﻿@charset "utf-8";
/*
WCAG GREEN LARGE TEXT >>> #619600 *lrg only | ZOO GREEN SMALL TEXT >>> #558300| ZOO GREEN ACCENT BORDER >>>#92C745
*/
@font-face {font-family: blackshore; src: url(/!/fonts/Blackshore.otf);}
@font-face {font-family: Artfully; src: url('/!/fonts/Artfully/Web-TT/Artfully.woff2') format('woff2'), url('/!/fonts/Artfully/Web-TT/Artfully.woff') format('woff'), url('/!/fonts/Artfully/Web-TT/Artfully.ttf') format('truetype');}
html {font-size: 18px;  scroll-behavior: smooth;  height: 100%;}
body {font-family: 'Libre Franklin', Arial, Helvetica, sans-serif; margin: 0; padding: 0; background-color: #ffffff; text-align: center; line-height: 1.78;}
#home {display: flex; flex-direction: column; position:relative; background-color: #fff; min-height:100%;}
#allcontent {flex: 1;}/* forces the footer to the bottom */
h1 {font-family:blackshore; color: #51970b; font-size: 2.8em; font-weight: normal; line-height: 1; text-align: center;}
h2 {color: #206A2E; font-size: 1.4em; font-weight: 900; line-height: 1.3; margin: 0; text-align: center;}
h3 {color: #206A2E; font-size: 1.3em; font-weight: 400; line-height: 1.35; margin: 0; text-align: center;}
.lf, .plain{font-family: 'Libre Franklin', Arial, Helvetica, sans-serif;}
.blackshore {font-family: blackshore;}
.artfully{font-family: Artfully;}
.f900 {font-weight:900;}
.t1 {color:#629c06; font-size: 30px; line-height:1.2;}
.t2 {font-weight:900; color:#206a2e; font-size: 30px;}
.t3 {font-weight:bold; font-size: 24px;}
hr{border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0,0), rgba(226,226,226,1.00), rgba(226,226,226,1.00), rgba(226,226,226,1.00), rgba(0, 0, 0, 0));}
a, a:visited{ color: #558300; text-decoration:none; transition:color .2s ease-out, background .2s ease-in; font-weight: bold; outline: none;
  border: none;}
#tophold{background-color:#fff; position:relative; z-index:10; font-size:14px; line-height:1.2;}
#whitebar{width:80%; margin:0 auto; min-height:85px; display:inline-flex; justify-content:space-between; align-items: center; flex-wrap: wrap; max-width:1280px;}

#logo {z-index:30; width:145px;}
#hours {z-index:0; display:inline-block;}
#hours img{width:28px; margin-right:5px; vertical-align:middle;}
#inhours{text-align:left;}
#hours:hover #inhours{color:#4F2C1B; text-decoration:underline;}
#whitebarbut{display:inline-flex; align-items: center; justify-content:center;}
#searchholder{display:inline-block; text-align:left; margin-right:3vw;}
#search {display:inline-block; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;-webkit-box-shadow: inset 2px 2px 8px 0px rgba(0,0,0,0.3);-moz-box-shadow: inset 2px 2px 8px 0px rgba(0,0,0,0.3);box-shadow: inset 2px 2px 8px 0px rgba(0,0,0,0.3); white-space: nowrap; vertical-align: middle;}
#searchsubmit{background-color: transparent; height:24px; border:0px; cursor:pointer; background-image:url(/!/img/layout/search-magnifying-glass.gif); background-position:center; background-repeat:no-repeat;}
#hbuthold{display:inline-flex; align-items: center; justify-content:center; gap: 1px;}
#hbuthold a{display:inline-block; text-decoration:none; min-width:95px;}
a:hover, #whitebarbut a:hover { text-decoration:underline; color:#4F2C1B;}
a:hover img{ opacity: 0.7; transition: 0.3s;}
a:focus {outline: 2px solid #4285f4; /* Added for accessibility */}
#header {clear:both; text-align:center; padding:2px 0; min-height:54px; position:relative; font-family:'Libre Franklin', Arial, sans-serif; }
.icon40 {width:100%; max-width:40px; border-radius:40px;}

footer { width:100%; bottom:0; font-family: 'Libre Franklin', Arial, sans-serif;}
#foottop{height:9px; background: url(/!/img/layout/footer-transition2.png); display:block;}
#foothold{text-align:center; margin:0 auto; background: #2e1c12 url(/!/img/layout/footer3.jpg?a);}
#butfoot{ text-align:center; margin-top:30px; margin-bottom:30px;}
#butfoot h2{text-align:left; color:white; margin-bottom:20px;}
#butfoot a:link, #butfoot a:visited, #butfoot a:hover { color: white; margin: 0 9px 18px 9px; display: inline-block; font-size: 14px;}
#logosfoot { width:100%%; display:inline-block; vertical-align:top;} 
#logosfoot a{ margin:0.5%; display:inline-block;}
#social { max-width:320px;  text-align:left;} 
#social a:hover, #social a:visited, #social a:link {margin: 0.5%;} 
.clear{ clear:both;}

#alertdrop{ width:100%; height:100%; background-color: rgba(255,255,255,.73);  text-align:center; z-index:100; display:none; margin:0 auto;}

/*SOCIAL BAR*/
.share-icon {display: inline-block;  width: 48px;  height: 48px;  cursor: pointer; vertical-align: middle; background-image: url(/!/img/layout/social5.png?f);}
.share-1 {background-position: 0px 0px; }
.share-1:hover {background-position: 0px -48px;}
.share-2 {background-position: -48px 0px; }
.share-2:hover {background-position: -48px -48px;}
.share-3 {background-position: -96px 0px;}
.share-3:hover {  background-position: -96px -48px;}
.share-4 {background-position: -144px 0px;}
.share-4:hover {background-position: -144px -48px;}
.share-5 {background-position: -192px 0px;}
.share-5:hover {background-position: -192px -48px;}
.share-6 {background-position: -240px 0px;}
.share-6:hover {background-position: -240px -48px;}
.share-7 {background-position: -288px 0px;}
.share-7:hover {background-position: -288px -48px;}
.share-8 {background-position: -336px 0px;}
.share-8:hover {background-position: -336px -48px;}
/*SOCIAL BAR END*/

/*GENERAL PAGE STYLES*/
.main-content {width:100%; display: inline-block; position:relative;}/*Caps all website content at 1920px*/
.wid { width:100%;}
.pg-wrap{ padding:3px 0 0 0}
.pg{ padding:8px 4%; text-align:left;}
.highlight{background-color:#538122; color:#fff; border-radius:20px; padding:20px;}/*reverse highlight text*/

/*Content reverse - two columns, 1/3 & 2/3 respectivly can be reversed by adding r - mobile at 940*/
.colrev {display: grid; grid-template-columns: 38% 60%; grid-template-areas: "img txt"; gap: 2%;margin: 5% 0; box-sizing: border-box; align-items: flex-start;}
.colrev img{width:100%; border-radius:20px;}
.colrev > :first-child { grid-area: img; }
.colrev > :last-child { grid-area: txt; }
.colrev.r {grid-template-columns: 60% 38%; grid-template-areas: "txt img"; }
.colrev > * { width: 100%; }
/*Equal Columns - two columns, 1/2 & 1/2 respectivly - mobile at 940*/
/*Content reverse - two columns, 1/3 & 2/3 respectivly can be reversed by adding r - mobile at 940*/
.twocol{display:grid;grid-template-columns:49% 49%;gap:2%;margin:5% 0;align-items:flex-start;box-sizing:border-box;grid-template-areas:"left right"}
.twocol> :first-child{grid-area:left;min-width:0}
.twocol> :last-child{grid-area:right;min-width:0}
.twocol.r{grid-template-areas:"right left"}
.twocol img{width:100%;border-radius:20px}
.twocol>.box{margin:0} /* use gap for spacing inside .twocol */

/*.twocol {width:100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin: 0 auto; box-sizing:border-box;}
.twocolitem {padding: 20px; text-align: center; border-radius: 10px;}*/
/*Two col to replace old leftCol and rightCol class - 2/3 1/3 split*/
.twos {display: grid; grid-template-columns: 66% 32%; gap: 2%;}


/*APPROPRIATED STYLES*/
.leftCol { float:left; width:100%; max-width:705px; text-align: justify;}
.rightCol {	float:right; width:304px;}
.just{text-align: justify; width:875px; float:left;}
.justimg{text-align: justify; }
.but {background-color:#51970b; font-size:1.1em; display: inline-block; text-align:center; vertical-align: middle;padding:12px 40px; border-radius: 120px; color:#FFFFFF; font-weight:bold; border: 2px solid #fff;  box-shadow: rgba(0,0,0,0.3) 0 10px 10px -10px;}
a.but{color:#FFFFFF;}
a.but:hover, .but:hover{color:#FFFFFF; background-color:#477504; text-decoration:none;}
a.evt{border: 1px solid #E2E2E2; width:100%; max-width:338px; display:inline-block; margin-bottom: 20px;}
.evt-inner{padding:10px 10px 10px 0; float:left; max-width:222px; text-align:left;}
.evt img{ width:80px;  float:left; margin:12px; -moz-border-radius: 8px; border-radius: 8px; -webkit-border-radius: 8px;  }
a.evt:hover{ color:#4E3227; text-decoration:underline;}
.small{ FONT-SIZE: 0.75em;}
img {border:0;}
img.right { float: right; padding-left:12px; margin-left: 12px; margin-right: 0px; padding-right:0px; }
img.blk {  width:100%; max-width:300px; border-radius:12px;}
img.i300 { width:100%; max-width:300px; }
img.zico{ border:0px; width:80px; }
#sep{ width:100%; height:1px; margin-top:12px; margin-bottom:12px; color:#E2E2E2}
#spc{ padding-left:12px; margin-left:12px; padding-right:12px; margin-right:12px; vertical-align:middle;}
table.border { border-collapse:collapse; width:100%;}
.border td{	border: 1px solid #E2E2E2; padding:6px; margin:0px; vertical-align:top; border-spacing:0; text-align:left;}
table.border2 { border-collapse:collapse; width:100%;}
.border2 td{	border: 1px solid #000; padding:6px; margin:0px; vertical-align:top; border-spacing:0}
table.noborder { border-collapse:collapse; width:100%;}
.noborder td{	border: 0px none; padding:2px; margin:0px; vertical-align:top; border-spacing:0}
table.lines { border-collapse:collapse; width:100%;}
.lines td { border-bottom:1px solid #e4e4e4; padding:6px; margin:0px; vertical-align:top; text-align:left;}
.btmline { border-bottom:1px solid #e4e4e4; padding:6px;}
.button a { background-color:#ffffff; font-size:1.4em;  display: inline-block;  text-align:center; vertical-align: middle; border: 2px solid #77b800; padding:16px;  -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; font-weight:normal; color:#6aa400; font-weight:bold;}
.red {color:#FF0000}
.video-container {position: relative;padding-bottom: 56.25%; height: 0; overflow: hidden;} 
.video-container iframe, .video-container object, .video-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
/*ANCHOR SPECIFIC*/
.tour-info{line-height:normal;}


/*DEFAULT BANNERS*/
.newbanner {width: 100%; height: 0; padding-bottom: 28%; background-color: #fff; position: relative; overflow: hidden;}
.newbanner::after {content: "";position: absolute;top: 1%; left: 0; width: 100%; height: 112%; background-size: contain; background-position: center bottom; opacity: 0; animation: fadeInAndMove 2s ease-out forwards; z-index: 0;}
.squiggly-line {position: absolute; bottom: 0; left: 0; width: 100%; height: 39%; background-image: url('/!/bnr/squiggle3.svg?c'); background-size: 100%; z-index: 2;}
/*Slider line added for preview - also in slider code*/
.mySlides img{width:100%;}
/*common animation styles*/
    @keyframes fadeInAndMove {
    0% {opacity: 0;transform: translateY(1%);}
    100% {opacity: 1;transform: translateY(-3%);}
    }
    
@keyframes fadeInAndRise2 {
0% {opacity: 0;transform: translateY(8%);}
100% {opacity: 1;transform: translateY(0%);}
}

@keyframes fadeInAndRise3 {
0% {opacity: 0;transform: translateY(8%) rotate(calc(var(--rotate-angle) / 2));}
100% {opacity: 1;transform: translateY(0%) rotate(var(--rotate-angle));}
}

@keyframes AndRise {
0% {transform: translateY(0%);}
100% {transform: translateY(-8%);}
}

@keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}

@keyframes Zoom {
0% {transform: scale(0.85)}
70% {transform: scale(1.05)}
100% {transform: scale(1)}
}


    @media (max-width: 768px) {
        .newbanner {padding-bottom: 48%;}
        .newbanner::after {left: -30%; top:5%; width: 160%; height: 100%;}
        .squiggly-line {height: 22%;}

        @keyframes fadeInAndMove {
        0% {opacity: 0;transform: translateY(0);}
        100% {opacity: 1;transform: translateY(-7%);}
        }
    }

/*NEW CONTENT STYLES*/
.space {height:10px;}
.spacer {height:35px;}

#banhold {overflow-x:hidden; display:flex; justify-content:center; align-self: center}
#banr{opacity:0; width:100%; align-self: center}
#bnrtitle{position:absolute; color:#fff;  font-size:3vw; font-weight:bold; bottom:8%; right:8%;  z-index:4; text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);}
@font-face {font-family: calibreblack; src: url(/!/fonts/CALIBRE-BLACK.OTF);}
#bnrtxt{position:absolute; color:#fff; font-family: 'calibreblack', cursive;  font-size:6vw; bottom:8%; right:15%; z-index:10; text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);text-align:right; width:66%;}

.c0 {width:100%; text-align: justify; display: inline-block; font-size: 18px;}
.c1080 {width:100%; max-width: 1080px; text-align: justify; display: block; margin-left:auto; margin-right:auto;}
.c1080 p, .c1080 ul, .c1080 ol{}
.c1280 {width:100%; max-width: 1280px; text-align: justify; display: block; margin-left:auto; margin-right:auto;}
.c1325 {width:100%; max-width: 1325px; text-align: justify; display: block; margin-left:auto; margin-right:auto;}
.c1920 {width:100%; max-width: 1920px; display: block; margin-left:auto; margin-right:auto; }

.h42{ color: white; font-size: 42px;}
.h35{ font-size: 35px; font-weight: bold;}
.h25{ font-size: 25px; font-weight: bold;}

.t24{font-size: 24px;}
.tmed{ font-size:46px; text-align: left; font-weight: bold; color:#0c5c94;}
.tlg{ text-align: left; font-weight: bold;}

.iflexaround {display: inline-flex; justify-content: space-around; flex-wrap: wrap; gap:7px;}
.iflexbetween {display: inline-flex; justify-content: space-between; flex-wrap: wrap;}/*Plan*/
.iflexcen {display: inline-flex; align-items:center; justify-content: space-around; flex-wrap: wrap;}

.cblue { background-color: #117fa7; color: white;  }/*Membership*/
.cblue::before {background-image: url('/!/img/cblue-top.png'); background-size: 100% 30px; display: inline-block; width: 100%; height: 30px; content:"";}
.cblue::after {background-image: url('/!/img/cblue-bot.png?d'); background-size: 100% 39px; display: inline-block; width: 100%; height: 39px; content:".";}
.cblue a{color: #4f0f80;}

.ruffborder{position:relative;}
.ruffborder img{width:100%; z-index:0;}
.ruffborder::before{width:100%; height:100%; position:absolute; top:0; left:0; z-index:1; background-image:url(/!/img/layout/Ruff-top-white.svg); background-size:100%; background-repeat:no-repeat; content:"";}
.ruffborder::after{width:100%; height:100%; position:absolute; bottom:-1px; left:0; z-index:1; background-image:url(/!/img/layout/Ruff-bot-white.svg); background-size:100%; background-position:bottom; background-repeat:no-repeat; content:"";}

.box{box-shadow: 0 10px 16px 0 rgba(0,0,0,0.2),0 6px 30px 0 rgba(0,0,0,0.19) !important; border-radius:8px; background-color:white; padding: 1rem; margin:1rem;}
.mask-square {width: 100%; height: 100%; object-fit: cover; mask-image: url('/!/img/layout/mask-square-ruff.svg'); mask-size: 100% 100%; mask-repeat: no-repeat; mask-position: center;}

.col2 {display: inline-block; width: 100%; max-width: 500px; vertical-align: top; text-align: left;}
.col3 {width:100%; max-width:423px; vertical-align:top; margin-bottom: 50px; text-align:center; display: flex; flex-direction: column; line-height:1.6;}/*Giftshops*/
.col3 img {width:100%; max-width:423px; border-radius:10%;}
.col3:hover { text-decoration: none;}
    .col3txtborder{ margin-top:-42px; background-color:rgba(255, 255, 255, 0.6); position:relative; padding:4%; border-radius:50% 50% 10% 10% / 42px 42px 10% 10%;}
    .col3txt{background-color:#fff; border-radius:50% 50% 10% 10% / 42px 42px 10% 10%; font-weight:normal; color:#000;}
    .col3title{font-weight:900; font-size:1.2em; padding-top:20px; color: #206a2e;}
    .col3btnhold{margin-top: auto;}
    .col3btn{font-weight:bold; color: #fff; background-color:#206a2e; border-radius:22px; display:inline-block; padding:2px 20px; border: 2px solid #fff;  box-shadow: rgba(0,0,0,0.3) 0 10px 10px -10px;}
    a:hover .col3btn{ background-color:#5d8d66; transition: 0.3s;}

.col3a {width:100%; max-width:390px; vertical-align:top; display:inline-block; margin-bottom: 50px;}/*schools*/
.col3a img {width:100%; max-width:390px;}

.col4 {width:100%; max-width:337px; vertical-align:top; display:inline-block; text-align: center; border: 3px solid #9ed14d; border-radius: 3px; min-height: 524px; position: relative; margin-bottom: 50px;}/*places to stay*/
.col4 img {width:100%; max-width:337px;}

.hmbut a{ display:inline-block; font-weight:900; width:100%; max-width:120px; text-align:center; line-height:1.2em;}
.hmbut img{width:100%; max-width:100px; border-radius:50%; border: 2px solid #fff; box-shadow: rgba(0,0,0,0.3) 0 10px 10px -10px;}
.pgbut{gap: 10px;}
.pgbut a{display:inline-block; font-weight:900; width:100%; max-width: 19%; text-align: center; margin-bottom: 30px; font-size:1.2em; line-height:1.2em; text-decoration:none;  }
.pgbut img{width:100%; max-width:200px; border-radius:50%;border: 2px solid #fff; box-shadow: rgba(0,0,0,0.3) 0 10px 10px -10px; margin-bottom:15px; object-fit: cover;  aspect-ratio:1/1;}

.lc {display:inline-block; width:100%; vertical-align:top; max-width:348px; margin-bottom:50px;}/*gift tickets, group tickets*/
.rc {width:100%; text-align: justify; display: inline-block; max-width:620px; margin-bottom:50px;}

/*book now but*/
a.book {width: 216px; height:60px; background-color:#9ed14d; color:white; font-size: 24px; display:inline-flex; align-items:center; justify-content: center; flex-wrap: wrap; position: absolute; bottom:15px; left:18%;}

/*icobut - Alerts button - Any button with an icon*/
a.icobut { margin: 18px 0; color: #fff; font-weight: bold;  cursor: pointer; transition: 0.5s; border-radius: 52px; box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0); background-color: #569605; height:100px; display: inline-flex;  align-items: center; width:100%;}
a.icobut:hover { background-color: #cb3b35; color: white; transition: 0.5s; text-decoration:none;}
a.icobut:hover img { transition: 0.5s; transform:scale(110%); opacity:1;}
.icobut img{height: 100%; width: auto;aspect-ratio: 1 / 1; border-radius:50%; border:3px #bbee7a solid; }
.icobut div{ font-size:1em; font-weight:normal; line-height:1.2; width:100%; margin-right:35px;}
.icobut span{font-size:1.6em; font-weight:bold; display:block;}

/*ANIMAL PAGE STYLES */
.img0-wrap{position: relative; max-width:614px; width:100%; display:inline-block; vertical-align:top; margin-top: 30px;}
.img0-shade{position: absolute; z-index: 0; width:100%; background-color:#92c745; -ms-transform: rotate(7deg);    -webkit-transform: rotate(7deg);    transform: rotate(7deg);}
.img0{position: relative; z-index: 2; width:100%;}
.img0-bghold{filter: brightness(0.2) sepia(1) saturate(10000%) hue-rotate(71deg); opacity: 0.01; filter: alpha(opacity=01);}
.img1-wrap{position: relative; max-width:35%; width:100%; height:250px; display:inline-block; vertical-align:top; margin:0 4% 4% 0}
.img1-shade{position: absolute; z-index: 1; width:100%; height:250px; background-color:#92c745; -ms-transform: rotate(-7deg);    -webkit-transform: rotate(-7deg);    transform: rotate(-7deg);}
.img1{position: absolute; z-index: 2; width:100%; height:250px; overflow:hidden;}
.fact-wrap{width:100%; max-width:216px; height:372px; background-color:white; display:inline-block; vertical-align:top; margin-top:36px; position:relative; z-index:3}
.fact{width:100%; max-width:216px; height:372px; background-color:white; display:inline-block; vertical-align:top; margin-top:36px; position:absolute}
.con-wrap{width:100%; max-width:55%; background-color:white; display:inline-block; vertical-align:top;}


/*LARGE CSS START*/
@media only screen and (min-width: 941px) and (max-width: 1300px){
    #butmob {min-width:100%;}
    #hours {font-size:12px;}
    #whitebar{width:90%; font-size:12px;}
    #hbuthold a{min-width:90px;}
    #xfoot {width:95%}

    /*GENERAL PAGE STYLES*/
    .pg-wrap{padding:4px 0}
    .conpad{padding:0 32px 42px 32px;}
    .conright{ max-width:23%}
    .conleft{ min-width:99%; max-width:99%;}
    .leftCol { float:left; width:100%; max-width:65%;}
    .rightCol {	float:right; width:32%;}
    #social {max-width:320px; text-align:center;} 

    /*NEW CONTENT STYLES*/
    .c1080, .c1280, .c1325, .c1435 {padding: 0 15px; box-sizing: border-box;}
    .col3 {width:100%; max-width:32%;}
    .col3 img {width:100%; max-width:100%;}
    
    .pgbut{gap: 15px;}
    .pgbut a{display:inline-block; font-weight:900; width:100%; max-width: 18%; text-align: center; margin-bottom: 30px; font-size:1.1em; line-height:1.2em; text-decoration:none;}
    .pgbut img{width:100%; max-width:175px; border-radius:50%;border: 2px solid #fff; box-shadow: rgba(0,0,0,0.3) 0 10px 10px -10px; margin-bottom:15px; }
}
/*LARGE END*/

@media only screen and (max-width:1100px){
    h1{font-size:1.85em}
    h2 {font-size:1.35em}
    h3 {font-size:1.25em}
    #whitebar{ width:95%;}
}

@media only screen and (max-width:1000px){
    .conpad{padding:0 22px 32px 22px;}
    #whitebar{ width:99%;}
}

/*MEDIUM CSS*/
@media only screen and (max-width: 940px){
    html{font-size: 16px; }
    .main-content{ padding-bottom:0;}
    footer { position:relative; width:100%; bottom:0;}
    #xfoot { width:100%;}
    #whitebar{display:block; text-align:center; margin:0 auto; width:94%; font-size:12px;}
    #logo {width:125px; margin-top:20px;}
    #searchholder{display: block; text-align: center; margin-right:0;}
    #hours{display:block; padding:15px; min-width:130px; }
    #hours p{ font-size:12px;}
    #header { min-height:4px; padding:0;}
    #butmob{ min-width:40px; text-align:left; width:100%; display:none;/**/}
    #whitebarbut{display:block; text-align:center; float:none; padding-right:0;}
    #hbuthold a{padding: 10px 0; min-width:80px;}
    #logosfoot a{ margin:1%;}
    #social {width:100%; max-width:320px; text-align:center;} 
    #nav-toggle {display: inline-block; position:absolute; top:24px; left:24px; width:50px; opacity:1; cursor: pointer; z-index:30; border: 0px; text-decoration: none; background: #ffffff;}
    #nav-toggle img {width:100%;}
    .nav-toggle:hover, .nav-toggle:focus, .nav-toggle:active {background-color: #a6a6a6; color: #212428;}
    img.scale{ max-width:260px;}
    h1 { font-size:1.8em}
    h2 { font-size:1.3em}
    h3 { font-size:1.2em}
    .t1 {font-size: 22px;}
    .t2 {font-size: 22px;}
    .t3 {font-size: 18px;}
    .c1080, .c1280, .c1325, .c1435, .c0 {padding: 0 12px; box-sizing: border-box;}
    .c1080 p, .c1080 ul, .c1080 ol{line-height: 1.56;}
    #contactpad{text-align:center; padding-top:16%; padding-bottom:1%; padding-left:0;}
    #sliderbars {display:none;}

    .but { font-size:1em;   padding:12px;  }

    /*GENERAL PAGE STYLES*/
    .colrev, .colrev.r {display: block;}
    .twocol{grid-template-columns:1fr;grid-template-areas:"left" "right"} 
    .twocol.r{grid-template-areas:"left" "right"} 
    /*(old .twocol, .twocol.r {display: block;})
        (older).twocol {grid-template-columns: 1fr; gap: 15px; padding: 0px;}*/
    .leftCol { float:none; width:100%; max-width:99%; }
    .rightCol {	float:none; width:100%; max-width:99%; text-align: center}
    .twos{grid-template-columns: 1fr; text-align:left;}
    .twos > :nth-child(2) {text-align: center;}
    .btn a {  width:100%; max-width:42%;  border-radius: 8px;  text-decoration: none; margin:4px 1%; height:45px;}
    .pgbut a{max-width: 160px; text-align: center; margin-bottom: 20px;}
    .pgbut img{ max-width:140px; margin-bottom:5px;}

    /*NEW CONTENT STYLES*/
    #banr{min-width:900px; position:relative;}
    .col3 {width:100%; max-width:48%;}
    #bnrtitle{ font-size:1.8em;  border-bottom: 2px solid white;  }
    #bnrtxt{ font-size:8vw;bottom:8%; right:8%; width:66%;}
    .box{padding: 1rem ; margin:1rem 0;}

    /*ANIMAL PAGE STYLES */
    .img0-wrap{ max-width:800px; margin-right:0; margin-top: 0;}
    .img0-shade{ -ms-transform: rotate(0deg);    -webkit-transform: rotate(0deg);    transform: rotate(0deg);}
	.img0{margin-bottom: 15px;}
    .fact-wrap{ max-width:100%; margin-top:12px;}
    .con-wrap{ max-width:100%;}
	.img1-wrap{ max-width:320px;}
    #butfoot h2{text-align:center; }
    #butfoot div{text-align:center; margin-bottom:20px;}
}
/*MEDIUM END*/

@media only screen and (max-width:685px){
    #banr{right:60px;}
}

/*SMALL CSS*/
@media only screen and (max-width: 515px){
    .btn a {  width:100%; max-width:400px;  -webkit-border-radius: 8; -moz-border-radius: 8; border-radius: 8px;  text-decoration: none; margin:3px 0;}
    /*#hbuthold{ display:block;}*/
    .dropdownholder ul { padding:20px;}
    #shop {  background-position:left 15px center;}
    .pgbut a{ max-width: 120px; margin-bottom: 8px; font-size:1em;}
    .pgbut img{ max-width:100px; margin-bottom:0px;}
    /*NEW CONTENT STYLES*/
    #banr{ min-width:800px; right:60px;}
    #bnrtitle{font-size:1.5em;right:10%;}
    .c1080, .c1280, .c1325, .c1435, .c0, .leftCol {text-align:left;}
    .col3 {width:100%; max-width:423px;}
}
/*SMALL END*/

@media only screen and (max-width:385px){
    #banr{ min-width:700px; right:60px;}
    #hbuthold a{ min-width:70px;}
    #shop {  background-position:left -5px center;} 
}
.cen{ text-align:center; margin:0 auto;}
.centered {text-align:center;}
.opentxt{color:#ac208d; font-weight:900;}