/* body styles */

body {

background-color: #FFFFFF;

color: #666666;

font-family: Verdana, Arial, sans-serif;

background-image: url(images/background.jpg);

}

/* wrapper styles */

#wrapper {

background-color: #FFFFFF;

margin-left: auto;

margin-right: auto;

width: 80%;

min-width: 700px;

max-width: 1024px;

box-shadow: 3px 3px 3px #333;

}

/* header styles */

header {

background-color: #000033;

color: #FFFFFF;

font-family: Georgia, serif;

}

/* navigation styles */

nav {

font-weight: bold;

background-color: #90C7E3;

padding: 5px;

}

nav a{

text-decoration: none;

padding-right: 30px;

padding-left: 10px;

}

/* main styles */

main {

padding-left: 20px;

padding-right: 20px;

display: block;

}

/* bullet style list */

main ul{

list-style-image: url(images/marker.gif);

}

/* resort class set color and font weight */

.resort {

color: #3399CC;

font-weight: bold;

}

/* h1 styles */

h1 {

line-height: 200%;

background-image: url(images/sunset.jpg);

background-repeat: no-repeat;

background-position: right center;

padding-left: 20px;

height: 72px;

margin-bottom: 0;

}

/* h2 styles */

h2 {

padding-left: 20px;

color: #3399CC;

font-family: Georgia, serif;

}

/* h3 styles */

h3 {

color: #000033;

}

/* dt styles */

dt {

color: #000660;

font-weight: bold;

font-size:20px;

}

/* footer styles */

footer {

font-size: 0.70em;

font-style: italic;

text-align: center;

padding: 10px;

}

/* set the header image of each page index, yurts, activities */

#homehero {

height: 300px;

background-image: url(images/coasthero.jpg);

background-size: 100% 100%;

}

#yurthero {

height: 300px;

background-image: url(images/yurt.png);

background-size: 100% 100%;

}

#activities {

height: 300px;

background-image: url(images/activities.png);

background-size: 100% 100%;

}

#trailhero {

height: 300px;

background-image: url(images/trailhero.jpg);

background-size: 100% 100%;

}

/*Media query for mobile phones*/

@media only screen and (max-width:37.5em){

video,embed {float:right;padding:20px;}

nav {padding:0;}

nav a {display:block; text-decoration: none;border-bottom:solid 2px #330000;}

header{padding-top:1em;}

main{padding-top:0.1em;padding-bottom:0.1em;padding-left:1em;padding-right:1em;font-size:90%;}

h1{font-size:1.5em;}

#homehero{display:none;height:auto;}

#yurthero{display:none;height:auto;}

#trailhero{display:none;height:auto;}

#mobile{display:inline;}

#desktop{display:none;}

table{border:solid 1px #3399CC;width:80%;border-spacing:0;}

td,th{padding:5px;border:solid 1px #3399CC;}

td{text-align:center;}

.text{text-align:left;}

tr:nth-of-type(odd) {background-color: #F5FAFC;}

label{float:none;text-align:left;}

input[type="submit"]

{margin-left:0;}

#fade{width:100%;}

}

/*Media query for tablet devices*/

@media only screen and (max-width:64em){

body{margin:0;background-color:#FFFFFF;}

main{margin-left:0;}

#wrapper{min-width:0;width:auto;box-shadow:none;}

nav{float:none;width:auto;text-align:left;padding:0.5em;text-decoration: none;}

nav a{ display:block;margin-bottom:5px;border-bottom:solid 3px #330000;}

#homehero{margin:0;height:200px;}

#yurthero{margin:0;height:200px;}

#trailhero{margin:0;height:200px;}

#pathhero{margin:0;height:200px;}

footer{margin:0;}

}