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;
	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; }

@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;}

}