/* MorwebCMS http://www.chittendenhumane.org/ font-family: 'Open Sans', sans-serif; font-family: 'Lato', sans-serif; font-family: 'Lato', sans-serif; font-family: 'Damion', cursive; */ body { background: #fff url(../images/pawbg.gif) right 200px no-repeat; font-weight:400; } body#noPaw { background: #fff; font-weight:400; } .mobile {display:none;} /* ----- Link Transitions ----- */ .mainContentArea a, .footerWrap a, .quickMenu ul li { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .mainContentArea a:hover, .footerWrap a:hover, .quickMenu ul li:hover { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } /* ----- Header ----- */ .headerWrap { width: 100%; background: #396b9c; position: fixed; top:0; width: 100%; z-index:500; height:93px; } .header {max-width: 1060px;margin: 0 auto;height: 39px;background: #396b9c; position:relative;} .headerWrap .logo {margin-top:0px;width:210px;height:93px;z-index:9999;position:relative;background: #fff;border-right:2px solid #fff;border-left:2px solid #fff;position:absolute;top:0;left:0;} .headerWrap .logo img {width:100%;} .headerRight {float:right; } /* ----- Spacer ----- */ .spacer {height:55px; width:100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } /* Popup */ .stickyDonate {position:fixed; right:0; top:370px; z-index:499;} .modalDialog { position: fixed; top: -1000px; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.8); opacity: 0; -webkit-transition: opacity 400ms ease-in; -moz-transition: opacity 400ms ease-in; transition: opacity 400ms ease-in; pointer-events: none; z-index: 1000 !important; } .modalDialog:target { opacity: 1; top: 0; pointer-events: auto; z-index: 1000 !important; } .modalDialog > div { max-width: 580px; position: relative; margin: 6% auto; padding: 20px 25px; background: #fff; z-index: 1000 !important; } a.close { position: absolute; right: 10px; text-align: center; top: 10px; height: 45px; width: 45px; text-decoration: none; color: #555; z-index:88; } a.close:hover {opacity:.3; } /* Popup Form Styles */ .modalDialog th {text-transform:uppercase; font-size:9pt !important;} .modalDialog .mwInput.text, .modalDialog .mwInput.select {background:#f6f3ed !important;} .modalDialog .mwInput.text:hover, .modalDialog .mwInput.select:hover {border:1px solid #396b9c;} .Caption h3 { margin:0; width:90%;} .Caption h6 {font-weight:bold; margin:0;} /* Social */ .socialMedia {float:right;width: 124px;margin-top:12px;} .socialMedia ul { } .socialMedia ul li { float:left; margin:0 8px} .socialMedia ul li a{color:#fff; font-size:12pt; } .translateWrap {float:right; margin:8px 10px 0 0} .translateWrap a {text-decoration:none;} /* searchWrap */ .searchWrap {/* float:right; */height:62px;position:relative;} .searchWrap input[type=text] {border: none;background: #fff !important;color: #000!important;padding: 5px;border: 1px solid #ccc!important;width: 190px;border-radius:2px;} .searchWrap input[type=submit] { border: none; background: #333; color: #000; padding: 5px; text-transform: uppercase; width:30px; text-indent:-9999em; background:url(../images/searchIcon.png) center center no-repeat; } .searchWrap input[type=submit]:hover { background:url(../images/searchIcon.png) center center no-repeat !important; } /* ----- Mobile Menu Icon ----- */ #mobile-header {display: none;position: absolute;top: 43px;right: 4px; height:44px; width:44px;z-index: 98;} /* ----- Main Menu ----- */ #mobile-header img {max-width:100% !important; height:44px; width:44px;} .menuWrap { background: #f5f4f4; height: 54px; font-family: 'Lato', sans-serif; font-weight:600; position:relative; z-index:500; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; text-transform:uppercase; } .menuHolder {max-width: 1060px;margin: 0 auto;} .mainMenu {/* width: 680px; */margin-left:220px;margin-right: 0;} .mainMenu ul {font-size: 10pt;} .mainMenu ul li a, .mainMenu ul li { float: left; text-decoration: none; color: #396b9c; } .mainMenu ul li { list-style: none; position: relative; height: 54px; line-height: 54px; } .mainMenu ul li:first-child { } .mainMenu ul li a { padding: 0 10px; } .mainMenu ul li:hover a { color: #396b9c; -webkit-transition: 250ms linear all; -moz-transition: 250ms linear all; transition: 250ms linear all; } .mainMenu ul li:hover { background: #ededed; -webkit-transition: 250ms linear all; -moz-transition: 250ms linear all; transition: 250ms linear all; } /* Submenu */ .mainMenu ul li ul { display: none; position: absolute; left: 0; top: 100%; margin: 0; background: #f5f4f4; font-size: 10pt; } .mainMenu ul li ul li { padding:12px 12px; width: 250px; height: 20px; line-height: 20px; border: none; } .mainMenu ul li ul li:first-child { border: none; } .mainMenu ul li ul li:after { clear: both; content: " "; display: block; height: 0; visibility: hidden; } .mainMenu ul li:hover > ul { display: block; } .mainMenu ul li ul li, .mainMenu ul li ul li a { float: none; color: #fff; } .mainMenu ul li ul li { _display: inline; /* for IE6 */ } .mainMenu ul li ul li a { display: block; padding: 0 10px; } .mainMenu ul li ul li:hover, .mainMenu ul li ul li a:hover { color: #396b9c; -webkit-transition: 250ms linear all; -moz-transition: 250ms linear all; transition: 250ms linear all; } /* Subsub Menu */ .mainMenu ul li ul li ul { display: none; background: #000; padding-top: 5px; padding-bottom: 5px; } .mainMenu ul li ul li:hover ul { left: 100%; top: 0; } .mainMenu ul li ul li ul li { padding: 5px 20px } .activeMenu { background: #f4f3f2 !important; } /* Quick Menu */ .quickMenu {max-width: 480px; float:right;font-size: 12pt; font-weight:600;font-family: 'Lato', sans-serif; text-transform:uppercase;} .quickMenu ul li {float:left; height:39px; line-height:39px; width:120px; text-align:center; } .quickMenu ul li:hover { background:#666} .quickMenu ul li a {color:#fff; text-decoration:none; display:block; } .brown { background:#827a65; } .blue { background:#42b6dc;} .orange { background:#dcb642;} .green { background:#6CC46C;} /* ----- Text ----- */ .mainContentArea h1 { font-size: 34pt; font-weight:600; margin: 25px 0; color: #231f20; font-family: 'Lato', sans-serif; text-transform:uppercase; } .mainContentArea h2 {font-size: 24pt;margin: 15px 0;color: #396b9c;font-weight:600;font-family: 'Lato', sans-serif;text-transform:uppercase;} .mainContentArea h3 {font-size: 18pt;margin: 15px 0;color: #396b9c;font-weight:600;font-family: 'Lato', sans-serif;text-transform:uppercase;} .mainContentArea h4 { font-size: 14pt; line-height:20pt; margin: 15px 0; color: #396b9c; font-weight:600; font-family: 'Lato', sans-serif; text-transform:uppercase;} .mainContentArea h5 { font-size: 12pt; margin: 15px 0; color: #396b9c; font-weight:600; font-family: 'Lato', sans-serif; text-transform:uppercase;} .mainContentArea h6 { font-size: 11pt; margin: 15px 0; color: #396b9c; font-weight:600; font-family: 'Lato', sans-serif; text-transform:uppercase;} .mainContentArea p { font-size: 11pt; margin: 15px 0; color: #505050; font-weight:400; font-family:Arial, Helvetica, sans-serif; } .mainContentArea b, .mainContentArea strong { font-weight: 700; } .mainContentArea i, .mainContentArea em { font-style: italic; } .mainContentArea a { color: #333; text-decoration: underline; font-weight: 400; } .mainContentArea a:hover { color: #333222; } /* ----- Lists ----- */ .mainContentArea ul { font-size: 11pt; list-style: none; margin: 10px 0 0; font-family:Arial, Helvetica, sans-serif; } .mainContentArea ul li { line-height: 15pt; padding: 0 0 10px 20px; color: #505050; } .mainContentArea ul li:before { /* circle bullet */ content: '\2022'; /* Square bullet */ /*content:'\25A0';*/ display: block; position: relative; max-width: 0px; max-height: 0px; left: -15px; top: -0px; color: #505050; font-size: 14px; } .mainContentArea ol { font-size: 11pt; counter-reset: item; margin: 10px 0 0; line-height: 11pt; color: #505050; font-family:Arial, Helvetica, sans-serif; margin-left:25px; } .mainContentArea ol li { line-height: 15pt; color: #505050; display: block; padding: 0 0 10px; margin-left:-20px; } .mainContentArea ol li:before { color: #505050; content: counter(item) ". "; counter-increment: item; line-height: 15pt; font-weight: bold; margin-right:5px; } /* ----- Extras ----- */ .mainContentArea blockquote { color: #505050; margin: 0 80px; padding: 20px; font-size: 14pt; line-height: 21pt; text-align: left; float: left; position: relative; font-family: 'Garamond', 'Times New Roman', sans-serif; } .mainContentArea blockquote:before { font: 11px/16px 'Garamond', 'Times New Roman', sans-serif; color: #505050; content: open-quote; font-size: 7em; line-height: .1em; position: absolute; left: -55px; top: 60px; } .mainContentArea blockquote:after { font: 11px/16px 'Garamond', 'Times New Roman', sans-serif; color: #505050; content: close-quote; font-size: 7em; line-height: .1em; position: absolute; right: -40px; bottom: -10px; } .mainContentArea blockquote p { color: #505050; font-size: 14pt; line-height: 21pt; text-align: left; float: left; position: relative; } .mainContentArea img { max-width: 100%; } .mainContentArea hr { border: none; color: #fff; background-color: #ccc; height: 1px; } /* ----- Tables ----- */ .mainContentArea table { width: 100%; color: #4a4e53; border-top: 1px solid #ccc; border-left: 1px solid #ccc; font-size: 12pt !important; font-family: 'Lato', sans-serif; margin-bottom:10px; } .mainContentArea table tr td, .mainContentArea table tr th { padding: 5px; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;} .mainContentArea table tr th { } .mainContentArea table caption { font-size: 16pt; margin: 15px 0; color: #333222; } /* Forms */ table.Dialog { width: 100%; text-align: left; margin-left: 0px; font-size: 10pt; background: none !important; border: none !important; } table.Dialog th { background: none; color: #4b525b; font-weight: 300; padding-left: 5px; padding-bottom: 3px; padding-top: 2px; padding-right: 0px; vertical-align: middle; border: none !important; width:30%; } table.Dialog td { background: none !important; border: none !important; border: none !important; } table.Dialog { margin: 0 auto; background: none; } table.Dialog.two-column { width: 50%; float: left; } table.Dialog.two-column TH { padding-left: 5px; padding:0; font-weight: 300;} table.Dialog.two-column TD { padding-left: 3px; padding-right: 5px; padding:0;} .Dialog .mwInput { color: #4b525b !important; border: 1px solid #aaa; padding: 0.1em; font-size: 10pt; line-height: 1.2em; background: #fff; border-radius: 0; padding-left: 5px; } .Dialog .mwInput:hover, .Dialog .mwInput:focus { -webkit-transition: .5s; -moz-transition: .5s; transition: .5s; background: #fafafb; } .Dialog .mwInput.error { border: 1px solid red } .Dialog select .mw { color: #fff; } .sidebarRight table.Dialog TH { padding-left: 2px; } .sidebarRight table.Dialog TD { padding-left: 0px; } /* Forms Button */ .Dialog .mwInput.button { text-decoration:none; background:#fff; color:#396b9c; padding:5px 25px; border:3px solid #396b9c; font-weight:600; } .Dialog .mwInput.button input.mw { color: #396b9c!important; font-size: 11pt; font-weight: 900; } .Dialog .mwInput.button:hover { background:#396b9c;} .Dialog .mwInput.button:hover input.mw { color: #fff!important;} /* ----- banner ----- */ .bannerWrap {max-width:1400px; height:460px; margin:38px auto 0; position: relative; background:#333333; } .banner {height:460px;} .pageTitle {width:100%; position:absolute; bottom:0; background:rgba(255,255,255,.6); text-align:center; } .pageTitle h1 { color:#111; font-family: 'Lato', sans-serif; font-size:28pt; text-transform:uppercase; padding:10px 0px; } /* Slider */ .slider { height:590px; clear:both; position:relative; background:#333333; } .captionHolder { position: absolute; bottom:0; width:100%; background:rgba(255,255,255,.1) } .caption { max-width:800px; margin:10px auto;} .caption:after {clear: both; content: " "; display: block; height: 0; visibility: hidden;} .caption h2 { font-size:27pt; text-align:center; color:#333; } .caption h2, .caption h3, .caption h4, .caption h5, .caption h6 { color:#333; font-family: 'Lato', sans-serif; margin: 0 0 15px; font-size:32pt; text-transform:uppercase;} .caption p { color:#333; font-family: 'Lato', sans-serif; font-size:17pt; } .caption p a { text-decoration:none; border:1px solid #fff; padding:10px 15px; } .caption p a:hover {background:#b40000;} .caption .button {margin:25px 0 10px !important; } .caption .button p a {font-family: 'Oswald', sans-serif !important; font-size:12pt; font-weight:300; text-transform:uppercase; paddding:0; border:0; color:#000; background:#fff; border-radius:24px; } /* ----- Content Areas ----- */ .contentArea { padding:60px 0; } .contentArea.smaller { padding:30px 0 !important; } .contentArea.grey { background:#f5f4f4; } .mainContentArea { max-width: 1000px; margin:0 auto; } /* Columns */ /* Sidebar */ .sidebar {padding:10px 0;} .sidebar:after { clear: both; content: " "; display: block; height: 0; visibility: hidden; } .right .sidebarLeft { width: 68%; float: left; } .right .sidebarRight { width: 25%; float: right; background:#f5f4f4; padding:0 1%; } .sidebarLeft .right .sidebarRight {background:none;} .left .sidebarLeft { width: 27%; float: left; } .left .sidebarRight { width: 68%; float: right; } .left .sidebarLeft h3 { color:#999999; border-bottom:1px solid #999999; padding:0 0 10px 0;} .left .sidebarLeft ul { margin:0; } .left .sidebarLeft ul li:before {display:none; } .left .sidebarLeft ul li { padding:8px 0px;} .left .sidebarLeft ul li:hover {} .left .sidebarLeft ul li a { text-decoration:none; color:#000000; } .left .sidebarLeft ul li:hover {color: } .left .sidebarLeft ul li:hover a {color:#396b9c; border-bottom:1px solid #396b9c; } .sidebar h5 {margin-top:0;} /* Two Columns */ .twoColumn { padding:10px 0;} .twoColumn:after { clear: both; content: " "; display: block; height: 0; visibility: hidden; } .twoColLeft { width: 48%; float: left;} .twoColRight { width: 48%; float: right; } /* Three Columns */ .threeColumn:after { clear: both; content: " "; display: block; height: 0; visibility: hidden; } .threeColCol { width: 31.5%; float: left; margin: 0 2.7% 0 0; padding-bottom: 20px;} .threeColCol:last-child { margin: 0; } /* Four Columns */ .fourColumn {padding:10px 0;} .fourColumn:after { clear: both; content: " "; display: block; height: 0; visibility: hidden; } .fourColCol { width: 23.8%; float: left; margin: 0 1.5% 0 0; padding-bottom: 20px;} .fourColCol:last-child { margin: 0; } /* ----- FiveColumn Block ----- */ .fiveColumn { padding:10px 0; } .fiveColumn:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } .fiveColumnCol { width: 17.6%; float: left; margin-right: 3%;} .fiveColumnCol:last-child { margin-right: 0%; } .fiveColumnCol h4 {color:#fff; background:#b40000; padding:10px 0; text-align:center; margin-top:0; margin-bottom:0; } /* ----- testimonial / form ----- */ .testimonialBG {background:url(/files/galleries/banner2-0001.jpg) center center no-repeat; background-size:cover; } .testimonialWrap {padding: 60px 0 0; background: rgba(42,44,118,.95) } .testimonial { max-width:1000px; height:460px; margin:0 auto; background:url(../images/formBackground.png) bottom right no-repeat; } .testimonial p {color:#fff; margin: 15px 0; font-weight:400; font-family: 'Lato', sans-serif; font-size:18pt; } .testimonial:after { clear: both; content: " "; display: block; height: 0; visibility: hidden; } .testimonialLeft { width: 55%; float: left; margin-top:50px; } /* ----- form ----- */ .testimonialRight { width: 38%; float: right; margin-top:270px; } .testimonialRight table {width:90%; margin:0 auto;} .testimonialRight table td {padding:5px 0;} .testimonialRight table td input {padding:5px 0; text-align:center; color:#2c2f75; font-weight:900; } .testimonialRight .Dialog .mwInput.button { text-decoration:none; background:#396b9c; color:#fff; padding:5px 25px; border:3px solid #fff; font-weight:600; } .testimonialRight .Dialog .mwInput.button input.mw { color: #fff !important; font-size: 14pt; font-weight: 900; } .testimonialRight .Dialog .mwInput.button:hover { background:#396b9c;} .testimonialRight .Dialog .mwInput.button:hover input.mw { color: #fff!important;} /* ----- testimonial slider ----- */ .testimonialSlider { text-align:center;} .testimonialSlider .testimonialImage {height:100px; width:100px; border-radius:50px;} .testimonialSlider p.title {font-style: italic;} .testimonialSlider {} .testimonialSlider .owl-page {background:#cccccc; height:14px; width:14px; border-radius:7px; margin:0 4px;} .testimonialSlider .owl-page.active {background:#396b9c;} /* button */ .button {margin:25px 0 ;} .button p {} .button p a { text-decoration:none; background:#none; color:#396b9c; padding:10px 25px; border:3px solid #396b9c; font-weight:300; border-radius:24px; text-transform:uppercase; font-family: 'Oswald', sans-serif !important;} .button p a:hover { text-decoration:none; background:#396b9c; color:#fff; padding:10px 25px; border:3px solid #396b9c; } .button {margin:25px 0 ;} .button {} .button a { text-decoration:none; background:#none; color:#396b9c; padding:10px 25px; border:3px solid #396b9c; font-weight:300; border-radius:24px; text-transform:uppercase; font-family: 'Oswald', sans-serif !important;} .button a:hover { text-decoration:none; background:#396b9c; color:#fff; padding:10px 25px; border:3px solid #396b9c; } .button a.small {font-size:10px;} .button a.large {font-size:20px;} .petBtn {text-decoration:none; background:#none; color:#396b9c; padding:10px 25px; border:3px solid #396b9c; font-weight:300; border-radius:24px; text-transform:uppercase; font-family: 'Oswald', sans-serif !important;} .petBtn:hover { text-decoration:none; background:#396b9c; color:#fff; padding:10px 25px; border:3px solid #396b9c; cursor: pointer; cursor: hand; } .petBtnActive { text-decoration:none; background:#396b9c; color:#fff; padding:10px 25px; border:3px solid #396b9c; cursor: pointer; cursor: hand; } /* socialFeed */ .socialFeedWrap {width:100%; padding:130px 0; background:url(../images/fbfeedBG.jpg) center center no-repeat; background-size:cover; } .socialFeed {max-width: 290px;margin:0 auto;background:#fff;padding:25px 25px 10px;position: relative;} .socialFeed ul li p{font-size: 11pt; color: #505050; font-weight:400; font-family: 'Lato', sans-serif; } .socialFeed h3 { font-size: 18pt; margin: 0 0 25px; color: #396b9c; font-weight:400; font-family: 'Lato', sans-serif; text-align:center; } .socialFeed p i { font-size: 11pt; margin: 15px 0; color: #396b9c; font-weight:400; font-family: 'Lato', sans-serif; text-align:center; } #twitterFeed { font-size: 11pt; color: #505050; font-weight:400; font-family: 'Lato', sans-serif;} #twitterFeed a { font-size: 11pt; color: #505050; font-weight:400; font-family: 'Lato', sans-serif;} #twitterFeed .user {display:none;} #twitterFeed li {border-bottom:1px solid #ccc; margin:0 0 15px 0; padding-bottom:28px;} .socialFeed ul li p.timePosted {font-size: 9pt; color: #505050; font-weight:400; font-family: 'Lato', sans-serif;} p.timePosted {float:left; } p.interact {text-align:right; } p.interact a { margin:0 10px 0 0; font-size: 9pt !important; color: #505050; font-weight:400; font-family: 'Lato', sans-serif; float:right; } p.followUs, p.followUs a {font-size: 11pt; margin: 0 0 15px; color: #396b9c; font-weight:400; font-family: 'Lato', sans-serif; text-align:center;} /* ----- Footer ----- */ .footerWrap {background: #f5f4f4 url(../images/footerBG.png) right bottom no-repeat; } .footer { max-width:1000px; margin:0 auto; position:relative; padding:25px 0; } .footer:after {clear: both; content: " "; display: block; height: 0; visibility: hidden; } .footer h3 {color:#396b9c; font-weight:400; margin:10px 0; font-family: 'Lato', sans-serif; text-transform:uppercase; } .footer p {color:#231f20; font-weight:400; font-family: 'Lato', sans-serif; font-size:10pt; } .footer p b, .footer p strong {font-weight:600;} .footer p a {color:#231f20; text-decoration:none; } .footer ul li { font-family: 'Lato', sans-serif; font-size:10pt; line-height:17pt; } .footer ul li a {color:#231f20; text-decoration:none;} /* ----- To Top ----- */ .toTop {height:38px; width:38px; background:#f5f4f4; color:#231f20; font-family: 'Lato', sans-serif; text-align:center; position:absolute; top:-36px; right:0; cursor: pointer; cursor: hand; } .toTop span { font-size:15pt; } /* ----- Copyright ----- */ .copyrightWrap {background: #f5f4f4; border-top:1px solid #231f20; text-transform:uppercase; } .copyright {max-width:1000px; margin:0 auto; padding:10px 0 5px;} .copyright:after {clear: both; content: " "; display: block; height: 0; visibility: hidden; } .copyright p {color:#231f20; font-weight:300; font-size:8pt; font-family: 'Lato', sans-serif; } .copyright p a {color:#231f20; text-decoration:none; } /* ----- Zoom Gallery ----- */ .zoom-gallery { position: relative; font-family: 'Open Sans', sans-serif; font-weight: 900; font-size: 11pt; line-height: 20pt; margin: 20px 0; } .zoom-gallery:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } .zoom-gallery ul li { float: none; padding: 0; } .zoom-gallery ul li:before { display: none; } .zoom-gallery .item { overflow: hidden; background-position: center center; } .zoom-gallery .item:hover {} .zoom-gallery .itemHover { padding: 35% 0 45%; background: #222; color: #fff; transition: all 0.7s ease; opacity: 0; text-align: center; font-size: 2em; } .zoom-gallery .itemHover:hover { padding: 35% 0 45%; transition: all 0.7s ease; opacity: .8; } .zoom-gallery .item.two { overflow: hidden; background-position: center center; background-size: auto; width: 50%; padding-bottom: 37.23%; height: 0; float: left; ; } .zoom-gallery .item.four { overflow: hidden; background-position: center center; background-size: auto; width: 25%; padding-bottom: 20.23%; height: 0; float: left; ; } /* ----- Blog Carousel ----- */ .Carousel {width:100%; position:relative; margin:40px 0; } .carouselItem {width:100%; height:240px; position:relative; border:1px solid #fff; background:#555; } .carouselItem img {width:100%; position:relative;} .carouselItem h5 {position:absolute; bottom:-25px; text-align:center; width:100%; text-align:Center; color:#fff; background:rgba(0,0,0,.5); padding:15px 0 25px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; padding:10px 0 25px; } .carouselItem h5 a {color:#fff; text-decoration:none;} .carouselItem h5 a:hover {color:#fff; text-decoration:none;} .carouselItem:hover h5 {width:100%; height:140px; padding:150px 0px 10px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .Carousel .owl-pagination { display:none;} .Carousel .owl-controls { display:none;} /* ----- Partners ----- */ .Partners { position:relative; text-align:center;} .Partners .owl-prev { position:absolute; background:#0ff; left:0; top:41%; background:url(/images/prevNext.png) left center no-repeat; text-indent:-999em; } .Partners .owl-next {position:absolute; background:#0ff; right:0; top:41%; background:url(/images/prevNext.png) right center no-repeat; text-indent:-999em; } .Partners .owl-pagination { display:none;} /* ----- Banner ----- */ .Banner { position:relative; text-align:center;} .Banner .owl-prev { position:absolute; background:#0ff; left:10%; bottom:14%; width:38px; height:80px; background:url(/images/slider-nav-banner.png) left center no-repeat; text-indent:-999em; } .Banner .owl-next {position:absolute; background:#0ff; right:10%; bottom:14%; width:38px; height:80px; background:url(/images/slider-nav-banner.png) right center no-repeat; text-indent:-999em; } .Banner .owl-pagination { margin-top:20px; } .Banner .owl-page {background:#cccccc; height:14px; width:14px; border-radius:7px; margin:0 4px;} .Banner .owl-page.active {background:#396b9c;} /* ----- Blogs----- */ .blog {position:relative; } .blogPostSocial {position:absolute; right:0;; top:62px; } .blog h2 a, .blog h2 { text-decoration:none; color: #396b9c; font-size:18pt;} .blogsidebar h5 a { text-decoration:none; color: #396b9c;} .blogsidebar h5 {margin:3px 0 10px;;} .blogsidebar p {margin:3px 0;} .shareButton span {font-size:12pt; } .shareButton { cursor: pointer; cursor: hand; background:#00a; color:#fff; padding-top:5px; margin:0 0 0 5px ; height:25px; line-height:25px; width:30px; text-align:center; } .shareButton.Facebook {background:#3b5998;} .shareButton.Twitter {background:#0084b4;} .shareButton.Google{background:#d34836;} .shareButton.LinkedIn {background:#007bb6;} /* ----- Extras ----- */ .sidr-class-liveEdDummyBlock { display: none; } #twitter-widget-0 { height: 300px; overflow: hidden; } .trans { animation-name: fadeIn; -webkit-animation-name: fadeIn; animation-duration: .6s; -webkit-animation-duration: .6s; animation-timing-function: ease-in; -webkit-animation-timing-function: ease-in; visibility: visible !important; opacity: 1; } @keyframes fadeIn { 0% { opacity: 0.0; } 60% { opacity: 0.0; } 100% { opacity: 1; } } @-webkit-keyframes fadeIn { 0% { opacity: 0.0;} 0% { opacity: 0.0; } 100% { opacity: 1;} } /** donateForm **/ .Dialog .mwInput.error { border: 1px solid red; color: #231F20; background: #ddd; } .doanteForm { margin-bottom: 50px; width: 100%; } .doanteForm input.donateAmount1, .doanteForm input.donateAmount2, .doanteForm input.donateAmount3, .doanteForm input.donateAmount4, .doanteForm input.donateAmount5, .doanteForm input.donateAmount6 { height: 90px; width: 90px; font-family: 'Lato', sans-serif; background: #fff; border: none; border: 1px solid #ccc; margin: 0 5px 5px 0; font-size: 15pt; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; cursor: pointer; cursor: hand;} .doanteForm input.donateAmount1:hover, .doanteForm input.donateAmount2:hover, .doanteForm input.donateAmount3:hover, .doanteForm input.donateAmount4:hover, .doanteForm input.donateAmount5:hover, .doanteForm input.donateAmount6:hover { background: #396b9c; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .doanteForm input:focus { -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, /1); box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, /1); } .doanteForm select, .doanteForm input { border:none; padding:5px 10px; background:#fff; border:1px solid #ddd; font-family: 'Open Sans', sans-serif; } .doanteForm input[type=checkbox]{ background-position: 0 0; background-repeat: no-repeat; line-height: 32px; cursor: pointer; padding:10px;} .hearttoheart input.donateAmount1, .hearttoheart input.donateAmount2, .hearttoheart input.donateAmount3, .hearttoheart input.donateAmount4, .hearttoheart input.donateAmount5, .hearttoheart input.donateAmount6 { font-size: 12pt !important; width: auto; font-weight: 600; padding: 0 10px; } /* Accordion */ .accordion {} .accordionBtn {} .accordionBtn a {text-decoration:none; color:#666666; position:relative; } .accordionBtn a:before {content:url('/images/accordianArrow.png'); position:absolute; left:-28px; font-size:18pt; } .accordionBtn a p {font-size: 15pt; margin: 0 0 0px 0; color: #4a4e53; font-family: 'Lato', sans-serif; font-weight: 700; } .accordionContent {} .accordionContent p {color: #4a4e53; font-family: 'Lato', sans-serif; } .accordionBtn a.selected:before {content:url('/images/accordianDown.png'); position:absolute; left:-28px; } /* PetPost */ .petPostList {width:30%; float:left; margin: 0 1.4% 4%; text-align:center; } .petPostList h2 a {text-decoration:none; font-size:13pt; } .petPostList p {text-decoration:none; font-size:10pt; } .petThumb {width:23%; float:left; margin:0 2% 1% 0;} .petImage {width:100%; height:120px;} .petPostList img {/* height:270px; */} /* Dog Training */ .dtrain {text-decoration:none; background:#fff; color:#396b9c; padding:5px 25px; border:3px solid #396b9c; font-weight:600; cursor: pointer; cursor: hand;} .dtrain:hover {background:#396b9c; color:#fff;} /* Dog Training Menu */ .dclassMenuHolder .Menu ul li {margin:0 0 7px; padding:0;} .dclassMenuHolder .Menu ul li:before {color:#fff;} .dclassMenuHolder .Menu ul li ul li {margin-left:15px;} .dclassMenuHolder .Menu ul li ul li a {text-decoration:none; } .dclassMenuHolder .Menu ul li ul li a:hover {color:#396b9c;} .dclassMenuHolder .Menu ul li ul li:before { margin:0; content:'\25B6'; color:#505050;} .utw {padding-bottom:3%;} /* Banners */ .bannerCaption {width: 100%;/* padding-bottom: 25.6% */padding: 20% 0;text-align: center;background: rgba(0,0,0,.3);} .bannerCaption h1, .bannerCaption h2, .bannerCaption h3, .bannerCaption h4, .bannerCaption h5, .bannerCaption h6 {font-family: 'Roboto Slab', serif;font-weight: 700;font-size: 28pt;color:#fff;width: 86%;max-width:960px;margin:0 auto 20px;line-height: 30pt;} .bannerCaption p { color:#fff; font-family: 'Open Sans', sans-serif; font-size:12pt;max-width:960px; margin:0 auto } .bannerCaption p a {display: inline-block;background: #414b4b;color: #ffffff;text-decoration: none;padding: 10px 18px;letter-spacing: 1px;} .bannerCaption p a:hover {background: #ccc; } .contentImageCaption a { text-decoration:none; } .contentImageCaptionCopy {/* text-align:center; *//* padding:25% 0; */background: rgba(0,0,0,.3);-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;height: 260px;} .contentImageCaptionCopy h2 {color:#fff;text-transform:uppercase;font-size: 14pt;text-transform: none;position: relative;top: 227px;width: 90%;margin: 0 auto;} .contentImageCaptionCopy p { color:#fff;} .contentImageCaptionCopy .description p { opacity: 0;font-size: 14pt; width: 90%; margin: 0 auto;} .contentImageCaptionCopy .contentImageBorder { height: 95%; width: 95%; margin: 0 auto; top: 2.5%; /* border: 1px solid #fff; */ position: relative; opacity: 0; } .contentImageCaptionCopy:hover .contentImageBorder {opacity: 1;} .contentImageCaptionCopy .description {position: relative; top: 60px;} .contentImageCaptionCopy .description.threeCol {position: relative; top: 60px;} .contentImageCaptionCopy:hover {text-align:center;/* padding:25% 0; */background: rgba(57,107,156,0.4);-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;} .contentImageCaptionCopy:hover .description p {opacity: 1;font-size: 14pt;} .contentImageCaptionCopy:hover h2 {display: none;} @media (max-width: 880px) { .contentImageCaption.newsletter {height: 403px;} .contentImageCaptionCopy {text-align:center;padding:25% 0;background: rgba(0,0,0,0.3); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .contentImageCaption {margin-top: 0;} .contentImageCaptionCopy .contentImageBorder {height: 409px;top: -75px;} .contentImageCaptionCopy .description {top:160px;} .contentImageCaptionCopy .description.threeCol {top: 160px;} } /* Card Bubba */ .grid { position: relative; margin: 0 auto; padding: 0 0 4em; max-width: 1000px; list-style: none; text-align: center; } /* Common style */ .grid figure { position: relative; float: left; overflow: hidden; margin: 0 1%;/* min-width: 320px;*/ max-width: 480px; max-height: 360px;/* width: 48%; */ text-align: center; cursor: pointer; } .grid figure img { position: relative; display: block; min-height: 100%; max-width: 100%; } .grid figure figcaption { padding: .5em 0; color: #fff;/* font-size: 1.25em; */ -webkit-backface-visibility: hidden; backface-visibility: hidden; } .grid figure figcaption::before, .grid figure figcaption::after { pointer-events: none; } .grid figure figcaption, .grid figure figcaption > a { position: absolute;top: 260px; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);} .grid figure.effect-bubba.four figcaption, .grid figure.effect-bubba.four figcaption > a { position: absolute;top: 187px; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);} .grid figure.effect-bubba.four.long figcaption, .grid figure.effect-bubba.four.long figcaption > a { position: absolute;top: 167px; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);} .grid figure:hover figcaption, .grid figure:hover figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: top 1.35s; -moz-transition: top 1.35s; -webkit-transition: top 1.35s; -ie-transition: top 1.35s;} .grid figure.effect-bubba.four:hover figcaption, .grid figure.effect-bubba.four:hover figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: top 1.35s;-moz-transition: top 1.35s; -webkit-transition: top 1.35s; -ie-transition: top 1.35s;} /* Anchor will cover the whole item by default */ /* For some effects it will show as a button */ .grid figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; } .grid figure h2 { font-weight: 300; font-size: 20pt; } .grid figure h2 span { font-weight: 800; } .grid figure h2, .grid figure p { margin: 0; color: #fff; } .grid figure h3 {font-weight: 300;font-size: 15pt;text-transform: uppercase;} .grid figure h3 span { font-weight: 800; } .grid figure h3 { color: #fff; } .grid figure h3::after {content: '>';position: absolute;/* width: 24px; *//* height: 24px; */font-family: 'Lato', sans-serif;font-size: 30pt;/* padding-left: 20px; *//* top: -1px; */right: 15px;top: -1px;} .grid figure.long h3::after {content: '>';position: absolute;/* width: 24px; *//* height: 24px; */font-family: 'Lato', sans-serif;font-size: 30pt;/* padding-left: 20px; *//* top: -1px; */right: 15px;top: 8px;} .grid figure p { letter-spacing: 1px; font-size: 11pt; line-height: normal; color: #fff; } /*---------------*/ /***** Bubba *****/ /*---------------*/ figure.effect-bubba h2 { padding-top: 30%;} figure.effect-bubba h3 {/* padding-top: 20%; */padding: 0px 10px;margin: 7px;text-align: left;} figure.effect-bubba p { padding: 0% 15%; padding: 10px 10px;text-align: left;} .partnersImage {height: 200px;} @media (max-width: 768px) { .grid figure figcaption, .grid figure figcaption > a,.grid figure.effect-bubba.four figcaption, .grid figure.effect-bubba.four figcaption > a {top: 190px;} .partnersImage {height: 300px;} } .mwBtnLeft {text-align:left;} .mwBtnRight {text-align: right;} .mwBtnCenter {text-align: center;} /*! |----------------------------------------------------------------------------------------- | | | Mobile Menu One - Start | | |----------------------------------------------------------------------------------------- */ .mobileMenuOne .mobileMenuBackdrop { display: none; position: fixed; top: 0; left: 0; bottom: 0; width: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 1000;} .mobileMenuOne .mobileMenuWrap { position: fixed; top: 0; right: 0; bottom: 0; width: 100%; max-width: 480px; padding: 15px; transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 400ms; -webkit-transform: translateX(100%); transform: translateX(100%); z-index: 1010;} .mobileMenuOne .mobileMenuInner {position: relative;display: grid;grid-template-rows: auto 1fr auto;overflow: hidden;height: 100%;padding: 80px 0 50px;border-radius: 4px;box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);background: #fff;} @media (max-width: 575px) { .mobileMenuOne .mobileMenuInner { padding: 80px 0 30px; } } .mobileMenuOne .mobileMenuClose { position: absolute; top: 30px; right: 30px;} .mobileMenuOne .mobileMenuHeader { padding: 0 50px;} @media (max-width: 575px) { .mobileMenuOne .mobileMenuHeader { padding: 0 30px; } } .mobileMenuOne .mobileMenuBody { overflow-x: hidden; overflow-y: auto; padding: 0 50px;} @media (max-width: 575px) { .mobileMenuOne .mobileMenuBody { padding: 0 30px; } } .mobileMenuOne .mobileMenuFooter { padding: 0 50px;} @media (max-width: 575px) { .mobileMenuOne .mobileMenuFooter { padding: 0 30px; } } .mobileMenuOne.active .mobileMenuWrap { -webkit-transform: translateX(0); transform: translateX(0);} .mobileMenuOne .mobileMenuNav ul {padding: 0;font-family: 'Lato', sans-serif;} .mobileMenuOne .mobileMenuNav ul li { padding: 0; margin: 0 0 15px 0;} .mobileMenuOne .mobileMenuNav ul li:last-of-type { margin-bottom: 0;} .mobileMenuOne .mobileMenuNav ul li:before { display: none;} .mobileMenuOne .mobileMenuNav ul li a {width: 100%;color: var(--color-primary);font-size: 25px;font-weight: 700;text-decoration: none;color: #396b9c;} .mobileMenuOne .mobileMenuNav ul li a:hover { color: var(--color-primary-dark);} .mobileMenuOne .mobileMenuNav ul li a > i { font-size: 20px; transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 200ms;} .mobileMenuOne .mobileMenuNav ul li.has-children > a {display: flex;align-items: center;justify-content: space-between;text-decoration: none;color: #396b9c;} .mobileMenuOne .mobileMenuNav ul li ul { display: none; margin: 15px 0 0; padding: 0 0 0 20px; border-left: 1px solid var(--color-primary-dark);} .mobileMenuOne .mobileMenuNav ul li ul li a { color: var(--color-primary-dark); font-size: 18px; font-weight: 400;} .mobileMenuOne .mobileMenuNav ul li ul li a:hover { color: var(--color-primary-darkest);} .mobileMenuOne .mobileMenuNav ul li ul li a > i { font-size: 16px;} .mobileMenuOne .mobileMenuNav ul li.active > a { color: var(--color-primary-dark);} .mobileMenuOne .mobileMenuNav ul li.active > a i { -webkit-transform: rotate(90deg); transform: rotate(90deg);} /* |----------------------------------------------------------------------------------------- | | | Mobile Menu One - End | | |----------------------------------------------------------------------------------------- */ /*! |----------------------------------------------------------------------------------------- | | | Burger - Start | | |----------------------------------------------------------------------------------------- */ .headerMobileMenu {position:absolute; right:10px; top:55px; z-index:9;} .burger {display: table;position: relative;min-width: 20px;height: 20px;cursor: pointer;border: none;background: none;} .burger .burgerLines { display: block; position: absolute; top: 2px; left: 0; overflow: hidden; width: 20px; height: 16px;} .burger .burgerLine {display: block;position: absolute;top: 7px;height: 2px;border-radius: 0;color: #fff;} .burger .burgerSlashes { display: inline-block; position: absolute; overflow: hidden; top: 0; left: 0; width: 20px; height: 20px;} .burger .burgerSlash { opacity: 0; display: block; position: absolute; top: 9px; left: -3px; width: 26px; height: 2px; border-radius: 0; background-color: var(--color-primary); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 500ms; background:#396b9c} .burger .burgerText {display: block;position: relative;overflow: hidden;margin-left: 26px;color: #fff;text-transform: uppercase;font-size: 12px;line-height: 20px;background: none;font-weight: 800;} .burger .burgerText .textOpen { display: block; position: absolute; top: 0; left: 0; transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms; -webkit-transform: translateX(0%); transform: translateX(0%);} .burger .burgerText .textClose { display: block; opacity: 0; transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms; -webkit-transform: translateX(-100%); transform: translateX(-100%);} .burger.burgerHover:hover .burgerLine { background-color: var(--color-primary-dark);} .burger.burgerHover:hover .burgerSlash { background-color: var(--color-primary-dark);} .burger.burgerHover:hover .burgerText { color: var(--color-primary-dark);} .burger.open .burgerText .textOpen { opacity: 0; -webkit-transform: translateX(100%); transform: translateX(100%);} .burger.open .burgerText .textClose {opacity: 1;-webkit-transform: translateX(0%);transform: translateX(0%);color: #396b9c;} .burgerOne .burgerLine {width: 20px;background: #fff;} .burgerOne .burgerLine:nth-of-type(1) { -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 0ms;} .burgerOne .burgerLine:nth-of-type(2) { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 100ms;} .burgerOne .burgerLine:nth-of-type(3) { -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 200ms;} .burgerOne .burgerLine:nth-of-type(4) { opacity: 0; -webkit-transform: translate(-20px, -7px); transform: translate(-20px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 50ms;} .burgerOne .burgerLine:nth-of-type(5) { opacity: 0; -webkit-transform: translate(-20px, 0px); transform: translate(-20px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 150ms;} .burgerOne .burgerLine:nth-of-type(6) { opacity: 0; -webkit-transform: translate(-20px, 7px); transform: translate(-20px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 250ms;} .burgerOne .burgerSlash:nth-of-type(1) { -webkit-transform: rotate(45deg) translate(-40px, 0); transform: rotate(45deg) translate(-40px, 0);} .burgerOne .burgerSlash:nth-of-type(2) { -webkit-transform: rotate(-45deg) translate(40px, 0); transform: rotate(-45deg) translate(40px, 0);} .burgerOne .burgerSlash:nth-of-type(3) { -webkit-transform: rotate(45deg) translate(-40px, 0); transform: rotate(45deg) translate(-40px, 0);} .burgerOne .burgerSlash:nth-of-type(4) { -webkit-transform: rotate(-45deg) translate(40px, 0); transform: rotate(-45deg) translate(40px, 0);} .burgerOne.burgerHover:not(.open):hover .burgerLine:nth-of-type(1) { opacity: 0; -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerOne.burgerHover:not(.open):hover .burgerLine:nth-of-type(2) { opacity: 0; -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerOne.burgerHover:not(.open):hover .burgerLine:nth-of-type(3) { opacity: 0; -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerOne.burgerHover:not(.open):hover .burgerLine:nth-of-type(4) { opacity: 1; -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px);} .burgerOne.burgerHover:not(.open):hover .burgerLine:nth-of-type(5) { opacity: 1; -webkit-transform: translate(0px, 0); transform: translate(0px, 0);} .burgerOne.burgerHover:not(.open):hover .burgerLine:nth-of-type(6) { opacity: 1; -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px);} .burgerOne.open .burgerLine:nth-of-type(1) { -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerOne.open .burgerLine:nth-of-type(2) { -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerOne.open .burgerLine:nth-of-type(3) { -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerOne.open .burgerLine:nth-of-type(4) { opacity: 0; -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerOne.open .burgerLine:nth-of-type(5) { opacity: 0; -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerOne.open .burgerLine:nth-of-type(6) { opacity: 0; -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerOne.open .burgerSlash:nth-of-type(1) { -webkit-transform: translate(0, 0) rotate(45deg); transform: translate(0, 0) rotate(45deg); opacity: 1;} .burgerOne.open .burgerSlash:nth-of-type(2) { -webkit-transform: translate(0, 0) rotate(-45deg); transform: translate(0, 0) rotate(-45deg); opacity: 1;} .burgerOne.open.burgerHover:hover .burgerSlash:nth-of-type(1) { -webkit-transform: translate(45px, 45px) rotate(45deg); transform: translate(45px, 45px) rotate(45deg); opacity: 0;} .burgerOne.open.burgerHover:hover .burgerSlash:nth-of-type(2) { -webkit-transform: translate(-45px, 45px) rotate(-45deg); transform: translate(-45px, 45px) rotate(-45deg); opacity: 0;} .burgerOne.open.burgerHover:hover .burgerSlash:nth-of-type(3) { -webkit-transform: translate(0, 0) rotate(45deg); transform: translate(0, 0) rotate(45deg); opacity: 1;} .burgerOne.open.burgerHover:hover .burgerSlash:nth-of-type(4) { -webkit-transform: translate(0, 0) rotate(-45deg); transform: translate(0, 0) rotate(-45deg); opacity: 1;} .burgerTwo .burgerLine:nth-of-type(1) { width: 18px; -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 0ms;} .burgerTwo .burgerLine:nth-of-type(2) { width: 20px; -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 100ms;} .burgerTwo .burgerLine:nth-of-type(3) { width: 14px; -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 200ms;} .burgerTwo .burgerLine:nth-of-type(4) { opacity: 0; width: 19px; -webkit-transform: translate(-20px, -7px); transform: translate(-20px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 50ms;} .burgerTwo .burgerLine:nth-of-type(5) { opacity: 0; width: 20px; -webkit-transform: translate(-20px, 0px); transform: translate(-20px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 150ms;} .burgerTwo .burgerLine:nth-of-type(6) { opacity: 0; width: 14px; -webkit-transform: translate(-20px, 7px); transform: translate(-20px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 250ms;} .burgerTwo .burgerSlash:nth-of-type(1) { -webkit-transform: rotate(45deg) translate(-40px, 0); transform: rotate(45deg) translate(-40px, 0);} .burgerTwo .burgerSlash:nth-of-type(2) { -webkit-transform: rotate(-45deg) translate(40px, 0); transform: rotate(-45deg) translate(40px, 0);} .burgerTwo .burgerSlash:nth-of-type(3) { -webkit-transform: rotate(45deg) translate(-40px, 0); transform: rotate(45deg) translate(-40px, 0);} .burgerTwo .burgerSlash:nth-of-type(4) { -webkit-transform: rotate(-45deg) translate(40px, 0); transform: rotate(-45deg) translate(40px, 0);} .burgerTwo.burgerHover:not(.open):hover .burgerLine:nth-of-type(1) { opacity: 0; -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerTwo.burgerHover:not(.open):hover .burgerLine:nth-of-type(2) { opacity: 0; -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerTwo.burgerHover:not(.open):hover .burgerLine:nth-of-type(3) { opacity: 0; -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerTwo.burgerHover:not(.open):hover .burgerLine:nth-of-type(4) { opacity: 1; -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px);} .burgerTwo.burgerHover:not(.open):hover .burgerLine:nth-of-type(5) { opacity: 1; -webkit-transform: translate(0px, 0); transform: translate(0px, 0);} .burgerTwo.burgerHover:not(.open):hover .burgerLine:nth-of-type(6) { opacity: 1; -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px);} .burgerTwo.open .burgerLine:nth-of-type(1) { -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerTwo.open .burgerLine:nth-of-type(2) { -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerTwo.open .burgerLine:nth-of-type(3) { -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerTwo.open .burgerLine:nth-of-type(4) { opacity: 0; -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerTwo.open .burgerLine:nth-of-type(5) { opacity: 0; -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerTwo.open .burgerLine:nth-of-type(6) { opacity: 0; -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerTwo.open .burgerSlash:nth-of-type(1) { -webkit-transform: translate(0, 0) rotate(45deg); transform: translate(0, 0) rotate(45deg); opacity: 1;} .burgerTwo.open .burgerSlash:nth-of-type(2) { -webkit-transform: translate(0, 0) rotate(-45deg); transform: translate(0, 0) rotate(-45deg); opacity: 1;} .burgerTwo.open.burgerHover:hover .burgerSlash:nth-of-type(1) { -webkit-transform: translate(45px, 45px) rotate(45deg); transform: translate(45px, 45px) rotate(45deg); opacity: 0;} .burgerTwo.open.burgerHover:hover .burgerSlash:nth-of-type(2) { -webkit-transform: translate(-45px, 45px) rotate(-45deg); transform: translate(-45px, 45px) rotate(-45deg); opacity: 0;} .burgerTwo.open.burgerHover:hover .burgerSlash:nth-of-type(3) { -webkit-transform: translate(0, 0) rotate(45deg); transform: translate(0, 0) rotate(45deg); opacity: 1;} .burgerTwo.open.burgerHover:hover .burgerSlash:nth-of-type(4) { -webkit-transform: translate(0, 0) rotate(-45deg); transform: translate(0, 0) rotate(-45deg); opacity: 1;} .burgerThree .burgerLine:nth-of-type(1) { width: 20px; -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 0ms;} .burgerThree .burgerLine:nth-of-type(2) { width: 20px; -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 100ms;} .burgerThree .burgerLine:nth-of-type(3) { width: 14px; -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 200ms;} .burgerThree .burgerLine:nth-of-type(4) { opacity: 0; width: 20px; -webkit-transform: translate(-20px, -7px); transform: translate(-20px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 50ms;} .burgerThree .burgerLine:nth-of-type(5) { opacity: 0; width: 20px; -webkit-transform: translate(-20px, 0px); transform: translate(-20px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 150ms;} .burgerThree .burgerLine:nth-of-type(6) { opacity: 0; width: 14px; -webkit-transform: translate(-20px, 7px); transform: translate(-20px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 250ms;} .burgerThree .burgerSlash:nth-of-type(1) { -webkit-transform: rotate(45deg) translate(-40px, 0); transform: rotate(45deg) translate(-40px, 0);} .burgerThree .burgerSlash:nth-of-type(2) { -webkit-transform: rotate(-45deg) translate(40px, 0); transform: rotate(-45deg) translate(40px, 0);} .burgerThree .burgerSlash:nth-of-type(3) { -webkit-transform: rotate(45deg) translate(-40px, 0); transform: rotate(45deg) translate(-40px, 0);} .burgerThree .burgerSlash:nth-of-type(4) { -webkit-transform: rotate(-45deg) translate(40px, 0); transform: rotate(-45deg) translate(40px, 0);} .burgerThree.burgerHover:not(.open):hover .burgerLine:nth-of-type(1) { opacity: 0; -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerThree.burgerHover:not(.open):hover .burgerLine:nth-of-type(2) { opacity: 0; -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerThree.burgerHover:not(.open):hover .burgerLine:nth-of-type(3) { opacity: 0; -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerThree.burgerHover:not(.open):hover .burgerLine:nth-of-type(4) { opacity: 1; -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px);} .burgerThree.burgerHover:not(.open):hover .burgerLine:nth-of-type(5) { opacity: 1; -webkit-transform: translate(0px, 0); transform: translate(0px, 0);} .burgerThree.burgerHover:not(.open):hover .burgerLine:nth-of-type(6) { opacity: 1; -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px);} .burgerThree.open .burgerLine:nth-of-type(1) { -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerThree.open .burgerLine:nth-of-type(2) { -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerThree.open .burgerLine:nth-of-type(3) { -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerThree.open .burgerLine:nth-of-type(4) { opacity: 0; -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerThree.open .burgerLine:nth-of-type(5) { opacity: 0; -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerThree.open .burgerLine:nth-of-type(6) { opacity: 0; -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerThree.open .burgerSlash:nth-of-type(1) { -webkit-transform: translate(0, 0) rotate(45deg); transform: translate(0, 0) rotate(45deg); opacity: 1;} .burgerThree.open .burgerSlash:nth-of-type(2) { -webkit-transform: translate(0, 0) rotate(-45deg); transform: translate(0, 0) rotate(-45deg); opacity: 1;} .burgerThree.open.burgerHover:hover .burgerSlash:nth-of-type(1) { -webkit-transform: translate(45px, 45px) rotate(45deg); transform: translate(45px, 45px) rotate(45deg); opacity: 0;} .burgerThree.open.burgerHover:hover .burgerSlash:nth-of-type(2) { -webkit-transform: translate(-45px, 45px) rotate(-45deg); transform: translate(-45px, 45px) rotate(-45deg); opacity: 0;} .burgerThree.open.burgerHover:hover .burgerSlash:nth-of-type(3) { -webkit-transform: translate(0, 0) rotate(45deg); transform: translate(0, 0) rotate(45deg); opacity: 1;} .burgerThree.open.burgerHover:hover .burgerSlash:nth-of-type(4) { -webkit-transform: translate(0, 0) rotate(-45deg); transform: translate(0, 0) rotate(-45deg); opacity: 1;} .burgerFour .burgerLines { transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms;} .burgerFour .burgerLine { width: 20px;} .burgerFour .burgerLine:nth-of-type(1) { -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 0ms;} .burgerFour .burgerLine:nth-of-type(2) { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 100ms;} .burgerFour .burgerLine:nth-of-type(3) { -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 200ms;} .burgerFour .burgerLine:nth-of-type(4) { opacity: 0; -webkit-transform: translate(-20px, -7px); transform: translate(-20px, -7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 50ms;} .burgerFour .burgerLine:nth-of-type(5) { opacity: 0; -webkit-transform: translate(-20px, 0px); transform: translate(-20px, 0px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 150ms;} .burgerFour .burgerLine:nth-of-type(6) { opacity: 0; -webkit-transform: translate(-20px, 7px); transform: translate(-20px, 7px); transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 360ms 250ms;} .burgerFour .burgerSlashes { display: none;} .burgerFour.burgerHover:hover .burgerLine:nth-of-type(1) { opacity: 0; -webkit-transform: translate(20px, -7px); transform: translate(20px, -7px);} .burgerFour.burgerHover:hover .burgerLine:nth-of-type(2) { opacity: 0; -webkit-transform: translate(20px, 0); transform: translate(20px, 0);} .burgerFour.burgerHover:hover .burgerLine:nth-of-type(3) { opacity: 0; -webkit-transform: translate(20px, 7px); transform: translate(20px, 7px);} .burgerFour.burgerHover:hover .burgerLine:nth-of-type(4) { opacity: 1; -webkit-transform: translate(0px, -7px); transform: translate(0px, -7px);} .burgerFour.burgerHover:hover .burgerLine:nth-of-type(5) { opacity: 1; -webkit-transform: translate(0px, 0); transform: translate(0px, 0);} .burgerFour.burgerHover:hover .burgerLine:nth-of-type(6) { opacity: 1; -webkit-transform: translate(0px, 7px); transform: translate(0px, 7px);} .burgerFour.open .burgerLines { -webkit-transform: rotate(90deg); transform: rotate(90deg);} /*!