header, main, nav, footer, figure, figcaption { display: block; }
body { background-color: #4F6D93;
      color: #666666;
	  font-family: Arial, Helvetica, sans-serif;
	    background-image: linear-gradient(to bottom, #FFFFFF, #4F6D93);
	  background-repeat: no-repeat;
}
label
{
    float: left;
    display: block;
    text-align: right;
    width: 120px;
    padding-right: 10px;
}
input, textarea
{
    display: block;
    margin-bottom: 20px;
}
input[submit]
{
    margin-left: 130px;
}
#wrapper { width: 80%;
           margin-left: auto;
		   margin-right: auto;
		   background-color: #90C7E3; 
		   min-width: 960px;
		   max-width: 2048px;
		   box-shadow: 3px 3px 3px #333333;
}
header { background-color: #000033;
       color: #FFFFFF;
	   background-image: url(sunset.webp);
	   background-position: right;
	   background-repeat: no-repeat;
	   text-align: center;
	   height: 60px;
	   padding-top: 15px;
}
h1 { margin-bottom: 0;
    margin-top: 0;
    font-family: Georgia, "Times New Roman", serif;
	letter-spacing: 5px;
} 
nav { float: left;
     width: 160px;
     font-weight: bold; 
	 padding: 20px;
}
nav ul { list-style-type: none;
       margin: 0;
	   padding-left: 0;
	   font-size: 1.2em;
}
nav a { text-decoration: none; }

nav a:link { color: #000033; }
nav a:visited { color: #000033; }
nav a:hover { color: #FFFFFF; }

main { padding: 1px 20px 20px 30px; 
      display: block;
	  background-color: #FFFFFF;
	  margin-left: 190px;
}
h2 { color: #3399CC;
	font-family: Georgia, "Times New Roman", serif;
	text-shadow: 1px 1px 1px #ccc;
}
h3 { color: #000033;
	font-family: Georgia, "Times New Roman", serif;
}
dt { color: #000033; 
}
.resort { color: #5C7FA3; 
          font-weight: bold;
}	
main ul { list-style-image: url(marker.webm);
}   
#contact { font-size: 90%; }

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

#homehero { background-image: url(coasthero.webp);
           height: 300px;
		   background-repeat: no-repeat;
		   background-size: 100% 100%;
		   margin-left: 190px;
}
#yurthero { background-image: url(yurthero.webp);
           height: 300px;
		   background-repeat: no-repeat;
		   background-size: 100% 100%;
		   margin-left: 190px;
}
#trailhero { background-image: url(trailhero.webp);
           height: 300px;
		   background-repeat: no-repeat;
		   background-size: 100% 100%;
		   margin-left: 190px;
}
#mobile { display: none; }
#desktop { display: inline; }
table { border: 1px solid #3399CC;
      width: 80%;
	  border-spacing: 0;
}
td, th { padding: 5px;
       border: 1px solid #3399CC;
}
td { text-align: center; }
.text { text-align: left; }
tr:nth-of-type(odd) { background-color: #F5FAFC; }

@media only screen and (max-width: 64em) {
	body  { margin: 0;
	       background-color: #FFFFFF;
	}
	#wrapper { min-width: 0;
	           width: auto;
			   box-shadow: none;
	}
	#homehero, #yurthero, #trailhero { margin-left: 0;
	            height: 200px; 
	}
	main { margin-left: 0; }
	nav { float: none;
	     width: auto;
		 padding: .5em;
		 text-align: center;
	}
	nav li { display: inline;
	      padding: 0.25em 0.75em;
	
	}
	footer { margin-left: 0; }
}
@media only screen and (max-width: 37.5em) {
   main { padding: 0.1em 1em;
		 font-size: 90%;
	}
	header { padding-top: 1em; 
	}
	h1 { font-size: 1.5em;
    }
	nav { padding: 0; }
	nav li { display: block;
	       margin: 0;
		   border-bottom: 2px solid #330000; 
	}
	nav a { display: block; }
	#homehero, #yurthero, #trailhero { background-image: none; height: 0; }
	#mobile { display: inline; }
	#desktop { display: none; }
  }
label
{
    float: none;
    text-align: left;
}
input[submit]
{
    margin-left: 0;
}