* { box-sizing: border-box; }
body { background-color: #EAEAEA;
color: #666666; font-family: Arial, Helvetica, sans-serif; }
header { color: #FFFFFF; background-color: #002171; text-align: center; }
h1 { margin-top: 0; margin-bottom: 0; font-family: Georgia, 'Times New Roman', serif;
letter-spacing: 0.25em; padding-top: 0.5em; padding-bottom: 0.5em; }
nav { font-weight: bold; padding: 0; font-size: 120%; text-align: center; }
nav a {text-decoration: none;
transition: color 3s ease-out; }
h2 { color: #1976D2; font-family: Georgia, 'Times New Roman', serif; text-shadow: 1px 1px #CCCCCC; }
h3 { color: #000033; font-family: Georgia, 'Times New Roman', serif; }
dt { color: #002171; }
.resort { color: #1976D2; font-weight: bold; }
nav ul { list-style-type: none; margin: 0; padding-left: 0; font-size: 1.2em; }
nav li { border: 1px solid #000033; }
nav a:link { color: #5C7FA3; }
nav a:visited { color: #344873; }
nav a:hover { color: #A52A2A; }
header a { text-decoration: none; }
header a:link { color: #FFFFFF; }
header a:visited { color: #FFFFFF; }
header a:hover { color: #90C7E3; }
main ul { list-style-image: url(marker.gif); }
footer { font-size: 75%; font-style: italic; text-align: center;
font-family: Georgia, 'Times New Roman', serif; padding: 2em; background-color: #FFFFFF; }
#contact { font-size: 90%; }
#wrapper { background-color: #90C7E3; background-image: linear-gradient(to bottom, #FFFFFF, #90C7E3);
background-repeat: no-repeat; }
main { background-color: #FFFFFF; padding: 1px 20px 20px 30px; display: block; overflow: auto; }
#homehero { height: 300px; background-image: url(coast2.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; }
form { display: flex;
flex-flow: column nowrap; }
input, textarea { margin-bottom: .5em; }
video, embed { float: right; padding-left: 20px; }
@media (min-width: 600px) {
nav ul { display: flex; flex-flow: row nowrap; justify-content: space-around; }
nav li { border: 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; }
form { width: 60%; display: grid; grid-gap: 1em;
  grid-template-rows: auto; grid-template-columns: 6em 1fr; }
input[ type="submit" ] { grid-column: 2 / 3; width: 9em; }
}
@media (min-width: 1024px) {
nav ul { display: flex; flex-direction: column; padding-top: 1em; }
nav { text-align: left; padding-left: 1em; }
#wrapper { margin-left: auto; margin-right: auto; width: 80%; border: 1px solid #000033;
box-shadow: 3px 3px 3px #333333; }
#wrapper { display: grid; grid-template-rows: auto; grid-template-columns: 180px 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; }
}
table { border: 2px; solid; #3399CC; border-collapse: collapse; }
th, td { padding: 0.5em; border: 2px solid #3399CC; }
td { text-align: center; }
.text { text-align: left; }
tr:nth-of-type(odd) { background-color: #F5FAFC; }
