

header, main, nav, footer, figure, figcaption, aside, section, article {display:block;}
*{box-sizing: border-box;}
body {background-color: #FFFFFF;
color: #666666;
font-family: Ariel, Helvetica, sans-serif; }

h1 {background-color: #00B386;
color: #FFFFFF;

font-size:3em;
letter-spacing:0.25em;
margin-top:0;
margin-bottom:0;}

header {background-color: #00B386;
/*color: #FFFFFF; */
margin-bottom:0;
text-align: center;
height: 175px;
padding-top:30px;
padding-left:3em;}

#wrapper {margin: auto;
 width:80%;
 background-color: #0C5442;
 background-image: linear-gradient(to bottom, #FFFFFF, #0C5442);
 min-width: 600px;
 max-width: 2050px;
 box-shadow: 4px 4px 4px 4px #133926;
 border: 1.5px solid #003300;}
nav {
font-weight: bold;
padding: 1.5em;
font-size:120%;
float:left;
width:160px;}

nav ul {
  list-style: none;    
  margin: 0;            
  padding-left: 0;      
  font-size: 1.2em;}

nav a:link {color: #00664D;}

nav a:visited {color: #7A7A52;}

nav a:hover {color: #FFFFFF;}
h1, h2, h3 {font-family:Georgia, "Times New Roman", serif; }

main ul {list-style-image:url(marker.gif);}

footer {font-size:75%;
font-style: italic;
font-family: Georgia, "Times New Roman", serif;
text-align: center;
padding: 15px;
margin-left:190px;
background-color: #FFFFFF;
/*background-color: #FFFFFF;*/}

main {padding: 1px 20px 20px 30px;
 display: block;
 background:#FFFFFF;
 margin-left: 190px}
 
h2 {color: #00664D;
text-shadow: 1px 1px #CCCCCC;}

dt {color: #00664D;}

.barn {color: #70DBDB;
font-weight:bold;}

#heroHome {background-image: url(sunsetHorse.png);
height: 300px;
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left:190px;}

#heroBoard {background-image: url(fenceline.png);
height: 300px;
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left:190px;}

#heroTraining {background-image: url(BayBella.png);
height: 300px;
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left:190px; }

#contact { font-size: 90%; }
#mobile { display: none;}
#desktop { display:inline; }

table { border: 1px solid #003300;
		width: 80%;
		border-spacing: 0;
		border-collapse: collapse;
}
td,th { padding: 5px; 
border: 1px solid #3399CC; }
td {text-align: center; }
tr:nth-of-type(odd) { background-color: #ecf9ec;}

label { float:left; display: block; text-align: right; width: 125px;
padding-right: 2em; }
input, texxtarea {display: block; margin-bottom: 20px;}
input [type="submit"] {margin-left:135px; }


@media only screen and (max-width: 64em) { 
body{ margin: 0; background-color: #FFFFFF; }
#wrapper {min-width:0; width:auto; box-shadow: none; border:0; }
header {padding-top:0.5em; padding-bottom: 0.5em; padding-left:0; height:auto; }
h1 {letter-spacing:0.1em;}
main {margin-left:0; }
nav {float:none; width:auto; text-align:center; padding:0.5em;}
nav li {display:inline; padding: 0.25em 0.75em; }
#heroHome , #heroBoard , #heroTraining {margin-left:0; height:200px; }
footer {margin-left:0; }
}
@media only screen and (max-width: 37.5em) {
	main { padding: 0.1em 1em; font-size:90%;}
	h1 { font-size: 2em; }
	nav { padding: 0; }
	nav li { display:block;
	margin:0;
	border:solid 2px #330000; }
	nav a { display:block;}
	#heroHome , #heroBoard, #heroTraining {background-image: none; height:0;}
	#mobile {display:inline;}
	#desktop { display:none;}
	
}


