@charset "UTF-8";
body{
font-family:Verdana, Geneva, sans-serif;
font-size:1.3rem;
line-height:1.2;
}
article {
width:960px; 
height:auto; 
background-color:whitesmoke;
position:relative;
}
article{
display:block;
width:90%;
margin:auto;
min-height:800px;
}
header{
height:65px;
color:lightblue;
text-align: center;
}
section{
padding:1%;
margin:1%;
float:left;
}
#a img{
float:left;
margin-right:3%;
margin-left:3%;
}
#img2{
margin-right:3%;
margin-left:3%;
}
#E1 image{
float:left;
}
#a{
width:44%;
background-color:white;
color:#8a6c59;
min-height: 500px;
}
#b{
width:44%;
background-color:#5f4532;
color:white;
min-height: 500px;
}
#c1{
 width:25%;
 color: black;
 float: left;
 text-align: center;
}
#c2{
 width:25%;
 color: black;
 float: left;
 text-align: center;
}
#c3{
 width:25%;
 color: black;
 float: left;
 text-align: center;
}
#d{
 float:left; 
 width:95%;
}
#E{
float: left;
height: 100px;
width:100%;
}
#E1{
width:100%;
float:left;
}
footer {
background-color:lightblue;
float: left;
width: 100%;
margin-bottom: 10px;
}
footer a{
    color: black;
}
#f1 {
   width:25%;
   color: black;
   float: left;
   text-align: center;
}
#f2 {
	width: 25%;
	color: black;
	float: left;
	text-align: center;
}
#f3 {
	width: 25%;
	color: black;
	float: left;
	text-align: center;
}
h6{color:#5f4532;
  text-align: center;
}
h5{color:#5f4532;
  text-align: center;
}
h4{color:white;
  text-align: left;
}
h3{color:whitesmoke;
}
h2{color:lightblue;
  text-align: right;
  margin:5%; 
}
h1{
font-family: 'Open Sans', sans-serif;
color:#5f4532;
}
.rightFrameBody{
   border-top:2px #5f4532 solid;
}

@media (min-width: 960px) {
    

    /*The following style rules are new*/


 /* Customize the look of the embedded native video */
video {
    width: 400px;
    padding: 15px;
    margin: 3%; 
    background-color:#8a6c59;
    border:2px white solid;
}
    
   .button {
    background-color: white;
    color:black;
    height:40px;
    border:1px Khaki solid;
    padding: 10px;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;  
    margin-left: 3%;
} 
.buttonMargin { 
    margin-right: 10px;
    margin-top: 40px;
}

.button2 { 
    width: 100px;
}

.button:hover {    
    background-color: #f6f0bb;
    cursor: pointer;
}
}
@media (max-width: 959px) {
 /*The following style rules are new*/

#a{
float:none; /*We are removing the float*/
width:95%; /*We are defining the width with a relative value*/
}
#b{
float:none; /*We are removing the float*/
width:95%; /*We are defining the width with a relative value*/
}
#c{
float: none;
    }
#d{
    float:none;
    }
#E{
float: left;
height: 230px;
width:100%;
line-height:1.2;
}
footer{
    background-color: lightblue;
    }
#f1{float:none;
    color:white;
    text-align: center;
    width: 95%;
    }
#f2{float:none;
    color:white;
    text-align: center;
    width: 95%;
    }
#f3{float:none;
    color:white;
    text-align: center;
    width: 95%;
    }
h1{
font-family: 'Architects Daughter', cursive;
font-size:1.1rem;
margin-top:-75px;
margin-left:150px;
line-height: .80;
}
video {
width: 95%;
padding: 15px;
margin: 3%; 
background-color:#8a6c59;
border:2px white solid;
}
    .button {
    background-color: white;
    color:black;
    height:40px;
    border:1px Khaki solid;
    padding: 10px;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;  
    margin-left: 3%;
} 
    .buttonMargin { 
    margin-right: 10px;
    margin-top: 40px;
}

.button2 { 
    width: 100px;
}

.button:hover {    
    background-color: #f6f0bb;
    cursor: pointer;
}
a{ 
font-size:1.5rem;
text-decoration:none; 
}   
}