body { color: #666666; background-color: #90C7E3; font-family: Arial, Verdana, sans-serif ; margin: 0; }
h1 { margin-bottom: 0; margin-top:0; font-family: Georgia, "Time New Roman", serif; font-size: 1.5em; }
header a { text-decoration: none; }
header a:link { color: #FFFFFF; }
header a:visited { color: #FFFFFF; }
header a:hover { color: #90C7E3; }
header { background-color: #002171; padding: 1em; color: #FFFFFF; text-align: center; }
nav a { text-decoration: none; }
nav a:link { color: #5C7FA3; }
nav a:visited { color: #344873; }
nav a:hover { color: #A52A2A; }
nav { background-color: #FFFFFF; text-align: center; font-size: 1.2em; }
nav ul {display: flex; margin: 0; padding-left: 0; list-style-type: none; flex-direction: column; }
nav li { padding-top: .5em; padding-bottom: .5em; padding-right: 1em; padding-left: 1em; width: 100%; border-bottom: solid 1px; }
h2 { color: #1976D2; font-family: Georgia, "Time New Roman", serif; }
h3 { font-family: Georgia, "Times New Roman", serif; }
main { padding-left: 1em; padding-right: 1em; padding-top: 0; padding-bottom: 0; }
#homehero { background-image: url(coast.jpg); background-repeat: no-repeat; background-size: 200% 100%; height: 300px; }
#yurthero { background-image: url(yurt.jpg); background-repeat: no-repeat; background-size: 200% 100%; height: 300px; }
#trailhero { background-image: url(trail.jpg); background-repeat: no-repeat; background-size: 200% 100%; height: 300px; }
#reshero { background-image: url(coast.jpg); background-repeat: no-repeat; background-size: 200% 100%; height: 300px; }
#shophero { background-image: url(sunset.jpg); background-repeat: no-repeat; background-size 200% 100%; height: 300px; }
.shop { margin: 1em; background-color: #F4F4F4; }
. shop img { float: right; padding: 1em; }
.shop form { clear:right; }
*{ box-sizing: border-box; }
dt { color: #002171; font-weight: bold; }
.resort { color: #1976D2; font-size: 1.2em; }
#wrapper { background-color: #FFFFFF; margin: auto; }
section { padding-left: .5em; padding-right: .5em; }
footer { background-color: #FFFFFF; font-size: small; font-style: italic; text-align: center; padding: 1em; }
#mobile { display: inline; }
#desktop {display: none; }
table { margin: auto; border: 1px solid #3399CC; width: 90%, border-collapse: collapse; }
td { padding: .5em; border: 1px solid #3399CC; text-align: center; }
th { padding: .5em; border 1px solid #3399CC; }
.text { text-align: left; }
tr: nth-of-type(even) { background-color: #DFEDF8 }
form { display: flex;
flex-direction: column;
padding-left: 1em;
width: 80% }
input, textarea { margin-bottom: .5em; }
@media(min-width:600px)
h1 { font-size: 2em; letter-spacing: .25em; }
nav ul { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-around; padding-right: 2em; }
nav li { width: 12em; border-bottom: none; }
section { padding-left: 2em; padding-right: 2em; }
#flow { display: flex; flex-direction: row; }
#mobile { display: none; }
#desktop { display: inline; }
#homehero { background-size: 100% 100%; }
#yurthero { background-size: 100% 100%; }
#trailhero { background-size: 100% 100%; }
#shophero { background-size: 100% 100%; }
form { width: 60%;
display: grid;
grid-gap: 1em;
grid-template-columns: 10em 1fr; }
input[type="submit"] {grid-column: 2/3; 
width: 9em; }
.reshero { background-size: 100% 100% }
@media(min-width: 1024px)
body { background-image: linear-gradient( to bottom, #FFFFFF 20%, #90C7E3 60%, #FFFFFF 100%); }
nav ul { padding-right: 10%; padding-left: 10%; }
#wrapper { margin: auto; width: 80%; }