/*----------------------------------------------------------*/
/* Equine Extra Care MAIN Cascading Style Sheet - main.css  */
/* Author: Steve Pettee, Glacier Web Creative */
/* www.GlacierWebCreative.com */
/*----------------------------------------------------------*/



/* General
------------------------------------------------------------*/
* {
    padding: 0; margin: 0;
    font-family: "Times New Roman";
    }
    
div#space30 {
     position: relative;
     width: 100%;
     height: 30px;
     }
     
span#underline {
     text-decoration: underline;
     }
    
ul {
     list-style: none;
     }
     
body {
     background-color: #fff8e2;
     }
     

#wrapper {
     width: 94%;
     min-width: 600px;
     max-width: 1000px;
     margin-left: 3%;
     margin-right: 3%;
     margin: 0 auto;
     margin-top: 30px;
     margin-bottom: 30px;
     font-size: 19px;
     background-color: #e4d8be;
     }     

    

    
    
/* Header
------------------------------------------------------------*/
div#header {
     width: 100%;
     height: 100%;
     }
     
div#header img#headerImage {
     position: relative;
     width: 100%;
     height: 100%;
     }
     

     


/* Navigation
------------------------------------------------------------*/
div#navigation {
     position: relative;
     width: 70%;
     height: 10px;
     margin: -60px 0 0 42%;
     
     }
     
div#navigation ul#navList {
     position: relative;
     width: 100%;
     height: 100%;
     } 
     
div#navigation ul#navList li{
     position: relative;
     float: left;
     }
     
div#navigation ul#navList li#index {width: 35%; margin-top: 0px;}   
   
div#navigation ul#navList li#servicesAndFees {width: 35%; margin-top: 0px;}

     
div#navigation ul#navList li a{
     display: block;
     color: #564237;
     font-size: 21px;
     font-style: italic;
     }     
     
div#navigation ul#navList li a:hover {
     display: block;
     color: #ffffff;
     
     }     
     
     

/* Content
-------------------------------------------------------------*/
div#content {
     width: 90%;
     margin: 0 auto;
     margin-top: 2%;
     margin-bottom: 3%;
     }

div#content p {
     margin: 0;
     color: #564237;     
     }

div#content img {
     display: block;
     width: 100%;
     }
     





/* Footer
-------------------------------------------------------------*/
div#footer {
     width: 90%;
     height: 40%;
     margin: 0 auto;
     background-color: #e4d8be; 
     }
     
div#footer img#aboveFooter {
     display: inline-block;
     width: 100%;
     height: 100%;
     }
     
div#footer span#copyright {
     display: inline-block;
     width: 30%;
     height: 70%;
     margin-left: 0%;
     margin-Bottom: 3%;
     color: #564237; 
     }
     
     
div#footer img#footerImage {
     display: inline-block;
     width: 35%;
     height: 100%;
     margin: 0 0% 0 15%;
     }     
     
     
/* change font size and wrapper size for 481-900 pixels screen
****************************************************************/
@media screen and (min-width: 750px) and (max-width: 900px) {
     div#navigation ul#navList li a, div#wrapper {
          font-size: 17px;
          }      
     }     
     
@media screen and (max-width: 749px) {
     div#navigation ul#navList li a, div#wrapper {     
          font-size: 15px;
          }
     }