/* ************************ */ /* */ /* custom theme */ /* */ /* ************************ */ /* ************************* */ /* GLOBAL settings */ /* ************************* */ /* general */ html{font-size:18px;} html, body { height: 100%; } body * { position:relative; box-sizing:border-box; -moz-box-sizing:border-box } body {display:flex; flex-direction:column; margin:0; padding:0; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; overflow-x: hidden; font: 1rem/1.5 'Roboto', sans-serif; font-weight:400; color: #445666; background-color:white; } #page-wrap{flex:1 0 auto;} #scrollup { position:fixed; display:block; color:white!important; opacity:0; box-shadow:0 0 10px rgba(0,0,0,0.5); background-color:rgba(0,0,0,0.5); border-radius:0; text-align:center; line-height:2.4rem; width:2.5rem; height:2.5rem; border-radius:50%; bottom:-3.5rem; right:1.2rem; z-index: 1000; transition:opacity 1s ease, bottom 1s ease, color 0.2s ease, background-color 0.2s ease; -webkit-transition:opacity 1s ease, bottom 1s ease, color 0.2s ease, background-color 0.2s ease;} #scrollup:hover{ background-color:#28B493;} #scrollup.affix{ opacity:1; bottom:1rem; } .content-section{ padding-top:4.4rem; padding-bottom:4.4rem; } .content-section.bottom-edge{padding-bottom:5.4rem; } .content-section.top-edge{padding-top:5.4rem; } .content-section.bottom-edge.top-edge{padding-bottom:5.4rem; padding-top:5.4rem;} .bottom-edge:after{content:''; display:block; position:absolute; z-index:1; left:0; right:0; bottom:0; height:3rem; background:url(../img/bg-bottom-edge.png) repeat-x bottom;} .top-edge:before{content:''; display:block; position:absolute; z-index:1; left:0; right:0; top:0; height:3rem; background:url(../img/bg-top-edge.png) repeat-x top;} .splitter{height:2px; border:1px solid transparent; line-height:0; margin-bottom:2rem;} .splitter span{display:inline-block; top:-0.22rem; left:-1px; width:2.27rem; height:0.33rem; border-radius:0.16rem; background-color:#E6E4DB; transition:background-color 0.2s ease; -webkit-transition:background-color 0.2s ease;} .splitter.full{ border-color:#E6E4DB;} .splitter.short{margin-bottom:0.5rem;} .splitter.medium span{width:5.72rem;} h1+splitter.short, h2+.splitter.short, h3+.splitter.short, h4+.splitter.short, h5+.splitter.short, h6+.splitter.short{margin-top:-0.5rem;} .textbox, .form-wrap, .accordion, .mb, .side-nav, .tabs-wrap{margin-bottom:4rem;} h1.mb, h2.mb, h3.mb, h4.mb, h5.mb, h6.mb{margin-bottom:3rem;} .textbox:last-child, .form-wrap:last-child, .accordion:last-child, .side-nav:last-child, .textbox ul:last-child, .textbox ol:last-child, .textbox p:last-child, .textbox img:last-child, h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, .mb:last-child, .tabs-wrap:last-child, .mb-sm:last-child, .mb-xs:last-child {margin-bottom:0;} /*.text-in-columns{margin-bottom:1rem;} .text-in-columns:last-child{margin-bottom:-3rem;}*/ .text-in-columns > .row{ display:flex; align-items:flex-start; flex-wrap:wrap; margin-bottom:0;} .text-in-columns > .row:last-child{margin-bottom:-3rem;} .text-in-columns > .row > [class*='col-']{margin-bottom:3rem;} .twin-section{ display:flex; align-items:stretch;} .twin-section .col-left, .twin-section .col-right{width:50%; display:flex; align-items:center; padding-left:calc((100vw - 1170px)/4 + 2rem); padding-right:calc((100vw - 1170px)/4 + 2rem);} .twin-section .col-left > .inner-wrap, .twin-section .col-right > .inner-wrap{width:100%;} .twin-padding{padding-top:7rem; padding-bottom:7rem;} .has-link{ display:flex;} .has-link span:first-child{flex-grow:10;} .has-link a{ margin-left:2rem; white-space:nowrap; font-weight:700; text-transform:uppercase; font-family:'Roboto'; font-size:1rem;} .social-links a{ width:2.4rem; height:2.4rem; margin-bottom:0.2rem; border-radius:50%; border:1px solid white; display:inline-flex!important; align-items:center; justify-content:center; background-color:transparent; color:white;} .social-links a:hover, #contacts .social-links a:focus{background-color:#28B493; color:white;} .social-links a:before{display:none!important;} .categories-links{margin-bottom:2rem;} .categories-links.affix{top:6.6rem; } .categories-links.affix, .categories-links.affix-bottom{background-color:#fff; width:1140px; z-index:10;} .categories-links.affix + .textbox{margin-top:10.5rem;} .categories-links.affix + .standard-list{margin-top:10.5rem;} .categories-links.affix-bottom{top:6.6rem;} .standard-list{display:flex; align-items:stretch; flex-wrap:wrap; justify-content:flex-start; margin-left:-0.7rem; margin-right:-0.7rem; margin-bottom:3rem;} .standard-list:last-child{margin-bottom:-1.5rem;} .standard-list .item{width:calc(33.33% - 1.4rem); margin-left:0.7rem; margin-right:0.7rem; margin-bottom:1.5rem;} .standard-list + .load-more-button-wrap{margin-top:-1.5rem;} .table{margin-bottom:2rem;} .tooltip {font-family:inherit; font-size:1rem; line-height: 1.2;} .tooltip.in {opacity:1; filter: alpha(opacity=100);} .tooltip.top {margin-top: -3px; padding:0;} .tooltip.right { margin-left: 3px; padding:0;} .tooltip.bottom { margin-top: 3px; padding:0;} .tooltip.left { margin-left: -3px; padding:0;} .tooltip-inner { padding:0.83rem; color:inherit; background-color: #fff; border-radius:0.33rem; box-shadow: 0 2px 4px rgba(0,0,0,0.5);} .tooltip-arrow {display:none;} @keyframes bounce-right{ from{left:0;} 50%{left:1rem;} to{left:0;} } @keyframes bounce-left{ from{right:0;} 50%{right:1rem;} to{right:0;} } .move-to-right-side{float:right;} .extra-padding-right{padding-right:3rem;} .extra-padding-left{padding-left:3rem;} /* typography */ h1, h2, h3, h4, h5, h6 {margin:0px 0 1rem 0; font-family:'Argone', sans-serif; font-weight:400; color: inherit; line-height:1.2; } h1, .section-header{font-size:3.33rem /*60px*/;} h2{font-size:2.66rem /*48px*/;} h3{font-size:2.00rem /*36px*/;} h4{font-size:1.55rem /*28px*/;} h5{font-size:1.33rem /*24px*/;} h6{font-size:1.00rem /*18px*/;} h1+h2, h2+h3, h3+h4{margin-top:-0.5rem;} .textbox{padding:1px;} .textbox img{ margin:0 0 1rem 1px; display:inline-block; max-width:100%; border-radius:0.44rem;} .textbox .align-left{float:left; max-width:41.66%; margin:0 2rem 1rem 1px;} .textbox .align-right{float:right; max-width:41.66%; margin:0 1px 1rem 2rem;} .textbox:after{ content:''; display:block; clear:both; font-size: 1px; line-height: 0px; margin:0; padding:0;} .textbox figure{background-color:white; border:1px solid #b1b1b1; padding:10px;} .textbox figure img{margin:0;} .textbox ul, .textbox ol{padding-left:2em; margin-bottom:2rem; overflow:hidden;} .textbox li+li{margin-top:0.5rem;} .textbox p{margin:0 0 2rem 0;} .textbox iframe {max-width:100%;} .textbox p+ul{margin-top:-1rem;} .lead, .big, big{ font-size:1.50rem; font-weight:300; } .small, small{ font-size:77%; color:inherit; font-weight:inherit;} .font-argone{ font-family:'Argone';} .caps{ text-transform:uppercase;} .in-form-heading{margin-top:1rem;} .decor-line{ overflow:hidden;} .decor-line span:after{ content:''; position:absolute; display:block; height:1px; width:1000%; background-color:#BCBAB1; left:100%; margin-left:0.5rem; top:50%;} .weight-bold{ font-weight:700;} .weight-medium{ font-weight:500;} .extra-line-height{ line-height:2;} /* links */ a {color:#28B493; transition:color 0.2s ease, background-color 0.2s ease; -webkit-transition:color 0.2s ease, background-color 0.2s ease;} a:hover{color:#229A7E;} a:hover, A:focus{ text-decoration:none;} a img{border:0;} .area-link{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:2;} .more-link{ font-weight:500; text-transform: uppercase;} .more-link:before{ content:''; display:block;} .color-white a:not(.btn), .accordion .panel-body a:not(.btn) { display:inline-block; color:#fff;} .color-white a:not(.btn):hover, .accordion .panel-body a:not(.btn):hover {color:#fff;} .color-white a:not(.btn):before, .accordion .panel-body a:not(.btn):before { content:''; display:block; height:2px; width:100%; position:absolute; bottom:-1px; background-color:white; transition:width 0.2s ease; -webkit-transition:width 0.2s ease;} .color-white a:not(.btn):hover:before, .accordion .panel-body a:not(.btn):hover:before {width:0;} /* placeholder formatting */ ::-webkit-input-placeholder { opacity: 1 !important; color: #BCBAB1 !important;} :-moz-placeholder {color: #BCBAB1 !important; opacity: 1 !important;} ::-moz-placeholder {color: #BCBAB1 !important; opacity: 1 !important;} :-ms-input-placeholder {color: #BCBAB1 !important; opacity:1 !important; } [placeholder]:focus::-webkit-input-placeholder { color: #BCBAB1 !important;} input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { color: #BCBAB1 !important;} input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {color: #BCBAB1 !important;} input:focus:-ms-input-placeholder, textarea:focus::-ms-input-placeholder {color: #BCBAB1 !important;} input[placeholder] {text-overflow:ellipsis;} input::-moz-placeholder {text-overflow:ellipsis;} input:-moz-placeholder {text-overflow:ellipsis;} input:-ms-input-placeholder {text-overflow:ellipsis;} /* colors */ .color-black{color:#2B3947;} .color-white{color:white;} .color-dark-orange{color:#C9590B;} .color-green{color:#28B493;} [class*='color-overlay-']{position:absolute; top:0; right:0; bottom:0; left:0;} .color-overlay-gradient{ background: rgba(0,0,0,0.8); background: -moz-linear-gradient(top, rgba(0,0,0,0.8), rgba(0,0,0,0.2)); background: -webkit-linear-gradient(top, rgba(0,0,0,0.8), rgba(0,0,0,0.2)); background: -o-linear-gradient(top, rgba(0,0,0,0.8), rgba(0,0,0,0.2)); background: -ms-linear-gradient(top, rgba(0,0,0,0.8), rgba(0,0,0,0.2)); background: linear-gradient(top, rgba(0,0,0,0.8), rgba(0,0,0,0.2)); } .color-overlay-blue{ background-color:rgba(43,57,71,0.7);} .bg-yellow{ background-color:#F69E04;} .bg-blue{ background-color:#3498DB;} .bg-dark-blue{ background-color:#2978B7;} .bg-beige{ background-color:#E6E4DB;} .bg-orange{ background-color:#C9590B;} .bg-grey-blue{ background-color:#445666;} .bg-green{ background-color:#229075;} /* form */ .form-control{padding-left:1.5rem; padding-right:1.5rem; height:2.77rem; border-radius:1.38rem; border:1px solid #BCBAB1; font-size:1rem; font-weight:500; box-shadow:none; transition:border-color 0.2s ease; -webkit-transition:border-color 0.2s ease;} .form-control:focus{outline:0; box-shadow:none; border-color:#28B493;} select.form-control:not([multiple]){-webkit-appearance: none !important; -moz-appearance: none !important; background-image:url(../img/i-select-caret.png); background-position: 100% center; background-repeat: no-repeat; padding-right:3.5rem;} select.form-control::-ms-expand {display: none;} textarea.form-control{border-radius:0.33rem;} label{ font-weight:500; line-height:1.3em; font-size:0.77rem; padding-left:1.6rem; margin-bottom:0.5rem;} .placeholder{ opacity:0;} .focused{ opacity:1; color:#28B493; transition:color 0.2s ease, opacity 0.2s ease; -webkit-transition:color 0.2s ease, opacity 0.2s ease;} /* custom animated radio & check */ .inline-radio-wrap{ display:block;} label + .inline-radio-wrap{margin-left:1.6rem;} .radio label, .checkbox label, .inline-radio-wrap label{padding-left:0; cursor:pointer; margin-right:1rem;} .inline-radio-wrap label{ cursor:default;} input[type='radio'], input[type='checkbox']{ display:none;} .radio-check-control{ cursor:pointer; display:block; position:absolute; top:0.1rem; left:0; width:20px; height:20px; border:1px solid #BCBAB1; background-color:#fff; transition:border 0.2s ease, background 0.2s ease; -webkit-transition:border 0.2s ease, background 0.2s ease;} .radio-check-label{ cursor:pointer; font-weight:500; line-height:1.3em; font-size:1rem; padding-left:1.7rem;} input[type='radio'] + .radio-check-control{border-radius:50%;} input[type='radio'] + .radio-check-control:before{content:''; display:block; position:absolute; width:12px; height:12px; border-radius:50%; background-color:#28B493; top:3px; left:3px; opacity:0; transform:scale(0.01); -webkit-transform:scale(0.01); transition:transform 0.2s ease; -webkit-transition:transform 0.2s ease;} input[type='checkbox'] + .radio-check-control:before{ content:''; display:block; position:absolute; width:0; height:3px; background-color:#28B493; left:1px; top:7px; transform:rotate(45deg); -webkit-transform:rotate(45deg); transform-origin:0 100%; -webkit-transform-origin:0 100%; transition:width 0.1s ease 0.1s; -webkit-transition:width 0.1s ease 0.1s;} input[type='checkbox'] + .radio-check-control:after{ content:''; display:block; position:absolute; width:0; height:3px; background-color:#28B493; left:40%; bottom:2px; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform-origin:0 100%; -webkit-transform-origin:0 100%; transition:width 0.1s ease; -webkit-transition:width 0.1s ease;} input[type='radio']:checked + .radio-check-control:before{ transform:scale(1); -webkit-transform:scale(1); opacity:1;} input[type='checkbox']:checked + .radio-check-control:before{width:8px; transition:width 0.1s ease; -webkit-transition:width 0.1s ease;} input[type='checkbox']:checked + .radio-check-control:after{width:14px; transition:width 0.1s ease 0.1s; -webkit-transition:width 0.1s ease 0.1s;} .radio label:hover .radio-check-control, .checkbox label:hover .radio-check-control, .inline-radio-wrap label:hover .radio-check-control{border-color:#28B493; background-color:#fff;} input[type='radio'][disabled], input[type='radio'][disabled]:checked, input[type='radio'][disabled] + .radio-check-control + .radio-check-label, input[type='radio'][disabled]:checked + .radio-check-control + .radio-check-label, input[type='checkbox'][disabled], input[type='checkbox'][disabled]:checked, input[type='checkbox'][disabled] + .radio-check-control + .radio-check-label, input[type='checkbox'][disabled]:checked + .radio-check-control + .radio-check-label { cursor:default;} input[type='radio'][disabled] + .radio-check-control, input[type='checkbox'][disabled] + .radio-check-control{border-color:#ddd; cursor:default;} input[type='radio'][disabled] + .radio-check-control:before{ transform:scale(0.01); -webkit-transform:scale(0.01); opacity:0;} input[type='radio'][disabled]:checked + .radio-check-control:before{ transform:scale(1); -webkit-transform:scale(1); opacity:1; background-color:#ddd;} input[type='checkbox'][disabled] + .radio-check-control:before{width:0;} input[type='checkbox'][disabled] + .radio-check-control:after{width:0;} input[type='checkbox'][disabled]:checked + .radio-check-control:before{width:8px; background-color:#ddd;} input[type='checkbox'][disabled]:checked + .radio-check-control:after{width:14px; background-color:#ddd;} .form-wrap .btn[type='submit']{margin-top:1.5rem;} /* dropdown-select */ .dropdown-select{ display:block;} .dropdown-select .btn{ display:block; width:100%; text-transform:none; text-align:left; padding-right:4rem; padding-left:1.5rem;} .dropdown-select .btn, .dropdown-select .btn:hover{border-color:#BCBAB1; background-color:white; color:inherit;} .dropdown-select .btn:focus, .dropdown-select .btn:focus:hover{outline:0; background-color:white; color:inherit; border-color:#28B493;} .dropdown-select .btn .fa{ position:absolute; right:2rem; top:50%; margin-top:-0.5rem; transition:transform 0.7s ease; -webkit-transition:transform 0.7s ease; color:#bcbab1;} .dropdown-select .btn[aria-expanded='true'] .fa{ transform:rotate(180deg); -webkit-transform:rotate(180deg);} .dropdown-select .dropdown-menu{width:100%; padding:0.5rem 0; margin:0; border:1px solid #E6E4DB; border-radius:0; background-color:#fff;} .dropdown-select .dropdown-menu > li > a{padding:0.5rem 1rem; line-height:1.2; font-weight:400; white-space:normal;} .dropdown-select .dropdown-menu > li > a{color:#445666; background-color:transparent;} .dropdown-select .dropdown-menu > li > a:hover, .categories-selector .dropdown-menu > li > a:focus{color:#28B493; background-color:transparent;} .dropdown-select .dropdown-menu > .active > a{color:#28B493; background-color:transparent;} .dropdown-select .dropdown-menu > .active > a:hover, .categories-selector .dropdown-menu > .active > a:focus{color:#28B493; background-color:transparent;} .has-marks .dropdown-menu > li > a{padding-left:3rem;} .has-marks .btn{padding-left:3rem; display:flex; align-items:center;} .color-mark{ display:inline-block; width:1rem; height:1rem; margin:0 0.5rem 0 -1.5rem; vertical-align:bottom;} .has-marks .btn .all-options{height:1.3rem;} .has-marks .all-options:before{ content:'\f00c'; font-family:'FontAwesome'; font-weight:400;} .has-marks .inner-wrap{flex-shrink:999;} /* buttons */ .btn {height:auto; white-space:normal; padding:0.6rem 2.5rem; border-radius:1.38rem; font-size:1rem; font-weight:700; border:1px solid transparent; text-transform:uppercase; text-shadow:none; transition:color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease; -webkit-transition:color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;} .btn-default{color:#28B493; border-color:#28B493; background:transparent; } .btn-default:hover, .btn-default:focus, .focus.btn-default, .btn-default:active, .active.btn-default, .open > .btn-default.dropdown-toggle{ color:#28B493; border-color:#28B493; background:rgba(40,180,147,0.2);} .btn-default-solid{color:#fff; border-color:#28B493; background:#28B493; } .btn-default-solid:hover, .btn-default-solid:focus, .focus.btn-default-solid, .btn-default-solid:active, .active.btn-default-solid, .open > .btn-default-solid.dropdown-toggle{ color:#fff; border-color:#229A7E; background:#229A7E;} .btn-white-solid{color:#445666; border-color:#fff; background:#fff; } .btn-white-solid:hover, .btn-white-solid:focus, .focus.btn-white-solid, .btn-white-solid:active, .active.btn-white-solid, .open > .btn-white-solid.dropdown-toggle{ color:#445666; border-color:#fff; background:#dadada;} .btn-white{color:#fff; border-color:#fff; background:rgba(255,255,255,0);} .btn-white:hover, .btn-white:focus, .focus.btn-white, .btn-white:active, .active.btn-white, .open > .btn-white.dropdown-toggle{ color:#fff; border-color:#fff; background:rgba(255,255,255,0.1);} .btn-wide{padding-left:5rem; padding-right:5rem;} .btn-narrow{padding-left:1rem; padding-right:1rem;} .btn .fa{margin-left:0.5rem;} p .btn{margin-bottom:0.2rem;} .allow-wrap{ white-space:normal; height:auto;} .clear-search-btn{ background:transparent; border:0; color:inherit; padding:0; width:3rem;} .clear-search-btn:hover, .clear-search-btn:focus{color:#28B493;} /* input type file */ .file_upload{overflow: hidden; border-radius:1.38rem;} .file_upload > .btn{width: 8rem; float:right; top:0; right:0; padding-left:1.5rem; border-top-left-radius:0; border-bottom-left-radius:0;} .file_upload > .file-name{ width:auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-right:2.5rem; padding-top:0.6rem; padding-bottom:0.6rem; border-top-right-radius:0; border-bottom-right-radius:0; border-right:0;} .file_upload input[type=file]{position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(20); -webkit-transform: scale(20); transform-origin:100% 50%; -webkit-transform-origin:100% 50%; opacity: 0; cursor: pointer;} .file_upload .btn-clear{ position:absolute; width:1.11rem; height:1.11rem; border-radius:50%; color:white; line-height:1; text-align:center; padding:0 0 0.1rem 0; border:0; background:#BCBAB1; top:0.85rem; right:9rem; z-index:2;} .file_upload .btn-clear:hover{background:#229A7E;} /* tabs */ .nav-tabs{border-bottom:2px solid #E6E4DB; font-size:1.11rem; text-transform:uppercase; font-weight:700;} .nav-tabs > li{margin-bottom:0;} .nav-tabs > li > a:after{ content:''; display:block; opacity:0; position:absolute; left:50%; right:50%; bottom:-0.2rem; height:0.33rem; border-radius:0.16rem; background-color:#28B493; transition:left 0.2s ease, right 0.2s ease; -webkit-transition:left 0.2s ease, right 0.2s ease;} .nav-tabs > li > a{margin-right:0; border:0; border-radius:0; padding:1.5rem 1rem; padding-top:0; color:#445666; line-height:1.2;} .nav-tabs > li:first-child > a{padding-left:0;} .nav > li > a:hover, .nav > li > a:focus{ background-color:transparent; color:#229A7E; outline:0; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus{color:inherit; background-color:transparent; border:0;} .nav-tabs > li.active > a:after, .nav-tabs > li > a:hover:after, .nav-tabs > li > a:focus:after{opacity:1; left:1rem; right:1rem;} .nav-tabs > li.active:first-child > a:after, .nav-tabs > li:first-child > a:hover:after{left:0;} .tab-content > .tab-pane{padding-top:2rem;} .color-white .nav-tabs{border-color:rgba(255,255,255,0.4);} .color-white .nav-tabs > li > a{color:white} .color-white .nav > li > a:hover, .color-white .nav > li > a:focus{color:#229A7E;} .color-white .nav > li > a:before{ display:none;} /* accordion */ .accordion{margin-top:3rem;} .accordion .panel {margin-bottom:0.5rem; background-color:transparent; border:0; border-radius:0; -webkit-box-shadow:none; box-shadow:none;} .accordion .panel-heading {padding:0; border:0; border-radius:0;} .accordion .panel-title { margin: 0px; font-size:inherit; } .accordion .panel-title a{ font-size:1.33rem; display:block; color:#2B3947; padding:0.5rem 1rem 0.5rem 3rem; background-color:transparent; border:1px solid #BCBAB1; border-radius:0.44rem; transition:font-size 0.2s ease; -webkit-transition:font-size 0.2s ease;} .accordion .panel-title a:hover, .accordion .panel-title a:focus{outline:0; color:#28B493;} .accordion .panel-title a[aria-expanded='true']{ font-size:2rem; color:white; background-color:#28B493; border-color:#229075; border-bottom-left-radius:0; border-bottom-right-radius:0; border-bottom-color:#28B493;} .accordion .panel-title a[aria-expanded='true'] .fa{ transform:rotate(-180deg); -webkit-transform:rotate(-180deg);} .accordion .panel-body {padding:0 1.5rem 1.5rem 3rem; background-color:#28B493; border:1px solid #229075; border-top-color:#28B493; border-bottom-left-radius:0.44rem; border-bottom-right-radius:0.44rem; color:white;} .accordion .panel-title a .item-plus{ position:absolute; left:1rem; top:50%; margin-top:-11px; display:inline-block; width:24px; height:24px; padding:5px; border-radius:50%; background-color:#28B493; line-height:22px; transition:background-color 0.2s ease; -webkit-transition:background-color 0.2s ease;} .accordion .panel-title a .item-plus span{ display:block; width:100%; height:4px; background-color:#fff; top:50%; margin-top:-2px; } .accordion .panel-title a .item-plus span+span{margin-top:-4px; transform:rotate(90deg); transition:transform 0.7s ease; -webkit-transition:transform 0.7s ease;} .accordion .panel-title a[aria-expanded='true'] .item-plus span+span{ transform:rotate(0);} .accordion .panel-title a[aria-expanded='true'] .item-plus{ background-color:#fff;} .accordion .panel-title a[aria-expanded='true'] .item-plus span{ background-color:#28B493;} /* ************************* */ /* HEADER */ /* ************************* */ #header{height:0;} /* navbar */ .navbar{ top:0; position:fixed; margin-bottom:0; border:0; background-color:transparent; border-radius:0; z-index:1030; width:100%; transition:box-shadow 1s ease, top 1s ease, background-color 1s ease; -webkit-transition:box-shadow 1s ease, top 1s ease, background-color 1s ease;} .navbar.affix{top:-130px; box-shadow:0 5px 10px rgba(0,0,0,0.5); background-color:rgba(43,57,71,0.9);} #navbar-header-wrap{} .navbar-header{float:none;} .navbar-brand {float:left; height:auto; padding:0; margin:3.2rem 0 0 0; font-size: inherit; line-height: inherit; position:absolute; z-index:3; transition:transform 1s ease; -webkit-transition:transform 1s ease; transform-origin:0 100%; -webkit-transform-origin:0 100%;} .navbar-brand img{width:100%;} .navbar.affix .navbar-brand{ transform:scale(0.4); -webkit-transform:scale(0.4);} .container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse{margin-left:0; margin-right:0;} .navbar-toggle {padding:0.7rem 1rem; color:#fff; margin:0; height:3.5rem; width:3.5rem; border:0; border-radius:0; transition:color 0.2s ease, background-color 0.2s ease; -webkit-transition:color 0.2s ease, background-color 0.2s ease;} [aria-expanded='true'].navbar-toggle .fa:before{ content:'\f00d';} .navbar-toggle:hover, [aria-expanded='true'].navbar-toggle{ background-color:#fff; color:#2b3947;} .navbar-toggle:focus{ background-color:transparent; color:#fff;} [aria-expanded='true'].navbar-toggle:focus{ background-color:#fff; color:#2b3947;} /*navigation */ #navigation{ text-align:right; border-bottom:1px solid rgba(255,255,255,0.4); z-index:2;} #main-nav{ position:static; border:0; font-size:1rem; font-weight:700; text-transform:uppercase; float:right; margin-top:7.2rem; margin-right:-15px; } #main-nav > li > a{padding:1.6rem 0.8rem; line-height:1.2; text-shadow:0 0 0 rgba(0,0,0,0); transition:text-shadow 0.2s ease; -webkit-transition:text-shadow 0.2s ease;} #main-nav > li > a:after{ content:''; z-index:2000; display:block; position:absolute; left:50%; right:50%; bottom:-0.16rem; border-radius:0.16rem; height:0.33rem; background-color:#28B493; transition:left 0.2s ease, right 0.2s ease; -webkit-transition:left 0.2s ease, right 0.2s ease;} #main-nav > li.dropdown_split > .dropdown-toggle{ display:none; position:absolute; top:0; right:0; margin-right:0; width:2rem; padding-left:0.6rem; padding-right:0.6rem; line-height:1.2; } #main-nav > li > a[aria-expanded="true"] .fa{ transform:rotate(-180deg); -webkit-transform:rotate(-180deg);} #main-nav .fa{ transition:transform 0.7s ease; -webkit-transition:transform 0.7s ease;} #main-nav > li > a{color:#fff; background-color:transparent;} #main-nav > li > a:hover, #main-nav > li > a:focus{color:#fff; background-color:transparent; text-shadow:0 2px 4px rgba(0,0,0,0.5);} #main-nav > li > a:hover:after{left:0.8rem; right:0.8rem; opacity:1; } #main-nav > .active > a{color:#28B493; background-color:transparent; text-shadow:0 2px 4px rgba(0,0,0,0.5);} #main-nav > .active > a:hover, #main-nav > .active > a:focus{color:#28B493; background-color:transparent;} #main-nav > .open > a{ color:#fff; background-color:transparent; text-shadow:0 2px 4px rgba(0,0,0,0.5);} #main-nav > .open > a:after{left:0.8rem; right:0.8rem; opacity:1; } #main-nav > .open.active > a{color:#28B493;} #main-nav > .has-mega-menu{ position:static;} /* nav dropdown */ #main-nav .dropdown-menu{ text-transform:none; font-size:1rem; min-width:100%; padding:0.5rem 0; margin:0; top:100%; border:1px solid #E6E4DB; border-radius:0; background-color:#fff;} #main-nav .dropdown-menu > li{margin-top:1px;} #main-nav .dropdown-menu > li > a{padding:0.5rem 1rem; line-height:1.2; font-weight:400; } #main-nav .dropdown-menu > li.dropdown_split > a{ padding-right:0.3rem; margin-right:2rem; } #main-nav .dropdown-menu > li > a .fa{ transform:rotate(-90deg); -webkit-transform:rotate(-90deg);} #main-nav .dropdown-menu > li > a[aria-expanded="true"] .fa{ transform:rotate(90deg); -webkit-transform:rotate(90deg);} #main-nav .dropdown-menu > li.dropdown_split > .dropdown-toggle{position:absolute; top:0; right:0; margin-right:0; width:2rem; padding-left:0.6rem; padding-right:0.6rem; line-height:1.2;} #main-nav .dropdown-menu > li > a{color:#445666; background-color:transparent;} #main-nav .dropdown-menu > li > a:hover, #main-nav .dropdown-menu > li > a:focus{color:#28B493; background-color:transparent;} #main-nav .dropdown-menu > .active > a{color:#28B493; background-color:transparent;} #main-nav .dropdown-menu > .active > a:hover, #main-nav .dropdown-menu > .active > a:focus{color:#28B493; background-color:transparent;} #main-nav .dropdown-menu.open-left {left:auto; right:-1px;} /* third level */ #main-nav .dropdown-menu .dropdown-menu{top:0; left:100%;} #main-nav .dropdown-menu .dropdown-menu.open-left{left:auto; right:100%;} /* mega-menu */ #main-nav .mega-menu{font-weight:400; border:1px solid #E6E4DB; padding-top:0; padding-bottom:0;} #main-nav .mega-menu .menu-body{padding:1.5rem 1rem; } #main-nav .mega-menu .menu-body > .row{ display:flex; align-items:stretch;} #main-nav .mega-menu .menu-body > .row > [class*='col-']{padding:0 1.5rem; width:25%;} #main-nav .mega-menu .menu-body > .row > [class*='col-']+[class*='col-']{border-left:1px solid #E6E4DB;} #main-nav .mega-menu .menu-footer{ background-color:#E6E4DB; padding:1.2rem 1rem;} #main-nav .mega-menu .menu-title{ color:#2B3947; margin-bottom:0.3rem;} #main-nav .mega-menu ul{margin:0; padding:0; list-style-type:none;} #main-nav .mega-menu ul > li > a{ display:block; padding:0.3rem 0; color:inherit;} #main-nav .mega-menu ul > li > a:hover, #main-nav .mega-menu ul > li > a:focus{color:#28B493;} #main-nav .mega-menu ul > .active a, #main-nav .mega-menu ul > .active a:hover, #main-nav .mega-menu ul > .active a:focus{color:#28B493;} #center-nav{ display:none; float:none; position:absolute; font-weight:500; font-size:1rem; top:4.5rem; right:17.5rem; } #center-nav > li > a{border:1px solid rgba(255,255,255,0.4); height:2.66rem; color:#fff; padding:0.65rem 0.7rem;} #center-nav > li+li > a{margin-left:-1px;} #center-nav > li > a:hover, #center-nav > li > a:focus{ background-color:#28B493;} #center-nav > li:first-child > a{border-top-left-radius:1.33rem; border-bottom-left-radius:1.33rem; padding-left:1rem;} #center-nav > li:last-child > a{border-top-right-radius:1.33rem; border-bottom-right-radius:1.33rem; padding-right:1rem;} #top-search{float:none; position:absolute; top:4.5rem; right:15px; width:15rem; padding:0; margin:0; border: 1px solid rgba(255,255,255,0.4); border-radius:1.33rem; color:white;} #top-search .form-control{ display:block; width:calc(100% - 6rem); height:2.55rem; background-color:transparent; color:white; border:0; padding-left:0; padding-right:0;} #top-search .form-control::-ms-clear {display: none;} #top-search .form-control:focus{outline:0;} #top-search ::-webkit-input-placeholder {color: #fff !important;} #top-search :-moz-placeholder {color: #fff !important;} #top-search ::-moz-placeholder {color: #fff !important;} #top-search :-ms-input-placeholder {color: #fff !important;} #top-search [placeholder]:focus::-webkit-input-placeholder { color:rgba(255,255,255,0.4)!important;} #top-search input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { color:rgba(255,255,255,0.4)!important;} #top-search input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {color:rgba(255,255,255,0.4)!important;} #top-search input:focus:-ms-input-placeholder, textarea:focus::-ms-input-placeholder {color:rgba(255,255,255,0.4)!important;} #top-search .input-group-addon{width:3rem; display:block; border:0; background-color:transparent; padding:0.7rem 0.8rem; color:#fff;} #top-search .input-group{ display:flex; /*display:-ms-flexbox; display:-webkit-box; -webkit-box-align:stretch; -ms-flex-align:stretch;*/ align-items:stretch;} #top-nav{ float:none; position:absolute; left:0; width:100%; background-color:rgba(255,255,255,0.2); top:0; font-size:0.9rem; font-weight:400;} #top-nav li > a{color:#fff; padding:0.8rem 0.5rem;} #top-nav li > a:hover, #top-nav li > a:focus{ background-color:#28B493;} #top-nav .navbar-right{margin-right:0;} /* notification */ #notification-top{position:fixed; top:0; left:0; right:0; padding-top:1rem; padding-bottom:1rem; background-color:#F69E04; color:white; z-index:1031; } #notification-top h3{margin-bottom:0.2rem;} #notification-top > .container > .row{display:flex; align-items:center;} #notification-top .icon{ position:absolute; top:0; left:-4rem; color:rgba(255,255,255,0.6);} #notification-top .btn{margin-bottom:0.5rem; margin-right:0.5rem;} /* ************************* */ /* HOME */ /* ************************* */ /*slick slider */ #main-slider{ background-color:#fff; height:45rem; overflow:hidden; text-align:center; text-shadow:0 2px 4px rgba(0,0,0,0.5); color:white;} #main-slider .item-wrap{height:100%; background-size:cover; background-position:center; display:flex; align-items:center; padding-top:2rem;} .slick-track, .slick-list{height:100%;} .slick-slide:focus{outline:0;} .slick-dots{position:absolute; padding:2rem 0 0 0; margin:0; left:auto; right:5.3%; bottom:0; top:0; list-style-type:none; display:flex; flex-direction:column; justify-content:center;} .slick-dots li{width:20px; height:20px; border:5px solid transparent; border-radius:50%;} .slick-dots .slick-active{border-color:rgba(255,255,255,0.4);} .slick-dots li+li{margin-top:2rem;} .slick-dots li button{ display:block;border:0; background:rgba(255,255,255,0.4); color:transparent; overflow:hidden; width:10px; height:10px; border-radius:50%; padding:0; line-height:1rem; transition:background 0.2s ease, border 0.2s ease; -webkit-transition:background 0.2s ease, border 0.2s ease;} .slick-dots li button:hover, .slick-dots li button:focus{ background:rgba(255,255,255,1);} .slick-dots .slick-active button, .slick-dots .slick-active button:hover{background:#fff; cursor:default;} .slick-arrow{opacity:1; z-index:2; position:absolute; width:2.77rem; height:2.77rem; top:calc(50% - 0.38rem); background:none; border:1px solid #fff; border-radius:1.38rem; overflow:hidden; padding:0; transition:background 0.2s ease, border-color 0.2s ease; -webkit-transition:background 0.2s ease, border-color 0.2s ease;} .slick-arrow:hover{ background:#28B493; border-color:#28B493;} .slick-arrow.slick-disabled{ opacity:0.1; cursor:default; background:transparent; border-color:#fff;} .slick-prev{left:calc((100vw - 1140px)/2);} .slick-next{right:calc((100vw - 1140px)/2);} #main-slider #slide1{ background-image:url(../img/bg01.jpg);} #main-slider #slide2{ background-image:url(../img/bg02.jpg);} #main-slider #slide3{ background-image:url(../img/bg03.jpg);} .video-bg-wrap {position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; /*z-index: 1;*/ background: url(../img/bg01.jpg) no-repeat; background-size: cover;} .video-bg-wrap > video { position: absolute; top: 0; left: 0; min-width: 100%; min-height: 100%; width: auto; height: auto; } @supports (object-fit: cover) { .video-bg-wrap > video {top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;} } /* featured links */ #featured-links{ display:flex; align-items:stretch; justify-content:space-between; z-index:2;} #featured-links .item-wrap{border:1px solid #E6E4DB; background-color:transparent; color:inherit; border-radius:0.33rem; width:calc(25% - 1.5rem); padding:0.8rem; transition:background 0.2s ease 0.2s, border 0.2s ease 0.2s, color 0.2s ease 0.2s; -webkit-transition:background 0.2s ease 0.2s, border 0.2s ease 0.2s, color 0.2s ease 0.2s; } #featured-links .item-title{color:#2B3947; transition:color 0.2s ease 0.2s; -webkit-transition:color 0.2s ease 0.2s;} #featured-links .item-wrap:hover{border-color:#28B493; background-color:#28B493; color:white; transition:background 0.2s ease, border 0.2s ease, color 0.2s ease; -webkit-transition:background 0.2s ease, border 0.2s ease, color 0.2s ease;} #featured-links .item-wrap:hover .item-title{color:white; transition:color 0.2s ease; -webkit-transition:color 0.2s ease;} #featured-links .item-wrap .splitter span{ transition:background-color 0.2s ease 0.2s; -webkit-transition:background-color 0.2s ease 0.2s;} #featured-links .item-wrap:hover .splitter span{ background-color:rgba(255,255,255,0.4); transition:background-color 0.2s ease; -webkit-transition:background-color 0.2s ease;} #featured-links .textbox+.weather-widget{margin-top:-3.5rem;} .weather-widget{ font-family:'Argone'; font-size:1.33rem; color:#2B3947; transition:color 0.2s ease 0.2s; -webkit-transition:color 0.2s ease 0.2s;} .weather-widget .image{ display:inline-flex; vertical-align:bottom; align-items:center; justify-content:center; width:2rem; height:2rem; border-radius:50%; background-color:white; overflow:hidden;} .weather-widget .image img{width:100%;} #featured-links .item-wrap:hover .weather-widget{color:white; transition:color 0.2s ease; -webkit-transition:color 0.2s ease;} #featured-links .slide-panel{ opacity:0; position:absolute; bottom:80%; margin-bottom:-1.5rem; color:white; background-color:#28B493; border:1px solid #28B493; border-radius:0.33rem; left:-1px; right:-1px; padding:0.8rem; transition:opacity 0.2s ease, bottom 0.2s ease; -webkit-transition:opacity 0.2s ease, bottom 0.2s ease;} #featured-links .item-wrap:hover .slide-panel{bottom:100%; opacity:1; transition:opacity 0.2s ease 0.2s, bottom 0.2s ease 0.2s; -webkit-transition:opacity 0.2s ease 0.2s, bottom 0.2s ease 0.2s;} #featured-links .item-wrap:hover a:not(.area-link) { display:inline-block; color:#fff;} #featured-links .item-wrap:hover a:not(.area-link):hover {color:#fff;} #featured-links .item-wrap:hover a:not(.area-link):before { content:''; display:block; height:2px; width:100%; position:absolute; bottom:-1px; background-color:white; transition:width 0.2s ease; -webkit-transition:width 0.2s ease;} #featured-links .item-wrap:hover a:not(.area-link):hover:before {width:0;} /* news */ h2+.events-news-list{margin-top:3rem;} .events-news-list .item{display:flex; flex-direction:column; overflow:hidden; margin-bottom:0; border-radius:0.33rem;} .events-news-list .item-image{flex:0 0 auto;} .events-news-list .item-image img{width:100%; max-width:100%;} .events-news-list .item-info{padding:1rem 0 0 0; flex-grow:1; z-index:2;} .events-news-list .item-info .textbox{margin-bottom:0.5rem;} .events-news-list .item-info a{ font-weight:500;} .events-news-list .item-info:before{ content:''; display:block; position:absolute; left:0; bottom:100%; width:100%; height:2rem; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .events-news-list .item-name{color:#2B3947; margin-bottom:0.5rem;} .events-news-list [class*='color-overlay-']{ z-index:2; opacity:0; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease; background: rgba(0,0,0,1); background: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1)); background: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1)); background: -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1)); background: -ms-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1)); background: linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1)); } .events-news-list .item:hover [class*='color-overlay-']{opacity:1;} .events-news-list .overlay-image{ position:absolute; opacity:0; z-index:3; top:0; right:0; left:0; bottom:0; display:flex; align-items:center; justify-content:center; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} .events-news-list .overlay-image img{width:auto; height:auto;} .events-news-list .item:hover .overlay-image{ opacity:1;} /* animals carousel */ #animals-section{ background-color:#E6E4DB;} #animals-carousel-wrap{margin-top:-3rem; margin-bottom:3rem;} #animals-carousel-wrap #view-all-link{ display:block; z-index:2; bottom:-2.4rem; width:7rem; position:absolute; text-transform:uppercase; left:50%; margin-left:-3.5rem; text-align:center; font-weight:500;} #animals-carousel .item-wrap{ height:calc(100vw/2.3); display:flex; align-items:center;} #animals-carousel .item{ background-color:#fff; border-radius:0.33rem; overflow:hidden; display:flex; flex-direction:column; width:100%; margin:0.5rem 1rem; text-align:center; transition:box-shadow 0.7s ease, padding 0.7s ease; -webkit-transition:box-shadow 0.7s ease, padding 0.7s ease;} #animals-carousel .item-image{ position:static; flex:0 0 auto; padding:0 1rem 0rem 1rem; transition:padding 0.7s ease; -webkit-transition:padding 0.7s ease;} #animals-carousel .item-image img{ display:inline-block; max-width:100%; width:80%; transition:transform 0.7s ease 0s; -webkit-transition:transform 0.7s ease 0s; transform-origin:50% 90%; -webkit-transform-origin:50% 90%;} #animals-carousel .item-description{overflow:hidden; height:0; transition:height 0.7s ease; -webkit-transition:height 0.7s ease; } #animals-carousel .item-info{padding:0rem 2rem 2rem 2rem; flex-grow:1; width:100%;} #animals-carousel .item-info .textbox{margin-bottom:0;} #animals-carousel .item-name{color:#2B3947;} #animals-carousel [class*='color-overlay-']{ z-index:2; opacity:0; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} #animals-carousel .overlay-info{ opacity:0; position:absolute; left:0; top:100%; bottom:0; display:flex; align-items:center; justify-content:center; z-index:2; width:100%; background-color:#28B493; color:white; text-align:center; padding:1rem; transition:opacity 0.2s ease, top 0.2s ease; -webkit-transition:opacity 0.2s ease, top 0.2s ease; } #animals-carousel .overlay-info:before{ content:''; display:block; position:absolute; left:0; width:100%; bottom:100%; height:2rem; background:url(../img/watercolor_edge_green.png) no-repeat bottom; background-size:100% auto;} #animals-carousel .item:hover [class*='color-overlay-']{opacity:1;} #animals-carousel .item:hover .overlay-info{opacity:1; top:0.4rem;} #animals-carousel .slick-center .item{ box-shadow:0 2px 4px rgba(43,57,71,0.39);} #animals-carousel .slick-center .item-image{padding-top:6rem;} #animals-carousel .slick-center .item-image img{transform:scale(1.4); -webkit-transform:scale(1.4);} #animals-carousel .slick-center .item-description{height:4.5rem;} #animals-carousel .slick-arrow{top:auto; bottom:-3rem; background:#28B493; color:#fff; border:0;} #animals-carousel .slick-arrow:hover{ background:#229A7E;} #animals-carousel .slick-arrow.slick-disabled{ background:#28B493;} #animals-carousel .slick-prev{left:50%; margin-left:-6rem;} #animals-carousel .slick-next{right:50%; margin-right:-6rem;} /* testimonials */ .testimonials{border:1px solid #E6E4DB; border-radius:0.33rem; margin-bottom:2rem; padding:6.66rem 3.8rem; font-weight:300; font-size:1.33rem;} .testimonials .name{color:#2B3947; font-size:2rem; font-family:'Argone'; margin-top:-2rem;} .testimonials .name:before{ content:'-';} .testimonials q:before, .testimonials q:after{ content:'';} .testimonials:before{ content:'\f10d'; font-family:'FontAwesome'; color:#BCBAB1; display:block; position:absolute; left:50%; top:2rem; width:2.8rem; margin-left:-1.4rem; font-size:210%;} .testimonials:after{ content:'\f10e'; font-family:'FontAwesome'; color:#BCBAB1; display:block; position:absolute; left:50%; bottom:2rem; width:2.8rem; margin-left:-1.4rem; font-size:210%;} /* conservation-case-study */ .conservation-case-study{ margin-bottom:2rem;} .conservation-case-study .case-image{border-radius:0.33rem 0.33rem 0 0; overflow:hidden; } .conservation-case-study .case-image:after{ content:''; display:block; position:absolute; left:0; right:0; bottom:0; top:0; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .conservation-case-study .case-image img{width:100%; max-width:100%;} .conservation-case-study .case-body{border:1px solid #E6E4DB; border-top:0; padding:1rem 1.5rem 1.5rem 1.5rem; border-radius:0 0 0.33rem 0.33rem; } /* conservation */ .stories-list{margin-bottom:2rem;} .stories-list .item-wrap{ display:flex;} .stories-list .item-wrap+.item-wrap{margin-top:2rem;} .stories-list .item-media{ flex-basis:33.33%; padding-right:1.66rem;} .stories-list .item-media-object{width:100%; max-width:100%; border-radius:0.33rem;} .stories-list .item-body{ flex-basis:66.66%; flex-grow:1;} .stories-list .item-title{color:#2B3947; margin-bottom:0.2rem;} .stories-list .animal-link{ text-transform:uppercase; font-weight:500;} .stories-list .animal-link span+span:before{ content:'|'; margin:0 0.4rem 0 0.2rem; color:#BCBAB1;} /* instagram feed */ #instagram-feed{ display:flex; align-items:stretch; flex-wrap:wrap; justify-content:space-between; margin-top:3.1rem;} #instagram-feed .item-wrap{ flex-basis:calc(33.33% - 0.8rem); margin-bottom:1.6rem; border-radius:0.33rem; overflow:hidden;} #instagram-feed .item-wrap img{width:100%; max-width:100%;} #instagram-feed .item-wrap:after{ content:''; display:block; position:absolute; top:0; right:0; bottom:0; left:0; background-color:rgba(43,57,71,0.31); transition:background-color 0.2s ease; -webkit-transition:background-color 0.2s ease;} #instagram-feed .item-wrap:hover:after{ background-color:transparent;} #instagram-feed .icon{ position:absolute; right:1rem; bottom:1rem; width:2.22rem; height:2.22rem; background:url(../img/i-inst.png) no-repeat center; background-size:100% 100%;} /* ************************* */ /* FOOTER */ /* ************************* */ #footer{ background-color:#E6E4DB; flex:0 0 auto;} #footer a:not(.btn){color:#2B3947;} #footer a:hover:not(.btn), #footer a:focus:not(.btn){color:#28B493;} /* footer-top */ #footer-top-section{ background-color:#E6E4DB; padding-top:2.5rem; padding-bottom:2.5rem;} #footer-top-section > .container > .row{ display:flex; align-items:stretch;} #footer-top-section > .container > .row [class*='col-']{padding-left:1.3rem; padding-right:1.3rem; } #footer-top-section > .container > .row [class*='col-']+[class*='col-']{border-left:1px solid #BCBAB1;} #footer-nav{ font-weight:500;} #footer-nav ul{margin:0; padding:0; list-style-type:none;} #footer-nav ul li+li{margin-top:0.5rem;} #footer-nav ul li a{ text-transform:uppercase;} #location address{margin-bottom:2rem;} #location address .directions-link{margin-top:1rem;} #location address .directions-link a{ text-transform:uppercase; font-weight:500; } #location h3{margin-bottom:0.5rem;} #contacts h3{margin-bottom:0.5rem;} #contacts .social-links{margin-bottom:2rem;} #contacts .social-links a{ width:2.4rem; height:2.4rem; margin-bottom:0.2rem; border-radius:50%; border-color:transparent; display:inline-flex; align-items:center; justify-content:center; background-color:#BCBAB1; color:white;} #contacts .social-links a:hover, #contacts .social-links a:focus{background-color:#28B493; color:white;} #contacts .btn{ display:block;} #footer-logos a{ display:inline-block; margin-bottom:1rem; max-width:100%;} #footer-logos a img{max-width:100%;} /* footer-bottom */ #footer-bottom-section{ background-color:#BCBAB1; padding-top:0.7rem; padding-bottom:0.7rem; font-weight:500; font-size:0.9rem;} #footer-bottom-section .policies{ text-align:right;} #footer #footer-bottom-section a{ color:#445666;} #footer #footer-bottom-section a:hover, #footer-bottom-section a:focus{ color:#28B493;} /* ************************* */ /* INTERNAL */ /* ************************* */ /*.quick-contact-form{margin-top:2rem;}*/ /*.quick-contact-form .form-group{margin-bottom:2.5rem;}*/ /* breadcrumbs */ #breadcrumbs{ border-bottom:1px solid rgba(255,255,255,0.4); padding-top:0.5rem; padding-bottom:0.5rem; font-weight:700; color:white; line-height:1.2;} #breadcrumbs ol{margin:0; padding:0; list-style-type:none; display:flex; flex-wrap:wrap;} #breadcrumbs ol li+li:before{ content:'/'; margin-left:0.2rem; margin-right:0.2rem;} #breadcrumbs ol li a{color:inherit; white-space:nowrap;} #breadcrumbs ol li a:hover, #breadcrumbs ol li a:focus{color:#229A7E;} /* page-header */ .internal-header-section{padding-top:18rem; padding-bottom:6rem; background-position:center; background-size:cover; color:white;} .internal-header-section h1, .internal-header-section p{text-shadow:0 2px 4px rgba(0,0,0,0.5);} .internal-header-section + .content-section{padding-top:2rem;} .internal-header-section.empty-header{padding-bottom:0;} .internal-header-section.header-message-centered{padding-top:17rem; padding-bottom:9rem;} .internal-header-section.event-details-header{padding-top:20rem; padding-bottom:0;} #internal-header-section-default{ background-image:url(../img/bg01.jpg);} #internal-header-section-alt1{ background-image:url(../img/20140821__PAS6995PaulSelvaggio.jpg);} #internal-header-section-alt2{ background-image: url(../img/20160603__PS50145PaulSelvaggio.jpg);} #internal-header-section-alt3{ background-image:url(../img/20120208_PS3_9138_Kobe_Profile.jpg);} /* side-nav */ .side-nav .list-group{ background-color:transparent; border:0; padding:0; border-left: 1px solid #E6E4DB;} .side-nav .list-group + .list-group{ border-top:0; } .side-nav .list-group-item{border-radius:0!important; border:0; padding:0; background-color:transparent; margin-bottom:0;} .side-nav .list-group-item + .list-group-item{margin-top:1.2rem;} .side-nav .list-group-item.active, .side-nav .list-group-item:hover, .side-nav .list-group-item:focus{ background-color:transparent;} .side-nav .list-group-item > a{padding:0 1.7rem 0 1rem; font-weight:700;} .side-nav .list-group-item .collapse-toggle{ display:none; position:absolute; color:#445666; right:0; top:0; width:1.5rem; padding:0 0.5rem; margin-left:0; ;} .side-nav .list-group-item .collapse-toggle:focus{outline:0;} .side-nav .list-group-item .collapse-toggle:hover{color:#445666;} /* plus */ .side-nav .collapse-toggle .item-plus{ display:inline-block; width:0.8rem; height:0.8rem; } .side-nav .collapse-toggle .item-plus span{ display:block; position:absolute; width:100%; height:3px; background-color:#636363; top:50%; margin-top:-1px;} .side-nav .collapse-toggle .item-plus span+span{ transform:rotate(90deg); transition:transform 0.7s ease; -webkit-transition:transform 0.7s ease;} .side-nav .collapse-toggle:hover .item-plus span{ background-color:#28B493;} .side-nav .collapse-toggle[aria-expanded='true'] .item-plus span+span{ transform:rotate(0);} .side-nav .list-group-item a:hover .collapse-toggle .item-plus span{ background-color:#445666;} .side-nav-sublevel{padding-left:0;} .side-nav-sublevel ul{margin:1.2rem 0 0 0; padding:0; list-style-type:none;} .side-nav-sublevel ul li+li{margin-top:1.2rem;} .side-nav-sublevel ul li a{padding:0 0 0 2rem; } .side-nav a{display:block; color:#445666; font-size:1.11rem; line-height:1.2;} .side-nav a:hover{color:#28B493;} .side-nav .active > a{color:#28B493; } .side-nav .active > a:before{ content:''; display:block; width:0.33rem; top:-0.2rem; bottom:-0.2rem; position:absolute; left:-0.16rem; border-radius:0.16rem; background-color:#28B493;} /* cta-box */ .cta-box{border-radius:0.33rem; padding:2rem 1rem;} .cta-box .icon{margin-bottom:1rem; color:rgba(43,57,71,0.39);} /* cta-section */ .cta-section{ background-position:center; background-size:cover;} .cta-section .cta-section-action{ text-align:right;} .cta-section > .container > .row{ display:flex; align-items:center;} .cta-section.text-center .cta-section-action{ text-align:inherit; margin-top:3rem;} #cta-join{ background:url(../img/20140926__PAS0235PaulSelvaggio.jpg) center; background-size:cover;} #cta-right1{ background:url(../img/20111213-_PAS0489_swimming.jpg) center; background-size:cover;} /* header-message */ .header-message-section{margin-top:-8rem; z-index:2;} .header-message-section .message-wrap {padding:1.5rem; border-radius:0.44rem; } .header-message-section .has-icon{padding-left:5.77rem;} .header-message-section .icon{ position:absolute; top:1.5rem; left:1.5rem; color:rgba(43,57,71,0.39);} .header-message-section .message-button{ text-align:right;} .header-message-section.right-edge .message-wrap{width:calc(100% + (100vw - 1170px)/2 + 15px); padding-right:calc((100vw - 1170px)/4); border-top-right-radius:0; border-bottom-right-radius:0;} /* trip-intro */ .trip-intro-section > .row{ display:flex; align-items:stretch;} .trip-intro-section .left-side{ display:flex; align-items:stretch; margin-right:-8.33%;} .trip-intro-section .right-side{ display:flex; align-items:stretch; padding-top:4rem; padding-bottom:4rem; } .trip-intro-section .image-wrap{ position:absolute; top:0; right:0; bottom:0; width:calc(100% + (100vw - 1170px)/2); border-radius:0 0.33rem 0.33rem 0; overflow:hidden; background:url(../img/20111213-_PAS0489_swimming.jpg) center; background-size:cover; } .intro-body{border-radius:0.33rem; background-color:#E6E4DB; padding:1.5rem; margin-bottom:2rem; } .intro-body .intro-links{ display:flex; align-items:flex-start; flex-wrap:wrap; margin-bottom:-0.5rem;} .intro-body .textbox + .intro-links{margin-top:-3rem;} .intro-body .intro-links a{ flex-basis:50%; text-transform:uppercase; font-weight:500; margin-bottom:0.5rem;} /* pricing */ .pricing-wrap{border-radius:0.33rem; overflow:hidden; border:1px solid #BCBAB1; margin-bottom:2rem;} .pricing-wrap .pricing-header{color:#2B3947; text-align:center; margin:0; border-bottom:1px solid #BCBAB1; background-color:#E6E4DB; padding:1.5rem;} .pricing-wrap .pricing-body{padding:1.5rem; text-align:center;} .pricing-wrap .package-name{font-size:1.11rem; font-weight:700;} .pricing-wrap .package-price{color:#28B493; font-size:2.66rem; font-family:'Argone'; margin-bottom:0.7rem;} .pricing-wrap .splitter.short{margin-bottom:1rem;} .pricing-wrap .splitter.short span{width:5rem;} /* gallery */ .gallery-wrap{display:flex; align-items:stretch; margin-top:2rem;} .gallery-wrap .col-1{ width:66.66%; display:flex; align-items:stretch; flex-wrap:wrap;} .gallery-wrap .col-2{ width:33.33%; display:flex; flex-direction:column;} .gallery-wrap .image-wrap [class*='color-overlay-']{opacity:0; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} .gallery-wrap .image-wrap:hover [class*='color-overlay-'], .gallery-wrap .image-wrap:focus [class*='color-overlay-']{opacity:1;} .gallery-wrap .image-wrap{ overflow:hidden; display:flex; align-items:stretch; border:2px solid white; background-size:cover; background-position:center;} .gallery-wrap .image-wrap img{width:100%; max-width:100%;} .gallery-wrap .image-wrap a{ display:flex; align-items:center; color:white; justify-content:center;} .gallery-wrap .col-1 .image-wrap{height:11.77rem;} .gallery-wrap .col-2 .image-wrap{height:17.77rem;} .gallery-wrap .col-1 .image-wrap:nth-child(1), .gallery-wrap .col-1 .image-wrap:nth-child(4){width:58.33%;} .gallery-wrap .col-1 .image-wrap:nth-child(2), .gallery-wrap .col-1 .image-wrap:nth-child(3){width:41.66%;} .gallery-wrap .gallery-view-all-link{height:auto; padding-left:1rem; padding-right:1rem; border-radius:0; flex-grow:1; border:2px solid white; display:flex; align-items:center; justify-content:center; line-height:1;} .gallery-wrap .gallery-view-all-link .fa{padding-left:0.5rem;} /* full-bg-cta-section */ .full-bg-cta-section{ background-position:center; background-size:cover; padding-top:7rem; padding-bottom:7rem;} #full-bg-cta1{ background-image: url(../img/20140825PAS7517PaulSelvaggio.jpg);} #full-bg-cta1.top-edge:before{background:url(../img/bg-top-edge-beige.png) repeat-x top;} /* schedule-section */ .schedule-section > .row{ display:flex; align-items:stretch;} .schedule-section > .row > [class*='col-']{display:flex; align-items:stretch;} .schedule-section .schedule-body{border-radius:0.33rem; background-color:#E6E4DB; padding:2rem; width:100%;} .schedule-section .schedule-body h3{margin-right:6rem;} .schedule-body .table{ font-size:1.11rem; margin-top:2rem;} .schedule-body .table + div{margin-top:2rem;} .schedule-body .table a{ text-transform:uppercase; font-weight:700;} .schedule-body .table > tbody > tr > td {border-top:0; border-bottom:1px solid #BCBAB1; padding:0.6rem 0;} .schedule-body .table > tbody > tr > td:first-child{ font-family:'Argone'; color:#2B3947; width:30%;} .schedule-body .table > tbody > tr > td:last-child div+div{margin-top:1rem;} .schedule-body .weather-widget{ font-size:2rem; position:absolute; top:1.8rem; right:2rem;} .schedule-body .weather-widget .image{width:3.5rem; height:3.5rem; border-radius:0; background-color:transparent; vertical-align:middle; margin-top:-0.3rem;} .schedule-cta{ margin-top:3rem; margin-bottom:3rem; margin-left:calc((1170px - 100vw)/2 - 15px); margin-right:-30px; padding:2rem 20%; width:calc(100% + (100vw - 1170px)/2 + 3rem); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background: url(../img/20130926_PS4_2212PaulSelvaggio.jpg) center; background-size:cover; color:white; } .schedule-cta > div{width:100%;} /* tickets */ .tickets-wrap{border:1px solid #E6E4DB; border-radius:0.33rem; padding:1.5rem;} .tickets-table-header{margin-bottom:2rem;} .tickets-table-header .btn{float:right; z-index:2;} .tickets-pricing{ font-size:1.11rem; color:#2B3947; border-bottom:1px solid #E6E4DB;} .tickets-pricing > tbody > tr > td{border-color:#E6E4DB; padding-top:0.6rem; padding-bottom:0.6rem;} .tickets-pricing > tbody > tr > td:first-child{ font-family:'Argone';} .tickets-pricing > tbody > tr > td:last-child{ text-align:right; color:#28B493; font-weight:700;} .tickets-pricing a{ font-weight:700;} .tickets-info-wrap .textbox:not(:last-child){margin-bottom:3rem;} /* locations */ .locations-section > .row{ display:flex; align-items:stretch;} .locations-section > .row > [class*='col-']{display:flex; align-items:stretch;} .locations-section .map-wrap{ border-radius:0.33rem; overflow:hidden; width:100%;} .locations-section .map-wrap iframe{width:100%; height:100%;} .locations-section .location-wrap{ border-radius:0.33rem; padding:2rem 1rem; width:100%; border:1px solid #E6E4DB; display:flex; align-items:center; justify-content:center; text-align:center;} .locations-section .location-wrap .splitter{margin-top:0; margin-bottom:1rem;} .locations-section .location-wrap .textbox .btn{ display:block;} .locations-section .location-wrap .textbox .btn+.btn{margin-top:1rem;} .locations-section .location-wrap .icon{margin-bottom:1rem;} /* zoo-map */ #zoo-map-cta-section .col-right{ background:url(../img/map-bg-tmp.JPG) center; background-size:cover;} /* support the zoo */ .items-list{ display:flex; align-items:stretch; justify-content:space-between; flex-wrap:wrap;} .items-list:last-child{margin-bottom:-3rem;} .items-list .item{width:calc(50% - 1rem); border:1px solid #E6E4DB; border-radius:0.33rem; overflow:hidden; padding:2.5rem 1.5rem 1.5rem 1.5rem; text-align:center; margin-bottom:3rem; } .items-list .item .item-icon{margin-bottom:2rem; color:#C9590B;} .items-list .item .item-title{color:#2B3947;} .items-list .item .textbox{margin-bottom:0;} .items-list .item .hover-overlay{ z-index:2; position:absolute; left:0; width:100%; bottom:-100%; padding:1rem; background-color:#28B493; transition:bottom 0.2s ease; -webkit-transition:bottom 0.2s ease;} .items-list .item .hover-overlay:before{ content:''; display:block; position:absolute; left:0; width:100%; bottom:100%; height:3rem; background:url(../img/watercolor_edge_green.png) no-repeat bottom; background-size:100% auto;} .items-list .item:hover .hover-overlay{bottom:0;} .items-list .item .splitter.short{margin-bottom:0.7rem;} .testi-section{border:0; padding-left:0; padding-right:0; margin:0;} .testi-section::after, .testi-section::before{color:rgba(43,57,71,0.39);} .testi-section .name{color:inherit;} /* ************************* */ /* NEWS */ /* ************************* */ .filter-wrap > form > .row{ display:flex; align-items:flex-end;} .filter-wrap > form > .row > [class*='col-']:first-child{order:1;} .filter-wrap > form > .row > [class*='col-']:last-child{order:0;} .page-search{padding:0; margin:0; border: 1px solid #BCBAB1; border-radius:1.38rem;} .page-search .input-group-addon{ display:block; width:3rem; border:0; background-color:transparent; padding:0.9rem 0.8rem; color:#BCBAB1;} .page-search .input-group{ display:flex; align-items:stretch;} .page-search .form-control{ display:block; width:calc(100% - 6rem); height:2.77rem; background-color:transparent; border:0; padding-left:0; padding-right:0;} .page-search .form-control::-ms-clear {display: none;} .news-list .item{border-top:1px solid #E6E4DB; border-bottom:1px solid #E6E4DB; padding:0.7rem 0;} .news-list .item+.item{margin-top:-1px;} .news-list .news-title{margin-bottom:0;} .tags-list a{ display:inline-block; margin-right:0.2rem; margin-bottom:0.4rem; background-color:#E6E4DB; color:inherit; border-radius:0.66rem; line-height:1.1; white-space:nowrap; padding:0.1rem 0.5rem 0.2rem 0.5rem ; font-weight:500;} .tags-list a:hover, .tags-list .active{ background-color:#cccac2;} .news-details-header{margin-bottom:2rem;} .news-type-date{margin-bottom:1rem; display:flex; align-items:center;} .news-type-date span + span:before{ content:'|'; margin:0 0.2rem;} .video-wrap{border-radius:0.33rem; overflow:hidden;} .video-wrap iframe{/*width:100%; height:100%;*/ display:block;} /* ************************* */ /* EVENTS */ /* ************************* */ #internal-header-section-events1{ background-image:url(../img/20100703__PAS9688PaulSelvaggio.jpg);} #internal-header-section-events2{ background-image: url(../img/20140618_PS4_8117PaulSelvaggio.jpg); } .sort-button{ position:absolute; right:0; top:-0.7rem; z-index:2; } .sub-menu{display:flex; align-items:flex-start; justify-content:center; flex-wrap:wrap; margin-bottom:1.5rem;} .sub-menu a{ text-transform:uppercase; white-space:nowrap; font-weight:500; padding:0 1rem; margin-bottom:0.5rem;} .events-list .item{border:1px solid #E6E4DB; border-radius:0.33rem; overflow:hidden; display:flex; flex-direction:column;} .events-list .event-date{ position:absolute; z-index:3; top:0; right:0; width:6.25rem; height:6.25rem; display:flex; flex-direction:column; text-align:center; justify-content:center; background-color:#F69E04; color:white; font-family:'Argone'; font-size:2.44rem; text-transform:uppercase; line-height:1; border-bottom-left-radius:0.33rem;} .events-list .event-date span+span{ font-size:1.6rem;} .events-list .event-image{flex:0 0 auto; position:static;} .events-list .event-image img{width:100%; max-width:100%;} .events-list .event-info{padding:0.5rem 1rem 1rem 1rem; flex-grow:1; min-height:7rem;} .events-list .event-info .textbox{margin-bottom:0;} .events-list .event-info:before{ content:''; display:block; position:absolute; left:0; bottom:100%; width:100%; height:2rem; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .events-list .event-name{margin-bottom:0; color:#2B3947;} .events-list [class*='color-overlay-']{ z-index:2; opacity:0; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} .events-list .overlay-info{ opacity:0; position:absolute; left:0; top:100%; bottom:0; display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:2; width:100%; background-color:#28B493; color:white; text-align:center; padding:0 1rem 1rem 1rem; transition:opacity 0.2s ease, top 0.2s ease; -webkit-transition:opacity 0.2s ease, top 0.2s ease; } .events-list .overlay-info:before{ content:''; display:block; position:absolute; left:0; width:100%; bottom:100%; height:2rem; background:url(../img/watercolor_edge_green.png) no-repeat bottom; background-size:100% auto;} .events-list .event-time{ font-family:'Argone'; font-size:2rem;} .events-list .area-link{ z-index:4;} .events-list .item:hover [class*='color-overlay-']{opacity:1;} .events-list .item:hover .overlay-info{opacity:1; top:0.4rem;} .event-name-box{ background-color:#2B3947; color:white; padding:1.7rem 1.7rem 4rem 1.7rem; border-top-left-radius:0.44rem;} .event-name-box.right-edge{width:calc(100% + (100vw - 1170px)/2 + 15px);} .event-name-box .splitter span{ background-color:rgba(255,255,255,0.4);} .event-name-box p{ text-shadow:none;} .event-name-box h2 a{ display:inline-block;} .event-name-box h2 a:hover .fa{animation: bounce-right 0.5s infinite ease-in-out;} .callouts-wrap{margin-bottom:3rem;} .callouts-wrap > .row > [class*='col-']{ display:flex; align-items:flex-start; flex-wrap:wrap; margin-top:-6rem; z-index:2;} .callouts-wrap .callout{padding:0.5rem 1rem; border-radius:0.44rem; margin-right:1.5rem; margin-bottom:1rem;} .callouts-wrap .callout .fa{color:rgba(43,57,71,0.39);} .callouts-wrap .callout:hover .area-link + div .fa{color:rgba(43,57,71,0.69);} .event-details-wrap{ display:flex; align-items:stretch; justify-content:space-between;} .event-details-wrap .item{width:calc(25% - 1rem); border:1px solid #E6E4DB; border-radius:0.33rem; padding:1rem; text-align:center;} .event-details-wrap .item .icon{color:#C9590B; margin-bottom:1rem;} .event-option{ display:flex; align-items:flex-start;} .event-option .option-label{width:30%; padding-right:1rem; min-height:2.4rem;} .event-option .option{width:70%;} .event-option .map-wrap{border-radius:0.33rem; overflow:hidden;} .event-option .map-wrap img{max-width:100%;} .event-direction-map{align-items:flex-start; flex-wrap:wrap;} .event-direction-map .option{width:100%; padding-top:0.5rem;} .global-nav-section{ display:flex; align-items:stretch;} .global-nav-section a{width:50%; padding-left:1rem; padding-right:1rem; display:flex; align-items:center; justify-content:center; font-family:'Argone'; font-size:2.66rem; line-height:1.1; color:white; background-position:center; background-size:cover; background-color:#229A7E;} .global-nav-section a [class*='color-overlay-']{opacity:1; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease; background-color:rgba(43,57,71,0.6);} .global-nav-section a:first-child [class*='color-overlay-']{background-color:rgba(43,57,71,0.6);} .global-nav-section a:hover [class*='color-overlay-'], .global-nav-section a:focus [class*='color-overlay-']{opacity:0;} .global-nav-section a:first-child:hover .fa{animation: bounce-left 0.5s infinite ease-in-out;} .global-nav-section a:last-child:hover .fa{animation: bounce-right 0.5s infinite ease-in-out;} #event1{ background-image:url(../img/20140821__PAS6995PaulSelvaggio.jpg);} #event3{ background-image: url(../img/20121010_PS3_4979PaulSelvaggio.jpg);} /* ************************* */ /* ANIMALS */ /* ************************* */ #internal-header-section-animals1{ background-image:url(../img/20141001__PAS1199PaulSelvaggio.jpg);} .animals-list .item{border:1px solid #E6E4DB; border-radius:0.33rem; overflow:hidden; text-align:center; display:flex; flex-direction:column;} .animals-list .item-image{flex:0 0 auto; position:static;} .animals-list .item-image img{width:100%; max-width:100%;} .animals-list .item-info{padding:0.5rem 1rem 1rem 1rem; flex-grow:1;} .animals-list .item-info .textbox{margin-bottom:0;} .animals-list .item-info:before{ content:''; display:block; position:absolute; left:0; bottom:100%; width:100%; height:2rem; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .animals-list .item-name{color:#2B3947;} .animals-list [class*='color-overlay-']{ z-index:2; opacity:0; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} .animals-list .overlay-info{ opacity:0; position:absolute; left:0; top:100%; bottom:0; display:flex; align-items:center; justify-content:center; z-index:2; width:100%; background-color:#28B493; color:white; text-align:center; padding:0.5rem 1rem 1rem 1rem; transition:opacity 0.2s ease, top 0.2s ease; -webkit-transition:opacity 0.2s ease, top 0.2s ease; } .animals-list .overlay-info:before{ content:''; display:block; position:absolute; left:0; width:100%; bottom:100%; height:2rem; background:url(../img/watercolor_edge_green.png) no-repeat bottom; background-size:100% auto;} .animals-list .item:hover [class*='color-overlay-']{opacity:1;} .animals-list .item:hover .overlay-info{opacity:1; top:0.4rem;} #header-slider{ background-color:#fff; height:47rem; overflow:hidden; text-shadow:0 2px 4px rgba(0,0,0,0.5); color:white;} #header-slider .item-wrap{height:100%; background-size:cover; background-position:center; display:flex; align-items:center; padding-top:2rem;} #animals-slide1{ background-image: url(../img/20130926_PS4_2212PaulSelvaggio.jpg);} #animals-slide2{ background-image:url(../img/bg02.jpg);} #animals-slide3{ background-image:url(../img/bg03.jpg);} #header-slider .slick-dots{padding-top:6rem;} #header-slider-wrap + .content-section .header-message-section{margin-top:-13rem;} .header-message-section + .animal-header{margin-top:-3rem;} .animal-header{margin-bottom:1rem;} .animal-header h1{margin-bottom:0;} .animal-header .latin-name{ font-size:1.55rem; font-weight:300; font-family:'Roboto'; vertical-align:middle;} .animal-header .action-control-wrap{ position:absolute; right:0; bottom:0;} #animal1{ background-image:url(../img/bg01.jpg);} #animal3{ background-image:url(../img/bg02.jpg);} .cta-box + .exibit-details{margin-top:-2.5rem;} .exibit-details ul{padding-left:0;} /* ************************* */ /* CONSERVATION */ /* ************************* */ #conservation-slide1{ background-image: url(../img/20131106_PS4_5645PaulSelvaggio.jpg);} #conservation-slide2{ background-image:url(../img/bg02.jpg);} #conservation-slide3{ background-image:url(../img/bg03.jpg);} .conservation-cta-section > .row{ display:flex; align-items:stretch;} .conservation-cta-section .left-side{ display:flex; align-items:stretch; margin-right:-8.33%;} .conservation-cta-section .right-side{ display:flex; align-items:stretch; padding-top:4rem; padding-bottom:4rem; } .conservation-text{border-radius:0.33rem; background-color:#E6E4DB; padding:1.5rem;} .conservation-cta{ margin-left:calc((1170px - 100vw)/2 - 15px); padding:2rem 20%; border-radius:0 0.33rem 0.33rem 0; overflow:hidden; width:calc(100% + (100vw - 1170px)/2 + 3rem); display:flex; align-items:center; justify-content:center; text-align:center; background: url(../img/bg03.jpg) center; background-size:cover; color:white; } .initiatives-list .item{border:1px solid #E6E4DB; border-radius:0.33rem; overflow:hidden; display:flex; flex-direction:column;} .initiatives-list .item-image{flex:0 0 auto; position:static;} .initiatives-list .item-image img{width:100%; max-width:100%;} .initiatives-list .item-info{padding:0.5rem 1rem 1rem 1rem; flex-grow:1;} .initiatives-list .item-info .textbox{margin-bottom:0;} .initiatives-list .item-info:before{ content:''; display:block; position:absolute; left:0; bottom:100%; width:100%; height:2rem; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .initiatives-list .item-name{margin-bottom:0; color:#2B3947;} .initiatives-list [class*='color-overlay-']{ z-index:2; opacity:0; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} .initiatives-list .overlay-info{ opacity:0; position:absolute; left:0; top:100%; bottom:0; display:flex; align-items:center; justify-content:center; z-index:2; width:100%; background-color:#28B493; color:white; text-align:center; padding:1rem; transition:opacity 0.2s ease, top 0.2s ease; -webkit-transition:opacity 0.2s ease, top 0.2s ease; } .initiatives-list .overlay-info:before{ content:''; display:block; position:absolute; left:0; width:100%; bottom:100%; height:2rem; background:url(../img/watercolor_edge_green.png) no-repeat bottom; background-size:100% auto;} .initiatives-list .item:hover [class*='color-overlay-']{opacity:1;} .initiatives-list .item:hover .overlay-info{opacity:1; top:0.4rem} #internal-header-section-conservation1{ background-image:url(../img/bg01.jpg);} .very-tall-header{padding-top:19rem; padding-bottom:19rem;} #full-bg-cta2{ background-image:url(../img/bg03.jpg);} /* ************************* */ /* ALBUMS */ /* ************************* */ .categories-selector{ text-align:center;;} .categories-selector .dropdown{ display:inline-block;} .categories-selector .dropdown .btn:focus{outline:0;} .categories-selector .dropdown .btn .fa{ transition:transform 0.7s ease; -webkit-transition:transform 0.7s ease; } .categories-selector .dropdown .btn[aria-expanded='true'] .fa{ transform:rotate(180deg); -webkit-transform:rotate(180deg);} .categories-selector .dropdown-menu{ min-width:100%; width:24rem; left:50%; padding:0.5rem 0; margin:0 0 0 -12rem; border:1px solid #E6E4DB; border-radius:0; background-color:#fff;} .categories-selector .dropdown-menu > li > a{padding:0.5rem 1rem; line-height:1.2; font-weight:400; white-space:normal;} .categories-selector .dropdown-menu > li > a{color:#445666; background-color:transparent;} .categories-selector .dropdown-menu > li > a:hover, .categories-selector .dropdown-menu > li > a:focus{color:#28B493; background-color:transparent;} .categories-selector .dropdown-menu > .active > a{color:#28B493; background-color:transparent;} .categories-selector .dropdown-menu > .active > a:hover, .categories-selector .dropdown-menu > .active > a:focus{color:#28B493; background-color:transparent;} .albums-list .item{border:1px solid #E6E4DB; border-radius:0.33rem; overflow:hidden; display:flex; flex-direction:column;} .albums-list .photos-count{ position:absolute; z-index:3; top:0; right:0; width:5.55rem; height:5.55rem; display:flex; flex-direction:column; text-align:center; justify-content:center; background-color:#F69E04; color:white; font-family:'Argone'; text-transform:uppercase; border-bottom-left-radius:0.33rem;} .albums-list .photos-count span+span{ font-size:2rem; line-height:1;} .albums-list .photos-count .fa{color:rgba(43,57,71,0.39); margin-bottom:0.8rem;} .albums-list .item-image{flex:0 0 auto; position:static;} .albums-list .item-image img{width:100%; max-width:100%;} .albums-list .item-info{padding:0.5rem 1rem 1rem 1rem; flex-grow:1;} .albums-list .item-info .textbox{margin-bottom:0;} .albums-list .item-info:before{ content:''; display:block; position:absolute; left:0; bottom:100%; width:100%; height:2rem; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .albums-list .item-name{margin-bottom:0; color:#2B3947;} .albums-list [class*='color-overlay-']{ z-index:2; opacity:0; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} .albums-list .overlay-info{ opacity:0; position:absolute; left:0; top:100%; bottom:0; display:flex; align-items:center; justify-content:center; z-index:2; width:100%; background-color:#28B493; color:white; text-align:center; padding:1rem; transition:opacity 0.2s ease, top 0.2s ease; -webkit-transition:opacity 0.2s ease, top 0.2s ease; } .albums-list .overlay-info:before{ content:''; display:block; position:absolute; left:0; width:100%; bottom:100%; height:2rem; background:url(../img/watercolor_edge_green.png) no-repeat bottom; background-size:100% auto;} .albums-list .area-link{ z-index:4;} .albums-list .item:hover .overlay-info{top:0.4rem; opacity:1;} .albums-list .item:hover [class*='color-overlay-']{opacity:1;} .showing{margin-bottom:1rem; margin-top:-2rem;} /* ************************* */ /* GALLERY */ /* ************************* */ .images-list .item-image{border-radius:0.33rem; overflow:hidden;} .images-list .item-image img{width:100%; max-width:100%;} .images-list .hover-overlay{ opacity:0; background-color:rgba(43,57,71,0.7); display:flex; align-items:center; justify-content:center; color:white; transition:opacity 0.2s ease; -webkit-transition:opacity 0.2s ease;} .images-list .item:hover .hover-overlay{opacity:1;} .modal-dialog{width:54rem;} .modal-content{overflow:hidden; border:0; } .modal-body{padding:0;} .modal-body .slider_spin{ text-align:center; margin:10rem auto; display:none;} .gallery-slider .item-image{border-radius:0.33rem 0.33rem 0 0; overflow:hidden;} .gallery-slider .item-image img{width:100%; max-width:100%;} .gallery-slider .item-image iframe{height:calc(54rem/1.77); display:block;} .gallery-slider .item-text{padding:1.5rem 2rem;} .gallery-slider .item-text:before{ content:''; display:block; position:absolute; bottom:100%; left:0; width:100%; height:2rem; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .gallery-slider .item-title{color:#2B3947; margin-bottom:0.5rem;} .gallery-slider .slick-arrow{opacity:1; z-index:2; position:absolute; width:2.77rem; height:2.77rem; top:40%; background:#28B493; color:white; border:0; border-radius:50%; overflow:hidden; padding:0; transition:background 0.2s ease; -webkit-transition:background 0.2s ease; box-shadow: 0 2px 4px rgba(0,0,0,0.5);} .gallery-slider .slick-arrow:hover{ background:#229A7E;} .gallery-slider .slick-arrow.slick-disabled{ opacity:0.1; cursor:default; } .gallery-slider .slick-prev{left:2rem;} .gallery-slider .slick-next{right:2rem;} .gallery-slider .slick-dots{position:absolute; display:block; padding:0; margin:0; left:0; right:0; bottom:auto; top:1rem; list-style-type:none; text-align:center;} .gallery-slider .slick-dots li{width:20px; height:20px; border:5px solid rgba(0,0,0,0.4); border-radius:50%; display:inline-block;} .gallery-slider .slick-dots .slick-active{border-color:rgba(0,0,0,1);} .gallery-slider .slick-dots li+li{margin-top:0; margin-left:1rem;} .gallery-slider .slick-dots li button{ display:block;border:0; background:#fff; color:transparent; overflow:hidden; width:10px; height:10px; border-radius:50%; padding:0; line-height:1rem; transition:background 0.2s ease, border 0.2s ease; -webkit-transition:background 0.2s ease, border 0.2s ease;} .gallery-slider .slick-dots li button:hover{ background:rgba(255,255,255,1);} .gallery-slider .slick-dots .slick-active button, .gallery-slider .slick-dots .slick-active button:hover{background:#28B493; cursor:default;} /* ************************* */ /* INTERACTIVE MAP */ /* ************************* */ .legend{margin-bottom:2rem; display:flex;} .legend .item{flex-grow:1; display:flex; align-items:center; color:#445666; border:1px solid #C9590B; padding:0.5rem; justify-content:center; } .legend .item+.item{margin-left:-1px;} .legend .item:first-child{border-top-left-radius:0.33rem; border-bottom-left-radius:0.33rem;} .legend .item:last-child{border-top-right-radius:0.33rem; border-bottom-right-radius:0.33rem;} .legend .item:hover{color:#229A7E;} .legend .fa{color:#C9590B; margin-right:0.5rem;} .legend .active, .legend .active:hover{ background-color:#C9590B; color:white;} .legend .active .fa{color:white;} .map-icon{ display:flex; align-items:center; justify-content:center; width:2rem; height:2rem; border-radius:50%; background-color:#C9590B; color:white; box-shadow: 0 2px 4px rgba(0,0,0,0.5);} .modal-image-wrap{border-radius:0.33rem 0.33rem 0 0; overflow:hidden;} .modal-image-wrap img{width:100%; max-width:100%;} .modal-text-wrap{padding:1.5rem 2rem;} .modal-text-wrap:before{ content:''; display:block; position:absolute; bottom:100%; left:0; width:100%; height:2rem; background:url(../img/bg-bottom-edge.png) no-repeat bottom; background-size:100% auto;} .modal-text-wrap .action-button{ text-align:right;} #interactive-map img{width:100%; max-width:100%;} #interactive-map-mobile-app {display:none;} #interactive-map-mobile-app img {width:100%;} /* ************************* */ /* CALENDAR */ /* ************************* */ #calendar_wrapper .dropdown-select .btn{height:1.85rem; font-size:0.8rem; white-space:nowrap; padding:0.25rem 2rem 0.25rem 2.5rem;} #calendar_wrapper .dropdown-select .btn .inner-wrap{ display:inline-block; width:100%; overflow:hidden; text-overflow:ellipsis;} #calendar_wrapper .dropdown-select .btn .fa{right:1rem; margin-top:-0.4rem;} #calendar_wrapper .dropdown-select .btn .color-mark{ margin-top:0.05rem;} #calendar_wrapper .has-marks .dropdown-menu > li > a{padding-left:2.5rem;}