@font-face {font-family:Red Hat Text;font-style:normal;font-weight:400;src:local("Red Hat Text Regular"),local("RedHatText-Regular"),url("/fonts/RedHatText-Regular.woff2") format("woff2"),url("/fonts/RedHatText-Regular.woff") format("woff")}
@font-face {font-family:Red Hat Text;font-style:normal;font-weight:500;src:local("Red Hat Text Medium"),local("RedHatText-Medium"),url("/fonts/RedHatText-Medium.woff2") format("woff2"),url("/fonts/RedHatText-Medium.woff") format("woff")}
@font-face {font-family:Red Hat Text;font-style:normal;font-weight:700;src:local("Red Hat Text Bold"),local("RedHatText-Bold"),url("/fonts/RedHatText-Bold.woff2") format("woff2"),url("/fonts/RedHatText-Bold.woff") format("woff")}

* {padding:0;margin:0;list-style:none;border:none}
body {font-family:"Red Hat Text",sans-serif;font-size:16px;color:#111}
a {color:#111;text-decoration:none}
a:hover {color:#F05A14}
label {color:transparent;text-shadow:0 0 0 #FFF;cursor:pointer}

/*public*/
.wrapper,.main {width:100%;max-width:1200px;margin:0 auto}
.link-ad1 {margin:0 auto;margin-top:30px}
.auto-ad1,.auto-ad2 {clear:both;text-align:center}
.auto-ad3 {clear:both;max-width:960px;margin:0 auto;margin-bottom:50px}

/*header*/
.header {width:100%;height:80px;background:#F05A14}
.logo {float:left;padding:5px 0;width:145px;height:70px}
.logo a {width:70px;height:70px;display:block;text-indent:-9999px;overflow:hidden}
.cat-logo { float:right}
.cat-logo a {background:url(../img/cat-logo.png) no-repeat left top;background-size:70px 70px}
.dog-logo { float:left}
.dog-logo a {background:url(../img/dog-logo.png) no-repeat left top;background-size:70px 70px}
.nav {float:left;padding-top:16px;margin-left:85px}
.nav a {float:left;margin:0 20px;padding:0 20px;line-height:60px;text-align:center;font-size:18px;font-weight:700;color:#FFF}
.nav a:nth-child(1) {border-bottom:4px #FEE702 solid;width:75px}
.nav a:hover {border-bottom:4px #FEE702 solid;background:#FEE702;text-decoration:none;color:#F05A14}
.search {float:right;margin-top:25px}
.search a {width:40px;height:40px;display:block;text-indent:-9999px;overflow:hidden;background:url(../img/search.png) no-repeat 5px 7px;background-size:25px 27px}

/*left*/
.main-l {float:left;width:250px}
.main-l input,.main-l label {display:none}
.toggle-content dl {margin-bottom:50px}
.toggle-content dt {font-family:Arial;font-size:15px;font-weight:800;color:#7A7A7A;height:30px;margin-top:30px;clear:both}
.toggle-content dd:before {content:"";width:8px;height:8px;border:2px solid #BBB;border-radius:5px;display:inline-block}
.toggle-content dd:hover:before {border:2px solid #F05A14}
.toggle-content dd a {line-height:24px;padding-left:10px}
.names-btn,.ask-btn {width:80%;text-align:center;line-height:44px;font-size:18px;margin-top:20px;background:#F78956;border-radius:2px}
.names-btn a,.ask-btn a {color:#FFF;font-weight:500;display:block}
.ask-btn {background:#2DBAD5;margin-bottom:50px}

/*right*/
.main-r {float:left;width:100%;max-width:950px;min-width:320px}
.a-z {border-bottom:2px solid #E6E6E6;text-align:center;padding:19px 0 8px 0}
.a-z a {border-radius:3px;border:1px solid #DDD;margin:0 3px 10px 4px;padding:0 5px;height:24px;line-height:23px;display:inline-block}
.a-z a:hover {border:1px solid #F05A14}

/*title*/
.title {padding-top:28px;text-align:center}
.title h1,.title h2 {font-size:28px}
.description {padding:5px 0 28px 0;color:#7A7A7A;text-align:center}

/*location*/
.loc {margin:28px 0;color:#BBB;line-height:27px;min-height:27px}
.loc a {color:#888;margin-right:5px;font-size:14px;font-weight:500}

/*list items*/
.item-w {width:100%;height:51px}
.item-1,.item-2,.item-3,.item-4,.item-5 {float:left;width:15%;height:51px;line-height:51px;background:#F5F5F5;font-size:15px;color:#7A7A7A;font-weight:bold;text-indent:11px;border-right:5px solid #FFF;box-sizing:border-box}
.item-1 {width:40%}
.item-2 {background:#F05A14;color:#FFF;line-height:32px}
.item-2 span {font-weight:normal;display:block;line-height:12px}
.item-5 {border-right:none}

/*breeds list*/
.list {width:100%;height:130px;padding:23px 0;border-bottom:1px solid #EFEFEF}
.list-1 {width:40%;float:left}
.list-1 .left {width:170px;float:left;margin-left:5px}
.list-1 .left img {width:170px;height:auto}
.list-1 .right {width:180px;float:left;margin-left:16px}
.list-1 .right-t p a {font-size:20px;color:#23A9E7;line-height:18px;font-weight:500}
.list-1 .right-t p a:hover {color:#F05A14}
.list-1 .right-t span {display:inline-block;padding-top:6px}
.list-1 .right-c,.list-1 .right-b span {display:none}
.list-1 .right-b {margin-top:22%;color:#7A7A7A;font-size:14px}
.list-2,.list-3,.list-4,.list-5 {width:15%;height:135px;float:left}
.list-2 p,.list-4 p,.list-5 p {display:block;margin:14px auto 15px auto;width:65px;height:65px;line-height:65px;border-radius:50%;border:7px solid #FFECDE;font-size:24px;font-weight:500;color:#F05A14;text-align:center}
.list-2 span,.list-4 span,.list-5 span {display:block;text-align:center;font-size:14px}
.list-3 {margin-top:12px}
.list-3 p {padding-left:27px;line-height:24px}
.list-3 span {padding-left:27px}
.list-4 p {border:7px solid #F5F5F5;color:#7A7A7A}
.list-4 .yes {border:7px solid #ECF8DE;color:#A9D76F}
.list-5 p {border:7px solid #E5F7FC;color:#79BDDD}
.more {font-size:16px;font-weight:500;text-align:center;padding:30px 0}
.more a {color:#23A9E7}

/*other list*/
.other {font-size:0;padding-top:25px;margin:0 auto;max-width:1200px}
.other dd {width:33.333333%;margin-bottom:30px;text-align:center;display:inline-block;vertical-align:top;*display:inline;*zoom:1}
.other dd img {width:100%;display:block;margin-bottom:10px}
.other dd a {font-size:20px;line-height:24px}
.other span {display:block;font-size:14px;font-style:italic;margin-bottom:10px;color:#7A7A7A}

/*breeds content*/
.content,.wall,.stories {margin:0 auto 50px auto;padding-bottom:30px;box-shadow:1px 1px 8px -1px rgba(0,0,0,.3);font-size:18px}
.content h1 {font-size:28px;color:#F05A14;padding:30px 0 20px 0;text-align:center;line-height:32px}
.content h2 {font-size:24px;color:#819F00;padding:40px 0 15px 0;text-align:left}
.content a,.stories a {color:#23A9E7}
.content td a,.stories p a,.related a {text-decoration:underline}
.content .auto-ad1,.content .auto-ad2 {margin:45px auto 0 auto}
.slideshow,.slideshow2 {max-width:800px;margin:0 auto;position:relative}
.slideshow img,.slideshow2 img,.like li img,.ts-img img,.item img {width:100%}
.slideshow-number {color:#FFF;font-size:12px;padding:12px;position:absolute}
.slideshow-prev,.slideshow-next {position:absolute;top:48%;margin-top:-22px;padding:16px;font-weight:700;font-size:22px;transition:0.6s ease;cursor:pointer}
.slideshow-next {right:0}
.slideshow-prev:hover,.slideshow-next:hover {background-color:rgba(0,0,0,0.6)}
.slideshow-text {color:#FFF;position:relative;text-align:center;margin-top:-40px;line-height:37px;text-shadow:#333 1px 1px 2px}
.fade{ -webkit-animation-name:fade; -webkit-animation-duration:1.5s; animation-name:fade; animation-duration:1.5s}
@-webkit-keyframes fade{ from{opacity:.4} to{opacity:1}}
@keyframes fade{ from{opacity:.4} to{opacity:1}}
.table-01,.table-02,.table-03,.table-04 {width:95%;max-width:800px;margin:0 auto;border-collapse:collapse}
.table-01 th,.table-02 th,.table-04 th {border-bottom:2px solid #EFEFEF}
.table-01 td:nth-child(1),.table-02 td:nth-child(1) {width:42%;color:#7A7A7A;font-weight:700;font-size:15px}
.table-01 td:nth-child(2).table-02 td:nth-child(2) {width:58%}
.table-01 tr,.table-02 tr {border-bottom:1px solid #EFEFEF}
.table-01 td,.table-02 td {padding:8px 0;vertical-align:top;line-height:24px}
.table-01 p:nth-child(even),.table-02 p:nth-child(even) {background:#F9F9F9}
.table-01 .flag {color:#7A7A7A;padding:10px 0}
.table-01 .flag p {margin-top:10px}
.table-01 .flag img {vertical-align:top;width:45px}
.table-01 .rank p:nth-child(1) {font-size:18px;font-weight:500}
.table-01 .rank p:nth-child(4),.table-01 .rank p:nth-child(5),.table-01 .rank p:nth-child(6),.rank p:nth-child(7){ display:none}
.table-01 .price {padding:5px}
.table-02 {margin-bottom:50px}
.table-02 span,.related span {display:block}
.table-02 p:nth-child(2),.table-02 .fold-text p {padding:2px 5px}
.table-02 .star-05,.table-02 .star-04,.table-02 .star-03,.table-02 .star-02,.table-02 .star-01,.table-02 .star-00 {width:80px;height:16px;display:inline-block;text-indent:-9999px;overflow:hidden}
.table-02 .star-05 {background:url(../img/star.png) no-repeat left 0;background-size:80px 109px}
.table-02 .star-04 {background:url(../img/star.png) no-repeat left -18px;background-size:80px 109px}
.table-02 .star-03 {background:url(../img/star.png) no-repeat left -37px;background-size:80px 109px}
.table-02 .star-02 {background:url(../img/star.png) no-repeat left -55px;background-size:80px 109px}
.table-02 .star-01 {background:url(../img/star.png) no-repeat left -74px;background-size:80px 109px}
.table-02 .star-00 {background:url(../img/star.png) no-repeat left -93px;background-size:80px 109px}
.table-03 td {padding:7px 0;line-height:28px;border-bottom:1px solid #EFEFEF;text-indent:15px}
.table-03 .n-title td:nth-child(1) {background:#FFECDE;width:26%}
.table-03 .n-title td:nth-child(2) {background:#E6F4FC}
.table-03 .n-title td:nth-child(3) {background:#FDEAF1}
.table-03 .n-title td {border:none;font-weight:700;color:#333}
.table-03 .all-names {border:none;text-align:center;padding:20px 0 0 0;line-height:14px;font-weight:700}
.table-04 .fold-text {background:#FFF}
.table-04 p {margin-top:20px;line-height:26px}
.fold {background:#F9F9F9;position:relative}
.fold-btn,.fold input {width:100%;position:absolute;display:block;color:#23A9E7;text-align:center;bottom:0;cursor:pointer;display:none}
.fold-btn div:nth-of-type(1) {display:block}
.fold-btn div:nth-of-type(2) {display:none}
.fold-text {overflow:hidden}
.fold input {opacity:0;z-index:999}
.fold input:hover+.fold-btn {background-color:#EEE}
.fold input:checked+.fold-btn div:nth-of-type(1) {display:none}
.fold input:checked+.fold-btn div:nth-of-type(2) {display:block}
.fold input:checked+.fold-btn+.fold-text {max-height:inherit}
.ref,.like {margin:0 auto;max-width:800px;width:95%}
.ref h3,.like h3 {padding:40px 0 15px 0;font-size:18px}
.ref li {font-family:Georgia;font-size:15px}
.ref li:nth-child(2) {margin-top:7px}
.like {font-size:0}
.like h3 {font-size:26px;color:#F05A14;font-weight:500}
.like li {width:25%;font-size:20px;margin-bottom:30px;text-align:center;display:inline-block;vertical-align:top;*display:inline;*zoom:1}
.like li span {display:block;margin-bottom:5px;font-size:14px;color:#7A7A7A}
.like li a {color:#333}
.stories .like li,.wallpaper .like li {width:33.333333%}
.stories .ref {max-width:640px}
.wallimg {max-width:800px;margin:0 auto;text-align:center;font-size:15px}
.wallimg img {width:100%;display:block;margin-bottom:10px}

/*stories*/
.stories h1 {font-size:28px;padding:40px 5px 15px 5px;line-height:32px;text-align:center;max-width:700px;margin:0 auto}
.byline {padding-bottom:12px;font-size:15px;color:#7A7A7A;text-align:center}
.byline span {border-right:1px solid #999;margin-right:10px;padding-right:10px;line-height:13px;display:inline-block;font-weight:500}
.ts-img {max-width:800px;width:95%;margin:0 auto}
.stories p {width:95%;max-width:640px;margin:0 auto;margin-top:25px;font-size:18px;line-height:28px}
.item h3 {margin-top:25px}
.ts-content,.it-summary,.tip {max-width:640px;width:95%;margin:0 auto}
.ts-img,.ts-content p img {width:100%}
.ts-content h2 {font-size:26px}
.ts-content h2,.ts-content h3 {margin-top:35px}
.ts-content h3 {font-size:20px}
.ts-content p,.item p,.b-line p{width:100%}
.it-summary {border-left:5px solid #F05A14;box-sizing:border-box;margin-top:35px}
.it-summary li {padding:7px 0 7px 15px}
.it-summary li span {font-weight:500;padding-left:5px;font-size:18px}
.item,.b-line,.related {max-width:640px;width:95%;margin:40px auto 0px auto}
.item h2 {font-size:28px;text-align:center;margin-bottom:20px;font-weight:700;color:#333}
.item h2 .num {margin:0 auto;width:75px;height:45px;display:block;font-size:36px;border-bottom:3px solid #F69C72;color:#F05A14;margin-bottom:5px;font-weight:700}
.b-left {border-left:5px solid #dadada;padding-left:15px;box-sizing:border-box}
.b-left li {margin-top:20px;font-size:18px;line-height:28px}
.b-left li span {font-weight:500}
.pros {border-left:5px solid #9ac62a}
.credit {display:block;font-size:12px;color:#888;text-transform:uppercase}
.related {border-left:10px solid #F78956;box-sizing:border-box;line-height:24px;padding:5px 0 10px 15px;font-size:20px;font-weight:700}
.related span {margin-bottom:5px;font-size:18px}
.tip {margin-top:30px;padding:30px 0;background:#FFF9F3}
.tip h3 {background:url(../img/tip.svg) no-repeat;background-size:25px 25px;margin-left:30px;padding-left:35px}
.tip p {max-width:90%;font-size:16px}
.ranking {margin:40px 0;width:100%;border-collapse:collapse}
.ranking th {padding:20px 5px;border-bottom:3px solid #9C006D;background:#F05A14;color:#fff;text-align:center;font-size:24px}
.ranking th h2 {margin:0;padding:10px 15px 0 15px;font-size:24px;line-height:28px}
.ranking td {padding:6px 0 6px 5px;border-bottom:2px solid #ebebeb}
.ranking td img {margin:0;margin-bottom:5px;width:120px;display:block}
.ranking td span {display:block;color:#707070;font-size:12px;line-height:30px}
.ranking a {display:inline-block;color:#23A9E7;text-decoration:none}
.video{position:relative;display:block;width:100%;height:0;margin:auto;padding: 0% 0% 56.25%;overflow: hidden;margin-top:25px}
.video iframe{position:absolute;border:0;width:100%;height:100%}
.dot{margin-top:25px}
.dot li{padding-left:20px;line-height:28px;position:relative}
.dot li::before{display:block;width:7px;height:7px;border-radius:50%;background:#333;content:'';position:absolute;left:0;top:11px}

/*pages*/
.pages {margin:30px auto 50px 5px;height:34px;line-height:34px}
.pages li {float:left;margin-right:8px;text-align:center}
.pages li:nth-child(7) {margin-right:0}
.pages .thisclass {float:left;padding:0 17px;color:#FFF;border-radius:3px;background:#F05A14}
.pages a {float:left;padding:0 16px;border-radius:3px;background:#F5F5F5}
.pages a:hover {background:#FDE6DC}

/*share*/
.share {clear:both;text-align:center;padding-bottom:25px}
.share a{display:inline-block;width:28px;height:28px;border-radius:28px;border:1px solid #7A7A7A;text-align:center}
.share svg{width:17px;height:17px;vertical-align:-7px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;fill:currentColor;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-transition:fill .2s cubic-bezier(.4,0,.2,1) 0s;transition:fill .2s cubic-bezier(.4,0,.2,1) 0s;-webkit-transition:-webkit-transform .3s ease-in-out;transition:transform .3s ease-in-out}
.share svg:hover{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.2)}

/*footer*/
.footer {width:100%;background:#F5F5F5;overflow:hidden}
.footer-t {width:100%;max-width:1200px;margin:0 auto;padding-bottom:50px;overflow:hidden}
.footer-t dl {float:left;width:25%;padding-top:50px}
.footer-t dt {font-size:18px;font-weight:bold;margin-bottom:18px}
.footer-t dd {margin-bottom:7px}
.footer-t .text-logo dd {float:left;height:56px;width:56px;line-height:56px;text-align:center;border-radius:50%;font-size:20px;font-weight:bold;background:#999}
.footer-t .text-logo dd a {color:#FFF}
.footer-t .text-logo dd:nth-child(1) {background:#F05A14;margin-right:5px}
.footer-t .ask {width:300px;height:60px;margin:0 auto;margin-top:-16px}
.footer-t .ask a {width:300px;height:60px;background:url(../img/ask-a-vet.png);background-size:300px 60px;display:block;text-indent:-9999px;overflow:hidden}
.footer-t .ask-text {line-height:24px;text-align:center;margin-top:20px}
.footer-b {margin:0 auto;padding:20px 15px;text-align:center;border-top:1px solid #E6E6E6;font-size:12px;color:#888}
.footer-b div {font-size:15px;color:#333;margin-bottom:10px}
.footer-b div span {font-weight:700}

@media screen and (max-width:1250px) {.header {width:100%;height:88px;position:relative}
.logo {float:none;margin:0 auto;height:48px}
.dog-logo a,.cat-logo a {height:53px}
.nav {padding-top:0;margin-left:0;width:100%;background:#E84C04}
.nav a {padding:0;margin:0;width:33%;line-height:30px;font-size:16px;color:#FEE;font-weight:700}
.nav a:nth-child(1) {border:none;width:33%;margin-left:0}
.nav a:nth-child(2) {width:34%;box-sizing:border-box;border:1px solid #F05A14;border-top:none;border-bottom:none}
.nav a:hover {border:none}
.search {position:relative;margin-top:-73px}
.search a {background-size:20px auto}
.main-l label {display:block}
.main-l .toggle-button {display:block;padding:20px 20px 17px 16px;margin-top:-88px;position:absolute;z-index:999}
.main-l .toggle-button i {display:block;width:23px;height:3px;margin-top:4px;background:#FFF}
input:checked~label .toggle-button i:nth-of-type(1) {-webkit-transform:translateY(7px) rotate(-45deg);transform:translateY(7px) rotate(-45deg)}
input:checked~label .toggle-button i:nth-of-type(2) {opacity:0}
input:checked~label .toggle-button i:nth-of-type(3) {-webkit-transform:translateY(-7px) rotate(45deg);transform:translateY(-7px) rotate(45deg)}
.toggle-content {display:none}
input:checked~.toggle-content {display:block;width:100%;max-width:1200px;background:#FCF8F5;padding-bottom:50px;position:absolute;z-index:999}
.toggle-content dl {width:95%;margin:0 auto 40px auto;font-size:18px}
.toggle-content dt {height:30px;border-bottom:2px solid #E5DDD8;margin:-5px 0 10px 0;font-size:16px}
.toggle-content dd {display:inline-block;padding-right:20px}
.names-btn,.ask-btn {width:95%;margin:20px auto}
.main-r {float:none;max-width:950px;margin:0 auto}
.footer-t {width:95%}
}

@media screen and (max-width:1000px) {.main-r,.i-wall {width:96%}
.item-3,.list-3 {display:none}
.item-1,.list-1 {width:49%}
.item-2,.item-4,.item-5,.list-2,.list-4,.list-5 {width:17%}
.table-01 td:nth-child(1),.table-02 td:nth-child(1) {width:35%}
.table-01 td:nth-child(2).table-02 td:nth-child(2) {width:65%}
.footer-t {padding:10px 0 30px 0;text-align:center}
.footer-t dl {width:100%;padding-top:30px}
.footer-t dl:nth-child(1) {float:none;width:117px;margin:0 auto}
.footer-t dt {border-bottom:1px solid #E6E6E6;padding-bottom:15px}
}

@media screen and (max-width:850px) {.item-3,.item-5,.list-3,.list-5 {display:none}
.item-1,.list-1 {width:60%}
.item-2,.item-4,.list-2,.list-4 {width:20%}
.item-4 {border:none}
.other dd,.like li,.stories .like li,.wallpaper .like li {width:50%}
}

@media screen and (max-width:680px) {.a-z {padding:10px 0 6px 0}
.a-z a {padding:0 6px;margin:0 3px 5px 2px}
.item-3,.item-4,.item-5,.list-3,.list-4,.list-5 {display:none}
.item-1,.list-1 {width:75%}
.item-2,.list-2 {width:25%}
.item-2 {border:none}
}

@media screen and (max-width:520px) {.main-r,.list-1,.like {width:100%}
.loc {text-indent:12px}
.description,.like h3 {width:95%;margin:0 auto}
.item-w,.list-2,.list-3,.list-4,.list-5 {display:none}
.list {height:220px;margin:0 auto;padding:0;border-bottom:none;padding-top:15px;background:#FFF;box-shadow:1px 1px 8px -1px rgba(0,0,0,.3);position:relative}
.list-1 .left {margin-left:0;width:27%;max-width:150px;min-height:180px;overflow:hidden}
.list-1 .left img {width:auto;height:180px;position:relative;left:-75px}
.list-1 .right {width:73%;margin-left:0}
.list-1 .right-t {margin-top:5px;padding-left:16px}
.list-1 .right-t span {color:#999;padding-top:3px}
.list-1 .right-t p a{font-size:22px}
.list-1 .right-c {display:block;width:96%;margin:0 auto;margin-top:13px}
.list-1 .right-c .pop,.list-1 .right-c .hyp,.list-1 .right-c .int {float:left;width:31%;text-align:center;font-size:14px}
.list-1 .right-c .hyp {width:38%}
.list-1 .right-c .pop p,.list-1 .right-c .hyp p,.list-1 .right-c .int p {display:block;margin:0 auto;width:58px;height:58px;line-height:58px;border:4px solid #FFECDE;border-radius:50%;font-size:21px;color:#F05A14;margin-bottom:4px}
.list-1 .right-c .hyp p {border:4px solid #F5F5F5;color:#7A7A7A}
.list-1 .right-c .hyp .yes {border:4px solid #D3F2C9;color:#A8D76F}
.list-1 .right-c .int p {border:4px solid #D1F1FA;color:#79BDDD}
.list-1 .right-b {height:36px;line-height:36px;background:#FFF;width:100%;margin:0 auto;position:absolute;left:0;top:180px}
.list-1 .right-b p {float:left;padding-left:10px;color:#333}
.list-1 .right-b span {display:block}
.list-1 .right-b span a {float:right;width:100px;background:#2BB8F6;color:#FFF;font-weight:500;line-height:36px;text-align:center}
.list-1 .right-b span a:hover {background:#1FACEA}
.content h1 {padding:25px 0 20px 0}
}

@media screen and (max-width:460px) {.fold {padding-bottom:24px}
.fold input,.fold-btn {display:block}
.fold-btn {line-height:24px}
.fold-text{ max-height:215px}
.table-04 .fold-text {max-height:360px}
}

@media screen and (max-width:335px) {.a-z a {padding:0 4px 0 5px}
.title h1,.title h2 {font-size:24px}
}