@charset "UTF-8";

body{
    color: black;
    background-color: #a65638;
    font-family: Arial, sans-serif;
    line-height: 1.5;
    margin:0;   
}

h1{
    font-size:14pt;
    font-family:  Georgia, serif;

}
h2{
     font-family:  Georgia, serif;
}

p {
  line-height: 1.25; 
}
#wrapper{
    background-color:floralwhite;
	width: 100%;
	margin: 0px auto;
    position: relative;
}

#header {
background-color: floralwhite;
width: 80%;
padding: 0 0 20px 0;
height: 100px;
margin: 0 auto;
}

#logo {
background: floralwhite;
margin: auto;
float: left;
margin: 20px 10px 20px 10px;
background-size: 100%;
width: 182px;
height: 50px;
background-repeat: no-repeat;
}

#subtitle {
color: #a65638;
padding: 40px 10px 0px 20px;
}



#navigation {
width: 80%;
height: auto;
font-size: 20px;
font-family: Georgia, serif;
float: left;
padding: 38px 0 3px 0px;
    margin:0 auto;
}


#navigation ul{
    padding: 0 0 0 0;
}

.primarynav {
list-style-type: none;
display: inline-block;
line-height: 30px;
width: 19%;
border-right: 0px solid #A65638;
height: auto;
float: left;
margin: 0 3px;
}

.primarynav a {
display: block;
float: left;
padding: 5px 0px;
color: white;
text-decoration: none;
border-bottom: none;
border-top: none;
width: 97%;
text-align: center;
background: #76ae68;
border-radius: 5px;
}

.current{
    background-color: #a65a3f !important;
    color: antiquewhite;
    
}

#navigation li a:hover { 
    color:white;
background-color:#a65a3f;
    transition: .5s ease;


}

.navbutton{
    display: none;
}
#nav{
    display: none;
}

#sub-navigation {
width: 20%;
border: 0px solid #daa520;
padding: 20px 0px 20px 0px;
height: auto;
margin: 20px 15px 16px 20px;
border-right: 1px solid yellowgreen;
}

#slider-container {

position: relative;
  display: inline-block;


}

##slider-container img{
    max-width: 100%;
    height: auto;
    margin:0 auto;
}
#sidewrapper{
    width: 34%;
border: 1px solid #daa520;
padding: 20 20 3 15;
height: auto;
}

.two-columnpagecontent{
   width: 63%;
float: left;
border: 0px solid black;
margin: 5px 5px 20px 20px;
padding: 3px 15px 3px 15px;
}

.two-columnpagecontent h4{
    color: #a65a3f;
    font-weight:bold;
}


#welcomebox {
position: absolute;
top: 20%;
left: 0;
width: 46%;
color: #a65638;
background-color: rgba(255, 255, 255, 0.8);
height: 52%;
}


#welcomebox2 {
padding: 0 30px 10px 30px;
font-size: 1.3vw;
}

#welcomeboxh2{
   padding: 20px 10px 5px 10px; 
    margin: 2px 0 0 0; 
    font-size: 3vw; 
    text-align: center;
    
}


#donatebox {
width: 40%;
height: auto;
background: #a65638;
color: white;
margin: 0 auto;
border-radius: 5px;
text-align: center;
font-size: 1.3vw;
padding: 15px 5px;
}

#donatebox:hover { 
    color:white;
background-color:#76ae68;
       transition: .5s ease;
    padding: 15px;
}



input{
    width: 70%;
}

fieldset{
        border-radius: 8px;
border: 2px solid #76ae68;

}
fieldset1{
    border: none;
}

#comment{
    
width: 90%;
height: 150px;
background: #a65a3f;
color: white;
    margin: 0 0 30px 0;
    font-size: 14pt;
}


#boxes {
display: flex;
flex-wrap: wrap;
width: 80%;
padding: 30px 150px 50px 150px;
background: #A65A3F;
margin: 0 auto;
}

.box {
margin: 3px 10px 30px 10px;
background-color: floralwhite;
color:#A65A3F;
width: 31.4%;
border-radius: 5px;
}

.box p{
     padding: 0px 10px 3px 10px;
}
.box h2 {
background: #A65A3F;
margin: 0 auto;
color: floralwhite;
text-align: center;
padding: 3px 10px 3px 10px;
font-size: 22pt;
}

.box img{
    max-width:100%;
    height:auto;
    padding:0;
    border-radius: 5px;
}


#skip-links {
       position: absolute;
       left: -10000px;
       top: auto;
       width: 1px;
height: 1px;
overflow: hidden;
}
#content {
	width: 100%;
	margin: 0 auto;
	padding: 0;
 
}
.pagecontent{
color: #a65a3f;
width: 80%;
margin: 0 auto;
}
.photo{
    width: 100%;
    height: auto;
}

.photo img{
float: left;
max-width: 45%;
margin: 20px 20px 20px 0;
border-radius: 8px;
}


#footer {
position: relative;
width: 90%;
height: auto;
margin: 0 0 0 0;
padding: 0 100px 0 50px;
font-size: 10pt;
background-color: #a65638;
color: floralwhite;
display: flex;
flex-wrap: wrap;
border-top: 1px solid;
}

.footerbox{
width: 24%;
height:auto;
border: 0px solid black;
float: left;
padding: 10px 0;
font-size: 10pt;
text-align: center;
display: inline;
}
.footerbox2 {
width: 100%;
height: auto;
border-top: 1px solid;
text-align: center;
font-size: 10pt;
background: #a65638;
padding: 5px 8px 10px 8px;
}


.media-icons {
width: 70%;
height: 60px;
margin: 0;
padding: 0 40px;
}

.media-icons img{
    width:25%;
    float:left;  

}
.footerbox p {
word-wrap: break-word;
margin: 15px 1px 0px 1px;
}

.links:hover{
font-weight: bold;

}

.subnavigation:hover{
    font-weight: bold;
}

.media-icons img:hover{
    background-color: floralwhite;
    border-radius: 50%;
}



@media screen and (max-width: 1326px){
#header {
background-color: floralwhite;
width: 80%;
padding: 0 0 20px 0;
height: 100px;
margin: 0 auto;

}
#navigation {
width: 100%;
height: auto;
font-size: 20px;
font-family: Georgia, serif;
float: left;
padding: 5px 0 15px 0;
margin: 0 auto;
}
    
.primarynav {
list-style-type: none;
display: inline-block;
line-height: 30px;
width: 19%;
border-right: 0px solid #A65638;
height: auto;
float: left;
margin: 0 3px;
}
    
#logo {
background: floralwhite;
margin: auto;
float: left;
margin: 20px 10px;
background-size: 100%;
width: 182px;
height: 50px;
background-repeat: no-repeat;
}

#boxes {
display: flex;
flex-wrap: wrap;
width: 92%;
padding: 30px 73px 60px 50px;
background: #A65A3F;
margin: 0 auto;
}
    .box {
margin: 3px 10px 30px 10px;
background-color: floralwhite;
color: #A65A3F;
width: 31%;
border-radius: 5px;
}
    #donatebox {
width: 40%;
height: auto;
background: #a65638;
color: white;
margin: 0 auto;
border-radius: 5px;
text-align: center;
font-size: 12pt;
padding: 10px 5px;
}
    
#welcomebox {
position: absolute;
top: 20%;
left: 0;
width: 46%;
color: #a65638;
background-color: rgba(255, 255, 255, 0.8);
height: 57%;
}
 
    
    }  











@media screen and (max-width: 961px){
  #wrapper {
    width:100%;
    }  
    iframe {
width: 100%;
height: 200px;
margin: 0;
padding: 0;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #ccc;
overflow: hidden;
}

#logo {
background: floralwhite;
margin: auto;
float: left;
margin: 20px 2px 10px 10px;
background-size: 100%;
width: 182px;
height: 50px;
background-repeat: no-repeat;
}
    

   #navigation {
width: 100%;
height: auto;
font-size: 20px;
font-family: Georgia, serif;
float: left;
margin: 15px 0;
       padding: 0;
}
    .primarynav {
list-style-type: none;
display: inline-block;
line-height: 30px;
width: 18.5%;
border-right: 0px solid #A65638;
height: auto;
float: left;
margin: 0 3px;
font-size: 85%;
}
    #header {
background-color: floralwhite;
width: 90%;
padding: 0 0 20px 0;
height: 100px;
margin: 0 auto;
}
    
    
      #boxes {
display: flex;
flex-wrap: wrap;
width: 95%;
padding: 50px 25px 60px 25px;
background: #A65A3F;
}
 
    .box h2{
        font-size:16pt;
    }
    
   .box {
margin: 3px 10px 30px 10px;
background-color: floralwhite;
color: #A65A3F;
width: 29.5%;
border-radius: 5px;
}
            #welcomebox {
width: 90%;
color: #a65638;
background-color: floralwhite;
height: auto;
margin: 0 auto;
            position: relative;
}
    #welcomeboxh2 {
padding: 5px 10px 5px 10px;
margin: 2px 0 0 0;
font-size: 30pt;
text-align: center;
}
    #welcomebox2 {
padding: 0 30px 0px 30px;
font-size: 12pt;
}
    #donatebox {
width: 40%;
height: auto;
background: #a65638;
color: white;
border-radius: 5px;
text-align: center;
font-size: 14pt;
padding: 15px 5px;
margin: 30px auto;
font-weight: bold;
}
    #sub-navigation {
width: 50%;
border: 0px solid #daa520;
padding: 20px 20px 20px 20px;
height: auto;
margin: 20px 16px 16px 20px;
border-top: 1px solid yellowgreen;
        border-bottom: 1px solid yellowgreen;
        
}
    .two-columnpagecontent {
width: 90%;
float: left;
border: 0px solid black;
padding: 3px 15px 30px 15px;
margin: auto;
}


    
}

@media screen and (max-width:640px){
   
  #wrapper {
    width: 100%;
      height: auto;
    }
    #subtitle{
        display: none;
    }
 iframe {
width: 100%;
height: 200px;
margin: 0;
padding: 0;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #ccc;
overflow: hidden;
  }
 
   #boxes {
display: flex;
flex-wrap: wrap;
width: 95%;
padding: 50px 18px 60px 18px;
background: #A65A3F;
}
    
    .box{
        width: 92.5%;
        border: 0;
             padding: 0 8px 0 8px;
}
    #footer {
position: relative;
width: 100%;
height: auto;
font-size: 10pt;
background-color: #a65638;
color: floralwhite;
display: flex;
flex-wrap: wrap;
border-top: 1px solid;
        padding: 0 0 0 0;
        margin: 0 0 0 0;
}
    
    
.footerbox {
width: 100%;
height: 90;
border: 0.2px solid white;
padding: 10px 0;
}
    .media-icons {
width: 30%;
height: 38;
margin: auto;
padding: 0 50 5 50;
}
    .textbox{
        margin: 1 20 1 20;
width: 40%;
}
    

    #sub-navigation {
width: 50%;
border: 0px solid #daa520;
padding: 20px 20px 20px 20px;
height: auto;
margin: 20px 16px 16px 20px;
border-top: 1px solid yellowgreen;
        border-bottom: 1px solid yellowgreen;
        
}
    .two-columnpagecontent {
width: 90%;
float: left;
border: 0px solid black;
padding: 3px 15px 30px 15px;
margin: auto;
}

.navbutton{
    font-size: 3em;
color: #FFFFFF;
    display: block;
margin: 0px;
padding: 0px;
text-align: center;
background-color: yellowgreen;
float: right;
width: 85px;
position: absolute;
right: 20px;
top: 20px;
z-index: 999;
border-width: 0px;
height: 70px;
    cursor: pointer;

}
    #navigation {
width: 93%;
height: auto;
font-size: 20px;
font-family: Georgia, serif;
float: left;
margin: 15px 0 15px 10px;
}


    .primarynav{
list-style-type: none;
display: inline-block;
line-height: 30px;
width:100%;
border: 0px solid #daa520;
height: auto;
    flex:1;
    display: flex;
    justify-content: space-between;
}
    .primarynav a {
display: block;
float: left;
padding: 5px 0px;
color: white;
text-decoration: none;
border-bottom: 1px solid floralwhite;
border-top: none;
width: 97%;
text-align: center;
background: #76ae68;
border-radius: 5px;
}
    
    #navigation ul{
        display: none;
    }
    
    #nav:checked + #navigation ul{
        display: block;
    }
    #navigation li a:hover { 
        border: 1px solid #DBEDB5;
}


    .box img{
        padding: 10px 0 2px 0;

    }
  .photo img {
float: left;
max-width: 90%;
margin: 20px 20px 20px 0;
border-radius: 8px;
}
}