/*

   Woods Cabins Layout Style Sheet
   Author: Woods Cabins
   Date: 16/06/2018
   
   Filename:  layout.css
   Supporting Files: 

*/

/* Display HTML5 structural elements as blocks */

article, figure, figcaption, footer, header, section, nav, div {
   display: block;
}

/* Set the default page element styles */

body{
	  width:99%;
	  min-width: 800px;
      max-width: 1920px; 
	  font-family: Arial, Helvetica, sans-serif;
	  font-weight: normal;
	  line-height: 1.2em;
	  list-style: none;	
	  background-color: rgb(49,52,54);
	  clear:both;
}


/* Set the default page header element styles */

header {
	      border: 1px solid black;
	      background-color: gold;
	      padding:30px;
	      
	      
}

header h1{
	     color:black; 
	     text-align:center;
	     font-variant: small-caps;
	     font-size:4em; 
}




/* Set the default section styles */

section {
	border: 3px solid gold;
	border-radius:20px;
	display: block;
    width: 80%;
    margin-left:auto;
    margin-right:auto;
    margin-top:3%;
    margin-bottom:5%;
    padding:10px 30px 30px 30px;	
    background-color: white;
    }
    
 section h2{
    font-size:2.5em;
    line-height: 1.0em;
    text-align:center;
 }   


 section h3{
    font-size:1.5em;    
  }
 
 
 section figure img{ 
   display: block;
   margin: auto;
   border-radius:5px;
   border: 3px solid gold; 
 }

section figure figcaption {
   text-align: left;
   padding: 10px;
   font-weight: bold;
}
 
 
 /* Set the default main navigation element styles */

nav.horizontal ul {
	      list-style: none;	
          font-variant: small-caps;
          color:black;     
          margin: 0;
          padding: 0;
          background-color: gold;
          overflow: hidden;
          width:100%;
}

nav.horizontal li  {
	     text-align: center;
	     float:left;
	     width:33.33%;	     
}

nav.horizontal ul li a {
	      border: 1px solid black;
	      color:black;
	      text-decoration: none;
	      display: block;
	      padding:8px;     
}

nav.horizontal ul li:hover {
           color:black;
           background-color: white;     
}
 
 
/* Set the default footer element styles */

footer {	
    border: 1px solid black;
    background-color: gold;
    color:black;
    text-decoration: none;  
    font-size:.8em;
    text-align:center; 
    padding:10px;
    clear:both;
}   

footer address a {	
    color:black;
    text-decoration: none; 
    font-style:normal;  
    font-variant: small-caps;
    font-size:1.8em;
    padding:5px;
}  
      
footer p.phone  {
	font-size:1.8em;
	
}