/* -------------------------------------------------- Table of Contents ----------------------------------------------------- :: Browser Resets :: Main Structure :: Sub Structure :: Universal Classes :: Universal Facebook Styles */ /* -------------------------------------------------- :: Habitat Colors - Universal Color CSS -------------------------------------------------- */ /* Foundation Resets / Overwrites */ .row {max-width: 1100px;} .button {background: none; margin: 0; padding: 0; display: initial; border: 1px solid rgba(0,0,0,.35);} .button:hover {} body.lock {overflow-y:hidden;} /* *** Text Colors *** */ /* Primary */ .bright-blue {color: #00AFD7;} .bright-green {color: #C4D600;} .grey, .gray {color: #888B8D;} .white {color: #fff;} .black {color: #000;} /* Secondary */ .habitat-blue {color: #385988;} .habitat-green {color: #43B02A;} .orange {color: #FF671F;} .brick {color: #A4343A;} /* *** Background Colors *** */ /* Primary */ .bright-blue-bg {background: #00AFD7;} .bright-green-bg {background: #C4D600;} .grey-bg, .gray-bg {background: #888B8D;} .white-bg {background: #fff;} .black-bg {background: #000;} /* Secondary */ .habitat-blue-bg {background: #385988;} .habitat-green-bg {background: #43B02A;} .orange-bg {background: #FF671F;} .brick-bg {background: #A4343A;} /* Other */ .off-white-bg {background: #f5f6ef;} /* Opaque */ .bright-blue-bg.opaque {background: rgba(0,175,215,.8);} .bright-green-bg.opaque {background: rgba(196,214,0,.8);} .grey-bg.opaque, .gray-bg.opaque {background: rgba(136,139,141,.8);} .white-bg.opaque {background: rgba(255,255,255,.8);} .black-bg.opaque {background: rgba(0,0,0,.8);} .habitat-blue-bg.opaque {background: rgba(56,89,136,.8);} .habitat-green-bg.opaque {background: rgba(67,176,42,.8);} .orange-bg.opaque {background: rgba(255,103,31,.8);} .brick-bg.opaque {background: rgba(164,52,58,.8);} .clear-bg:link {background: none;} /* Button Hovers */ .bright-blue-bg.button:hover {background: #1086a1;} .bright-green-bg.button:hover {background: #b3c20e;} .grey-bg.button:hover, .gray-bg.button:hover {background: #666;} .white-bg.button:hover {background: #eee;} .black-bg.button:hover {background: #333;} .habitat-blue-bg.button:hover {background: #2c4b76;} .habitat-green-bg.button:hover {background: #39a221;} .orange-bg.button:hover {background: #ec550e;} .brick-bg.button:hover {background: #93252b;} /*Text color overriders for dark backgrounds */ .habitat-green-bg h1, .habitat-green-bg h2, .habitat-green-bg h3, .habitat-green-bg h4, .habitat-green-bg h5, .habitat-green-bg h6, .habitat-green-bg p, .habitat-green-bg li, .habitat-green-bg a {color:#fff;} /* Gradients */ .bright-blue-bg.gradient { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00afd7+0,00a7cd+100 */ background: #00afd7; /* Old browsers */ background: -moz-linear-gradient(top, #00afd7 0%, #00a7cd 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #00afd7 0%,#00a7cd 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #00afd7 0%,#00a7cd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00afd7', endColorstr='#00a7cd',GradientType=0 ); /* IE6-9 */ } .bright-blue-bg.bright-green-bg.gradient, .bright-blue-bg.bright-green-bg.gradient.blue-to-green { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00afd7+0,c4d600+100 */ background: #00afd7; /* Old browsers */ background: -moz-linear-gradient(left, #00afd7 0%, #c4d600 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, #00afd7 0%,#c4d600 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #00afd7 0%,#c4d600 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00afd7', endColorstr='#c4d600',GradientType=1 ); /* IE6-9 */ } .bright-blue-bg.bright-green-bg.gradient.green-to-blue { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c4d600+0,00afd7+100 */ background: #c4d600; /* Old browsers */ background: -moz-linear-gradient(left, #c4d600 0%, #00afd7 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, #c4d600 0%,#00afd7 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #c4d600 0%,#00afd7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4d600', endColorstr='#00afd7',GradientType=1 ); /* IE6-9 */ } .gradient.overlay {opacity: .83;} /* -------------------------------------------------- :: Browser Resets -------------------------------------------------- */ body { font-family: Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* Google Fonts - for example - will render proper sizes in all browsers with this fix (no matter what color - Firefox traditionally renders bolder for white color text) */ margin: 0; padding: 0; position: relative; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } h1, h2, h3, h4, h5, h6 {font-family: Helvetica, Arial, sans-serif; font-weight: 600; line-height: 1.5;} h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {} h1 {font-size: 42px; margin-bottom: 30px;} h2 {font-size: 36px; margin-bottom: 14px;} h3 {font-size: 31px; margin-bottom: 9px;} h4 {font-size: 25px; margin-bottom: 7px;} h5 {font-size: 19px; margin-bottom: 3px; color: #385988;} h6 {font-size: 16px; margin-bottom: 3px; color: #385988;} /* Elements */ a {color: #00AFD7;} a:hover {color: #C4D600;} em, i {font-style: italic; line-height: inherit;} hr {border: 0; border-bottom: 1px solid #ccc; clear: both; display:block; height: 0; margin: 15px 0;} li {line-height: 1.5;} p {margin: 0 0 18px; line-height: 1.5;} p a, p a:visited {line-height: inherit;} p, p a, ul, ol, ul a, ol a {font-family: Helvetica, Arial, sans-serif; font-size: 16px;} small { font-size: 60%; line-height: inherit; } strong, b {font-weight: 700; line-height: inherit;} :focus {outline: 0;} /* Forms */ /* Specified in foundation.css */ form {margin: 0;} /* Placeholder Styles */ ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #888b8d; font-style: italic; } ::-moz-placeholder { /* Firefox 19+ */ color: #888b8d; font-style: italic } :-ms-input-placeholder { /* IE 10+ */ color: #888b8d; font-style: italic } :-moz-placeholder { /* Firefox 18- */ color: #888b8d; font-style: italic } /* Tables */ table { width:100%; } caption, th, td {font-weight: normal;} @media only screen and (max-width: 100%) and (min-width: 768px) { table tbody tr td {padding:2% 0;} table tr td input {padding:2% 0;} /* remember to define focus styles! */ /* Print styles - Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com) */ .print-only { display: none !important; } @media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */ p a, p a:visited { color: #444 !important; text-decoration: underline; } p a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ tr, img { page-break-inside: avoid; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3{ page-break-after: avoid; } .hide-on-print { display: none !important; } .print-only { display: block !important; } } } /* ----------------------------------------- Define Main Structure ----------------------------------------- */ /* Header */ .top-bar {text-align: right; height: auto; line-height: 1; font-size: 14px;} .top-bar nav {float: right;} .top-bar ul {margin: 0;} .top-bar li {display: inline-block; margin-left: -5px;} .top-bar li a {color: #fff; text-decoration: none; font-weight: 600; font-size: 14px; padding: 3px 10px; display: inline-block;} .top-bar .bright-green-bg a {color: #000;} .top-bar .phone {opacity: .8; padding: 6px 6px 4px; display: inline-block;} .logo {padding: 15px 0;} body.restore-home .logo {padding: 6px 0;} body.restore-home.f-topbar-fixed .logo {} .logo.with-restore a {color: none; text-decoration: none;} .logo.with-restore img {max-width: 42%; height: auto; width: auto; max-height: 74px; padding: 2%;} .logo.with-restore .restore-logo {margin-left: 2%;} .back-to-affiliate {color: #fff; float: left; display: block; padding: 6px 0; text-decoration: none;} .back-to-affiliate:hover {color: #fff; text-decoration: underline;} /* Navigation */ .sticky #mainnav {background: rgba(0,0,0,.8);} /* More Navigation in Media Queries */ /* Alert Bar */ .alert.bar {width:100%; padding:7px 0; background-color:#000; color: #fff; opacity: .95; clear: both;} .alert.bar p {color:#fff; font-weight:bold; font-size:14px; margin-bottom:0;} .alert.bar a {color:#fff; text-decoration:underline; font-size:14px;} .alert.bar.bright-green {background:#C4D600;} .alert.bar.bright-green p, .alert.bar.bright-green a {color:#333;} .alert.bar.bright-blue {background: #00AFD7;} .alert.bar.habitat-blue {background:#385988;} .alert.bar.habitat-green {background: #43B02A;} .alert.bar.brick {background: #A4343A;} .alert.bar.orange {background:#FF671F;} .alert.bar.yellow {background: #ffcc00;} .alert.bar.yellow p, .alert.bar.yellow a {color:#333;} .alert.bar.black {background: #000000;} .alert.bar svg {float:left; margin-right:10px; width:18px; height:auto;} .alert.bar .close-alert {float:right; font-weight:700;} .alert.bar .close-alert:hover {cursor:pointer;} #main_nav {background: #fff; text-align: center; width: 100%;} .main_nav, .restore_nav {display: block; list-style: none; margin: 0 auto; padding: 0; position: relative; text-align: right; z-index: 10;} .main_nav li, .restore_nav li {display: inline-block; *display: inline; padding: 0; margin: 0; line-height: 1; position: relative; zoom: 1;} .main_nav a, .restore_nav a {color: #fff; font-weight: 600; display: block; font-size: 16px; padding: 30px 10px; text-decoration: none;} .restore_nav a {padding: 35px 10px;} .main_nav a:hover, .main_nav > li:hover > a, .restore_nav a:hover, .restore_nav > li:hover a {color: #00AFD7; text-decoration: none;} .main_nav a.first, .restore_nav a.first {padding-left: 0; } .main_nav a.last, .restore_nav a.last {border-right: 0; padding-right: 0;} .main_nav li ul, .restore_nav li ul { font-size: 16px; line-height: 1.2; padding: 0 0 10px 0; position: absolute; top: 100%; left: -10px; text-align: left; visibility: hidden; width: 190px; z-index: 1000; } .main_nav > li:last-child ul, .main_nav li.item6 ul, .main_nav li.item7 ul, .main_nav li.item8 ul {left: auto; right: 0;} .main_nav li ul ul, .restore_nav li ul ul {top: 0; left: 190px; padding: 0 10px 10px 0;} .main_nav li li, .restore_nav li li {margin: 0; width: 100%;} .main_nav li ul a, .restore_nav li ul a {border-right: 0; display: block; line-height: 1.2; margin: 0 !important; padding: 3% 5% !important; text-align: left; text-transform: none !important; width: 100%;} .main_nav li ul a:hover, .restore_nav li ul a:hover, .main_nav li li:hover > a, .restore_nav li li:hover a {background-color: #385988; color: #fff;} .main_nav li:hover ul, .main_nav li.sfHover ul, .restore_nav li:hover ul, .restore_nav li.sfHover ul {visibility: visible;} /* Custom mobile Menu */ .cbp-spmenu { position: fixed; right: -240px; width: 240px; height: 100%; top: 0; z-index: 1000; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } .menuOpen .cbp-spmenu {right:0;} .cbp-spmenu-push { overflow-x: hidden; position: relative; right: 0; left:0; } .cbp-spmenu-push.menuOpen {right:240px; left:-240px; position:fixed;} /*END REPLACE SECTION */ /*Custom Menu styles */ .cbp-spmenu {background:#f3f3f3;} .cbp-spmenu .close-container {background:#f3f3f3; border-bottom:1px solid #dedede; padding:10px;} .cbp-spmenu .close-container img {width:70px;} .cbp-spmenu .menu-container {overflow-y:scroll; padding:0 15px;} .cbp-spmenu .menu-container nav {margin:10px 0 20px;} .cbp-spmenu h5 {text-transform:uppercase; margin:0;} .cbp-spmenu ul {margin:0; list-style-type:none; padding:0;} .cbp-spmenu ul a {text-decoration:none; display:block; width:100%; color:#555;} .cbp-spmenu nav > ul {margin: 0 0 25px 0;} .cbp-spmenu ul > li > a {font-size:16px; padding:7px 10px;} .cbp-spmenu ul ul a {font-size:14px; padding:7px;} .cbp-spmenu ul .top > a {display:inline-block; width:80%; padding-right:0;} .cbp-spmenu ul li {border-bottom:1px solid #dedede;} .cbp-spmenu ul.sub {display:none; background:#d5d5d5; padding:5px; margin-bottom:5px;} .cbp-spmenu ul.sub > li:last-child {border-bottom:none !important;} .cbp-spmenu ul a.toggleSub {width:20%; text-align:center; padding-left:0; padding-right:0; background:#e9e9e9;} .cbp-spmenu ul a.toggleSub.clicked {background:#d5d5d5;} .cbp-spmenu ul.sub li {border-bottom:1px solid #c5c5c5;} .cbp-spmenu ul.sub a.toggleSub {background:#dedede;} .cbp-spmenu ul.sub a.toggleSub.clicked {background:#c5c5c5;} .cbp-spmenu ul.sub ul.sub li {border-bottom:1px solid #b0b0b0;} .cbp-spmenu ul.sub ul.sub {background:#c5c5c5;} .cbp-spmenu ul.sub ul.sub a.toggleSub {background:#cfcfcf;} .cbp-spmenu ul.sub ul.sub a.toggleSub.clicked {background:#aeaeae;} .cbp-spmenu ul.sub ul.sub ul.sub {background:#aeaeae;} .cbp-spmenu ul.sub ul.sub ul.sub li {border-bottom:1px solid #999;} .cbp-spmenu .mobile-buttons {margin-bottom:30px;} .cbp-spmenu .header-menu-buttons {display:block;} .cbp-spmenu .header-menu-buttons a {display:block; margin-bottom:9px; padding:10px;} .cbp-spmenu ul .menuItemHighlight > ul.sub {display:block;} .cbp-spmenu-push.menuOpen #mobile-overlay-menu-open {position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,.45); z-index: 1000;} /* overlay - but not over header or X close button */ /* Menu Hamburger styles */ .showMobile { position: relative; height: 27px; width: 35px; cursor: pointer; transition: opacity .25s ease; float:right; display:none; margin:4px 0 0 ; } .cbp-spmenu .showMobile {margin:10px 0 0;} .showMobile:hover {} .showMobile.active .top {transform: translateY(11px) translateX(0) rotate(45deg);} .showMobile.active .middle {opacity: 0;} .showMobile.active .bottom {transform: translateY(-11px) translateX(0) rotate(-45deg);} .showMobile span { border: none; height: 4px; width: 100%; position: absolute; top: 0; left: 0; transition: all .35s ease; cursor: pointer; } .showMobile span:nth-of-type(2) {top: 11px;} .showMobile span:nth-of-type(3) {top: 22px;} /* end Custom mobile Menu */ @media screen and (max-width: 767px) { .showMobile {display:block;} } /* Content */ /* HOME PAGE - HOMEPAGE */ .mission-bar {padding: 20px 0; text-align: center; font-size: 20px; font-style: italic;} .flexslider-mission .slides {margin: 0; padding: 0;} /* Tubular Background Video */ #tubular-container {z-index: 0 !important; top: 0; position: absolute !important;} #tubular-player {width: 100% !important; height: 100% !important; left: 0 !important; top: 0 !important;} /* Overwriting the JS for the iframe - since I have #bg-video 16/9 ratio percentage */ #tubular-shield {background: #000; opacity: .3;} #bg-video {height: 0; padding-bottom: 56.25%; background: #000;} #bg-video .video-text {position: absolute; z-index: 3; bottom: 25%; left: 10%; right: 10%; text-transform: uppercase; text-align: center;} #bg-video .video-text h2 {color: #fff; line-height: 1; margin: 0; font-size: 52px; text-shadow: 0 0 5px #000;} #bg-video .video-text h4 {color: #fff; font-size: 32px; text-shadow: 0 0 5px #000;} a.homepage-btn.button {margin-top: 20px;} .half-size #bg-video {padding-bottom: 36.25%; overflow: hidden;} .half-size #tubular-container {height: 200% !important; margin-top: -15%;} .home-sections.style-1 {padding: 100px 0;} .home-sections.style-1 h2 a {color: #000; text-decoration: none;} .home-sections.style-1 h2 a:hover {color: #00AFD7;} .home-sections.style-1 .home-section-item img {width: 610px; -webkit-box-shadow: 3px 3px 4px 0 rgba(0,0,0,.25); box-shadow: 3px 3px 4px 0 rgba(0,0,0,.25);} .home-sections.style-1 .home-section-item.even img {position: relative; z-index: -1; margin: -20px 0;} .home-sections.style-1 .home-section-item.even .medium-8 {text-align: right;} .home-sections.style-1 .home-section-item.even h2 {margin-top: 40px;} .home-sections.style-1 .home-section-item.odd h2 {margin-top: 60px;} .home-button-link, .home-button-link:hover {color: #fff; text-decoration: none;} .home-button-link:hover .button-color-overlay {opacity: .8; transition: all ease .3s; -webkit-transition: all ease .3s;} .home-button {float: left; text-align: center;} /* Widths for .home-button.buttons-5, .home-button.buttons-4, and .home-button.buttons-3 are defined in media queries below */ .home-button .button-text {text-transform: uppercase; font-size: 40px; text-shadow: 0 0 15px rgba(0,0,0,.29);} .home-button .button-subtext {font-size: 14px; text-shadow: 1px 1px 10px rgba(0,0,0,.3);} .home-button .white-border {border: 2px solid #fff; padding: 14px 25px 8px;} .home-button .button-color-overlay {box-sizing: border-box; padding: 50px 10px; opacity: 1; transition: all ease .3s; -webkit-transition: all ease .3s;} .stats-section, .stats-section.row.full-width {background: #f5f6ef; padding: 45px 0 !important; text-align: center;} .stats-section .row {max-width: 1100px; margin: 0 auto;} .stat-item {float: left; box-sizing: border-box;} /* .stat-item.col-# widths & sizes in media queries below */ .stat-item p {color: #888b8d; line-height: 1.2; font-size: 18px; font-weight: 300;} .stat-number {font-size: 65px; font-weight: 600;} /* How Can You Help? Section */ .hcyh-section {background-size: cover !important; position: relative; padding: 100px 0;} .hcyh-section h2 {text-align: center; font-size: 48px; margin-top: 0;} .hcyh-overylay {position: absolute; top: 0; bottom: 0; width: 100%;} .hcyh-item {border: 1px solid #fff; width: 46%; margin: 0 2%; padding: 50px 0; position: relative;} .hcyh-item h3 {text-align: center; font-size: 36px; margin: 0 0 30px;} .hcyh-item p {font-size: 18px; font-weight: 600;} .row .hcyh-item .row {margin: 0;} .hcyh-buttons {text-align: center; margin-top: 50px;} .hcyh-buttons .button {margin-bottom: 0; font-size: 17px; padding: 15px 0; display: block; border: 1px solid #fff; -webkit-box-shadow: 0 0 8px 0 rgba(0,0,0,.15); box-shadow: 0 0 8px 0 rgba(0,0,0,.15); text-shadow: 0 0 5px rgba(0,0,0,.25); -webkit-text-shadow: 0 0 5px rgba(0,0,0,.25);} .hcyh-buttons .button-disclaimer-text {display: block; font-size: 12px; color: #fff; font-weight: 600;} /* SIDEBAR */ .sub.page .sidebar {margin-top: 40px;} .sidebar ul {list-style: none; padding: 0;} .sidebar ul li {margin-bottom: 8px;} .sidebar .social-media img {width: 64px; transition: opacity .5s ease; -webkit-transition: opacity .5s ease;} .sidebar .social-media a {text-decoration:none; color:#7f7f7f;} .home .sidebar h3 {font-weight: 400;} .sidebar-box {margin-bottom: 30px;} .restore .sidebar .sidebar-buttons {margin-bottom: 20px !important;} .restore .sidebar .sidebar-buttons .button {padding: 15px 15px 12px;} #sidebar-album-thumbs-container .row {margin: 0;} #sidebar-album-thumbs-container .columns {padding: 0;} #sidebar-album-thumbs-container .sidebar-photo-thumb-link {border: solid 3px #fff; display: block;} #sidebar-album-thumbs-container .sidebar-photo-thumb-link .sidebar-photo-thumb-item {opacity: 1; transition: all .3s ease; -webkit-transition: all .3s ease;} #sidebar-album-thumbs-container .sidebar-photo-thumb-link:hover .sidebar-photo-thumb-item {opacity: .4;} #sidebar-album-thumbs-container .sidebar-photo-thumb-item {width: 100%; height: 110px; background-size: cover !important;} #sidebar-album-thumbs-container .sidebar-photo-thumb-item.photo-thumb-2, #sidebar-album-thumbs-container .sidebar-photo-thumb-item.photo-thumb-3 {height: 82px;} #sidebar-album-thumbs-container .sidebar-photo-thumb-item.photo-thumb-1 {height: 170px;} .album-thumbs-lister .button {margin-top: 15px;} .social-media-sidebar .social-icon:hover img {opacity: .7;} .sidebar-buttons .button {width: 100%; display: block; text-transform: uppercase; font-size: 22px; margin-bottom: 10px;} .sidebar .did-you-know-box {padding: 30px; margin-bottom: 30px; border: 1px solid #dedfda;} .sidebar .did-you-know-box h4 {margin-top: 0; margin-bottom: 12px;} .sidebar-box {border: 1px solid #dedfda;} .sidebar-item {padding: 30px; border-top: 1px solid #dedfda;} .sidebar-item h4 {margin-top: 0;} .sidebar-item h5, .sidebar-item h6 {color: #000;} .restore-hours .sidebar-item h4 {font-size: 20px;} /* ReStore Pages */ .restore-home .main-content {padding-top: 60px;} .restore-home .main-content .page-title {margin-top: 0;} .restore-home .restore .sidebar {padding-top: 30px;} .restore .sidebar {padding-top: 60px;} /* Sub Page - Subpage */ .sub.page {padding-bottom: 50px;} .main-content blockquote {font-size: 24px; color: #385988; margin: 50px 0 30px; line-height: 1.4; text-transform: uppercase; font-weight: 300; border-top: 1px solid #e5e6df; border-bottom: 1px solid #e5e6df; text-align: center; position: relative;} .main-content blockquote:before {content: open-quote; content: '\201C'; font-size: 120px; color: #e5e6df; line-height: 0; position: absolute; left: 47%; font-weight: 400; top: 10px;} .main-content blockquote p {font-size: 24px; margin: 5px;} /* Staff Directory Lister */ .staff-item {margin-bottom: 20px; min-height: 230px;} .staff-item h5, .staff-item p {margin: 0;} .staff-photo {max-height: 145px;} .no-photo {height: 145px; background: #f5f6ef;} .no-photo-text {padding: 63px 0 0; display: block; text-align: center;} .person-content {padding-left: 100px;} /* Restore Staff */ .restore.staff-lister {padding: 20px 0;} .restore .staff-item {min-height: 0;} .restore .staff-item .photo-wrap {float:left; margin:0 10px 10px 0; width: 25%;} .restore .staff-item .photo-wrap img {border:1px solid #fff;} .restore .staff-item p {font-size: 17px;} .restore .staff-item a {text-decoration:none;} /* Sponsors Lister */ ul.sponsor-ul {list-style: disc; margin: 0 0 0 40px;} li.sponsor-li {list-style: disc; display: list-item; padding: 0 0 2px 5px; margin: 0;} /* FAQ */ .accordion .question, .accordion-all .question {background:#f5f6ef; border:1px solid #dedfda; padding: 10px 10px 5px; margin:5px 0; font-size: 17px;} .accordion .question:hover, .accordion-all .question:hover {cursor:pointer;} .accordion .answer, .accordion-all .answer {border:1px solid #dedfda; border-top:none; margin-top:-5px; padding:15px;} /* Buttons */ .button {border: 0; display: inline-block;} /* button reset */ button, a.button, .button a, input[type=submit] { border: 1px solid rgba(0,0,0,.3); cursor: pointer; font-family: inherit; font-weight: normal; line-height: normal; position: relative; text-decoration: none; text-align: center; -webkit-appearance: none; -moz-appearance: none; border-radius: 0; display: inline-block; padding-top: 1rem; padding-right: 2rem; padding-bottom: 1.0625rem; padding-left: 2rem; font-size: 1rem; color: #FFFFFF; transition: background-color 300ms ease-out; -webkit-box-shadow:inset 0 1px 0 0 rgba(255,255,255,.4); box-shadow:inset 0 1px 0 0 rgba(255,255,255,.4); } .button, input[type=submit] {margin: 0 0 1.25rem;} /* button fix (both p.button and a.button's) */ input[type=submit] {background: #00AFD7;} input[type=submit]:hover {background: #1086a1;} #mc-embedded-subscribe {padding: 0; /* Fixes MailChimp Form button */} a.button, .button a {color: #fff; text-decoration: none; font-weight: 600;} a.button.full-width, .button.full-width a {display: block; width: 100%;} /* Photo Album */ .album {margin-top: 5px; display: block; position: relative;} .album img {width: 94%;} .photo-frame {border: 1px solid #bdbdbe; margin: 1px 1px 0 1px; padding: 3px; background: #fff; display: block;} .album .blank-photo {display: block; width: 94%; height: 100%; border: 1px solid #bdbdbe; background: #fff; display: block; position: absolute; top: 0; z-index: -1; -webkit-transition: all 200ms ease; transition: all 200ms ease;} .album .blank-photo.one {left: 4px; top: 3px;} .album .blank-photo.two {left: 7px; top: 6px; z-index: -2;} .album:hover .blank-photo.one {left: 6px; top: 5px;} .album:hover .blank-photo.two {left: 11px; top: 9px;} .album-container h5 {margin-top:10px; margin-bottom:0; font-size:17px;} .dark-bg {background: #f5f6ef; padding: 90px 0 20px; border:1px solid #dedfda;} .dark-bg .detail-image {position: relative;} .dark-bg .detail-image img {width: auto; height: auto; max-height: 650px; display: block; margin: auto; -webkit-box-shadow: 0 0 40px 0 rgba(0,0,0,.5); box-shadow: 0 0 40px 0 rgba(0,0,0,.5);} .dark-bg h2 {color: #222222; font-size: 24px; margin-bottom: 0;} .dark-bg p {color: #222222; font-size: 16px;} .dark-bg p.pages {font-size: 14px; font-weight: 400; margin-top: 20px;} .photo-album-nav a {color: #222222; text-decoration: none; position: absolute; top: 49%;} .photo-album-nav a.prev {left: -55px;} .photo-album-nav a.next {right: -55px;} .dark-bg .detail-image .photo-album-nav img {width: auto; -webkit-box-shadow: none; box-shadow: none;} #album-thumbnails {margin:50px auto;} .square.thumb {width: 74px; height: 74px; float: left; margin: 0 7px 7px 0; overflow: hidden; position: relative;} .thumb img {min-width: 100%; min-height: 100%; position: absolute; max-width: 130%; top: 50%; left: 50%; margin-left: -37px; margin-top: -37px; } /* Responsive Calendar Styles */ #calendarDetail .calendarNav {margin-bottom:0; min-height:0;} #calendarDetail .calendarNav div {border:none; background:none; height:auto; min-height:0; vertical-align:baseline;} #calendarDetail div { background:#fff; font-size:16px; min-height:125px; } .calendarDays { } .calendarDays div {} #calendarDetail a { font-size:12px; line-height:1.1; margin-bottom:10px; } #calendarDetail a:hover { text-decoration:underline; } #calendarDetail .title { color:#f48a35; font-size:28px; padding:30px 0; text-align:center; text-transform:uppercase; } #calendarDetail .weekdays { color:#fff; font-weight:700; padding-top:10px; padding-bottom:10px; text-align:center; } .cal { background:#a8c837; border:1px solid #e5e5e5; margin-bottom:25px; text-align:center; width:100%; } .cal table { border:0; margin-bottom:0; } .cal .calGrid th { background:#edeae1; font-weight:700; } .cal .calGrid td { background:#fff; padding:10px 0; } .cal .calPrev { float:left; font-weight:700; margin-left:3%; padding: 10px 0; } .cal .calNext { float:right; font-weight:700; margin-right:3%; padding: 10px 0; } .cal .calMonth { color:#fff; display:inline-block; font-size:20px; font-weight:700; padding: 10px 0; text-align:center; text-shadow: 0px 1px 0px #779115; } .cal .calMonth a:hover { color:#779115; } .cal .calNext a, .cal .calPrev a, .cal .calMonth a { color:#fff; text-decoration:none; } .cal .calNext a:hover, .cal .calPrev a:hover, .cal .calMonth a:hover { color:#779115; } .cal .calDayOn a { text-decoration:underline; } .cal .calTodayOn a { background:#a8c837; color:#fff; font-weight:bold; text-decoration:underline; text-shadow: 0px 1px 0px #779115; } .cal .calDayOn { color:#a8c837; } .cal a, .cal a:hover { color:#779115; } .emptyDay { background:#fff!important; } .prevLink, .nextLink { text-align:center; padding-top:25px; } .prevLink a, .nextLink a {font-weight: 700; text-decoration:none;} .calMonthLink { color:#fff!important; display:block; padding:10px 0; text-shadow: 0px 1px 0px #779115; } .calMonthLink:hover { color:#779115!important; } /* Event Detail */ /* Events Lister */ #eventForm table, #eventForm table tr, #eventForm table tr td {border:0; margin:0; padding:0;} #category {margin: 10px 0;} #search_box_form {line-height:14px;} .searchBoxInput {display:block; float:left;} /* News Lister */ .news-lister .news-item {margin-bottom: 30px;} .news-lister h2 {font-weight: 400;} .news-lister h4 {margin-top: 0; font-weight: 400; line-height: 1.1;} .news-lister .publish-date {font-size: 14px; margin-top: -8px;} .news-lister .blurb p {margin: 0;} .news-detail .publish-date {font-size: 14px; margin-top: -12px;} .news-item img.imgleft {width: 250px; margin-top: 10px;} .news-item h3 {margin-top: 0px; font-size: 30px;} .news-item a.morelink {display: block; float: right; margin: 10px;} .news-item .publish-date {font-size: 14px; margin-bottom: 8px; margin-top: -8px;} /* Donate Form */ .button-wrapper {text-align: center; margin-bottom: 15px;} div.button-container {display: inline-block; margin: 0px 5px;} div.button-container .button { font-size: 25px; padding: 5px 20px; color: #00AFD7; } div.button-container .button:hover {background: #00AFD7; color: #fff;} div.button-container .button.selected {background: #00AFD7; color: #fff;} /* Forms */ .g-recaptcha {text-align: center;} .g-recaptcha div {display: inline-block;} .simpleAntiSpam {margin: auto; width: 100% !important;; max-width: 600px !important;} .simpleAntiSpam div {margin: auto; max-width: 100% !important; width: 100% !important; text-align:center;} .simpleAntiSpam br, .simpleAntiSpam #nospamResponse {display:none; overflow: hidden; visibility: hidden;} #nospamA, #nospamB {background: #fff; font-size: 12px; height: auto; padding: 3px 10px; width: auto;} #nospamLink {display: block; margin: auto; width: 100px;} #FreedomReCaptchaV2_0 div {margin: auto;} #IDFormField_expiration_0 {float:left; width:49%; margin-right:1%;} #IDFormField_expiration_0_year {float:right; width:49%; margin-left:1%;} form .hidden {background:#f5f6ef; border:1px solid #dedfda; margin-bottom:1rem; padding:15px 15px 5px;} /* Freedom 9.6.001 Date Picker Calendar Style Updates: */ #ui-datepicker-div { background: rgba(255, 255, 255, 0.95); /* this will give slightly opaque white bg */ border: 1px solid #ccc; box-shadow: 0 0 45px #ccc; -webkit-box-shadow: 0 0 45px #ccc; margin-left: -20px; padding: 20px; } .ui-datepicker-prev {float: left;} .ui-datepicker-next {float: right;} .ui-datepicker-prev, .ui-datepicker-next {font-size: 11px; margin-top: 4px;} .ui-datepicker-prev:hover, .ui-datepicker-next:hover {cursor: pointer;} .ui-datepicker-title {text-align: center; padding-bottom: 20px;} .ui-datepicker-calendar th {font-size: 12px; font-weight: bold;} #ui-datepicker-div table td {padding: 8px;} /* Countdown Timer */ #countdown-bar {display: none;} /* Cookies & Close panel now show/hide as needed via JS - this is CSS default to get that to function */ #countdown-wrapper {width: 440px; margin: auto; max-width: 100%;} .countdown-bar {color: #fff; background: #000; background: rgba(0,0,0,.85); z-index: 100; position: fixed; bottom: 0; width: 100%;} .countdown-timer h2 {font-size:26px; line-height: 1.2; text-align: right; padding-right: 15px; padding-bottom: 10px; border-right: 1px solid #666; margin-top: 25px; color: #fff;} .countdown-box {float: left; padding: 10px; text-align: center; width: 80px; color: #000; line-height: 1; margin: 25px 8px 20px 0; font-size: 12px;} .countdown-box span {display: block; color: #fff; font-size: 38px; font-weight: bold; margin-bottom: 3px;} .countdown-text {padding-top: 25px;} .countdown-text p {font-size: 15px; line-height: 1;} .countdown-text a {font-weight: 700; font-size:15px;} #close-cd-bar {color: #fff; float: right; font-size: 12px; margin-bottom: -17px; margin-top:3px; position: relative; z-index: 100; text-decoration: none;} #close-cd-bar:hover {text-decoration: underline;} #close-cd-bar strong {font-size: 14px;} /*Silent Salesman Styles */ .corner-box {position:fixed; bottom:10px; right:15px; z-index:500; opacity:0; display:none;} .corner-box.box-left {right:auto; left:15px;} .corner-box .header {padding:10px 15px; transition: all .3s ease;} .corner-box .header img {width:20px; margin:-2px 3px 0 0;} .corner-box .header img.no-title {margin:-2px 0 0;} .corner-box .container {border:2px solid #fff; border-radius:25px; -webkit-border-radius:25px; transition: all .3s ease;} .corner-box .header:hover {cursor:pointer;} .corner-box .header p {margin:0; color:#fff; font-size:16px; font-family:'Cachet Bold', Arial, Helvetica, sans-serif; display:inline-block;} .corner-box .content {display:none; width:340px; max-height:445px; overflow-y:auto; } .corner-box .content p {color:#777;} .corner-box .wrapper {font-size:14px; background:#fff; margin:0 10px 10px; padding:10px; border-radius:6px; -webkit-border-radius:6px} .corner-box .wrapper p {font-size:14px; margin:0 auto 15px;} .corner-box .wrapper .button {margin:0 auto; display:block;} .corner-box.open .header {border-radius:15px 15px 0 0; -webkit-border-radius:15px 15px 0 0; } .corner-box.open .header:after {content:'\25bc'; position:absolute; right:10px; color:#fff;} .corner-box.open .content {border-radius:0 0 15px 15px; -webkit-border-radius:0 0 15px 15px;} .corner-box.open .container {border-radius:15px; -webkit-border-radius:15px;} @media only screen and (max-width: 370px) { .corner-box .content {width:100%;} .corner-box.open {right:15px; left:15px;} } @media only screen and (max-height: 660px) { .corner-box .content {max-height:320px;} } @media only screen and (max-height: 530px) { .corner-box .content {max-height:220px;} } @media only screen and (max-height: 430px) { .corner-box .content {max-height:180px;} } @media only screen and (max-height: 360px) { .corner-box .content {max-height:120px;} } /* hBox popup box */ .modal {padding:20px;} .modal-bg, .modal { z-index: 2000; opacity: 1; position: fixed; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; transition: opacity 250ms ease-in-out; } .modal-bg {background: rgba(0, 0, 0, .5);} .modal.close .modal-bg, .modal.close {opacity:0;} .modal.slide, .modal.slide .modal-bg {top:auto; bottom:auto; z-index:-1000;} .modal .content { top: 50%; left: 50%; transform:translate(-50%,-50%); margin:0; max-width: 700px; width:100%; background: white; padding: 40px; position: relative; color: black; transition: transform 250ms ease-in-out; border-radius:12px; z-index:2000; max-height:100%; } .modal .content .item {overflow:auto;} .modal.close .content {transform: translate(-50%, -50%) scale(.75);} .modal .close-modal {position:absolute; right:8px; top:10px; line-height:1; text-align:center; height:30px; width:30px;} .modal .close-modal:hover {cursor:pointer;} /* Highlighted Story */ .highlighted-story {padding: 70px 0;} .highlighted-story h3 {margin-top: 0; line-height: 1;} .highlighted-story p {margin-bottom: 10px;} .highlighted-story .highlighted-story-title {display: block; font-size: 18px; opacity: .6;} /* Footer */ #footer h4 {font-size: 18px;} #footer a {color: #fff;} .search-bar {padding: 30px 0;} .search-bar input {margin: 0;} .search-bar .searchBoxInput {width: 85%; color: #000; font-size: 18px; font-weight: 300;} .search-bar .search-button {padding: 8px 10px 9px; width: 100px; margin: 0;position: absolute;right: 15px;} .main-footer {padding: 50px 0;} .main-footer h4 {margin: 0;} .main-footer .social-icon img {width:50px; opacity:.6; transition: opacity .5s ease; -webkit-transition: opacity .5s ease;} .main-footer .social-icon:hover img {opacity:1;} .main-footer .get-directions {color: #fff; font-size: 13px; font-style: italic;} .main-footer .mission-footer {border-top: 1px solid #54cbeb; border-bottom: 1px solid #54cbeb; margin:40px 0; overflow:hidden;} .main-footer .mission-footer .mc-field-group {float:left; width:60%;} .main-footer .mission-footer .mc-field-group input[type=text] {margin:0; border:none;} .main-footer .mission-footer #mc-embedded-subscribe {background:#385988; margin:0; height:37px; width:107px;} .main-footer .mission-footer .medium-6.end {border-left:1px solid #54cbeb; padding-bottom:100px; margin-bottom:-100px;} .main-footer .mission-footer .middle-footer-wrapper {padding:20px;} .main-footer .mission-footer h3 {margin:0;} .copyright .little-logo img{margin:0 5px; height:30px;} .copyright {background: #fff; padding: 15px 0;} #footer .copyright, #footer .copyright a, .copyright p {color: #c6c6c6; font-size: 14px; margin: 0;} #footer .copyright a:hover {color: #969696;} .copyright .center p, .copyright .right p {margin-top:5px;} .row.habitat-footer.content-footer {padding: 0px 30px;} /* -------------------------------------------------- :: Universal Classes ---------------------------------------------------*/ /* Alignment Classes */ .center {text-align: center;} .left {text-align: left;} .right {text-align: right;} .clear {clear: both;} .blank.clear {height: 0;} .imgleft {float: left; padding: 0 20px 20px 0;} .imgright {float: right; padding: 0 0 20px 20px;} .imgcenter {display: inline-block; margin: auto;} /* Miscellaneous Classes */ .formtextRequired {font-weight:bold;} .formtextRequired:before {content:"*";} .row.full-width, .columns.full-width {margin: 0!important; max-width: none!important; padding: 0!important; width: 100%!important;} .hide { display: none; } .hideclear { clear:both; height:0; overflow:hidden; visibility:hidden; } /* Pagination Classes */ .prevnextCurrent, .prevnextLink, .prevnextWindow { display:inline-block; line-height:0; padding:15px 20px; margin:0 4px; text-align:center;} .prevnextCurrent:hover, .prevnextLink:hover, .prevnextWindow:hover {} /* Google Maps & Locations Directory Classes */ #googlemap img, object, embed, .GMapEZ img, #map_canvas embed, #map_canvas img, #map_canvas object { max-width: none; } /* ---------------------- Facebook Universal Static iFrame Styles ------------------------ */ body.facebook { font-family: Helvetica, Arial, sans-serif; color: #7a7974; font-size:14px; line-height:26px; margin:0; padding:0; text-align:center; } body.facebook a { color: #7a7974; text-decoration:none; } body.facebook a:hover { text-decoration:underline; } #fb-container { margin:0 auto; width:810px; text-align:left; } .fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] { min-width: 100%!important; width: 100%!important; background: #fff; } /* ---------------------- FLEXSLIDER CSS - Delete if not using. ------------------------ */ /* * jQuery FlexSlider v2.2.0 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the GPLv2 license. * http://www.gnu.org/licenses/gpl-2.0.html * * Contributing author: Tyler Smith (@mbmufffin) */ /* Browser Resets *********************************/ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav { list-style: none;} /* Icon Fonts *********************************/ /* Font-face Icons */ @font-face { font-family: 'flexslider-icon'; src:url('graphics/extras/flexslider/fonts/flexslider-icon.eot'); src:url('graphics/extras/flexslider/fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'), url('graphics/extras/flexslider/fonts/flexslider-icon.woff') format('woff'), url('graphics/extras/flexslider/fonts/flexslider-icon.ttf') format('truetype'), url('graphics/extras/flexslider/fonts/flexslider-icon.svg#flexslider-icon') format('svg'); font-weight: normal; font-style: normal; } /* FlexSlider Necessary Styles *********************************/ .flexslider {background: #fff; position:relative; left:0; width:100%; zoom: 1; overflow: hidden;} .flexslider .slides {zoom: 1; margin: 0; padding: 0; list-style: none; margin: 0; padding: 0;} .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {left:0; display: block; max-width: 100%;} .flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;} .loading .flex-viewport {max-height: 300px;} .flexslider a {text-decoration: none;} /* Clearfix for the .slides element */ .slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .slides {display: block;} * html .slides {height: 1%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child {display: block;} /* Direction Nav */ .flex-direction-nav {*height: 0;} .flex-direction-nav a {overflow: hidden; display: block; width: 32px; height: 32px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; color: rgba(255,255,255,0.8); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;} .flex-direction-nav .flex-prev {left: -50px; opacity: 0.7;} .flex-direction-nav .flex-next {opacity: 0.7; right: -50px; text-align: right;} .flexslider:hover .flex-prev {left: 20px;} .flexslider:hover .flex-next {right: 20px;} .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;} .flex-direction-nav .flex-disabled {opacity: 0!important; filter:alpha(opacity=0); cursor: default;} .flex-direction-nav a:before {font-family: "flexslider-icon"; font-size: 26px; display: inline-block; content: '\f001';} .flex-direction-nav a.flex-next:before {content: '\f002';} /* Control Nav */ .flex-control-nav {position: absolute; bottom: 0; margin: 0; text-align: center; width: 80%; z-index:100; } .flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .flex-control-paging {width:100%;} .flex-control-paging li a {width: 11px; height: 11px; display: block; background: #fff; background: rgba(255,255,255,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 1px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 1px rgba(0,0,0,0.3); box-shadow: inset 0 0 1px rgba(0,0,0,0.3);} .flex-control-paging li a:hover {background: #53524e; background: rgba(83,82,78,.5);} .flex-control-paging li a.flex-active {background: #53524e; background: rgba(83,82,78,.5); cursor: default;} /* Sponsors Flexslider Carousel */ .sponsors-section {text-align: center;} .flexslider-sponsors {margin: auto; width: 75%; position: relative;} .flexslider-sponsors .sponsor-item a {opacity: .7;} .flexslider-sponsors .sponsor-item a:hover {opacity: 1;} .flexslider-sponsors .sponsor-logo {display: none;} .flexslider-sponsors .flex-direction-nav a {text-indent: -9999px; text-align: left; top: 60%; opacity: .6;} .flexslider-sponsors .flex-direction-nav a:hover {opacity: 1;} .flexslider-sponsors .flex-next {background: url(graphics/extras/flexslider/icon_arrow_next.png) no-repeat top left; right: -5%;} .flexslider-sponsors .flex-prev {background: url(graphics/extras/flexslider/icon_arrow_prev.png) no-repeat top left; left: -5%;} .flexslider-sponsors .flex-direction-nav a:before, .flexslider-sponsors .flex-direction-nav a.flex-next:before {display: none;} @media screen and (max-width: 860px) { .flex-direction-nav .flex-prev { opacity: 1; left: 20px;} .flex-direction-nav .flex-next { opacity: 1; right: 20px;} .flexslider-sponsors .flex-direction-nav a {top: 64%;} .flexslider-sponsors .flex-direction-nav .flex-next {right: -10%;} .flexslider-sponsors .flex-direction-nav .flex-prev {left: -10%;} } /* Slide Text Box */ .slide-text-box {padding: 50px; position: absolute; bottom: 10%;} .slide-text-box.text-box-left {left: 0;} .slide-text-box.text-box-right {right: 0;} .slide-text {color: #fff; font-size: 28px; line-height: 1;} /* slide-text margins in media queries */ .slide-text-big {padding: 0; margin: -15px 0 0; line-height: .8; color: #fff; font-size: 100px;} /* ----------------------END FLEXSLIDER CSS------------------------ */ /* -------------------------------------------------- :: Media Query Fixes Foundation classes & their media query sizes: .small- max-width 640px .medium- min-width 641px .large- min-width 1025px .xlarge- min-width 1441px .xxlarge- min-width 1921px ---------------------------------------------------*/ @media only screen and (min-width: 1025px) and (max-width: 1300px) { .home-button .button-text {font-size: 30px;} } /* Media Queries Large / Desktop & up */ @media only screen and (min-width: 1025px) { /* Slideshow */ .text-box-left .slide-text {margin-left: 170px;} .text-box-right .slide-text {margin-right: 170px;} .home-sections.style-1 {padding: 100px 150px;} .home-button.buttons-5 {width: 20%;} .home-button.buttons-4 {width: 25%;} .home-button.buttons-3 {width: 33%;} .stat-item.col-6 {width: 16.66%;} .stat-item.col-5 {width: 20%;} .stat-item.col-4 {width: 25%;} .stat-item.col-3 {width: 33.33%;} .staff-photo {display: block; margin: auto;} } /* Media Queries Medium-Large / Between Tablet & Desktop */ @media only screen and (min-width: 641px) and (max-width: 1024px) { .sticky.fixed #mainnav .main_nav a, .sticky #mainnav .main_nav a {font-size: 14px; padding-left: 10px; padding-right: 10px;} /* Slideshow */ .slide-text-big {font-size: 80px;} .text-box-left .slide-text {margin-left: 0;} .text-box-right .slide-text {margin-right: 0;} .home-button.buttons-5 {width: 33%;} .home-button.buttons-4 {width: 50%;} .home-button.buttons-3 {width: 33%;} .stat-item.col-6 {width: 33.33%;} .stat-item.col-5 {width: 33.33%;} .stat-item.col-4 {width: 50%;} .stat-item.col-3 {width: 33.33%;} .countdown-box {margin-top:5px;} } /* Custom Media Query */ @media only screen and (max-width: 965px) { .sticky.fixed #mainnav .main_nav a, .sticky #mainnav .main_nav a {font-size: 12px; padding-left: 3px; padding-right: 3px;} } /* Media Queries Medium / Tablet & up */ @media only screen and (min-width: 641px) { .home #header .sticky, .fixed {position: fixed; top:0; left:0; width:100%; z-index:1001;} .home.f-topbar-fixed, .restore-home.f-topbar-fixed {padding-top: 0 !important;} .restore-home .sticky {position: fixed; width: 100%; z-index: 900;} .sticky.fixed .logo img {max-height: 29px; transition: all ease .3s; -webkit- transition: all ease .3s;} .sticky.fixed .logo.with-restore img {max-width: 100%; padding: 0 2%;} /* Navigation - Menu */ .sticky.fixed #mainnav, .home .sticky.fixed #mainnav {height: 57px; background: rgba(0,0,0,.8); transition: all ease .3s; -webkit- transition: all ease .3s;} .sticky.fixed #mainnav .main_nav a, .sticky.fixed #mainnav .restore_nav a {padding: 20px 10px; transition: all ease .3s; -webkit- transition: all ease .3s;} .home .sticky #mainnav {background: url(graphics/images/bg_black_fade.png) repeat-x top left rgba(0,0,0,0); height: 130px; transition: all ease .3s; -webkit- transition: all ease .3s;} .hcyh-item p {min-height: 155px;} .flexslider-mission .slides {font-size: 20px;} } @media only screen and (max-width: 920px) { .home-sections.style-1 .home-section-item.odd img {margin:0;} .home-sections.style-1 .home-section-item.even img {margin:0;} .home-sections.style-1 .home-section-item.odd h2 {margin-top: 0px;} .home-sections.style-1 .home-section-item.even h2 {margin-top: 0px;} .home-section-item {margin-bottom: 80px;} } /* Media Queries Medium & Lower / Mid-table, phones & below */ @media only screen and (max-width: 767px) { .sticky.fixed {position: relative;} /* Removes Sticky Nav from Mobile (takes up too much screen space for small screens) */ body.f-topbar-fixed {padding-top: 0;} /* Removes Sticky Nav from Mobile */ .slide-text-box {padding: 25px; font-size: 22px;} .slide-text {margin-left: 50px;} .slide-text-big {font-size: 56px;} .hcyh-section {padding: 75px 0 50px;} .hcyh-item {width: 96%; margin-bottom: 30px;} .main-footer .mission-footer .middle-footer-wrapper {padding:20px 10px;} .staff-photo {max-height: 275px;} } /* Media Queries Small / Mobile */ @media only screen and (max-width: 640px) { .js .main_nav {display:none;} /* Slicknav style to hide the main menu */ .js .slicknav_menu {display:block;} /* Slicknav style to show the mobile menu */ .logo {text-align:center;max-width: 300px; width:100%; margin:0 auto;} form td {display: block;} form input, form textarea, form select {width: 100%;} .sticky #mainnav {background: rgba(0,0,0,.8);} .top-bar {text-align: center;} .top-bar nav {display: block; float: none; margin: auto;} .back-to-affiliate {float: none; margin: auto;} .top-bar ul {padding: 0;} .top-bar li a {font-size: 12px;} .top-bar .phone {display: none;} .mobile-icon img {width: 35px; height: auto; margin-top:0; margin-right:15px; margin-bottom:8px;} .slide-text-box {position: relative;} .slide-text {margin: 0;} .home-sections.style-1 .home-section-item:last-child {margin: 0;} .home-sections.style-1 .home-section-item.odd h2 {margin-top: 15px;} .home-sections.style-1 {padding: 50px 0;} .home-button.buttons-5, .home-button.buttons-4, .home-button.buttons-3 {width: 100%;} .stat-item.col-6, .stat-item.col-5, .stat-item.col-4, .stat-item.col-3 {width: 50%;} .stat-item.stat-5 {float: none; margin: auto;} .news-item img.imgleft {width: 100%; float: none;} .restore .staff-item .photo-wrap {width: 50%; float: none;} .hcyh-buttons .button {margin-top: 15px;} .highlighted-story h3 {margin-top: 20px;} .main-footer .mission-footer .medium-6.end {border:none; padding-bottom:0; margin-bottom:0;} .main-footer .logo img {margin-bottom:30px;} .copyright p {text-align:center !important;} .person-content {padding-left: 0px;} .main-content {padding: 0px 20px;} .row.news-item img {display: none;} .home-section-item img {display: none;} .home-section-item {margin-bottom: 20px;} #countdown-wrapper {width: 330px;} .countdown-timer h2 { text-align: center; padding-right: 0; padding-bottom: 0; border-right: none; margin-top: 20px;} .countdown-box { padding: 8px; text-align: center; width: 60px; color: #000; line-height: 1; margin: 5px 6px 10px 0; font-size: 12px;} .countdown-box span {font-size: 25px;} .countdown-text {padding-top: 0; text-align:center;} } /* Media Queries Extra Small / Phone */ @media only screen and (max-width: 479px) { .top-bar li a {font-size: 11px;} .search-bar .search-button {width:25%;} .search-bar .searchBoxInput {width: 75%;} } @media only screen and (max-width: 341px) { .top-bar li a {padding: 3px 7px;} } /* ModuleBegin::broadcastemail */ .enewsWrapper div { } .enewsWrapper span { display: block; } .enewsText { } .enewsEmail { } /* ModuleEnd::broadcastemail */ /* ModuleBegin::photo */ /* Photo Lister */ .photoListerWrapper { clear: both; } .photoListerWrapper .itemList { margin-bottom: 20px;} .photoListerWrapper span {display:block;} .photoListerWrapper .photoImage {float: left; padding-right: 20px;} .photoListerWrapper .photoImage img {padding:5px; border: 1px solid #ccc;} .photoListerWrapper .photoDescription { } /* Photo Thumbnails */ .photoThumbnailWrapper { } .photoIntro { padding-bottom: 10px; } .photoOther { } .photoThumbnail { float: left; width: 180px; height: 160px; text-align: center; } .photoThumbnail img { border:1px solid #ccc; padding: 5px;} .photoThumbnailWrapper .photoTitle { display: block; } /* Photo Detail */ .photoDetailWrapper { } .photoDetailWrapper .photoDetail { padding: 10px 0px; text-align: center; } .photoDetail span { display: block; } .photoImage img {border:1px solid #ccc; padding:5px;} .photoDetailWrapper .photoDescription { text-align: left; padding: 5px 0px; width: 400px; margin: 0 auto;} .photoRemote { width: 420px; margin: 0 auto; border: 0; clear: both;} .photoRemote:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} .photoRemote span{ border: 0; } .photoRemote span a{display: block; width: 68px; padding: 4px 0px; border: 1px solid #ccc; text-decoration:none; text-align:center; float:left;} .photoRemote span a:hover,div.photoRemote span a:active{border:1px solid #000;} .photoDetailWrapper .pagination { text-align: center; } /* Photo Slide */ .photoSlidelWrapper { } .photoSlideWrapper .photoDetail { padding: 10px 0px; text-align: center; } .photoSlide span { display: block; } .photoImage img {border:1px solid #ccc; padding:5px;} .photoSlideWrapper .photoRemote { width: 210px; margin: 0 auto; border: 0; clear: both; } /* ModuleEnd::photo */ /* ModuleBegin::jobs */ .jobsDetailWrapper span { display: block; } .jobsDetailWrapper span.itemLabel { display: inline; } .jobsJobCode { } .jobsCategory { } .jobsLocation { } .jobsKeywords { } .jobsDescription { } .jobs-list {font-size:16px; list-style:none !important; margin-left:0 !important;} .jobs-list h4 {} .jobs-list .ellipsis {height: 200px; overflow: hidden; position: relative;} .jobs-item .fade {background:url(graphics/images/fade.png) repeat-x left bottom 28px; height: 150px; position:absolute; bottom:-2px; left:0; width:100%;} .jobs-item .fade a {width:100%; margin:103px 0 0 0;} .jobs-detail-job-code {font-size: 12px; font-style: italic;} .apply-button {margin-top: 50px;} /* ModuleEnd::jobs */