/* CSS Document */

html {
    font-size: 100%;
}

body, html{ height:100%; }

* { margin:0; padding:0; }

body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    font-size:16px;

    }  


h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    font-family: 'Work Sans', sans-serif;
    
}
h1 {
    font-size: 3em; 
    color:#000000;
    font-weight:300;
    padding-bottom:5px;
    margin-bottom:15px;
    line-height:.9em;

}
h2 {
    font-size: 2.75em; /* 36 */
    font-weight:bold;
    margin-bottom:5px;

}
h3 {
font-size: 1.5em;
font-weight: 800;
color: #000000;
padding-top: 15px;
padding-bottom: 5px;
}

h3:first-child{padding-top:0;}

h4 {
font-weight: 800;
font-size: 1.625em;
padding-top: 10px;
color: #1fad51;
padding-bottom: 15px;
}

h4:first-child{padding-top:0;}

h4.small {
    font-size:90%;

}
h5 {
        font-weight: 800;
font-size: 1.125em;
padding-top: 10px;

}
h6 {
    font-weight: 700;
font-size: 1em;
padding-top: 10px;
color: #006633;
padding-bottom: 0;
font-family: 'Lato';

}


p{
    color:#666666;
    font-family:'Lato', sans-serif;
    line-height:1.25em;
    padding-bottom:20px;
    font-size:16px;
}

p.legal{
    color:#155f36;
    font-style: italic;
}


}

a{ text-decoration:none; }


a:link{
    color:#1fad51;
    text-decoration: none;
    -webkit-transition: ease-in all .25s;
       -moz-transition: ease-in all .25s;
        -ms-transition: ease-in all .25s;
         -o-transition: ease-in all .25s;
            transition: ease-in all .25s;
}
a:hover{
    color:#1fad51;
    -webkit-transition: ease-out all .25s;
       -moz-transition: ease-out all .25s;
        -ms-transition: ease-out all .25s;
         -o-transition: ease-out all .25s;
            transition: ease-out all .25s;
}

.footer a{color:#ffffff;}

.fal, .far{color:#e89c09; padding-right:4px;}



.panel ul {
  list-style-type: disc;
padding-left: 30px;
}


.flex{ 
display: flex;
flex-direction: row;
flex-wrap: wrap;
float:left;
width:100%;
 }


.flex.gap{ gap:4%; }


/* 
=========================================================================

Responsive Needs 

=========================================================================
*/

img{
    max-width:100%;
    height:auto;

}


.slicknav_menu {display:none;}
.mobile-logo{ display:none;}


/* 
=========================================================================
Buttons 
=========================================================================
*/

a.btn{
padding: 10px 25px;
background: #1fad51;
margin-top: 21px;
display: inline-block;
font-family: 'Lato', sans-serif;
color: #ffffff;
font-weight: bold;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
text-transform: uppercase;
white-space: nowrap;
}

a.btn:hover{
color:#333333;
background:#18dd5d;
}



.slider-message a{
padding: 10px 15px;
background: #e89d23; /* For browsers that do not support gradients */
 background: -webkit-linear-gradient(left, #e89d23, #cccc64); /* For Safari 5.1 to 6.0 */
 background: -o-linear-gradient(left, #e89d23, #cccc64); /* For Opera 11.1 to 12.0 */
 background: -moz-linear-gradient(left, #e89d23, #cccc64); /* For Firefox 3.6 to 15 */
 background: linear-gradient(left, #e89d23, #cccc64); /* Standard syntax */
margin-top: 10px;
display: inline-block;
font-family:'Lato', sans-serif;
color:#ffffff;
font-weight:bold;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;

}

.slider-message a:hover{
color:#333333;
}







hr.divider{
width: 100%;
height: 20px;
background: -webkit-radial-gradient(50% 0%, 50% 10px, #aaa 0%, white 100%);
border: none;
margin: 0 auto;
max-width: 1200px;
padding:0;

}



/* 
=========================================================================
Padding 
=========================================================================
*/

.padtop, li.padtop{ padding-top:40px!important;}

.padbottom, p .padbottom{ padding:0 0 20px 0; margin-top:0;}

.nomargin{margin:0!important;}

.nopad{padding:0!important;}









/* HEADER
========================================================================================================== */


.header-logo{
    width: 200px;
position: absolute;

}

.header-logo img{



}

.header-logo img{width:90%; display:block; margin:0 auto; padding-top: 40px;}

#header{ 

-webkit-box-shadow: 0px -1px 28px 19px rgba(0,0,0,0.75);
-moz-box-shadow: 0px -1px 28px 19px rgba(0,0,0,0.75);
box-shadow: 0px -1px 28px 19px rgba(0,0,0,0.75);
    width:100%; background:url(../images/header-bg.webp) no-repeat; background-size:cover; z-index: 9000;
position: relative;}

/* NAVIGATION
============================================= */

#primary-nav{ 
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    padding:55px 0 0 0;
    margin-top:38px;
    font-weight:700;
    display: inline-block;
    float:right;
    position: relative;
z-index: 9000;
text-transform:uppercase;
color:#ffffff;
}


#primary-nav a{color:#ffffff;}
#primary-nav a:hover{color:#1fad51;}

ul#menu{

}

#primary-nav li{ display:inline;  }





/* HERO
========================================================================================================== */

.hero{display: inline-block;}

.hero-message{
width: 40%;
padding: 30px;
box-sizing: border-box;
position: relative;
align-content: center;
}

.hero-text{
width: 70%;
margin: 0 auto;
}


.flexslider{ 
    float: left;
    width: 60%; 
}


.reservations-block{
background: #e7e7e7;
width: 100%;
padding: 45px 0;
text-align: center;
margin-top:-3px;
z-index: 900;
position: relative;
}


.reservations-block h2{
    font-size: 2.25em;
font-weight: bold;
margin-bottom: 5px;
}

.reservations-block a{
position: absolute;
left: 50%;
transform: translateX(-50%);
padding: 19px 21px;
font-size: 18px;
}



/* PANEL
========================================================================================================== */


.gray-bg{ background:#e7e7e7; padding:20px 0; }


.intro{padding-bottom:30px;}


.panel{padding-top:50px; }

.box-text{padding-bottom: 50px; text-align: center;}
img.icon{ 
width: 80%;
display: block;
margin: 0px auto 10px auto;
max-width: 150px;
}

.panel h2{
color: #000000;
padding-bottom: 10px;
border-bottom: 1px solid #cfcfcf;
margin-bottom: 15px;
line-height: 1em;
font-weight: 300;
}



.happening-block { display:inline-block; width:100%; padding-bottom:20px; }


.happening-block a {color:#1d9b4b; text-transform:uppercase;  font-family: 'Work Sans', sans-serif; font-weight:bold;}


.happening-block img{ 
    display:block; 
    float:left; 
    width:55%; }


.happening-text{
width: 40%;
float: right;
padding:15px 0;
}


.happening-text h3{
padding-top: 0;
font-size: 1.3em;
padding-bottom: 10px;
}


.happening-text h4{
color: #0fad51;
font-weight: 900;
font-size: 1em;
padding-bottom: 5px;
text-transform: uppercase;
}


.friend-logo{ flex-basis:20%; }


.box-text a{
    text-decoration:none;
padding: 10px 15px;
background: #ffffff;
margin-top: 20px;
display: inline-block;
font-family:'Lato', sans-serif;
color:#999999;
font-weight:500;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border:1px solid #cccccc;
font-size:12px;
text-transform:uppercase;
    -webkit-transition: ease-out all .25s;
       -moz-transition: ease-out all .25s;
        -ms-transition: ease-out all .25s;
         -o-transition: ease-out all .25s;
            transition: ease-out all .25s;

}


.box-text a:hover{
color:#ffffff;
background:#025132;
    -webkit-transition: ease-out all .25s;
       -moz-transition: ease-out all .25s;
        -ms-transition: ease-out all .25s;
         -o-transition: ease-out all .25s;
            transition: ease-out all .25s;
}


.box a{ position: absolute;
        bottom: 0; 
        left: 50%;
    transform: translateX(-50%);
    display:table;
        }


.box {

    position: relative;
    
}




.hero-banner{ 
text-align: center;
background: #025132;
line-height: 0;
position: relative;
width: 100%;
min-height: 300px;
overflow: hidden;
display: block;
height: 40vh;
}


.hero-banner img{
object-fit: cover;
width: 100%;
height: 100%;
}


.board-member{width:100%; padding-bottom:40px; display:inline-block;}

.member-info {width:80%; float:right;}

.board-member img{ width:18%; float:left; display:block;}

.board-member h3, .panel.contact h3, .panel.bio h3 {color:#2d6661; padding-bottom:3px; font-size:26px;}
.board-member h4{padding-bottom:10px; padding-top:5px;}

p.phone, p.email{padding-bottom:4px;}

p.title{padding-bottom:10px; font-size:18px;}



.board-member.individual .member-info {width:70%; float:right;}

.board-member.individual img{ width:28%; float:left; display:block;}


.member-contact{ padding-bottom:20px;}
.member-contact p { color:#e89c09; padding:0; }




.panel li{
    color:#666666;
    font-family:'Lato', sans-serif;
    line-height:1.25em;
    padding:5px 0;
}

.panel li:first-child{padding-top:0;}



.affiliate{width:100%; padding-bottom:40px; display:inline-block;}

.affiliate-logo{width:20%; float:left; display:block; text-align:center;}

body#index .affiliate-logo{width:11%; float:left; }

.affiliate img{ max-width:100px; margin:0 auto;}

.affiliate-info {width:80%; float:right;}



.pdf-box{        width: 45%;
    padding: 1% 2%;
    display: inline-block;}

.pdf-link{width:18%; float:left;}
.pdf-text{width:80%; float:right;}



.block-pics{ padding:20px 0; }


.hours-block{ 
background: #1d9b4b;
text-align: center;
padding: 30px 0;
}
.hours-block h2{ color:#ffffff; }
.hours-block p{ padding:0; color:#ffffff; }



.happenings h3{
    padding-top:5px;
}

.happenings h4{
    font-weight: 700;
font-size: 1em;
padding-top: 10px;
color: #006633;
padding-bottom: 0;
font-family: 'Lato';
}

.news-box{
    flex-basis: 30%;
}




.field-layout p{padding:0; }

.staff h5{font-weight: 800;
font-size: 1em;
color: #1fad51;
padding-bottom: 15px;
padding-top:0;
}



/* footer
========================================================================================================== */

.footer{
    width: 100%;
background: url(../images/footer-bg.webp) bottom repeat-x;
background-size: contain;
min-height: 118px;
  position:sticky;
  top:100vh;
}


.footer .container .flex{ 
    justify-content: left;
align-items: center;
 }

.footer-logo{
    width: 20%;
}

.footer-logo.treefarm{
    width: 120px;
}

.footer-text{
width:70%;
padding-left:10px;
color: #000000!important;

}

.treefarm .footer-text p{font-weight: 900;}


.footer p{ color:#000000; font-weight:bold; padding-bottom:4px;}

.footer p.copyright{ color:#ffffff; font-weight:bold; padding-top:10px; font-size:12px;}

p.gray{color:#999999;}

span.bar{padding:0 10px; color:#000000;}

.footer .fal{color:#d9db78; padding-right:4px;}

.footer-email, .footer-phone{ display:inline-block; }


.treefarm{ width:70%; }

.sponsor{ width:30%;  }


.sponsor a{color:#2e5867;}



/* SURREAL
========================================================================================================== */

html.is-cms .flexslider ul.slides li[style]{ opacity:1!important; margin:0!important; float:none!important;}
















/* RESPONSIVE
========================================================================================================== */

@media (max-width: 1170px) {

#header{ display:none;}

.mobile-logo{ 
display: block;
position: absolute;
top: 20px;
z-index: 990;
left: 20px;
width: 140px;
}

.slicknav_menu{
display: block;
z-index: 980;
position:relative;
}

.slicknav_menu:before{
content: '';
height: 75px;
background: url(../images/header-bg.webp);
background-repeat: no-repeat;
background-position: 0 -8px;
width: 100%;
top: 0;
position: absolute;
}





} /*1170*/




@media (max-width: 960px) {

.hero-message{
width: 50%;
}


.flexslider{ 
    width: 50%; 
}



/* MOBILE BREAK */

@media (max-width: 860px) {

.box{ margin-bottom:40px; }
.friend-logo{ flex-basis:33.333%; }

} /*860*/




@media (max-width: 760px) {

.treefarm, .sponsor{ width:50%; }

} /*760*/


@media (max-width: 670px) {

body{font-size: 15px;}

.hero-message, .flexslider{
width: 100%;
}

.happening-block img, .happening-text{ 
    width:100%; }

.footer-text;{
width: 100%;
padding-left: 0;
color: #000000!important;
}

} /*670*/



@media (max-width: 540px) {

.friend-logo{ flex-basis:50%; }

.treefarm, .sponsor{ width:100%; }

.treefarm { text-align:center; }
.treefarm .footer-text{ padding:0; margin:0 auto; }
.treefarm .footer-logo{ width:80%; margin:0 auto; }

.sponsor{
margin-top: 20px;
padding-bottom: 20px;
padding-top: 20px;
border-top: 1px solid #ededed;
}

.sponsor .footer-text{
width: 80%;
box-sizing: border-box;
}

} /*540*/