/* Styles for the page-layout-2021.php pages */
/* CSS Document */

header#basic-page-header { display:block; margin:0 auto; width:100%; height:auto; max-height:800px; position:relative; overflow:hidden; }
header#basic-page-header > img { width:100%; height:auto; position:relative; z-index:-1; }
#basic-title { position:absolute; bottom:0; padding-left:50px; box-sizing:border-box; font-size:250%; text-transform:uppercase; z-index:2; height:92px; line-height:92px; vertical-align:middle; width:100%; }
.page-sections{ margin: 0 auto;}
.highlightsboxes , .full_width_text{ max-width: 1720px; margin:35px auto; padding:0; }
.highlightsboxes { display:flex; flex-wrap:wrap; }
.full_width_text:after, .highlightsboxes:after, .fancy-section:after, .interrupter:after, .page-sections:after{clear:both; content:''; display:block;}
span.price { float:right; }
.bigspace { padding-right:30px; }
.bigspacehead { padding-right:20px; }
.vertbar { width: 1px; height: 220px; position: absolute; right: 112px; top: 96px; display: block; background-color: #01aa9e; }

/*Basic Titles*/
#basic-title.support {background-color: rgba(119,157,80,.8);}
#basic-title.visit {background-color: rgba(1,170,158,.8);}




/*Contact Form Styles*/
.volunteer-contact-form .wpcf7-text {margin-right: 10px; margin-bottom:10px; padding: 10px; font-size: 18px; width: 500px;}
.volunteer-contact-form .wpcf7-textarea {width:500px}

/*Page Section Buttons*/
.page-sections.conservation .pointy-button a { background-color:#3da3ff; }
.page-sections.conservation .pointy-button a:hover { background-color:#1177a6; }

/*Interrupter*/
.interrupter-copy { float:left; max-width:800px; }
.interrupter-copy p { color:#000; font-size:150%; line-height:1.5; }
.interrupter.visit{padding: 37px 0;display: block;background-color: #ea942c;margin: 0 auto;}
.interrupter.multilink.visit { background-color:#01aa9e; }
.interrupter.multilink.visit .interrupter-button { margin-right:2px; }
.interrupter.multilink.visit .interrupter-button a { margin-right:20px; }
.interrupter.multilink.visit .interrupter-button a:last-of-type { margin-right:0; }
.interrupter.multilink.visit a.visit { border-color:#fff; border-width:2px; border-style:solid; }  
.interrupter.multilink.visit a.visit:hover { background-color:#ea942c; cursor:pointer; }  

/* disclaimers */
section#disclaimers { overflow:hidden; display:block; position:relative; margin:30px auto; padding:0 50px 0 50px; box-sizing:border-box; color:#716d6d; max-width:1920px; }
section#disclaimers h3 { font-size:135%; margin-top:30px; font-weight:600; }
section#disclaimers ul { list-style:disc; padding-left:30px; padding-top:15px; }
section#disclaimers ul li, section#disclaimers p { font-size:115%; line-height:115%; }


/* Full Width Text Sections */
.full_width_text { line-height: 1.3em; padding: 35px 18px 0 18px; color: #000000; max-width: 1720px;margin: 0 auto; box-sizing: border-box;}
.full_width_text p {font-size:150%; line-height: 37px; margin-bottom: 20px;}
.full_width_text p:last-of-type { margin-bottom:0; }
.full_width_text.conservation h2{color:#3da3ff;}
.full_width_text.education h2{color:#ea942c;}
.full_width_text.visit {text-align: center; max-width: 1350px;}
.full_width_text.visit h2{color:#01aa9e;}
.full_width_text.visit a:hover{color:#ea942c;}

/*Anchor Tag Right Chevron*/
.fancy-section .fancy-text a, .the-box h3 a { padding-right: 29px; position:relative; color:#000; margin-bottom:15px; }
fancy-section .fancy-text a:last-of-type, .full_width_text a:last-of-type, .the-box h3 a:last-of-type { margin-bottom:0; }
.fancy-text a:after, .the-box h3 a:after { position:absolute; right:0; top:0; content:"\f138"; font-family: "Font Awesome 5 Pro"; font-weight:normal; }
.fancy-section.color .fancy-text a { color:#fff; }
.fancy-section .fancy-text a:hover, .full_width_text a:hover, .the-box h3 a:hover { color:#ea942c; }

/* Fancy Sections */
.fancy-section.education.white h2{color:#ea942c;}
.full_width_text.support.text_header{color:green;}
.text_header { font-weight:700; margin-bottom:20px; }
.fancy-title { font-weight:700; margin-bottom:20px; }
.fancy-section.education.white { position:relative; width:100%; color:black; margin:0; box-sizing: border-box; }
.fancy-section.conservation.white { color:#000; }
.fancy-section { position:relative; width:100%; margin:0; box-sizing:border-box;}
.fancy-section.color {margin: 0 auto; padding: 8px 35px;display: inline-block;position: relative;box-sizing: border-box;}
.fancy-section.white .fancy-image { margin-top:40px; position:relative; float:right; width:30%; padding:0% 11%; }
.fancy-section.color.support { background-color:#779d50; }
.fancy-section.color.about { background-color:#1a776f; }
.fancy-section.color.events { background-color:#e64247; }
.fancy-section.color.education { background-color:#779d50; }
.fancy-section.color.visit { background-color:#01aa9e; }
.fancy-section.color.news { background-color:#1a776f; }
.fancy-section.color.conservation { background-color:#779d50; }
.fancy-section:after { clear:both; display:block; content:'';}
.fancy-section.image { background-repeat:no-repeat; background-position:100% 0; background-size:cover; }
.fancy-section.image .fancy-image {display:none;}
.fancy-section.color .fancy-text { color:#fff; font-size:145%; line-height:32px; width:50%; }
.fancy-section.color .fancy-image {position: relative;float: right;width: 30%;padding: 3% 10% 3% 10%;}
.fancy-section.white .fancy-image {margin-top: 40px; position: relative; float: right; width: 30%;}
.fancy-content {max-width:1720px; padding:5% 9%;}
.fancy-image img { width:100%; height:auto; }
.fancy-image iframe { width:100%; }
.fancy-image:after { clear:both; display:block; content:'';}
.fancy-section.conservation.white h2{ color:#3da3ff; }
.fancy-text.visit a{color:#fff;}
.fancy-text.visit a:hover{color:#ea942c;}
.fancy-text.conservation a:hover{color:#3da3ff;}

/* Interrupter Sections */
section.interrupter { padding:37px 0; display:block; margin:37px auto; }
section.interrupter h1 { display:inline-block; color:#fff; text-transform:uppercase; margin:0 auto; font-size:240%; font-weight:700; line-height: 1.5;  }
section.interrupter h1.conservation{color:#fff;}
section.interrupter.conservation { background-color:#3da3ff; margin:0; }
div.interrupter-button { margin:0 auto; display:block; float:right; position:relative; margin-right:31px;  }
div.interrupter-button a { height:62px; box-sizing:border-box; background-color:#3da3ff; display:inline-block; color:#fff; padding:15px 15px; text-transform:uppercase; font-weight:bold; font-size:200%; transition:ease all .5s; position:relative; }
div.interrupter-button a:hover { background-color:#0076a3; }
div.interrupter-button a.education { background-color:#ea942c; }
div.interrupter-button a.education:hover { background-color:#f16922; }
div.interrupter-button a.support { background-color:#779d50; }
div.interrupter-button a.support:hover { background-color:#385024; }
div.interrupter-button a.conservation { color:#3da3ff; background-color:#fff; }
div.interrupter-button a.conservation:hover { color:#fff; background-color:#1177a6; }
div.interrupter-button a.visit { background-color:#01aa9e; }
div.interrupter-button a.visit:hover { background-color:#007f76; }

/* Highlight Boxes */
.highlight-image img { position: absolute;left:50%; top:50%; height:auto; width:100%; transform: translate(-50%, -50%); transition:all ease .5s; }
.highlight-box{ width: 25%; display: flex; flex-direction:column; padding: 20px 15px;box-sizing: border-box;vertical-align: top; float: left;}
.highlight-box.three_column { width:33%; }
.highlight-image { width:100%; display: block;position: relative;overflow: hidden; margin-bottom:-2px; height:0; padding-top:60%; } /* Images are 60% height of the with */
.highlight-box:hover .highlight-image img { width:105%; }
.highlight-title { display:block; width:100%; background-color:#779d50; height:auto; transition:background .5s ease; }
.highlight-title p { display:block; position:relative; padding:4% 3%; vertical-align:middle; font-weight:bold;  text-transform:uppercase; }

.highlight-title.support{ background-color:#779d50;}
.highlight-title.conservation{ background-color:#3da3ff;}
.highlight-title.about{ background-color:#16aa9d;}
.highlight-title.visit{ background-color:#01aa9e; text-align:center;}
.highlight-title.education{ background-color:#ea942c;}
.highlight-title.events{ background-color:#0076a3;}
.highlight-title.news{ background-color:#8560a9;}


.highlight-box:hover .highlight-title { background-color:#779d50; }
.highlight-box:hover .highlight-title.visit{ background-color:#007f76;}
.highlight-box:hover .highlight-title.support{ background-color:#385024;}
.highlight-box:hover .highlight-title.conservation{ background-color:#1177a6;}
.highlight-box:hover .highlight-title.education{ background-color:#f16922;}
.highlight-box:hover .hl-teaser.support { border: 2px solid #385024;}
.highlight-box:hover .hl-teaser.conservation { border: 2px solid #1177a6;}
.highlight-box:hover .hl-teaser.education { border: 2px solid #f16922;}

.highlightlinks { color: white;font-size: 120%;font-weight: 700;padding: 10px 10px; margin-top: -2px;}
.highlightlinks a { text-decoration:none; color:#fff; transition:color .5s ease; }
.hl-teaser { color: #000;font-weight: 500;line-height: normal;width: 100%;display:flex; flex:1; margin: 0 auto;padding: 2% 10% 10% 2%; font-size: 125%; box-sizing: border-box;position: relative; border: 2px solid #779d50; min-height:225px; transition: all .5s ease; }
.hl-teaser p:hover{ color:#000;}
.hl-teaser a { display:inline; color:#000; text-transform:uppercase; text-decoration:none; position:absolute; bottom:2%; right:5%; transition:color .5s ease; font-size:80%; }
.hl-teaser a i.fa-chevron-right { transition:border .5s ease; padding: 3px 4px 3px 7px; font-size: .8em; vertical-align: top; }

/* Dual Boxes */
.box-section { width:100%; padding:0; margin:35px auto; position:relative; }
.box-section:after { clear:both; content:''; display:block; }
.box-section .innerwrap { display:flex; }
.the-box { width:45%; margin:0; border-width:2px; border-style:solid; border-color:#01aa9e; box-sizing:border-box; float:left; position:relative; } 
.the-box:first-of-type { margin-right:5%; }
.the-box:last-of-type { margin-left:5%; }
.box-title { display:block; background-color:#01aa9e; padding:15px; }
.box-title h2 { font-size:200%; font-weight:700; }
.box-content { line-height:1.5; color:#000; padding:10px 15px 20px 15px; font-weight:400; }
.box-content h3 { font-size:150%; font-weight:700; padding-top:20px; }
.box-content p { font-size:150%; }

/* Two Column CTA */
.two-col-contaier { margin:30px auto;}
div.adventureslist-title h3 { color:#779d50; text-transform:capitalize; display:block; width:100%; font-size:180%; font-weight:700; padding:10px 0 17px 0; }
div.adventureslist-left { display:inline-block; width:27%; max-width:330px; vertical-align:top; margin-top:3px;  }
div.adventureslist-left div.adventurelist-image { width:100%; max-width:330px; }
div.adventureslist-left div.adventurelist-image img { width:100%; height:auto; display:block; }
div.adventureslist-left div.viewadventure-button { width:100%; height:auto; max-width:330px; }
div.adventureslist-right { display:inline-block; width:71%; box-sizing:border-box; padding-left:20px; vertical-align:top; }
div.adventureslist-right p { padding:3px 0; margin:3px 0; line-height:125%; color:#000; font-size: 150%; }
div.adventureslist-right p:first-of-type { margin-top:0; padding-top:0; }
a.givingoption { width:100%; height:0; padding-bottom:17.58%; background-image:url('images/buttons/ways-to-give-button.png'); background-position:0 0; background-size:200%; background-repeat:no-repeat; display:block; font-size:0; }
div.adventureslist-left:hover a.givingoption { background-position:100% 0;}

/* Support Styles */
.hl-teaser.support { border: 2px solid #779d50; }
.full_width_text.support h2.text_header { color: #779d50; font-weight: 700; font-size: 200%; margin-bottom:20px; }
p.support{ color:black; }


/* Conservation Styles */
.full_width_text.conservation h2.text_header, .fancy-title.conservation h2 { font-weight: 700; margin-bottom:20px; }
#basic-title.conservation { background-color: rgba(1,150,216,.8); }
.fancy-text.conservation, .fancy-text.education{font-size: 145%;line-height: 37px;width: 45%;margin-bottom: 20px; }
.hl-teaser.conservation { border: 2px solid #3da3ff; }
/* End Conservation Styles */

/*Education Styles*/
#basic-title.education {background-color: rgba(234,148,44,.8);}
.interrupter.education{padding: 37px 0;display: block;margin: 32px auto; background-color: #779d50;}
.full_width_text.education h2.text_header{color:#ea942c; }
.hl-teaser.education { border: 2px solid #ea942c;}

/* End Conservation Styles */


section#sponsors { display:inline-block; width:100%; text-align:center; margin:0 auto 0 auto; background-color:#fff; }
/* jcarousel styles */
.jcarousel-wrapper { margin: 20px auto; position: relative; width: 80%; }
.jcarousel-wrapper p { font-size:120%; margin-bottom:20px; font-weight:400; line-height:1.1; }

/** Carousel **/
.jcarousel { position: relative; overflow: hidden; }
.jcarousel ul { width: 20000em; position: relative; list-style: none; margin: 0; padding: 0; }
.jcarousel li {     float: left;width: 236px;height: auto; margin: 7px; }
.jcarousel li a { display:block; max-height:202px; overflow:hidden; }
.jcarousel img { width:230px; height:202px; object-fit:contain; object-position:50% 25%; }
.jcarousel .loading { text-align: center; line-height: 90px; /* Fake vertical aligning */ }
.jcarousel ul:after { display:block; content:''; clear:both; }

/** Carousel Controls **/
.jcarousel-control-prev,.jcarousel-control-next { position: absolute; top: 125px; width: 30px; height: 30px; text-align: center; background: #4E443C; color: #fff; text-decoration: none; text-shadow: 0 0 1px #000; font: 24px/27px Arial, sans-serif; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; -webkit-box-shadow: 0 0 2px #999; -moz-box-shadow: 0 0 2px #999; box-shadow: 0 0 2px #999; }
.jcarousel-control-prev { left: -50px; } 
.jcarousel-control-next { right: -50px; }
.jcarousel-control-prev:hover span, .jcarousel-control-next:hover span { display: block; }
.jcarousel-control-prev.inactive, .jcarousel-control-next.inactive { opacity: .5; cursor: default; }

@media only screen and (max-width:1500px) { 
	.highlight-box{ width:33%; }
	.fancy-section.white .fancy-image { width:40%; }
}

@media only screen and (max-width:1100px) {
	.fancy-section.image { background-image: none!important; }
	.fancy-section.image .fancy-image { display:block; }
	.fancy-section.image .fancy-image img { width: 200%;height: auto;float: right;}
	.highlight-box { width:50%; float:left; margin-bottom:30px; }
	.fancy-text {font-size: 125%!important;line-height: 27px!important; margin-bottom: 20px!important;width:100%!important; color:#000;}
	.full_width_text p {font-size: 125%;line-height: 27px;margin: 20px 0;padding: 0;}
	.fancy-section.white .fancy-image, .fancy-section.color .fancy-image {position: relative; float:none;width: 100%;padding: 3% 6%;display: inline-block; box-sizing: border-box;}
	.fancy-title.conservation{color:#3da3ff;}
	.fancy-section.color h2{color:#fff;}
	.full_width_text.education h2.text_header, .text_header {line-height: 1.25!important;}
	.interrupter-copy { float:none; }
	div.interrupter-button { float:none; margin:20px auto 0 auto; text-align:left;  }
	.box-section .innerwrap { display:block; }
	.the-box { width:100%; border-width:2px; border-style:solid; border-color:#007f76; margin:0 auto 25px auto; float:none; } 
	.the-box:first-of-type, .the-box:last-of-type { margin-right:auto; margin-left:auto; }
	.the-box:last-of-type { margin-bottom:0; }
	.interrupter.multilink.visit .interrupter-button a { margin-bottom:15px; }

}


@media only screen and (max-width:768px) /** Tablet Layout **/ {
	body { background-attachment:scroll; }
	header#basic-page-header > img { width: 100%; display:block; height: auto;position: relative; z-index: -1;}
	#basic-title {position: relative !important; height:54px; line-height:50px; padding-left:30px; }
	.interrupter { padding:45px 30px }
	.highlight-box, .highlight-box.three_column { width:50%; max-width:430px; margin:auto; display:block; }
	.highlight-box:nth-child(odd) { padding-left:15px; }
	.highlight-box:nth-child(even) { padding-right:15px; }
	/*Conservation*/
	.fancy-text {font-size: 125%;line-height: 37px; margin-bottom: 20px;width:100%;}
	.fancy-title {font-size: 200%;font-weight: 700;margin-bottom: 20px;}
	.fancy-content{ margin-bottom:0;}
	.fancy-section.color.conservation {background-color: #698c3c;height: auto;}
	.fancy-section.color .fancy-text {color: #fff;font-size: 125%;line-height: 32px;width: 100%;}
	.text_header {font-size: 160%;font-weight: 700;margin-bottom: 20px; margin-top: 20px;}
	.full_width_text {font-size: 125%;padding: 0 30px;}
	.highlightsboxes, .full_width_text { margin: 20px auto; }
	.vertbar { height: 170px; right: 92px; top: 84px; }
}
@media only screen and (max-width:500px) /** Tablet Layout **/ {
	#basic-title {position: relative !important; height:50px; line-height:50px; }
	.highlight-box, .highlight-box.three_column { width:100%; max-width:430px; float:none; margin:auto; display:block; }
	.hl-teaser { min-height:0; }
	.fancy-image iframe { height:auto; }
	div.adventureslist-title h3 { padding-bottom:10px; }
	div.adventureslist-right { padding-left:10px; padding-right:10px; }
	div.adventureslist-left { width:100%; }
	div.adventureslist-right { width:100%; max-width:330px; }
	div.adventureslist-right p:first-of-type {margin-top: 10px;}
	/*Contact Form Styles*/
.volunteer-contact-form .wpcf7-text {width: 400px;}
.volunteer-contact-form .wpcf7-textarea {width:400px}

}