*{box-sizing: border-box;}

body {background-color: #EAEAEA;
	color:#666666; 
	font-family: Arial, Helvetica, sans-serif; 
	}
	
	
#wrapper{	background-image: linear-gradient(to bottom, #FFFFFF, #90c7e3);
			background-repeat: no-repeat;
			background-color: #90c7e3;
			}
	
	
	
header {background-color: #002171;
color: #FFFFFF; 
text-align: center;}

header a{text-decoration: none;}

header a:link{color: #FFFFFF;}

header a:visited{color: #FFFFFF;}

header a:hover{color: #90c7e3;}



h1 { margin-bottom: 0;
	font-family: Georgia, "Times New Roman", serif;
	margin-top: 0;
	letter-spacing: .25em;
	padding-top: .5em;
	padding-bottom: .5em;}




nav {text-align: center;
	font-weight: bold;
	padding: 0;
	font-size: 120%;
	}
	
nav ul{list-style-type: none;
	margin: 0;
	padding-left: 0;
	font-size: 1.2em;}

nav a:link {color: #527fa3;}

nav a:visited{color: #344873;}

nav a:hover{color: #A52a2a;}

nav a { text-decoration: none; }

nav li { border-bottom: 1px solid #000033;}



main {background-color: #FFFFFF;
	padding: 1px 20px 20px 30px;
	display: block;
	overflow: auto;}


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


#contact { font-size: .90%; }



footer { text-align: center;
         font-style: italic;
         font-size: .75em;
		font-family: Georgia, "Times New Roman", serif;
			padding: 2em;
			background-color: #FFFFFF;
			}




#homehero {height: 300px;
			background-image: url(coast.jpg);
			background-size: 100% 100%;
			background-repeat: no-repeat;}

#yurthero {height: 300px;
			background-image: url(yurt.jpg);
			background-size: 100% 100%;
			background-repeat: no-repeat;}
			
#trailhero {height: 300px;
			background-image: url(trail.jpg);
			background-size: 100% 100%;
			background-repeat: no-repeat;}			


dt {color: #002171;}

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


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

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



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



@media (min-width: 600px) {
	
nav ul{display: flex;
		flex-flow: row nowrap;
justify-content: space-around;}

nav li {border-bottom: none;}

section {padding-left: 2em;
		  padding-right: 2em;}

.content main {display: grid;
                  grid-template-rows: auto;
                  grid-template-columns: 1fr 1fr 1fr; 
}
				  
h2         { grid-row: 1 / 2; grid-column: 1 / 5; }

section    { grid-row: 2 / 3; grid-column: auto; }

#special   { grid-row: auto; grid-column: 1 / 5; }

footer     { grid-row: auto; grid-column: 1 / 5; }

}


@media (min-width: 1024px) {
	
nav ul {display: flex;
		flex-flow: column;
		padding-top: 1em; }

nav {text-align:  left;
	 padding-left: 1em;}

#wrapper {margin: auto;
		width: 80%;
		border: 1px solid #000033;
		box-shadow: 1px 1px #000033;
		display: grid;
		grid-template-columns: 180px auto;
		grid-template-rows: auto;}


header {grid-row: 1/2; grid-column: 1/3;}
	
nav {grid-row: 2/5; grid-column: 1/2;}
	
div {grid-row: 2/3; grid-column: 2/3;}
	
main {grid-row: 3/4; grid-column: 2/3;}
	
footer {grid-row: 4/5; grid-column: 2/3;}
	
	

}