/* Theme Name: BlankSlate Theme URI: http://wordpress.org/themes/blankslate Author: TidyThemes Author URI: http://tidythemes.com/ Description: UPDATE - 4.0+ is here, completely overhauled, yet again. As always, use caution when upgrading (tidythemes.com/concept/#upgrading) and learn the TidyThemes concept (tidythemes.com/concept).   → CAUTION: If you're child theming or have clients that are child theming on top of BlankSlate (not the recommended use), please do not blindly upgrade to newer versions.   → DESCRIPTION: BlankSlate is the definitive WordPress HTML5 boilerplate starter theme. We've carefully constructed the most clean and minimalist theme available anywhere for designers/developers to use as a base/foundation to build websites for clients or to build completely custom themes from scratch to release faster. Clean, semi-minified, unformatted and valid code, SEO-friendly, no programmer comments, standardized and as white label as possible and most importantly, CSS reset for cross-browser-compatability and no intrusive visual CSS styles added whatsoever. A perfect skeleton theme that blows any others like it (the subsequent underscores.me for example) completely out of the water, as they're simply too overcomplicated for what people really want in this kind of theme. Now comes with jQuery enqueued and ready to go.   → SUPPORT: Please use the official support forum (tidythemes.com/forum). Comments and suggestions for improving BlankSlate, please see "TidyThemes Sucks!" (tidythemes.com/tidythemes-sucks). Just getting started? Want to learn CSS? (tidythemes.com/want-to-learn-css)   → WHAT'S NEW?: We stripped down as much custom, extraneous, superfluous junk code as we could and greatly improved the HTML5 structure. Chip Bennett (make.wordpress.org/themes/author/chipbennett), a highly experienced programmer and official WordPress administrator, worked closely with us to audit the theme code for quality. See (themes.trac.wordpress.org/changeset?old_path=/blankslate/3.3&new_path=/blankslate/4.0) just how much we've revamped things. Last, but not least, BlankSlate has now been opened up on GitHub (github.com/tidythemes/blankslate) if anyone would like to make suggested code additions/improvements. Thank you for using BlankSlate. Version: 4.0.2 License: GNU General Public License License URI: https://www.gnu.org/licenses/gpl.html Tags: black, blue, white, light, one-column, fluid-layout, responsive-layout, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready Text Domain: blankslate BlankSlate WordPress Theme © 2011-2014 TidyThemes BlankSlate is distributed under the terms of the GNU GPL */ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}.clear{clear:both} .sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{} /******************************** GENERAL TYPOGRAPHY ********************************/ /* font-family:'Montserrat'; */ html { -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */ } body { font-size: 62.5%; font-family:'Montserrat'; color: #231f20; } a { text-decoration: none; color: #0096d7; } sup { vertical-align: super; font-size: 12px; } strong, b { font-weight: 700; } i, em { font-style: italic; } .blue { color: #0096d7; } .blueBG { background-color: #0096d7; } .red { color: #ff0000; } .redBG { background-color: #ff0000; } .yellow { color: #e8bb20; } .yellowBG { background-color: #e8bb20; } .greyBG { background-color: #fafafa; } .module.greyBG:not(.moduleHero):not(.moduleFullWidthCTAS):not(.googleMap) + .module.greyBG, .module:not(.greyBG):not(.moduleHero):not(.moduleFullWidthCTAS):not(.googleMap) + .module:not(.greyBG) { padding-top: 0; } .twoColumn .greyBG { background: none; } .circleIcon { display: inline-block; margin-right: 10px; width: 65px; height: 65px; line-height: 65px; border-radius: 65px; -moz-border-radius: 65px; text-align: center; color: #fff; font-weight: 700; } .basicBtn { display: inline-block; padding: 12px 35px 12px 20px; border-radius: 3px; -moz-border-radius: 3px; color: #fff; font-size: 1.8em; font-weight: 600; box-shadow: 0 3px 3px rgba(0,0,0,0.3); text-shadow: 1px 1px 1px rgba(0,0,0,0.3); transition: all ease .3s; position: relative; } input[type=submit].basicBtn { padding: 12px 20px; } .basicBtn:after { content: '\f105'; font-family: FontAwesome; position: absolute; right: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); transition: all ease .3s; opacity: 0; } .basicBtn:hover:after { opacity: 1; right: 10px; } .basicBtn.yellowBG:hover { background-color: #0096d7; } .basicBtn.blueBG:hover { background-color: #e8bb20; } .readMore { font-size: 1.6em; font-weight: 700; color: #0798d7; } .readMore i { display: inline-block; margin-left: 5px; color: #d9ae1a; } .moduleNote { font-size: 1.2em; font-style: italic; margin: 20px 0; } /******************************** GENERAL LAYOUT ********************************/ html { -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */ } .wrapper { max-width: 1040px; width: 100%; padding: 0 20px; margin: 0 auto; position: relative; box-sizing: border-box; } .wrapper:after, .moduleColumnCTAS .ctas:after, .moduleColumnCTAS.bgImageHoverText .cta:after, #footer .icons:after, .featuredPost:after { content: ''; clear: both; display: block; } .clear { clear: both; } .donationBox { float: right; width: 370px; max-width: 100%; margin: 0 0 100px 100px; } .donationBox header { background: #006fae; color: #fff; font-size: 2.4em; font-weight: 600; padding: 40px 50px; } .donationBox .content { padding: 40px 50px 20px 50px; background: #fafafa; } .donationBox .content:after { content: ''; display: block; clear: both; } .donationBox .readMore { float: left; clear: left; } .donationBox .readMore + .readMore { display: none !important; } .coverLink { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10; } .btnCenter { text-align: center; } .youtubePlayer { display: block; } .youtubePlayer.floatleft { float: left; margin: 0 30px 30px 0; } .youtubePlayer.floatright { float: right; margin: 0 0 30px 30px; } .youtubePlayer.floatnone { float: none; margin: 0 0 30px 0; } /******************************** HEADER ********************************/ #header { position: relative; z-index: 30; box-shadow: 0 3px 3px rgba(0,0,0,0.2); border-bottom: 1px solid #dbdbdb; padding: 20px 0 0 0; background: #ffffff; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmMGYwZjAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ffffff 0%, #f0f0f0 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f0f0f0)); background: -webkit-linear-gradient(top, #ffffff 0%,#f0f0f0 100%); background: -o-linear-gradient(top, #ffffff 0%,#f0f0f0 100%); background: -ms-linear-gradient(top, #ffffff 0%,#f0f0f0 100%); background: linear-gradient(to bottom, #ffffff 0%,#f0f0f0 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f0f0f0',GradientType=0 ); } #logo { float: left; } #headerButtons { float: right; margin-top: 20px; } #headerButtons .btn { float: left; position: relative; } #headerButtons .btn + .btn { margin-left: 15px; } #headerButtons .btn a.roundedBtn { border: 1px solid #ebebeb; box-shadow: 0 0 3px rgba(0,0,0,0.1); border-radius: 3px; -moz-border-radius: 3px; font-weight: 700; font-size: 1.6em; float: left; display: block; padding: 10px 20px; margin-left: 15px; background: #ffffff; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmN2Y3ZjciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ffffff 0%, #f7f7f7 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f7f7f7)); background: -webkit-linear-gradient(top, #ffffff 0%,#f7f7f7 100%); background: -o-linear-gradient(top, #ffffff 0%,#f7f7f7 100%); background: -ms-linear-gradient(top, #ffffff 0%,#f7f7f7 100%); background: linear-gradient(to bottom, #ffffff 0%,#f7f7f7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 ); } #headerButtons .btn a.main.emergency { right: -1px; position: relative; color: #ff0000; } #headerButtons .btn a.main.emergency.active { background: #fff; padding-bottom: 25px; } #headerButtons .btn a.roundedBtn > i { margin-right: 8px; font-size: 1em; } #headerButtons .hide { display: none; } #headerButtons .hide.emergency { display: none; position: absolute; width: 380px; background-color: #fff; top: 45px; right: 0; padding: 20px; box-sizing: border-box; z-index: 20; border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0 2px 1px 1px rgba(0,0,0,0.1); } #headerButtons .hide.emergency .column { display: inline-block; width: 47%; padding: 5px 15px; box-sizing: border-box; color: #231f20; margin-bottom: 15px; } #headerButtons .hide.emergency .column + .column { border-left: 1px solid #eaeaea; } #headerButtons .hide.emergency .column h4 { font-size: 16px; font-weight: 700; margin-bottom: 10px; } #headerButtons .hide.emergency .column h4 a, #headerButtons .hide.emergency .column p a { color: #ff0000; } #headerButtons .hide.emergency .column p { font-size: 15px; margin-bottom: 10px; } #headerButtons .hide.emergency .column p i { color: #ff0000; margin-right: 5px; } #headerButtons .hide.emergency .hotline { background: #f9f9f9; border: 1px solid #f1f1f1; border-radius: 5px; -moz-border-radius: 5px; padding: 15px 20px; text-align: center; font-size: 15px; color: #231f20; margin-bottom: 15px; } #headerButtons .hide.emergency .allEmergencies { font-size: 14px; font-weight: 700; color: #fff; background: #ff0000; padding: 10px 20px; border: 1px solid #e20000; border-radius: 5px; -moz-border-radius: 5px; display: inline-block; } #headerButtons .hide.emergency .allEmergencies i { margin-right: 5px; } #quickMainNav { float: right; position: relative; z-index: 20; margin: 24px 0 0 20px; } #quickMainNav > a { color: #555; font-size: 1.6em; position: relative; z-index: 1; } #quickMainNav i { margin-right: 10px; font-size: 30px; vertical-align: middle; } #quickMainNav:hover .hide { display: block; } #quickMainNav .hide { display: none; position: absolute; top: 100%; right: 0; width: 160px; background: #fff; border-radius: 10px; -moz-border-radius: 10px; padding: 20px; z-index: 0; border: 1px solid #ccc; text-align: left; } #quickMainNav .hide ul li { font-size: 1.4em; line-height: 1.3em; margin-bottom: 10px; } #quickMainNav .hide ul li:last-child { margin-bottom: 0; } #quickMainNav .hide ul li:before { content: '\f105'; font-family: FontAwesome; display: inline-block; margin-right: 5px; font-size: 12px; vertical-align: middle; } #quickMainNav .hide a:hover, #quickMainNav .hide li:hover:before { color: #0899d8; } #mainNav { margin-top: 20px; height: 50px; line-height: 50px; clear: both; border-radius: 3px; -moz-border-radius: 3px; position: relative; top: 8px; z-index: 10; background: #0899d8; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA4OTlkOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDkxZDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #0899d8 0%, #0091d0 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0899d8), color-stop(100%,#0091d0)); background: -webkit-linear-gradient(top, #0899d8 0%,#0091d0 100%); background: -o-linear-gradient(top, #0899d8 0%,#0091d0 100%); background: -ms-linear-gradient(top, #0899d8 0%,#0091d0 100%); background: linear-gradient(to bottom, #0899d8 0%,#0091d0 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0899d8', endColorstr='#0091d0',GradientType=0 ); } #mainNav > ul { font-size: 0; text-align: center; } #mainNav > ul > li { display: inline-block; font-size: 15px; } #mainNav > ul > li:first-child > a { border-left: 0; } #mainNav > ul > li:last-child > a { border-right: none; } #mainNav > ul > li.donate > a:before { content: '\f004'; font-family: FontAwesome; color: #fff; display: block; float: left; margin-right: 5px; font-size: 10px; vertical-align: middle; } #mainNav > ul > li > a { color: #fff; display: block; padding: 0 15px; border-right: 1px solid #0ba2e4; border-left: 1px solid #008cc8; } #mainNav > ul > li > a:hover, #mainNav > ul > li > a:hover:before { color: #ffc600; background: #0899d8; } #mainNav .dropdown { display: none; color: #fff; position: absolute; width: 100%; left: 0; top: 50px; background: rgba(0,150,215,.97); padding: 40px 30px; box-sizing: border-box; text-align: left; } #mainNav > ul > li.donate .dropdown { max-width: 390px; width: 100%; right: 0; left: auto; } #mainNav ul li:hover .dropdown { display: block; } #mainNav .dropdown .columns { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: flex-start; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; flex-wrap: no-wrap; -webkit-flex-wrap: no-wrap; } #mainNav .dropdown .columns .column { width: 100%; max-width: 21%; line-height: 1em; margin: 0 2%; position: relative; } #mainNav .dropdown .columns .column:first-child { margin-left: 0; } #mainNav .dropdown .columns .column:last-child { margin-right: 0; } #mainNav .dropdown .columns .column.pageList { font-size: 15px; } #mainNav .dropdown .columns .column.pageList h4 { font-weight: 700; border-bottom: 1px solid #0384bb; padding-bottom: 10px; } #mainNav .dropdown .columns .column.pageList h4 a { color: #fff; } #mainNav .dropdown .columns .column.pageList ul li { font-weight: 300; border-bottom: 1px solid #0384bb; padding: 10px 0; } #mainNav .dropdown .columns .column.pageList ul li a { color: #fff; } #mainNav .dropdown .columns .column.pageList ul li:last-child { margin-bottom: 0; padding-bottom: 0; border: none; } #mainNav .dropdown .columns .column.pageList ul li:before { content: '\f105'; font-family: FontAwesome; display: inline-block; margin-right: 5px; font-size: 12px; vertical-align: middle; } #mainNav .dropdown .columns .column.pageList ul li a:hover { color: #ffd02f; } #mainNav .dropdown .columns .thumb { width: 100%; height: 125px; background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 20px; border: 1px solid #0384bb; } #mainNav .dropdown .columns .column.featuredContent h4 { font-size: 16px; font-weight: 700; margin-bottom: 10px; } #mainNav .dropdown .columns .column.featuredContent p { font-size: 13px; font-weight: 300; } #mainNav .dropdown form .field { float: left; width: 50%; padding: 0 0 0 10px; box-sizing: border-box; line-height: 1em; margin: 0 0 20px 0; font-size: 18px; } #mainNav .dropdown form .field:nth-child(odd) { padding: 0 10px 0 0; } #mainNav .dropdown form input[type=text] { width: 100%; border: none; height: 30px; padding: 0 10px; box-sizing: border-box; font-size: 18px; font-weight: 300; font-family: 'Montserrat'; } #mainNav .dropdown form .submit { clear: both; } #mainNav .dropdown form input[type=submit] { display: block; width: 100%; border: none; font-family: 'Montserrat'; margin: 0 0 10px 0; cursor: pointer; } #mainNav .dropdown form .basicBtn { text-align: center; font-size: 1em; display: block; line-height: 1em; } #mainNav li.donate .donationBox { display: block; float: none; width: 100%; max-width: 390px; margin: 0; } #mainNav li.donate .donationBox header { display: none; } #mainNav li.donate .donationBox .content { padding: 0; background: none; } #mainNav li.donate .donationBox .readMore { font-size: 16px; color: #fff; line-height: 1em; } #mainNav li.donate .donationBox .readMore + .readMore { display: inline !important; } /******************************** Secondary Nav ********************************/ #mainNav.secondaryNav > ul > li { position: relative; } #mainNav.secondaryNav .dropdown { width: auto; min-width: 250px; } #mainNav.secondaryNav .dropdown .columns .column { max-width: none; } #mobileNavContainer { display: none; margin-bottom: 20px; float: right; } .mobileNavLink { color: #0096d7; font-size: 1.6em; } .mobileNavLink i { font-size: 30px; margin-right: 10px; vertical-align: middle; } .mobileNavDropdown { position: absolute; left: 0; top: -100%; width: 100%; background: #0096d7; color: #fff; z-index: 20; } .mobileNavDropdown ul li { text-align: center; font-size: 1.6em; border-bottom: 1px solid #0384bb; } .mobileNavDropdown ul li:last-child { border: none; } .mobileNavDropdown ul li a { display: block; padding: 15px 20px; color: #fff; } .mobileNavDropdown ul li a:hover { background: #e9bc15; color: #0096d7; } #secondaryNav { height: 70px; line-height: 70px; background: #e1e1e1; } #secondaryNav ul { float: right; } #secondaryNav ul.main > li { float: left; font-size: 1.7em; font-weight: 700; position: relative; border-right: 1px solid #cecdcd; border-left: 1px solid #fef7f7; } #secondaryNav ul.main > li.hasSub > a:after { content: '\f107'; font-family: FontAwesome; float: right; margin-left: 10px; } #secondaryNav ul.main > li > a:hover { color: #e8bb20; } #secondaryNav ul.main > li:first-child { border-left: 0; } #secondaryNav ul.main > li:last-child { border-right: 0; } #secondaryNav ul li a { color: #0e8bc1; } #secondaryNav ul.main > li > a { display: block; padding: 0 25px; } #secondaryNav ul li:hover ul { display: block; } #secondaryNav ul ul { display: none; position: absolute; right: 0; top: 70px; background: rgba(225,225,225,.97); width: 220px; padding: 10px 30px; box-sizing: border-box; } #secondaryNav ul li li { font-size: 1em; float: none; border-bottom: 1px solid #cecdcd; padding: 10px 0; line-height: 16px; } #secondaryNav ul li li:last-child { border: none; } #secondaryNav ul li li:hover { border-color: #e8bb20; } #secondaryNav ul ul a { display: block; } #secondaryNav form { float: right; width: 180px; height: 25px; position: relative; margin-top: 25px; } #secondaryNav form #s { height: 25px; border-radius: 5px; -moz-border-radius: 5px; box-shadow: inset 0 1px 1px rgba(0,0,0,0.2); background: #fff; border: none; color: #989797; font-size: 12px; padding: 0 30px 0 10px; outline: none; display: block; } #secondaryNav form #searchsubmit { font-size: 16px; background: none; border: none; position: absolute; right: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); color: #797979; } /******************************** MOBILE SPECIFIC ********************************/ .mobileContent { display: none; } .mobileIconGrid { background: #fafafa; display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: flex-start; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .mobileIconGrid .item { max-width: 50%; border-bottom: 1px solid #e4e4e4; padding: 25px 20px; text-align: center; flex-basis: 50%; -webkit-flex-basis: 50%; box-sizing: border-box; position: relative; } .mobileIconGrid .item:nth-child(odd) { border-right: 1px solid #e4e4e4; } .mobileIconGrid .item img.icon { max-width: 30px; max-height: 25px; height: auto; width: auto; } .mobileIconGrid .item h2 { font-size: 1.4em; font-weight: 700; color: #0096d7; margin-top: 10px; } .mobileIconGrid .item:hover { background: #fff; } /******************************** .moduleHeader ********************************/ .moduleHeader { text-align: center; } .moduleHero .moduleHeader , .moduleServicesList .moduleHeader { text-align: left; } .moduleHeader h1 { font-size: 7.2em; font-weight: 700; } .moduleHero.simpleHeader:not(.hasBG) .moduleHeader h1, .moduleHero.whiteOverlay .moduleHeader h1 { color: #231f20; } .moduleHero .moduleHeader h1 { color: #fff; } .moduleHeader h2 { font-size: 3.6em; font-weight: 700; margin-bottom: 25px; } .moduleHeader h4 { font-size: 2.2em; line-height: 1.3em; } /******************************** .moduleHero ********************************/ .moduleHero { padding: 150px 0; background-size: cover; background-position: center center; background-repeat: no-repeat; background-color: #fafafa; position: relative; } .twoColumn .moduleHero { padding: 200px 30px 30px 30px !important; } .twoColumn .moduleHero .wrapper:after { clear: left; } .moduleHero .wrapper { z-index: 2; } .moduleHero:before { content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background: rgba(0,0,0,0.3); } .moduleHero.simpleHeader:not(.hasBG):before { display: none; } .moduleHero.whiteOverlay:before { background: rgba(255,255,255,0.5); } .moduleHero.simpleHeader:not(.hasBG) { padding: 60px 0; } /******************************** .moduleL3Content / single post content ********************************/ .moduleL3Content { padding: 70px 0; } .twoColumn .moduleL3Content .wrapper:after { clear: left; } .moduleL3Content .wrapper *:last-child, .moduleL3Content *:last-child { margin-bottom: 0; } .moduleL3Content h1 { font-size: 4.0em; font-weight: 700; line-height: 1.3em; margin-bottom: .5em; } .moduleL3Content h2 { font-size: 3.2em; font-weight: 700; line-height: 1.3em; margin-bottom: .5em; } .moduleL3Content h3 { font-size: 2.2em; font-weight: 600; line-height: 1.3em; margin-bottom: .5em; } .moduleL3Content h4 { font-size: 2.2em; font-weight: 300; line-height: 1.3em; margin-bottom: .5em; } .moduleL3Content p { font-size: 1.6em; line-height: 1.5em; margin-bottom: 1.5em; } .moduleL3Content ul { list-style: disc; font-size: 1.6em; margin: 1.5em 0 1.5em 3em; } .moduleL3Content ol { list-style: decimal; font-size: 1.6em; margin: 1.5em 0 1.5em 3em; } .moduleL3Content li { font-size: 1em; line-height: 1.3em; margin-bottom: .3em; } .moduleL3Content ul ul { font-size: 1em; margin: 1.5em 0 1.5em 3em !important; } .moduleL3Content .basicBtn { font-size: 1.3em; margin: 2em 0 3em 0; color: #fff; } .moduleL3Content p + .basicBtn, .moduleL3Content .basicBtn + .basicBtn, .moduleL3Content p .basicBtn:first-child { margin-top: 0; } .moduleL3Content p .basicBtn { font-size: 13px; line-height: 1em; } .moduleL3Content a { color: #0899d8; } .showHide .hide { display: none; } .alignleft { float: left; margin: 0 20px 20px 0; } .alignright { float: right; margin: 0 0 20px 20px; } .aligncenter { margin: 0 auto 20px auto; display: block; } .moduleL3Content img { max-width: 100%; height: auto; } .moduleL3Content table { border-collapse: collapse; table-layout: fixed; border-left: 1px solid #ccc; border-top: 1px solid #ccc; font-size: 1.6em; margin: 1em 0; } .moduleL3Content th { font-weight: 700; } .moduleL3Content td { padding: 10px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; } /******************************** .moduleFullWidthSlider ********************************/ .moduleFullWidthSlider ul li { height: 650px; background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; } .moduleFullWidthSlider ul li:before { content: ''; display: block; position: absolute; left:0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3); z-index: 1; } .moduleFullWidthSlider ul li.whiteOverlay:before { background: rgba(255,255,255,0.5); } .moduleFullWidthSlider .wrapper { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); z-index: 2; } .moduleFullWidthSlider .wrapper .inner { max-width: 350px; } .moduleFullWidthSlider h1 { font-size: 7.4em; line-height: .9em; font-weight: 900; margin-bottom: 20px; } .moduleFullWidthSlider p { font-size: 2.0em; line-height: 1.2em; margin-bottom: 40px; } .moduleFullWidthSlider li:not(.whiteOverlay) h1, .moduleFullWidthSlider li:not(.whiteOverlay) p { color: #fff; } .bx-wrapper { position: relative; } .moduleFullWidthSlider .bx-controls { position: absolute; left: 50%; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); bottom: 50px; width: 100%; max-width: 300px; text-align: center; z-index: 100; } .moduleFullWidthSlider .bx-pager-item { display: inline-block; } .moduleFullWidthSlider .bx-pager-link { display: inline-block; width: 15px; height: 15px; border-radius: 15px; -moz-border-radius: 15px; background: rgba(255,255,255,0.5); font-size: 0; margin: 0 10px; } .moduleFullWidthSlider .bx-pager-link:hover { background: rgba(255,255,255,0.8); } .moduleFullWidthSlider .bx-pager-item .active { background: #fff; } /******************************** .moduleFullWidthSlimCTA ********************************/ .moduleFullWidthSlimCTA { border: 2px solid #fff; border-left: 0; border-right: 0; padding: 20px 0 !important; text-align: center; background: #ededed; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VkZWRlZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZGVkZWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ededed 0%, #ffffff 50%, #ededed 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(50%,#ffffff), color-stop(100%,#ededed)); background: -webkit-linear-gradient(top, #ededed 0%,#ffffff 50%,#ededed 100%); background: -o-linear-gradient(top, #ededed 0%,#ffffff 50%,#ededed 100%); background: -ms-linear-gradient(top, #ededed 0%,#ffffff 50%,#ededed 100%); background: linear-gradient(to bottom, #ededed 0%,#ffffff 50%,#ededed 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ededed',GradientType=0 ); } .moduleFullWidthSlimCTA .inner { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: space-between; -webkit-justify-content: space-between; -ms-flex-pack: space-between; flex-wrap: no-wrap; -webkit-flex-wrap: no-wrap; align-items: center; -webkit-align-items: center; } .moduleFullWidthSlimCTA .header { font-size: 2.7em; font-weight: 700; max-width: 350px; width: 100%; border-right: 1px solid #c5c5c5; padding-right: 30px; box-sizing: border-box; text-align: left; } .moduleFullWidthSlimCTA .header .icon { width: 50px; float: left; } .moduleFullWidthSlimCTA .header .icon img { max-width: 100%; height: auto; } .moduleFullWidthSlimCTA .header header { margin-left: 60px; } .moduleFullWidthSlimCTA .content { width: 100%; margin-left: 30px; } .moduleFullWidthSlimCTA .content p { font-size: 1.7em; line-height: 1.3em; font-weight: 700; text-align: left; } .moduleFullWidthSlimCTA .content .basicBtn { float: right; margin: 0 0 10px 40px; } /******************************** .moduleFullWidthCTAS ********************************/ .moduleFullWidthCTAS { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: center; -webkit-justify-content: center; -ms-flex-pack: center; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } .moduleFullWidthCTAS .cta { width: 100%; height: 400px; padding: 0 30px; position: relative; color: #fff; text-align: center; overflow: hidden; background: rgba(1, 99, 142, 1); box-sizing: border-box; } .moduleFullWidthCTAS .cta:hover { box-shadow: inset 0 0 0 20px rgba(3,132,187,0.8); } .moduleFullWidthCTAS .cta .content { position: absolute; width: 100%; padding: 0 30px; top: 65%; left: 0; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); box-sizing: border-box; z-index: 5; transition: all ease .3s; } .moduleFullWidthCTAS .cta:hover .content { top: 50%; } .moduleFullWidthCTAS .cta .link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; } .moduleFullWidthCTAS .cta .bgImage { position: absolute; width: 100%; height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat; top: 0; left: 0; z-index: 1; transform: scale(1.15); -webkit-transform: scale(1.15); opacity: .7; transition: all ease .3s; } .moduleFullWidthCTAS .cta:hover .bgImage { transform: scale(1); -webkit-transform: scale(1); opacity: .3; } .moduleFullWidthCTAS .cta h3 { font-size: 5.0em; font-weight: 900; line-height: .9em; margin-bottom: 10px; background: url(images/iconCircleArrow.png) center bottom no-repeat; padding: 0 0 40px 0; } .moduleFullWidthCTAS .cta:hover h3 { padding: 0; background: none; } .moduleFullWidthCTAS .cta p { font-size: 1.7em; line-height: 1.3em; margin-bottom: 30px; opacity: 0; } .moduleFullWidthCTAS .basicBtn { opacity: 0; } .moduleFullWidthCTAS .cta:hover p { display: block; opacity: 1; } .moduleFullWidthCTAS .cta:hover .basicBtn { display: inline-block; opacity: 1; } /******************************** .moduleMeetTeam ********************************/ .moduleMeetTeam { padding: 70px 0; } .moduleMeetTeam .members { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: space-between; -webkit-justify-content: space-between; -ms-flex-pack: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .twoColumn .moduleMeetTeam .members { display: block; } .moduleMeetTeam .member { width: 100%; margin: 0 0 50px 0; padding: 0 0 50px 0; border-bottom: 1px solid #ccc; } .moduleMeetTeam .members.twoCol .member { width: 45%; border: none; padding-bottom: 0; } .moduleMeetTeam .member:last-child { margin: 0; padding: 0; border: none; } .moduleMeetTeam .member:after { content: ''; display: block; clear: both; } .twoColumn .moduleMeetTeam .member { max-width: 100%; } .moduleMeetTeam .member .headshot { float: right; width: 200px; height: auto; margin: 0 0 20px 20px; } .moduleMeetTeam .member .content h3 { font-size: 3.2em; line-height: 1.3em; font-weight: 700; margin-bottom: .5em; } .moduleMeetTeam .member .content h4 { font-size: 1.6em; font-weight: 700; line-height: 1.3em; } .moduleMeetTeam .member .content p { font-size: 1.6em; line-height: 1.5em; margin-bottom: 1em; } .moduleMeetTeam .member .content ul { margin-left: 2em; margin-bottom: 1em; } .moduleMeetTeam .member .content ul li { font-size: 1.6em; line-height: 1.5em; list-style: disc; } /******************************** .moduleColumnCTAS ********************************/ .moduleColumnCTAS { padding: 70px 0; } .moduleColumnCTAS:not(.greyBG) + .moduleColumnCTAS, .moduleTwoColumnImageContent:not(.greyBG):not(.default) + .moduleColumnCTAS, .moduleL3Content + .moduleColumnCTAS { padding-top: 0; } .moduleColumnCTAS .ctas { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: center; -webkit-justify-content: center; -ms-flex-pack: center; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } .moduleColumnCTAS .ctas .cta { width: 100%; position: relative; margin: 0 10px; } .moduleColumnCTAS .ctas .cta:last-child { margin-bottom: 0; } .moduleColumnCTAS .ctas .cta:first-child { margin-left: 0; } .moduleColumnCTAS:not(.adoptionSearchResults) .ctas .cta:last-child { margin-right: 0; } .moduleColumnCTAS .cta .link { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10; } /* .moduleColumnCTAS.bgImageHoverText */ .moduleColumnCTAS.bgImageHoverText .cta, .moduleColumnCTAS.posts .cta { background-size: cover; background-position: center center; background-repeat: no-repeat; height: 290px; background: #015484; overflow: hidden; } .moduleColumnCTAS.bgImageHoverText .cta .bgImage, .moduleColumnCTAS.posts .cta .bgImage { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background-size: cover; background-position: center center; background-repeat: no-repeat; opacity: .7; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(1.15); transform: scale(1.15); } .moduleColumnCTAS.bgImageHoverText .cta:hover .bgImage, .moduleColumnCTAS.posts .cta:hover .bgImage { opacity: .2; -webkit-transform: scale(1); transform: scale(1); opacity: .3; } .moduleColumnCTAS.bgImageHoverText .cta .header, .newsEvents .moduleColumnCTAS.posts .cta .header { position: absolute; left: 0; bottom: 0; width: 100%; z-index: 3; text-align: center; padding: 35px 10px; box-sizing: border-box; background: rgba(0,87,124,0.5); border-top: 1px solid #0384bb; background-repeat: no-repeat; background-position: center center; } .moduleColumnCTAS.bgImageHoverText .cta h3, .newsEvents .moduleColumnCTAS.posts .cta h3 { font-size: 2.4em; font-weight: 700; color: #fff; } .moduleColumnCTAS.bgImageHoverText .cta h3 a, .newsEvents .moduleColumnCTAS.posts .cta h3 a { color: #fff; } .moduleColumnCTAS.bgImageHoverText .cta:hover .header, .newsEvents .moduleColumnCTAS.posts .cta:hover .header { display: none; } .moduleColumnCTAS.bgImageHoverText .cta .hide, .newsEvents .moduleColumnCTAS.posts .cta .hide { text-align: center; position: absolute; left: 0; top: 55%; width: 100%; box-sizing: border-box; padding: 0 30px; display: block; z-index: 3; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); transition: all ease .3s; -webkit-transition: all ease .3s; opacity: 0; } .moduleColumnCTAS.bgImageHoverText .cta:hover .hide, .newsEvents .moduleColumnCTAS.posts .cta:hover .hide { top: 50%; opacity: 1; } .moduleColumnCTAS.bgImageHoverText .cta .hide h3, .newsEvents .moduleColumnCTAS.posts .cta .hide h3 { margin-bottom: 20px; } .moduleColumnCTAS.bgImageHoverText .cta .hide p, .newsEvents .moduleColumnCTAS.posts .cta .hide p { font-size: 1.4em; line-height: 1.3em; color: #fff; margin-bottom: 20px; } .moduleColumnCTAS .cta:hover .hide, .newsEvents .moduleColumnCTAS.posts .cta:hover .hide { display: block; } .moduleColumnCTAS.bgImageHoverText .cta .hide .basicBtn, .newsEvents .moduleColumnCTAS.posts .cta .hide .basicBtn { font-size: 1.3em; } /* .moduleColumnCTAS.headerContent */ .moduleColumnCTAS.headerContent .cta:nth-child(odd) .header { background: #0096d7; } .moduleColumnCTAS.headerContent .cta:nth-child(even) .header { background: #45b0de; } .moduleColumnCTAS.headerContent .cta .header { color: #fff; font-size: 2.0em; line-height: 1.3em; font-weight: 700; padding: 30px 30px 33px 30px; box-sizing: border-box; position: relative; transition: background-color ease .2s; } .moduleColumnCTAS.headerContent .cta .header:after { content: '\f105'; font-family: FontAwesome; color: #fff; vertical-align: middle; text-align: right; position: absolute; right: 25px; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); opacity: 0; transition: all ease .2s; } .moduleColumnCTAS.headerContent .cta:hover .header:after { right: 10px; opacity: 1; } .moduleColumnCTAS.headerContent .cta:hover .header { border-bottom: 3px solid #d8ab11; padding-bottom: 30px; background: #006fae; } .moduleColumnCTAS.headerContent .cta .content { background: #fafafa; padding: 30px; box-shadow: 0 2px 2px rgba(0,0,0,0.1); } .moduleColumnCTAS.headerContent .cta .content p { font-size: 1.6em; line-height: 1.3em; margin-bottom: 10px; } .moduleColumnCTAS.headerContent .cta .content a.readMore { font-weight: 700; font-size: 1.6em; color: #0096d7; } .moduleColumnCTAS.headerContent .cta .content a.readMore:after { content: '\f105'; display: inline-block; margin-left: 5px; color: #d8ab11; font-family: FontAwesome; } /* .moduleColumnCTAS.adoptionSearchResults */ .moduleColumnCTAS.adoptionSearchResults .ctas { flex-wrap: wrap; -webkit-flex-wrap: wrap; justify-content: flex-start; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; } .moduleColumnCTAS.adoptionSearchResults .ctas .cta { width: calc(33.33% - 20px); width: -webkit-calc(33.33% - 20px); margin-bottom: 30px; } .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n) { margin-right: 0; } .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n+1) { margin-left: 0; } .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n), .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n+1) { width: calc(33.33% - 10px); width: -webkit-calc(33.33% - 10px); } /******************************** .modulePetSlider ********************************/ .modulePetSlider { padding: 70px 0 0 0; } .modulePetSlider .moduleHeader h2 { font-size: 4.0em; margin: 0; } .modulePetSlider .petSlider { margin: 55px 0; } .modulePetSlider .petSlider li { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: flex-start; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; padding: 0 40px; } .petSlider .pet { width: 100%; max-width: calc(33.33% - 20px); max-width: -webkit-calc(33.33% - 20px); height: 270px; background-size: cover; background-position: center center; background-repeat: no-repeat; margin: 0 10px; position: relative; background-image: url(images/petFPO.png); } .petSlider .pet .link { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 5; } .petSlider .pet header h3 { position: absolute; left: 0; bottom: 0; width: 100%; z-index: 3; text-align: center; padding: 30px 0; background: rgba(0,87,124,0.5); border-top: 1px solid #0384bb; background-repeat: no-repeat; background-position: center center; } .petSlider .pet h3 { font-size: 2.2em; font-weight: 700; color: #fff; } .petSlider .pet:hover header { display: none; } .petSlider .pet .hide { display: none; position: absolute; left: 0; top: 0; z-index: 4; width: 100%; height: 100%; background: rgba(1,84,132,0.8); border-top: 3px solid #d8ab11; text-align: center; } .petSlider .pet .hide h3 { margin-bottom: 15px; } .petSlider .pet .hide .content { position: absolute; top: 50%; left: 0; width: 100%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); } .petSlider .pet .hide p { font-size: 1.6em; color: #fff; line-height: 1.3em; margin-bottoM: 15px; } .petSlider .pet .hide .basicBtn { font-size: 1.3em; } .petSlider .pet:hover .hide { display: block; } .petSlider .bx-viewport { z-index: 2; } .petSlider .bx-controls .bx-prev, .petSlider .bx-controls .bx-next { position: absolute; left: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); z-index: 5; font-size: 0; display: block; } .petSlider .bx-controls .bx-prev.disabled, .petSlider .bx-controls .bx-next.disabled { display: none; } .petSlider .bx-controls .bx-prev:before { content: '\f104'; font-family: FontAwesome; font-size: 90px; color: #d5d4d4; } .petSlider .bx-controls .bx-next { right: 0; left: auto; } .petSlider .bx-controls .bx-next:before { content: '\f105'; font-family: FontAwesome; font-size: 90px; color: #d5d4d4; } .petSlider .bx-controls .bx-next:hover:before, .petSlider .bx-controls .bx-prev:hover:before { color: #e8bb20; } .petSliderFilter header h3 { font-size: 2.2em; font-weight: 700; color: #0096d7; text-align: center; margin-bottom: 40px; } .petSliderFilter header h3 i { color: #d8ab11; margin-left: 10px; } .petSliderFilter header h3:hover a { color: #d8ab11; } .petSliderFilter ul { text-align: center; } .petSliderFilter ul li { width: 100%; max-width: 260px; margin: 0 15px 15px 15px; display: inline-block; } .petSliderFilter ul li select { width: 100%; background-color: #fff; background-image: url(images/iconYellowDownArrow.png); background-position: right 10px center; background-repeat: no-repeat; border: 1px solid #b5b5b5; height: 48px; padding: 0 20px; box-sizing: border-box; box-shadow: 0 2px 2px rgba(0,0,0,0.2); appearance: none; -moz-appearance: none; -webkit-appearance: none; outline: none; font-size: 2.2em; color: #53565a; font-weight: 700; font-family:'Montserrat'; position: relative; cursor: pointer; } .petSliderFilter select::-ms-expand { display: none !important; } .petSliderFilter .hide { display: none; padding: 90px 0; background: url(images/petSliderFilterArrow.png) center top no-repeat #dfdfdf; } .petSliderFilter .buttons { margin-top: 60px; text-align: center; } .petSliderFilter .buttons a { display: inline-block; margin: 0 20px; } .petSliderFilter .buttons a.cancel { background: none; box-shadow: none; color: #231f20; font-size: 1.8em; font-weight: 700; text-shadow: none; } .petSliderFilter .buttons .basicBtn { font-size: 1.3em; } /******************************** .moduleSocialMedia ********************************/ .moduleSocialMedia .icons { margin: 50px 0; display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: center; -webkit-justify-content: center; -ms-flex-pack: center; flex-wrap: no-wrap; -webkit-flex-wrap: no-wrap; } .moduleSocialMedia .icon { font-size: 4.0em; padding: 0 20px; } .moduleSocialMedia .icon a:hover { color: #51caff; } /******************************** .module_hours_contact ********************************/ .moduleHoursContact { padding: 70px 0; } .locationsContainer { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: center; -webkit-justify-content: center; -ms-flex-pack: center; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } .twoColumn .locationsContainer { display: block !important; } .twoColumn .locationGroup { padding: 0 0 20px 0; margin: 0 0 20px 0; border: none; border-bottom: 1px solid #eee; } .locationGroup { border-right: 1px solid #c5c5c5; padding: 0 40px 20px 40px; min-width: 260px; width: 100%; box-sizing: border-box; } .locationGroup.redText * { color: #ff0000; } .locationsContainer .locationGroup:first-child { padding-left: 0; } .locationsContainer .locationGroup:last-child { border: none; padding-right: 0; } .locationGroup h3 { font-size: 3.2em; font-weight: 700; margin-bottom: 20px; } .locations { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: center; -webkit-justify-content: center; -ms-flex-pack: center; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } .location { flex-basis: 100%; -webkit-flex-basis: 100%; margin-right: 20px; } .location:last-child { margin-bottom: 0; margin-right: 0; } .location h4 { font-size: 2.2em; line-height: 1.3em; margin-bottom: 15px; } .location p { font-size: 1.4em; line-height: 1.3em; margin-bottom: 10px; color: #474747; } .location .hours { font-weight: 700; color: #0096d7; font-size: 1.6em; display: inline-block; margin-top: 15px; } .location .hours i { margin-left: 10px; color: #d8ab11; } /******************************** .moduleTwoColumnImageContent ********************************/ .moduleTwoColumnImageContent { padding: 70px 0; } .moduleColumnCTAS:not(.greyBG) + .moduleTwoColumnImageContent:not(.greyBG) { padding-top: 0; } .moduleTwoColumnImageContent.greyBG + .moduleTwoColumnImageContent.greyBG { border-top: none; padding-top: 0; } .moduleTwoColumnImageContent .items { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: space-between; -webkit-justify-content: space-between; -ms-flex-pack: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; align-items: center; -webkit-align-items: center; } .moduleTwoColumnImageContent .items .item { width: 100%; position: relative; margin-top: 20px; margin-bottom: 20px; } .moduleTwoColumnImageContent .image { background-size: cover; background-position: center center; background-repeat: no-repeat; width: 350px; height: 300px; position: absolute; left: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); } .moduleTwoColumnImageContent .content { padding: 30px 0 30px 410px; box-sizing: border-box; min-height: 300px; } .moduleTwoColumnImageContent.defaultHalfWidth .content { min-height: 0; } .moduleTwoColumnImageContent .content h2 { font-size: 4.0em; font-weight: 700; margin-bottom: 25px; } .moduleTwoColumnImageContent .content p, .moduleTwoColumnImageContent .content li { font-size: 1.8em; line-height: 1.3em; margin-bottom: 15px; } .moduleTwoColumnImageContent .content p a, .moduleTwoColumnImageContent .content li a { color: #0096d7; } .moduleTwoColumnImageContent .content ul { margin: 1em 0 1em 3em; } .moduleTwoColumnImageContent .content ul li { list-style: disc; mragin-bottom: 10px; } .moduleTwoColumnImageContent .content ol li { list-style: decimal; margin-bottom: 10px; } .moduleTwoColumnImageContent .content .basicBtn { font-size: 1.3em; } /* .moduleTwoColumnImageContent.defaultHalfWidth ********************************/ .moduleTwoColumnImageContent.defaultHalfWidth .item { max-width: 48%; margin-bottom: 70px; min-height: 175px; align-self: flex-start; -webkit-align-self: flex-start; } .moduleTwoColumnImageContent.defaultHalfWidth .item:nth-last-child(-n + 2) { margin-bottom: 0; } .moduleTwoColumnImageContent.defaultHalfWidth .image { width: 175px; height: 175px; position: static; float: left; transform: none; -webkit-transform: none; -moz-transform: none; margin: 0 20px 20px 0; } .moduleTwoColumnImageContent.defaultHalfWidth .content { padding: 0; } .moduleTwoColumnImageContent.defaultHalfWidth .content h2 { font-size: 2.5em; margin-bottom: 20px; } .moduleTwoColumnImageContent.defaultHalfWidth .content p { font-size: 1.6em; } /* .moduleTwoColumnImageContent.bgImageOverlayText ********************************/ .moduleTwoColumnImageContent.bgImageOverlayText .image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background-size: cover; transform: none; -webkit-transform: none; -moz-transform: none; } .moduleTwoColumnImageContent.bgImageOverlayText .content { float: left; width: 400px; padding: 60px 40px; color: #fff; background: rgba(1,84,132, 0.8); position: relative; z-index: 2; } .moduleTwoColumnImageContent.bgImageOverlayText .content h2 { font-size: 3.2em; } .moduleTwoColumnImageContent.bgImageOverlayText .content p { font-size: 1.8em; line-height: 23px; } /* .moduleTwoColumnImageContent.relatedPosts ********************************/ .moduleTwoColumnImageContent.relatedPosts .item { background: #fafafa; margin-bottom: 30px; } .moduleTwoColumnImageContent.relatedPosts .image { width: 220px; height: 100%; position: absolute; left: 0; top: 0; background: no-repeat center center #f0f0f0; background-size: cover; transform: none; } .moduleTwoColumnImageContent.relatedPosts .content { margin-left: 220px; padding: 50px 30px; } .moduleTwoColumnImageContent.relatedPosts h4 { font-size: 2.4em; font-weight: 700; line-height: 1.2em; margin-bottom: 15px; color: #515151; } .moduleTwoColumnImageContent.relatedPosts p { font-size: 1.6em; line-height: 1.2em; color: #515151; margin-bottom: 15px; } /******************************** .moduleAdoptionCenterInfo ********************************/ .moduleAdoptionCenterInfo { padding: 70px 0; } .moduleAdoptionCenterInfo + .moduleAdoptionCenterInfo { margin-top: -40px; } .moduleAdoptionCenterInfo .columns { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: flex-start; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } .moduleAdoptionCenterInfo .columns .column { width: 33.33%; padding: 0 10px; box-sizing: border-box; } .moduleAdoptionCenterInfo.width50 .columns .column { width: 50%; } .moduleAdoptionCenterInfo .columns .column:first-child { padding-left: 0; padding-right: 20px; } .moduleAdoptionCenterInfo .columns .column:nth-child(3) { padding-right: 0; padding-left: 20px; } .moduleAdoptionCenterInfo .columns .column h3 { font-size: 2.4em; font-weight: 700; margin-bottom: 30px; } .moduleAdoptionCenterInfo .columns .column h4 { font-size: 1.8em; line-height: 1.5em; margin-bottom: 20px; } .moduleAdoptionCenterInfo .columns .column p { font-size: 1.3em; line-height: 1.8em; color: #474747; } .moduleAdoptionCenterInfo .columns .column p i { width: 15px; margin-right: 5px; } .moduleAdoptionCenterInfo .columns .column a.basicBtn { margin-top: 20px; } .moduleAdoptionCenterInfo .columns .column .basicBtn { font-size: 1.3em; } .donateForm .field { float: left; width: 50%; font-size: 2.0em; font-weight: 700; margin: 0 0 30px 0; } .donateForm .field input[type="radio"] { margin: 0 15px 0 0; } .donateForm .field input[type="text"] { outline: none; padding: 10px; width: 100%; box-sizing: border-box; border-radius: 5px; -moz-border-radius: 5px; border: 1px solid #ccc; } .donateForm .submit input[type=submit] { border: none; cursor: pointer; margin-top: 0; } .donateForm input[type=text]{ margin-top:-12px; } .moduleAdoptionCenterInfo .columns .column .readMore { float: left; clear: left; } /******************************** .moduleServicesList ********************************/ .moduleServicesList { padding: 80px 0; } .moduleServicesList .columns { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: space-between; -webkit-justify-content: space-between; -ms-flex-pack: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; padding-top: 70px; } .moduleServicesList .columns .columnContainer { flex-basis: calc(33.33% - 20px); flex-basis: -webkit-calc(33.33% - 20px); -webkit-flex-basis: -webkit-calc(33.33% - 20px); } .moduleServicesList .columns .column { border-bottom: 1px solid #dadada; padding: 0 0 20px 0; margin: 0 0 20px 0; } .moduleServicesList .columns .column h4 { font-size: 1.8em; font-weight: 600; margin-bottom: 10px; } .moduleServicesList .columns .column .phone { display: inline-block; font-size: 1.5em; color: #53565a; } .moduleServicesList .columns .column .phone i { margin-right: 5px; vertical-align: middle; } /******************************** .moduleLogoFarm ********************************/ .moduleLogoFarm { padding: 60px 0; } .moduleLogoFarm .logos { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: center; -webkit-justify-content: center; -ms-flex-pack: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .moduleLogoFarm .logos .logo { text-align: center; margin: 60px 20px 0 20px; align-self: center; -webkit-align-self: center; } .moduleLogoFarm .logos .logo img { vertical-align: middle; max-width: 190px; height: auto; } /******************************** .googleMap ********************************/ iframe.map { height: 375px; width: 100%; } /******************************** .googleMap ********************************/ .moduleContactAppointment { padding: 80px 0; } .moduleContactAppointment .columns { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: space-between; -webkit-justify-content: space-between; -ms-flex-pack: space-between; } .moduleContactAppointment .columns .column { flex-basis: 100%; -webkit-flex-basis: 100%; padding: 0 40px; } .moduleContactAppointment .columns .column:first-child { border-right: 1px solid #c5c5c5; padding-left: 0; } .moduleContactAppointment .columns .column:last-child { padding-right: 0; } .moduleContactAppointment .columns .column h3 { font-size: 3.2em; font-weight: 700; margin-bottom: 20px; } .moduleContactAppointment .columns .column h4 { font-size: 2.2em; font-weight: 400; line-height: 1.3em; margin-bottom: 20px; } .moduleContactAppointment .columns .column p { font-size: 1.7em; color: #474747; line-height: 1.8em; } .moduleContactAppointment .columns .column p i { width: 15px; text-align: center; margin-right: 10px; } .moduleContactAppointment form select { outline: 0; padding: 10px; margin: 0 0 15px 0; } .moduleContactAppointment form input[type=submit] { border: none; cursor: pointer; } /******************************** .moduleContentColumns ********************************/ .moduleContentColumns { padding: 70px 0; } .moduleContentColumns .columns { margin-top: 70px; display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: flex-between; -webkit-justify-content: flex-between; -ms-flex-pack: flex-between; flex-wrap: no-wrap; -webkit-flex-wrap: no-wrap; } .moduleContentColumns .columns .column { width: 100%; padding: 0 40px; } .moduleContentColumns .columns .column:first-child { padding-left: 0; } .moduleContentColumns .columns .column:last-child { padding-right: 0; } .moduleContentColumns .columns .column .content h1 { font-size: 2.6em; } .moduleContentColumns .columns .column .content h2 { font-size: 2.2em; } .moduleContentColumns .columns .column .content h3 { font-size: 2.0em; } .moduleContentColumns .columns .column .content h4 { font-size: 1.8em; } .moduleContentColumns .columns .column .content h5 { font-size: 1.6em; } .moduleContentColumns .columns .column .content h1, .moduleContentColumns .columns .column .content h2, .moduleContentColumns .columns .column .content h3, .moduleContentColumns .columns .column .content h4, .moduleContentColumns .columns .column .content h5, .moduleContentColumns .columns .column .content li { line-height: 1.2em; margin-bottom: .5em; font-weight: 700; } .moduleContentColumns .columns .column .content p { font-size: 1.4em; margin-bottom: 1.5em; } .moduleContentColumns .columns .column .content li { font-weight: 300; font-size: 1.6em; } .moduleContentColumns .columns .column .content ol, .moduleContentColumns .columns .column .content ul { margin-left: 15px; margin-bottom: 1.5em; } .moduleContentColumns .columns .column .content ol li { list-style: decimal; } .moduleContentColumns .columns .column .content ul li { list-style: disc; } .moduleContentColumns .columns .column .content p a { color: #0096d7; } /* .moduleContentColumns .contentBlock ********************************/ .moduleContentColumns .columns .column .contentBlock { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #dadada; } .moduleContentColumns .columns .column .contentBlock h4 { font-size: 1.8em; font-weight: 700; line-height: 1.2em; margin-bottom: 10px; } .moduleContentColumns .columns .column .contentBlock p { font-size: 1.4em; color: #53565a; margin-bottom: 10px; } .moduleContentColumns .columns .column .contentBlock p a { color: #0096d7; } .moduleContentColumns .columns .column .contentBlock p i { margin-right: 5px; } /******************************** Adoption Search, Adoption Listing ********************************/ .adoptionSearch { text-align: center; margin: 40px 0 0 0; } .adoptionSearch .field { float: left; margin: 0 10px 10px 10px; width: calc(25% - 20px); width: -webkit-calc(25% - 20px); } .adoptionSearch select { width: 100%; height: 48px; border: 1px solid #b5b5b5; border-radius: 4px; -moz-border-radius: 4px; font-size: 2.2em; font-weight: 600; color: #53565a; appearance: none; -webkit-appearance: none; outline: none; cursor: pointer; box-shadow: 0 1px 2px rgba(0,0,0,0.3); background: url(images/iconYellowDownArrow.png) right 10px center no-repeat; padding: 0 10px; } .adoptionSearch select option { padding-left: 10px; } .adoptionSearch input.search { border: none; font-family: 'Montserrat'; cursor: pointer; margin-top: 40px; -webkit-appearance: none; appearance: none; } .adoptionSearch input.search:hover { background: #0096d7; } .adoptionSearch .randomPet { margin-left: 20px; } .adoptionListing .moduleHero .headerBtns { text-align: right; position: absolute; right: 20px; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); } .adoptionListing .moduleHero .basicBtn { } .adoptionListingContent { padding: 40px 0; } .adoptionListing .leftColumn { width: calc(50% - 20px); width: -webkit-calc(50% - 20px); float: left; } .adoptionListingSlider .fullSize { width: 100%; height: 300px; background-size: cover; background-position: center center; background-repeat: no-repeat; background-color: #ccc; } .adoptionListingSlider .sliderThumbs { margin-top: 15px; height: 85px; position: relative; padding: 0 35px; } .adoptionListingSlider .sliderThumbs #slidePrev, .adoptionListingSlider .sliderThumbs #slideNext { position: absolute; left: 0; top: 0; display: block; width: 30px; height: 85px; line-height: 85px; text-align: center; background: #0899d8; cursor: pointer; color: #fff; font-size: 2.4em; } .adoptionListingSlider .sliderThumbs #slidePrev:hover, .adoptionListingSlider .sliderThumbs #slideNext:hover { background: #e8bb20; } .adoptionListingSlider .sliderThumbs #slideNext { left: auto; right: 0; } .adoptionListingSlider .sliderThumbs li .slide { float: left; height: 85px; width: calc(25% - 10px); width: -webkit-calc(25% - 10px); margin: 0 5px; background: #ccc; background-size: cover; background-position: center center; background-repeat: no-repeat; cursor: pointer; } .adoptionListing .rightColumn { width: calc(50% - 20px); width: -webkit-calc(50% - 20px); float: right; } .adoptionListing .content { margin: 0 0 30px 0; padding: 0 0 30px 0; border-bottom: 1px solid #e4e4e4 } .adoptionListing .content h2 { font-size: 3.2em; font-weight: 700; margin-bottom: 15px; } .adoptionListing .content p { font-size: 1.6em; line-height: 1.3em; color: #515151; margin-bottom: 25px; } .adoptionListing .share { text-align: right; font-size: 1.6em; color: #515151; } .adoptionListing .share span { margin-right: 5px; } .adoptionListing .share .icon { width: 20px; height: 20px; line-height: 20px; border-radius: 20px; -moz-border-radius: 20px; color: #fff; text-align: center; background: #109cd9; display: inline-block; margin-left: 5px; } .adoptionListing .share .icon:hover { background: #e8bb20; } .adoptionListing .share .icon i { vertical-align: middle; font-size: 10px; } .adoptionListing .contact h3 { font-size: 2.4em; font-weight: 700; margin-bottom: 20px; } .adoptionListing .contact p { font-size: 1.4em; line-height: 1.3em; margin-bottom: 20px; } .adoptionListing .contact .basicBtn { font-size: 1.3em; } /******************************** .newsEvents ********************************/ .newsEvents .sectionHeader { font-size: 7.4em; font-weight: 700; padding: 0 0 40px 0; text-align: left; } .newsEvents .sectionHeader.bgImage { padding: 110px 0 150px 0; background: #ccc; color: #fff; background-size: cover; background-position: center center; background-repeat: no-repeat; } .newsEvents .sectionContainer { padding: 80px 0 40px 0; } .newsEvents .sectionContainer.noPadding { padding: 0; } .newsEvents .moduleColumnCTAS.posts { text-align: center; padding: 0; } .newsEvents .moduleColumnCTAS.overlap { position: relative; top: -65px; } .newsEvents .moduleColumnCTAS.posts .ctas { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: space-between; -webkit-justify-content: space-between; -ms-flex-pack: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .newsEvents .moduleColumnCTAS.posts .ctas .cta { width: calc(50% - 10px); margin: 0 10px; height: 300px; background: #009bcd; } .newsEvents .moduleColumnCTAS.posts .ctas .cta:nth-child(2) { margin-left: 0; } .newsEvents .moduleColumnCTAS.posts .ctas .cta:last-child { margin-right: 0; } .newsEvents .moduleColumnCTAS.posts .ctas .cta.featuredPost { width: 100%; margin: 0 0 25px 0; height: 350px; } .newsEvents .moduleColumnCTAS.posts .cta:hover { background: #026b97; } .newsEvents .basicBtn.sectionBtn { margin-top: 40px; } .newsEvents .post { position: relative; text-align: left; height: 100%; } .newsEvents .moduleColumnCTAS.posts .ctas .cta.featuredPost .header { text-align: left; padding: 50px 30px; } .newsEvents .moduleColumnCTAS.posts .ctas .recentPosts .cta .header { text-align: left; padding: 40px 25px; } .newsEvents .moduleColumnCTAS.posts .ctas .cta.featuredPost .header h3 { font-size: 3.2em; } .upcomingEvents { padding: 80px 0; background: #edeeef; } .upcomingEvents .header { margin-bottom: 70px; font-size: 3.6em; font-weight: 700; text-align: center; } .upcomingEvents .columns { display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ justify-content: flex-start; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .upcomingEvents .columns .column { width: calc(50% - 40px); width: -webkit-calc(50% - 40px); margin: 0 40px 30px 40px; padding-bottom: 30px; border-bottom: 1px solid #c5c5c5; } .upcomingEvents .columns .column:after { content: ''; display: block; clear: both; } .upcomingEvents .columns .column:nth-child(odd) { margin-left: 0; } .upcomingEvents .columns .column:nth-child(even) { margin-right: 0; } .upcomingEvents .column .date { float: left; width: 80px; text-align: center; } .upcomingEvents .column .date .day { font-size: 3.0em; color: #006fae; font-weight: 700; } .upcomingEvents .column .date .month { font-size: 2.4em; font-weight: 700; color: #45b0de; text-transform: uppercase; } .upcomingEvents .column .date .datetil { font-size: 1.6em; color: #333; margin: 10px 0; font-weight: 700; } .upcomingEvents .column .content { margin-left: 90px; color: #515151; } .upcomingEvents .column .content h3 { font-size: 2.2em; font-weight: 700; margin-bottom: 15px; } .upcomingEvents .column .content p { font-size: 1.6em; line-height: 1.3em; margin-bottom: 15px; } .upcomingEvents .column .content a.learnMore { font-size: 1.4em; color: #0096d7; font-weight: 600; } .upcomingEvents .column .content a.learnMore i { display: inline-block; color: #e8bb20; margin-left: 5px; } .upcomingEvents h3.noEvents { text-align: center; font-size: 2.2em; font-weight: 700; } /******************************** Post Single ********************************/ .twoColumn { position: relative; } .twoColumn .pageHeader { padding: 70px 0; background: #fafafa; font-size: 7.4em; font-weight: 700; } .twoColumn .leftColumn { margin-right: 310px; padding: 40px 0 80px 0; } .twoColumn.single .leftColumn { padding-top: 80px; } .twoColumn.single .leftColumn .module:last-child { padding-bottom: 0; } .twoColumn .leftColumn .wrapper { padding: 0; } .twoColumn .leftColumn .module:first-child { padding-top: 0; } .postBanner { height: 300px; margin-bottom: 50px; background: center center no-repeat #ccc; background-size: cover; } .postHeader .date { float: left; width: 100px; text-align: center; border-right: 1px solid #ececec; padding: 15px 0; } .postHeader .date .day { font-size: 3.6em; color: #006fae; font-weight: 700; } .postHeader .datetil { font-size: 2.0em; color: #333; font-weight: 700; margin: 10px 0; } .postHeader h1 { margin: 0 0 .5em 120px; font-size: 3.2em; font-weight: 700; line-height: 1.2em; } .postHeader .eventInfo { margin-left: 120px; font-size: 1.5em; margin-bottom: 1em; line-height: 1.5em; } .postHeader .date .month { font-size: 2.4em; color: #45b0de; font-weight: 700; } .postMeta { border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; padding: 15px 0; font-size: 1.6em; color: #a9b1b5; } .postMeta:after { display: block; content: ''; clear: left; } .postMeta .postedOn { margin-left: 120px; float: left; } .postMeta .share { float: right; } .postMeta .share .icon { width: 20px; height: 20px; line-height: 20px; border-radius: 20px; -moz-border-radius: 20px; color: #fff; text-align: center; background: #109cd9; display: inline-block; margin-right: 5px; } .postMeta .share .icon:hover { background: #e8bb20; } .postMeta .share .icon i { vertical-align: middle; font-size: 10px; } .twoColumn.articlePosts .moduleL3Content.postContent { padding: 0; } .twoColumn:not(.articlePosts) .moduleL3Content.postContent { padding: 50px 0; } .postListing .post { padding: 0 0 20px 0; margin: 0 0 20px 0; border-bottom: 1px solid #e4e4e4; } .postListing .thumbnail { float: left; width: 160px; height: 160px; background-size: cover; background-position: center center; background-repeat: no-repeat; background-color: #ccc; } .postListing .post.hasThumb .content { margin-left: 190px; } .postListing .content h3 { font-size: 2.4em; font-weight: 700; line-height: 1.2em; margin-bottom: 15px; } .postListing .content p { font-size: 1.6em; line-height: 1.2em; color: #484848; } .postListing .content p.date { margin-bottom: .5em; } .postListing .postFooter { margin-top: 15px; } .postListing .content .readMore { font-size: 1.6em; font-weight: 700; color: #0798d7; float: left; } .postListing .content .readMore i { color: #e8bb20; display: inline-block; margin-left: 5px; } .postListing .postFooter .share { float: right; font-size: 1.8em; } .postListing .postFooter .share a { color: #0096d7; margin-left: 5px; } .postListing .postFooter .share a:hover { color: #e8bb20; } .wp-paginate { text-align: center; margin: 40px 0 0 0; } .wp-paginate li { display: inline-block; width: 30px; height: 30px; line-height: 30px; font-size: 1.4em; background: #efefef; margin: 0 3px; } .wp-paginate li:hover { background: #e3e3e3; } .wp-paginate li a { display: block; } .twoColumn .sidebar { float: right; position: absolute; right: 20px; top: 0; width: 270px; box-sizing: border-box; padding: 40px 0 80px 0; background: #f9f9f9; } .twoColumn.single .sidebar { padding-top: 80px; } .sidebar section.search { background: #e5e4e4; padding: 25px 20px; } .sidebar section.search form { position: relative; height: 30px; } .sidebar section.search input#s { background: #fff; border: none; box-shadow: inset 0 1px 1px 2px rgba(0,0,0,0.2); height: 30px; padding: 0 30px 0 15px;; width: 100%; box-sizing: border-box; border-radius: 5px; -moz-border-radius: 5px; outline: none; font-size: 1.4em; font-family:'Montserrat'; color: #989797; } section.search input#s::-webkit-input-placeholder { color: #989797; } section.search input#s:-moz-placeholder { color: #989797; } section.search input#s::-moz-placeholder { color: #989797; } section.search input#s:-ms-input-placeholder { color: #989797; } .sidebar section.search #searchsubmit { position: absolute; right: 5px; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); background: 0; border: none; color: #828282; outline: none; cursor: pointer; } .sidebar section.sidebarList h4 { font-size: 1.6em; font-weight: 700; padding: 20px; border-bottom: 2px solid #fff; } .sidebar section.sidebarList ul.top li { border-bottom: 2px solid #fff; font-size: 1.4em; font-weight: 700; } .sidebar section.sidebarList ul.top ul li { font-size: 1em; } .sidebar section.sidebarList ul.top ul li:last-child { border: none; } .sidebar section.sidebarList ul.top li a { color: #109cd9; display: block; padding: 15px 20px; } .sidebar section.sidebarList ul.top ul li a { padding-left: 40px; } .sidebar section.sidebarList ul.top li a i { display: inline-block; margin-right: 10px; color: #e8bb20; font-size: 10px; vertical-align: middle; font-weight: 400; } .sidebar section.sidebarList ul.top a:hover, .sidebar section.sidebarList ul.top a:hover > i { color: #fff; background: #e8bb20; } .sidebar section.sidebarList ul.sub li a { display: block; padding: 15px 20px 15px 30px; } /******************************** 404 Page ********************************/ #searchform.error404 { display: block; width: 500px; max-width: 100%; margin: 0 auto 40px auto; position: relative; } #searchform.error404 input#s { height: 40px; width: 100%; border: 1px solid #ccc; background: #fff; border-radius: 3px; -moz-border-radius: 3px; position: relative; font-family: 'Montserrat'; font-size: 16px; box-sizing: border-box; padding: 0 100px 0 20px; outline: none; } #searchform.error404 input#s:focus { border: 1px solid #999; } #searchform.error404 input#searchsubmit { position: absolute; right: 0; top: 0; height: 40px; padding: 0 20px; background: #0596d5; color: #fff; border: none; font-size: 14px; font-family: 'Montserrat'; cursor: pointer; } #searchform.error404 input#searchsubmit:hover { background: #0483bb; } /******************************** #footer ********************************/ #footer { background: #231f20; padding: 40px 0; } #footer h4 { font-size: 1.4em; color: #fff; margin-bottom: 8px; } #footer a { color: #51caff; } #footer .footerColumns { float: left; } #footer .footerColumns:after { content: ''; clear: left; } .footerColumns .col { width: 160px; float: left; padding-right: 20px; box-sizing: border-box; } .footerColumns .col ul li { font-size: 1.4em; line-height: 1.3em; margin-bottom: 5px; font-weight: 600; color: #51caff; } .footerSM { float: right; } #footer .icons { margin-bottom: 20px; } #footer .icons .icon { float: left; display: block; width: 28px; height: 28px; border-radius: 28px; -moz-border-radius: 28px; line-height: 28px; text-align: center; color: #231f20; background: #0096d7; margin-right: 15px; font-size: 1.6em; } #footer .icons .icon:hover { background: #d8ab11; } #footer .icons .icon i { vertial-align: middle; } #footer .basicBtn { font-size: 1.4em; color: #231f20; text-shadow: none; font-weight: 700; } #footer .basicBtn:after { margin-left: 20px; font-family: FontAwesome; font-size: .8em; color: #231f20; content: '\f054'; display: inline-block; } #footer .copyright { margin-top: 60px; font-size: 1.2em; color: #fff; } #footer .copyright p { display: inline; } @media (max-width:1000px) { #mainNav > ul > li { font-size: 14px; } #mainNav > ul > li > a { padding: 0 10px; } } @media(max-width:950px){ #footer .footerColumns { float: none; text-align: center; } .footerColumns .col { float: none; display: inline-block; vertical-align: top; text-align: left; padding: 0; margin: 0 10px; } .footerSM { float: none; clear: both; text-align: center; margin-top: 30px; } #footer .icons .icon { float: none; display: inline-block; } #footer .copyright { text-align: center; } } @media (max-width:900px) { /******************************** #header ********************************/ #header { padding: 20px 0; } #headerButtons { margin-top: 0; clear: right; } #mainNav { display: none; } #mobileNavContainer { display: block; } #headerButtons .btn a.roundedBtn { margin: 0; } #headerButtons .btn a.roundedBtn + a.roundedBtn { margin-left: 15px; } #quickMainNav { margin: 0 20px; } /******************************** Universal Changes ********************************/ .moduleHeader h1, .moduleFullWidthSlider h1 { font-size: 6.0em; } .moduleFullWidthCTAS .cta h3 { font-size: 4.0em; } .moduleTwoColumnImageContent .content h2 { font-size: 3.0em; } .moduleHero { padding: 80px 0; } .moduleTwoColumnImageContent, .moduleContactAppointment, .moduleLogoFarm { padding: 50px 0; } /******************************** .moduleFullWidthSlider ********************************/ .moduleFullWidthSlider ul li { height: 300px; } .moduleFullWidthSlider .wrapper .inner { max-width: none; text-align: center; } .moduleFullWidthSlider .bx-controls { bottom: 20px; } /******************************** .moduleTwoColumnImageContent ********************************/ .moduleTwoColumnImageContent .image { width: 250px; } .moduleTwoColumnImageContent .content { padding: 20px 0 20px 290px; } } @media (max-width:800px) { #header { text-align: center; } #logo { float: none; text-align: center; margin: 0 0 30px 0; } #mobileNav { text-align: left; } #headerButtons { float: none; text-align: center; } #headerButtons .btn { float: none; display: inline-block; vertical-align: top; } #mobileNavContainer, #headerButtons, #quickMainNav { float: none; display: inline-block; vertical-align: top; margin: 0 10px; } /******************************** Two Column Page ********************************/ .moduleHero.simpleHeader { padding: 40px 0; } .twoColumn.single .sidebar { width: 100%; float: none; position: static; height: auto !important; background: none; padding: 0; margin: 20px 0; } .twoColumn .leftColumn, .twoColumn.single .leftColumn { padding: 40px 0; width: 100%; } .moduleL3Content { padding: 40px 0; } .postMeta .postedOn { margin: 0; } .postMeta .share { float: left; clear: left; margin-top: 20px; } /******************************** .moduleHoursContact ********************************/ .locationsContainer, .locations { display: block !important; } .location, .locationGroup { margin: 0 0 20px 0; padding: 0 0 20px 0; border: none; border-bottom: 1px solid #ccc; } .location:last-child, .locationGroup:last-child { margin: 0; padding: 0; border: none; } /******************************** .adoptionListing ********************************/ .adoptionListing .moduleHero .headerBtns { position: static; float: left; text-align: left; transform: none; -webkit-transform: none; margin-top: 20px; } .adoptionListing .moduleHero .headerBtns .basicBtn { margin-right: 10px; } .adoptionListing .moduleHero .headerBtns br { display: none; } } @media (max-width:750px) { /******************************** Universal Changes ********************************/ .moduleHero, .moduleHero.simpleHeader, .moduleAdoptionCenterInfo, .moduleHoursContact, .moduleTwoColumnImageContent, .moduleContactAppointment, .moduleLogoFarm, .modulePetSlider, .upcomingEvents, .moduleColumnCTAS, .moduleL3Content, .moduleServicesList { padding: 40px 0; } .moduleHeader h1, .moduleFullWidthSlider h1, .newsEvents .sectionHeader { font-size: 5.0em; } h2, .moduleHeader h2, .modulePetSlider .moduleHeader h2, .moduleTwoColumnImageContent .content h2, .moduleContactAppointment .columns .column h3, .moduleMeetTeam .member .content h3, .newsEvents .moduleColumnCTAS.posts .ctas .cta.featuredPost .header h3, .moduleL3Content h2, .locationGroup h3, .moduleL3Content h1 { font-size: 2.6em; } .moduleHeader h4, .moduleContactAppointment .columns .column h4, .moduleL3Content h4 { font-size: 1.8em; } /******************************** #header ********************************/ #headerButtons { clear: both; margin: 20px 0 0 0; display: block; } body.home #headerButtons { display: none; } #headerButtons .btn.blue { margin-bottom: 10px; } .nonMobileContent { display: none; } .mobileContent { display: block; } #headerButtons .hide.emergency { right: 50%; transform: translate(50%,0); -webkit-transform: translate(50%,0); -moz-transform: translate(50%,0); } /******************************** .moduleFullWidthSlider ********************************/ .moduleFullWidthSlider { display: none; } /******************************** .moduleFullWidthCTAS ********************************/ .moduleFullWidthCTAS { display: block !important; } .moduleFullWidthCTAS .cta { height: 250px; } .moduleFullWidthCTAS .cta .bgImage { background-position: center top; } /******************************** .moduleColumnCTAS ********************************/ .moduleColumnCTAS .moduleHeader { padding: 0 20px; } .moduleColumnCTAS:not(.adoptionSearchResults) .ctas { display: block !important; } .moduleColumnCTAS:not(.adoptionSearchResults) .ctas .cta { margin: 0 0 20px 0; } .moduleColumnCTAS.headerContent .cta .header { padding: 20px 20px 23px 20px; } .moduleColumnCTAS.headerContent .cta:hover .header { padding-bottom: 20px; } .newsEvents .moduleColumnCTAS.posts .ctas .cta { width: 100%; margin: 0 0 25px 0; } .moduleColumnCTAS.adoptionSearchResults .cta .hide .basicBtn { display: none; padding: 0 15px; } /******************************** .moduleTwoColumnImageContent ********************************/ .moduleTwoColumnImageContent.bgImageOverlayText .content { width: 100%; padding: 30px; } .moduleTwoColumnImageContent.defaultHalfWidth .items { display: block; } .moduleTwoColumnImageContent.defaultHalfWidth .items .item:not(:last-child) { max-width: none; margin: 0 0 40px 0; } /******************************** .moduleContactAppointment ********************************/ .moduleContactAppointment .columns { display: block !important; } .moduleContactAppointment .columns .column { padding: 0 0 20px 0; } .moduleContactAppointment .columns .column:first-child { border-right: none; border-bottom: 1px solid #c5c5c5; margin-bottom: 20px; } /******************************** .moduleAdoptionCenterInfo ********************************/ .moduleAdoptionCenterInfo + .moduleAdoptionCenterInfo { margin-top: 0; } .moduleAdoptionCenterInfo .columns { display: block !important; } .moduleAdoptionCenterInfo .columns .column, .moduleAdoptionCenterInfo.width50 .columns .column { padding: 0 0 40px 0 !important; width: 100%; } .moduleAdoptionCenterInfo .columns .column:last-child { padding-bottom: 0 !important; } .moduleAdoptionCenterInfo .columns .column:last-child *:last-child { margin-bottom: 0; } /******************************** .moduleContentColumns ********************************/ .moduleContentColumns .columns { display: block !important; } .moduleContentColumns .columns .column { padding: 0; } .moduleContentColumns .columns .column:last-child .contentBlock:last-child { border: none; padding: 0; margin: 0; } /******************************** .moduleServicesList ********************************/ .moduleServicesList .columns { padding-top: 40px; display: block !important; } /******************************** .moduleFullWidthSlimCTA ********************************/ .moduleFullWidthSlimCTA .inner { display: block !important; } .moduleFullWidthSlimCTA .header { max-width: none; margin: 0; padding: 0; border: none; } .moduleFullWidthSlimCTA .header:after { content: ''; display: block; clear: both; } .moduleFullWidthSlimCTA .content { margin: 20px 0 0 0; width: auto; } .moduleFullWidthSlimCTA .content .basicBtn { float: left; margin: 0 20px 0 0; } /******************************** .moduleMeetTeam ********************************/ .moduleMeetTeam .member { margin: 0 0 20px 0; padding: 0 0 20px 0; } .moduleMeetTeam .member .headshot { float: none; margin: 0 0 20px 0; } /******************************** .modulePetSlider ********************************/ .modulePetSlider .petSlider li { display: block !important; } .petSlider .pet { max-width: none; margin: 0 0 20px 0; height: 150px; } /******************************** #secondaryNav ********************************/ #secondaryNav { height: auto; line-height: 1em; padding: 20px 0; } #secondaryNav form { float: none; margin: 0 auto 20px auto; width: 100%; } #secondaryNav form #s { width: 100%; box-sizing: border-box; } #secondaryNav ul { float: none; } #secondaryNav ul.main > li { float: none; border: none; margin: 0 0 20px 0; padding: 0; } #secondaryNav ul.main > li:last-child { margin: 0; } #secondaryNav ul.main > li > a { padding: 0; } /******************************** .upcomingEvents ********************************/ .upcomingEvents .columns { display: block !important; } .upcomingEvents .columns .column { width: 100%; margin: 0 0 20px 0; padding: 0 0 20px 0; } .upcomingEvents .columns .column:last-child { border: none; margin: 0; padding: 0; } /******************************** #footer ********************************/ .footerColumns .col { display: block; width: auto; text-align: center; margin-bottom: 20px; } /******************************** Miscellaneous ********************************/ .donationBox { width: 100%; margin: 0 0 30px 0; } } @media (max-width:650px) { .moduleHeader h1, .moduleFullWidthSlider h1 { font-size: 3.6em; } .basicBtn { font-size: 1.4em; padding: 10px 15px; } #logo img { max-width: 220px; height: auto; } /******************************** .moduleServicesList ********************************/ .moduleServicesList .columns .column { flex-basis: calc(50% - 20px); flex-basis: -webkit-calc(50% - 20px); -webkit-flex-basis: -webkit-calc(50% - 20px); } /******************************** .moduleLogoFarm ********************************/ .moduleLogoFarm .logos { display: block !important; } .moduleLogoFarm .logos .logo:first-child { margin-top: 60px; } .moduleLogoFarm .logos .logo { margin: 40px 0 0 0; } /******************************** .moduleTwoColumnImageContent ********************************/ .moduleTwoColumnImageContent:not(.defaultHalfWidth):not(.bgImageOverlayText) .image { width: 100%; height: 200px; position: static; transform: none; margin-bottom: 20px; -webkit-transform: none; } .moduleTwoColumnImageContent .content { padding: 0; min-height: 0; } .moduleTwoColumnImageContent.defaultHalfWidth .item { width: 100%; max-width: none; min-height: 0; } .moduleTwoColumnImageContent .items .item:last-child { margin-bottom: 0; } .moduleTwoColumnImageContent.defaultHalfWidth .image { width: 100px; height: 100px; transform: none; -webkit-transform: none; top: 0; } /******************************** .moduleMeetTeam ********************************/ .moduleMeetTeam .members { display: block !important; } .moduleMeetTeam .member { max-width: none; } .moduleMeetTeam .member .headshot { width: 150px; } /******************************** .moduleHoursContact ********************************/ .moduleHoursContact .locations { display: block !important; } .location { margin-bottom: 40px; } /******************************** .moduleColumnCTAS ********************************/ .moduleColumnCTAS.adoptionSearchResults .ctas .cta, .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n), .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n+1) { width: calc(50% - 10px); width: -webkit-calc(50% - 10px); margin: 0 10px 20px 10px !important; } .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(odd) { margin-left: 0 !important; } .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(even) { margin-right: 0 !important; } /******************************** .adoptionSearch ********************************/ .adoptionSearch .field { float: none; width: 100%; margin: 0 0 10px 0; } .adoptionSearch select { height: 30px; font-size: 1.6em; } .adoptionSearch input.search { margin-top: 20px; } /******************************** .adoptionListing ********************************/ .adoptionListing .leftColumn { float: none; width: 100%; margin-bottom: 30px; } .adoptionListing .rightColumn { float: none; width: 100%; } } @media (max-width:450px) { /******************************** .moduleColumnCTAS ********************************/ .moduleColumnCTAS.adoptionSearchResults .ctas .cta, .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n), .moduleColumnCTAS.adoptionSearchResults .ctas .cta:nth-child(3n+1) { width: 100%; height: 150px; margin: 0 0 20px 0 !important; background-position: center top; } .moduleColumnCTAS.adoptionSearchResults .ctas .cta .hide p { display: none !important; } /******************************** .moduleServicesList ********************************/ .moduleServicesList .columns .column { flex-basis: 100%; -webkit-flex-basis: 100%; } /******************************** Two Column Page ********************************/ .postHeader .date { float: none; width: auto; border: none; border-bottom: 1px solid #eee; padding: 0 0 20px 0; margin: 0 0 20px 0; } .postHeader h1 { margin-left: 0; } .postHeader .eventInfo { margin-left: 0; } /******************************** Miscellaneous ********************************/ .donateForm .field { float: none; width: 100%; } .donationBox .content { padding: 20px; } }