html, body {
height:100%;
}

body {
background:#4ea4d9 url(images/body_bg.gif) repeat-x top;
}

* {
margin:0;
padding:0;
border:0;
font-family:"Trebuchet MS", verdana, arial, sans-serif;
list-style:none;
}

.clear {
clear:both;
margin-top:0;
height:1%;
width:100%;
overflow:hidden;
} 

#wrap {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -150px; /* the bottom margin is the negative value of the footer's height */
width:960px;
background:#f8edd9 url(images/wrap_bg.gif) repeat-y;
}

#footer {
height: 150px; /* .push must be the same height as .footer */
width:960px;
margin:auto;
background:#f8edd9 url(images/footer_bg.gif) no-repeat;
}

.push {
height:150px;
clear:both;
}

#header {
width:960px;
height:275px;
background:#4ea4d9 url(images/Yurt-and-beaver.png) no-repeat right;
}

h1 {
width:485px;
height:275px;
float:left;
}

#subHeader {
width:960px;
height:85px;
background:transparent url(images/subHeader_right.gif) no-repeat right;
}

#menuBox {
width:485px;
height:85px;
background:#f2eda0 url(images/menu_bg.gif) no-repeat;
}

#mainMenu {
width:390px;
height:80px;
position:relative;
margin-left:70px;
top:5px;
background:transparent none;
}



#mainMenu li {
float:left;
height:40px;
position:relative;
top:8px;
margin-left:2px;
margin-right:15px;
}

* html #mainMenu li {
margin-right:10px;
}

#mainMenu li a {
font-size:18px;
text-transform:uppercase;
color:#158cd6;
}

* html #mainMenu li a {
font-size:16px;
}

#mainMenu li a:hover {
text-decoration:none;
color:#444;
}

#mainMenu li#lowerMenu {
margin-left:15px;
/*
text-align:center;
width:390px;
margin:0;
padding:0;
*/
}

#content {
width:900px;
margin:auto;
}

#contentLeft {
width:470px;
float:left;
background:transparent none;
}

#contentRight {
width:410px;
margin-right:20px;
float:right;
background:transparent none;
}

* html #contentRight {
margin-right:10px;
}

/* MAIN FORM STYLES */

.mainForm {
width:400px;
padding:5px;
margin:10px auto;
}

.mainForm fieldset {
border:1px solid #aaa;
padding:5px;
margin-top:5px;
}

.mainForm legend, .submitButton {
font-size:18px;
color:#444;
border:1px solid #aaa;
padding:2px 5px;
margin:2px 5px 5px 5px;
background:#d4d93d;
}

.submitButton {
cursor:pointer;
}

.mainForm label {
font-size:14px;
text-transform:uppercase;
color:#158cd6;
letter-spacing:.7px;
font-weight:bold;
float:left;
width:150px;
text-align:right;
padding-top:3px;
}

.mainForm .inputField, .textField, .captchaField, .selectBox {
width:220px;
height:20px;
padding:1px;
border:1px solid #aaa;
color:#555;
float:left;
margin-bottom:10px;
margin-right:10px;
font-size:12px;
}

.mainForm .textField {
height:120px;
overflow:auto;
}

.mainForm label#removalForm {
width:430px;
display: block;
font-size:11px;
}

.mainForm .checkBox {
height:20px;
width:20px;
margin-right:25px;
float:right;
border:1px solid #282828;
text-align:center;
}

.mainForm .captchaField {
width:120px;
}

.mainForm .captchaBox {
width:90px;
height:35px;
float:right;
margin-right:10px;
}

.mainForm .selectBox {
width:60px;
}

.mainForm p {
margin:5px;
}

.errorList {
width:300px;
margin:5px auto;
}

.errorList li {
height:16px;
background:#f8edd9 url(images/errorList_marker.gif) no-repeat left top;
font-size:10px;
font-weight:bold;
color:#ff0000;
padding-left:17px;
}

/* STORY FORMATTING */

.storyBox {
width:450px;
margin:auto;
margin-top:10px;
height:225px;
background:#f2eda0;
border:1px solid;
border-color:#c1c62b;
/*-moz-border-radius:20px;*/
/* TINY SCROLL ADDITIONS*/
position:relative;
overflow:auto;
}

.storyContent {
position:absolute; 
width:225px; 
z-index:200;
}

ul.storyThumbs {
width:150px;
float:right;
/*height:225px;*/
background:transparent none;
margin-right:5px;
margin-left:10px;
}

.storyThumbs li {
width:65px;
height:65px;
margin:4px;
border:1px solid #ddd;
float:left;
background:white;
}

* html .storyThumbs li {
margin:2px;
}
.storyThumbs li img {
width:55px;
height:55px;
vertical-align:bottom;
margin:4px;
border:1px solid #aaa;
}

ul#yurtPhotos {
width:150px;
margin:0 10px;
float:right;
}

#yurtPhotos li {
width:150px;
height:150px;
margin-top:5px;
border:1px solid #F8EDD9;
}

#yurtPhotos li img {
vertical-align:bottom;
}

/* TINY SCROLL BAR */
#scroll {
position:relative; 
width:450px; 
height:225px; 
overflow:auto; 
margin:auto;
margin-top:10px;
background:#f2eda0;
border:1px solid #c1c62b;
-moz-border-radius:20px;
}

#scroll p {
margin:5px 10px;
}

#scrollcontent { position:absolute; width:260px; z-index:200 }

#scrollbar {
float:left; 
position:relative; 
margin-left:260px; 
display:none; 
width:10px; 
height:225px; 
z-index:100; 
background:transparent url(images/scroll-bg.gif);
}

.scroller {
position:absolute; 
top:0; 
width:10px; 
cursor:pointer; 
background-color:#c1c62b; 
background-image:url(images/scroll-arrows.gif); 
background-position:50% 50%; 
background-repeat:no-repeat;
}

.buttonclick {background-color:#d4d93d}

#phaseList {
width:460px;
height:460px;
margin:5px auto;
}

#phaseList li {
width:230px;
height:230px;
float:left;
}

#smallPhaseList {
width:400px;
height:400px;
margin:5px auto;
}

#smallPhaseList li {
width:200px;
height:200px;
float:left;
}

#phasePhotos {
width:420px;
margin:10px auto;
}


#phasePhotos li {
width:120px;
height:120px;
float:left;
margin:10px;
}

* html #phasePhotos li {
margin:5px;
}


#phasePhotos li img {
vertical-align:bottom;
border:1px solid #aaa;
}