* { 
	box-sizing: border-box; 
}

body { 
	background-color: #EAEAEA;
    color: #666666; 
	font-family: Arial, Helvetica, sans-serif;
}

#wrapper{
   background-image: radial-gradient(#FFFFFF, #90C7E3);
   border: 1px solid #000033;
   margin: auto;
   width: 80%;
   background-color: #90C7E3;
   min-width: 960px;
   max-width: 2048px;
   box-shadow: 3px #333333;
}


header { 
	background-color: #002171; 
	color: #FFFFFF; 
	height: 120px;
	margin: auto;
	padding-top: 30px;
	padding-left: 3em;
	text-align: center;
}

header a:link {
	color: #FFFFFF; 
}

header a:visited {
	color: #FFFFFF; 
}

header a:hover {
	color:#A52A2A; 
}

nav { 
	font-weight: bold;  
    font-size: 120%;
    padding: 1.5em;
    float:left;
	text-align: left;
	width: 160px;
}
	
nav a { 
	text-decoration: none; 
}

nav ul {
	list-style-type: none;
	margin-left: 0em ;
	padding-left: 0em;
	font-size: 1.2em;
}	

nav a:link { 
	color:#5C7FA3;
}

nav a:visited { 
	color:#344873;
}

nav a:hover { 
	color:#A52A2A;
}

main {
	background-color: #FFFFFF;
	margin-left: 190px;
	padding: 0px 0px 20px 20px;
	display: block;
	overflow: auto;
}

h1 { 
	font-size: 3em;
    letter-spacing: 0.25em;
    margin-bottom: 0; 
	margin-top: 0;
	font-family: Georgia, Times New Roman, serif; 
}

h2 { 
	color: #1976D2; 
	font-family: Georgia, Times New Roman, serif; 
	text-shadow: 1px 1px #CCCCCC;
	text-align: center;
}

h3 { 
	color: #000033; 
	font-family: Georgia, Times New Roman, serif; 
}

main ul { 
	list-style-image: url(marker.gif);
}

dt {
	color: #002171 
	text-align: center;
} 

dd { 
	color: #666666;
	text-align: center;
}

.resort { 
	color: #1976D2; 
	font-weight: bold; 
}

footer { 
	background-color: #FFFFFF;
	font-size: 75%; 
    font-family: Georgia, Times New Roman, serif;
    font-weight: bold; 
    font-style: italic;
	margin-left: 190px;
    text-align: center;
	padding: 2em;
}

contact id { 
	font-size: 90%; 
}

section { 
	float:left;
    padding-left: 2em;
	padding-right: 2em;
	width: 33%;
}

.column1 {
	width: 33%;
	padding: 0% 8% 8% 8%;
	text-align: center;
	float: left;
}

.column2 {
	width: 33%;
	padding: 0% 8% 8% 8%;
	text-align: center;
	float: left;
}

.column3 {
	width: 33%;
	padding: 0% 8% 8% 8%;
	text-align: center;
	float: left;
}

#homehero { 
	background-size: 100% 100%;
	height: 300px;
	margin-left: 190px;
    background-image: url("coast2.jpg");
    background-repeat: no-repeat;
}

#yurthero{
   background-size: 100% 100%;
   height: 300px;
   margin-left: 190px;
   background-image: url("yurt.jpg");
   background-repeat: no-repeat;
}

#trailhero{
   background-size: 100% 100%;
   height: 300px;
   margin-left: 190px;
   background-image: url("trail.jpg");
   background-repeat: no-repeat;
}




@media only screen and (max-width:37.5em){


nav {
	padding:0;
}

nav a {
	display:block;
}


nav li{ 
	display:block;
	margin:0;
    border-bottom: solid 2px #330000;
}

header{
	padding-top:1em;
}

main{
	padding-top:0.1em;
	padding-bottom:0.1em;
    padding-left:1em;
    padding-right:1em;
    font-size:90%;
}

h1{
	font-size:1.5em;
}


#homehero{display:none;
          height:auto;
 }

#yurthero{display:none;
          height:auto;
 }

#trailhero{
	display:none;
    height:auto;
 }

#mobile{
	display:inline;
}

#desktop{display:none;

}

@media only screen and (max-width:64em)
{

body{
	margin:0;
    background-color:#FFFFFF;
}

main{
	margin-left:0;
}

h1{
	font-size:1.5em;
}


#wrapper{
	min-width:0;
    width:auto;
    box-shadow:none;
}

nav{
	float:none;
    width:auto;
    text-align:center;
    padding:0.5em;
}

#homehero{
	margin:0;
    height:200px;
 }

#yurthero{
	margin:0;
    height:200px;
 }

#trailhero{
	margin:0;
    height:200px;
 }

#pathhero{
	margin:0;
    height:200px;
}


footer{
	margin:0;
}




}