/*
--------------------------------------------------------------------
63421f
bg gif matte = 392915
--------------------------------------------------------------------*/
@import url("reset.css");


/*
=structure
--------------------------------------------------------------------*/
body {
	background: url(../images/redbg.jpg) top center repeat #392915;
	font-family: Garamond, Georgia, "Times New Roman", Times, serif;
	font-size: 1em;
	text-align: center;
	padding-top: 40px;
}
#wrapper,
#header,
#footer{
	padding: 0 100px 0;
	width: 800px;
	margin: 0 auto 0;
	overflow: hidden;
	text-align: left;
}
#header {
	text-align: center;
	background: url(../images/header.png) left top no-repeat transparent;
}
#wrapper {
	/*background: url(../images/fill_bg.gif) left 120px repeat-y transparent;*/ /* merges okay with header & footer */
	background: url(../images/bg_fill.png) left bottom repeat-y transparent; /* merges great with footer, header varies */
	overflow: hidden;
}

#content{
	padding-top: 8px;
	overflow: hidden;
}
.inner{
	background: url(../images/structure/inner_bg.jpg) left top repeat transparent;
	padding: 0 15px;
	border-right: solid 1px #ccc;
	border-left: solid 1px #ccc;
}
.inner .top, .inner .btm{
	display: block;
	height: 15px;
	background-color: red;
	margin: 0 -15px;
	clear: both;
}
.inner .top{
	border-top: solid 1px #ccc;
	background: url(../images/structure/inner_top_bg.jpg) left top repeat-x transparent;
}
.inner .btm{
	background: url(../images/structure/inner_btm_bg.jpg) left bottom repeat-x transparent;
	border-bottom: solid 1px #ccc;
}


#footer {
	background: url(../images/footer.png) left bottom no-repeat transparent;
	height: 245px;
	padding-top: 10px;
	margin-bottom: 20px;
	clear: both;
	position: relative;
	overflow: hidden;
}

.main{
	float: left;
	position: relative;
	display: inline;
	width: 530px;
}
.side{
	float: right;
	display: inline;
	width: 240px;
}


/*
=typography, =base
--------------------------------------------------------------------*/
body{
	color: #392f17;
}
h1, h2, h3, h4, h5, h6 {
	/*color: #e07620;*/
	color: #c36a02;
	font-weight: normal;
	padding: 0 0 10px;
	text-transform: capitalize;
}
h1 {
	font-size: 28px;
	border-top: solid 1px #63421f;
	/*font-weight: bold;*/
	margin: 10px 0 10px;
	padding: 10px 0 0;
	letter-spacing: -.01em;
}
h2 { font-size: 27px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 {
	color: #584b2b;
	font-size: 14px;
	font-weight: bold;
	margin-top: 10px;
}

#westheader{
	background: url(../images/westheader.gif) left bottom no-repeat transparent;
	display: block;
	height: 35px;
	overflow: hidden;
	text-indent: -999em;
	margin-bottom: 0;
}
p {
	color: #392f17;
	font-size: 16px;
	padding: 0 0 1em;
	line-height: 21px;
}
ol, ul {
	margin: 0 0 1em;
}
li {
	/*font-size: .9em;*/
	line-height: 1.5em;
}
ol li, 
ul li {
	list-style-position: inside;
}
.il li {
	display: inline;
	margin-right: 1em;
	
}
#local ul li{
	list-style-type: disc;
}
ul li small{
	display: block;
	margin-bottom: 10px;
	font-size: 14px;
	line-height: 1.1em;
	margin-left: 16px;
}
.menu li{
	display: inline;
}
dl         { margin-bottom: 1em; }
dt         { font-weight: bold; }
dd         { font-style: italic; margin-bottom: .5em; }
b, strong  { font-weight: bold; }
i, em      { font-style: italic; }
u, del     {  }
del        { text-decoration: line-through; }
small      { }
big        { font-size: 1.2em; }
sup {
	position: relative;
	top:-.5em;
	font-size: .8em;
}
sub {
	position: relative;
	top: .4em;
	font-size: .8em;
}
blockquote {
	margin: 0 2em 1em;
	font-size: .8em;
}
code { 
	font-family:"Courier New", Courier, monospace;
	white-space: pre;
}


/*
=navigation
--------------------------------------------------------------------*/

/* global */
a {color: #5a4b35;}
a:link    {color: #5a4b35;}
a:visited {color: #302412;}
a:focus   {color: #302412;}
a:hover, a:active {color: #302412;}


/* primary */
#header .menu{
	background: url(../images/nav/bg.gif) left top repeat-x transparent;
	margin: 10px 0 0;
	display: block;
	height: 30px;
}
#header li{
	background: url(../images/nav/bullet.gif) left 9px no-repeat transparent;
	margin-left: 11px;
	padding-left: 20px;
	float: left;
	display: inline;
}
#header ul .first{
	background-image: none;
	margin-left: 37px;
	padding-left: 0;
}
#header li a{
	text-decoration: none;
	display: block;
	height: 30px;
	overflow: hidden;
	background-color: transparent;
	background-position: left -30px;
	background-repeat: no-repeat;
	text-indent: -999em;
}
.menu .home a    { width: 52px; background-image: url(../images/nav/home.gif); }
.menu .cabin a   { width: 141px; background-image: url(../images/nav/cabin.gif); }
.menu .fishing a { width: 75px; background-image: url(../images/nav/fishing.gif); }
.menu .shop a    { width: 49px; background-image: url(../images/nav/shop.gif); }
.menu .gallery a { width: 80px; background-image: url(../images/nav/gallery.gif); }
.menu .links a   { width: 56px; background-image: url(../images/nav/links.gif); }
.menu .local a   { width: 56px; background-image: url(../images/nav/local.gif); }
.menu .contact a { width: 81px; background-image: url(../images/nav/contact.gif); }

#header .menu li a:hover{ background-position: left top; }
#header .menu .current a,
#header .menu .current a:hover{ background-position: left bottom; }


/* Section menu */
.section_menu{
	padding-top: 18px;
	padding-left: 40px;
}
.section_menu li{
	display: inline;
	margin-left: 10px;
	padding-left: 10px;
	border-left: solid 1px #302412;
	padding-top: 3px;
}
.section_menu .first{
	margin-left: 0;
	padding-left: 0;
	border-style: none;
}
.section_menu li a{
	text-decoration: none;
	font-size: 17px;
	color: #db771d;
	text-transform: uppercase;
}


/* footer */
#footer{
	position: relative;
}
#footer a{
	text-decoration: none;
	font-size: 12px;
}
#footer ul{
	float: right;
}
#footer ul li{
	display: inline;
	border-left: solid 1px #302412;
	margin-left: 8px;
	padding-left: 10px;
}
#footer ul .first{
	border-style: none;
	margin-left: 0;
	padding-left: 0;
}
#footer #ocilink{
	position: absolute;
	text-align: center;
	bottom: 20px;
	width: 800px;
}
#footer #ocilink a{
	font-size: 14px;
}
/*
=images
--------------------------------------------------------------------*/
#logo{
	background: url(../images/moose-river-ranch.gif) left top no-repeat transparent;
	display: block;
	width: 552px;
	height: 70px;
	overflow: hidden;
	text-indent: -999em;
	margin: 50px auto 0 ;
}

img.left{
	float: left;
	margin-right: 10px;
}
img.right{
	float: right;
	margin-left: 10px;
}

#content img{
	background: url(../images/img_bg.gif) left top repeat transparent;
	padding: 3px;
}
/* remove image styles */
#slide img,
#content .inner img{
	padding: 0;
	background-image: none;
}

#webcam{
	height: 460px;
	overflow: hidden;
	position: relative;
}
#webcam img{
	position: relative;
	top: -20px;
	padding: 0;
	background-image: none;
}

.thumbs{
	float: left;
	display: block;
	width: 390px;
}

.thumbs ul{
	padding-top: 10px;
	float: left;
	clear: left;
	width: 380px;
	display: block;
}
.thumbs li{
	display: inline;
}

.thumbs li a{
	display: inline;
	margin-right: 10px;
}


/*
=forms
--------------------------------------------------------------------*/
label{
	display: block;
	font-weight: bold;
}
input,
textarea{
	background: url(../images/structure/inner_bg.jpg) left top repeat #faf8f3;
	font-family: Garamond, Georgia, "Times New Roman", Times, serif;
	border: double 3px #ddc485;
	padding: 5px;
	font-size: 16px;
	color: #63421f;
}

.button{
	background-image: none;
	padding: 0;
	border-style: none;
	background-color: transparent
}

.error input,
.error textarea{
	border-color: #a9241d;
}

#contact textarea{
	width: 514px;
}

.errormsg{
	background-color: #f1e66c;
	border: solid 2px #bfaf01;
	padding: 10px;
	font-weight: bold;
	margin-bottom: 15px;
}
.half input{
	width: 190px;
}
input:focus,
textarea:focus{
	border-color: #a6925e;
}

textarea{
	overflow: auto;
}
/*
=tools =global
--------------------------------------------------------------------*/
.clear { clear: both; }
.left  { float: left; }
.right { float: right; }
.hide  { display: none; }

.hr{
	background: url(../images/structure/hr.jpg) center center no-repeat transparent;
	display: block;
	clear: both;
	height: 30px;
	width: 780px;
	margin: 0 0 0 -5px;
}

.half{
	width: 50%;
}

/* ClearFix - http://www.webtoolkit.info/css-clearfix.html */
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix {
    display: inline-block;
}
html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}