*{box-sizing: border-box;}
body {background-color:#EAEAEA;
color: #666666;
font-family: Arial;}
header {background-image: coast2.jpg;
text-align: center;
}
h1 {background-color:#002171;
color:#FFFFFF;
margin-top:0;
background-image:url(sunset.jpg);
background-position: center;
background-repeat: no repeat;
line-height: 400%;
text-align: center;
font-family: Georgia, Times New Roman, serif;
letter-spacing: .25em;
padding-top: 0.5em;
padding-bottom: .5em;}
nav {
font-weight: bold;
padding: 0;
font-size: 120%;
}
nav a {text-decoration: none;
width: 160px; }
main {padding-top: 1px;
padding-right:20px;
padding-bottom: 20px;
padding-left: 30px;
background-color: #FFFFFF;
overflow: auto;}
h2 {color: #1976D2;
font-family: Georgia, Times New Roman, serif;
text-shadow: 1px #CCCCCC;}
main ul {list-style-type: disc;}
h3 {color: #000033; font-family: Georgia, Times New Roman, serif;}
dt {color: #002171;}
#contactid {font-size: 90%;}
.resort {color: #1976D2; font-weight:bold;}
#wrapper {
background-color:#90C7E3;
background-image: linear-gradient(to bottom, #FFFFFF, #90C7E3 );
}
#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;
}
footer {font-size: 75%;
font-style: italic;
text-align: center;
padding: 2em;
background-color: #FFFFFF;}
nav ul {list-style-type: none;
margin: 0;
padding-left: 0;
font-size: 1.2em;}
nav link {color: #5C7FA3;
border-bottom: none;}
nav visited {color: #344873;}
nav hover { color: #A52A2A;}
header link visited { color: #FFFFFF;}
header hover {color: #90C7E3:}
section {padding-left: 2em;
padding-right: 2em;}
table {margin: auto; border: 2px solid #3399CC; border-collapse: collapse;}
td {padding: 0.5em; border: 2px solid #3399CC; text-align: center;}
th { padding: 0.5em; border: 2px solid #3399CC;}
.text {text-align: left;}
:nth-of-type(odd) {background-color: #F5FAFC;}
form {display: flex;
flex-flow: column nowrap;}
input, textarea{ margin-bottom: .5em;}
@media (min-width: 600px) {
form{ display: grid;
grid-template-rows: auto;
grid-template-columns: 6em 1fr;
grid-gap: 1em; gap:1em;width: 60%;
}
input type="submit"{
grid-column: 2/2;
width: 9em;}
nav ul { display: flex;
flex-wrap: nowrap;
flex-direction: row;
.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-direction: column;
padding-top: 1em; }
nav { text-align: left;
padding-left: 1em: }
#wrapper { margin: auto;
width: 80%;
border: #344873;
box-shadow: 1em;
display: grid;
grid-template-columns: 150px auto auto;
grid-template-rows: auto auto auto auto;
}
header { grid-row: 1/2; grid-column: 1/3;}
nav { grid-row: 2/3; grid-column: 1/2;}
main { grid-row: 2/3; grid-column: 2/3;}
footer { grid-row: 3/4; grid-column: 1/3;}