/* *************************************************************************************** 
   Version: 7/17/15
   Designed for screen size UVGA: 1024 x 768 px. Subtract 12 on each side for browser. 
   Pages centered 1000 px wide on full width dark green background.
   Body top offset: 0px. Page top offset: 10px; 
   Banner top offset: 10px; B1000 px wide and 80px high
   Content top offset: 90px; left offset: 200px; width: 800px.
   You Are Here top offset 90px; height: 22px.
   Page Heading top offset 112px; height: 31 px.
   Nav col on left 200 px wide. Content area 800 px wide. Content cols 380 px wide
   Margin between nav col and left content col 10 px. Margin between left and right
   content cols 20 px. Margin at right of right content col 10 px;
   Font for logo: Goudy Old Style, Bold.
   Colors: Dark Green = #595f23; Medium Green = #a2b964; 
           Dark Rust = #a45209; Light Rust = #cc6600; 
           Dark brown = #7c7062; Light Brown = #a8a28f
           Dark Blue = #356686; Light Blue = #93a4ae; Light Gray = #cccccc; 
   *************************************************************************************** */

/* DEFAULT PARAGRAPH ********************************************************************* */
p {
  margin: 0px; margin-bottom: 6px;
	padding: 0px; padding-right: 0px; padding-left: 0px;
	font-size: 1.0em; 
}

/* CONTAINERS **************************************************************************** */
body {
	width: auto; height: auto; 
	margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; padding: 0px; 	 
	background-color: #595f23; color: black; font-family: Arial, Helvetica, sans-serif; font-size: 13px;
}

div.page {
	position: relative; width: 1000px; height: auto;
	margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 10px; padding: 0px;
	background-color: #a2b964;; border-style: none;
}

div.banner {
	width: 1000px; height: 80px; 
	margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; padding: 0px;
	background-color: #a2b964;
}

div.col_nav {
  float: left; clear:none;
	width: 200px; height: auto;
	margin-left: 0px; background-color: #a2b964;
}

div.cont {
	width: 800px; height: auto; min-height: 650px; margin-left: 200px; padding-bottom: 10px; 
	background-color: white;
} 

div.col_cont_full_width {
  margin-top: 0px; margin-bottom: 0px; margin-left: 10px;
  width: 780px; height: auto; 
}

div.col_cont_left {
  float: left; 
  margin-top: 0px; margin-bottom: 10px; margin-left: 10px;
  width: 380px; height: auto; 
}

div.col_cont_right {
	margin-top: 0px; margin-right: 10px; margin-bottom: 10px; margin-left: 410px;
  width: 380px; height: auto; 
}

/* NAVIGATION COLUMN STUFF *************************************************************** */
div.menu_main {
	position: static; width: 180px; height: auto;
	margin-top: 10px; margin-left: 10px; padding-bottom: 10px;
	background-color: #595f23;
}
p.menu_main_head {
	position: static; width: 180px; height: auto;
	margin-bottom: 5px;
	padding-top: 5px; 
	color: white; text-align: center; font-weight:bold; font-size: 1.1em;
}
p.menu_main_item {
  position: static; width: 170px; height: auto;
  margin-top: 5px; margin-bottom: 5px;
	padding-top: 2px; padding-bottom: 2px; padding-left: 10px;
	color: #595f23; background-color: white; text-align: left; font-weight:normal; font-size: 1em;
}

p.menu_main_item a:link {color: #595f23; text-decoration:none;}
p.menu_main_item a:visited {color: #595f23; text-decoration:none;}
p.menu_main_item a:hover {color: #a45209; text-decoration:underline;}
p.menu_main_item a:active {color: #595f23; text-decoration:none;}

div.wm_feedback {
	position: static; width: 180px; height: auto;
	margin-top: 10px; margin-left: 10px; padding-bottom: 10px;
	background-color: #a8a28f;
}
p.wm_feedback_head {
	position: static; width: 180px; height: auto;
	margin-bottom: 5px;
	padding-top: 5px; padding-bottom: 5px;
	color: white; text-align: center; font-weight:bold; font-size: 1.1em; background-color:#7c7062;
}
div.wm_feedback p {
	text-align: center; 
}
p.disclaimer {
	width: 180px; height: auto; margin-top: 10px; margin-left: 10px; padding-top:10px; padding-bottom:10px;
	color:white; background-color: #595f23; font-size: 1.1em; font-weight: bold; text-align:center;
}
p.last_updated {margin-top: 20px ;font-size: 0.9em; font-style: italic; text-align: center;}


/* OTHER NAVIGATION STUFF **************************************************************** */
p.you_are_here {
  width: 790px; height: 15px; padding-top: 3px; 
  margin-top: 0px; margin-left: 0px; margin-bottom: 0px; padding-bottom: 4px; padding-left: 10px;
  color: white; background-color: #356686; font-size: 0.85em; font-weight:bold;
} 

p.on_this_page {
  width: 780px; height: 15px; padding-top: 3px; 
  margin-top: 5px; margin-left: 0px; margin-bottom: 0px; padding-bottom: 0px; padding-left: 0px;
 font-size: 0.85em; font-weight:bold;
 }

p.on_this_page_line2 {
  width: 700px; height: 15px; padding-top: 0px; 
  margin-top: 0px; margin-left: 0px; margin-bottom: 0px; padding-bottom: 0px; padding-left: 80px;
 font-size: 0.85em; font-weight:bold;
} 

/* Links */
p.you_are_here a:link {color: white;}
p.you_are_here a:visited {color: white;}
p.you_are_here a:hover {color: #93a4ae;}
p.you_are_here a:active {color: white;}

a.whitelink:link {color: white;}
a.whitelink:visited {color: white;}
a.whitelink:hover {color: #a45209;}
a.whitelink:active {color: white;}

a.whiteblacklink:link {color: white;}
a.whiteblacklink:visited {color: white;}
a.whiteblacklink:hover {color: black;}
a.whiteblacklink:active {color: white;}

/* Use default colors for most link states except hover. */
a:hover {color: #a45209;}


/* HEADINGS ****************************************************************************** */
h1 {
  margin-top: 0px; margin-bottom: 0px; width: 800px; height:27px; padding: 0px; padding-top: 4px; 
  color: white; background-color: #7c7062; font-size: 1.6em; font-weight:bold; text-align: center; 
}
h2 {
	position: static; width: auto; height: auto;
	margin-top: 15px; margin-bottom: 10px; padding-top: 0px; padding-bottom: 2px; padding-left: 0px;
  border-bottom-style:solid; border-bottom-width: 2px; border-bottom-color: #a45209;
	color: #a45209; background-color: white; text-align: left; font-weight:bold; font-size: 1.4em;
}
h3 {
  margin-top: 10px; margin-right: 5px; margin-bottom: 0px; margin-left: 0px; 
  color: #a45209; text-align: left; font-weight:bold; font-size: 1.2em;
}
h4 {
  margin-top: 10px; margin-right: 5px; margin-bottom: 0px; margin-left: 0px; 
  color: #a45209; text-align: left; font-weight:bold; font-size: 1.1em;
}
span.inlinehead{font-size: 1em; font-weight: bold; color: #a45209;} 


/* CONTENT ******************************************************************************* */

/* LISTS */
ul{
  list-style-type: square; color: black;
  margin-top: 0px; margin-right: 5px; margin-bottom: 6px; margin-left: 20px; padding: 0px; }  
li{
  margin: 0px;  margin-bottom: 6px; padding: 0px; 
} 
/* Nested list */
ul ul{
  list-style-type:  disc;
  margin-top: 5px; margin-right: 5px; margin-bottom: 0px; margin-left: 15px; padding: 0px; }

/* TO TOP LINK */
p.totop{
	text-align: right; font-size: 0.7em; font-variant: small-caps; 
	margin: 0px; margin-top: 5px; margin-right: 0px; padding: 0px; padding-top: 0px;}  	
p.totop a:hover {color: #a45209;}
  
/* PHOTOS IN CONTENT AREA */    
/* When a div is used, it must be given a local style width equal to the photo width. Otherwise the
   caption will expand past the edges of the picture. */
div.photoleft{
  float: left; height: auto; width: auto; 
  margin-top: 0px; margin-right: 15px;  margin-left: 0px; padding: 0px;}
div.photoright{
  float: right; clear: right; height: auto; width: auto; 
  margin: 0px; margin-top: 0px; margin-left: 10px; padding: 0px;}
div.photoleft p, div.photoright p{
  height: auto; width: auto; 
  margin: 0px; padding: 5px; padding-bottom: 0px; 
  text-align: left; font-size: .85em; font-weight: normal; font-style: italic; color: black;}

/* COLORED TEXT BOXES */
div.box_orange{
    height: auto; margin: 0px; margin-top: 15px; padding: 5px; padding-top: 10px; text-align: center; color: white; background-color: #cc6600;
	}

/* HIKING TABLES */
table.trails{
	width: 100%; border-collapse:collapse; border:solid; border-width: 1px; border-color:#a45209;
}
table.trails th{
	text-align:left; font-weight:bold; font-size:1.1em; color:white;
	background-color:#a45209; padding: 2px;
}
th.trail_name{
	width: 59%; 
}
th.trail_miles{
	width: 13%;
}
th.trail_gain{
	width: 9%;
}
th.trail_difficulty{
	width: 19%;
}
table.trails td{
	border-bottom-style:solid; border-width: 1px; border-color:#a45209; padding: 2px; vertical-align:top;
}

/* THUMBNAIL PICTURE TABLE */

table.thumbs{
	width: 100%; border-collapse:collapse; border:solid; border-width: 1px; border-color:#a45209;
}
table.thumbs td{
	width: 20%; margin: 0px; padding: 10px; 
	border-bottom-style:solid; border-width: 1px; border-color:#a45209; 
	text-align: center; vertical-align: bottom;
}

/* NORDIC CENTER TABLES */
table.nordic{
	width: 100%; border-collapse:collapse; border:solid; border-width: 1px; border-color:#a45209; margin-bottom:10px;
}
table.nordic th{
	text-align:left; font-weight:bold; font-size:1.1em; color:white;
	background-color:#a45209; padding: 2px;
}
th.nordic_name{
	width: 50%; 
}
th.nordic_location{
	width: 30%;
}
th.nordic_trails{
	width: 20%;
}
table.nordic td{
	border-bottom-style:solid; border-width: 1px; border-color:#a45209; padding: 2px; vertical-align:top;
}

/* HUT/YURT/CABIN TABLES */
table.yurt{
	width: 100%; border-collapse:collapse; border:solid; border-width: 1px; border-color:#a45209; margin-bottom:10px;
}
table.yurt th{
	text-align:left; font-weight:bold; font-size:1.1em; color:white;
	background-color:#a45209; padding: 2px;
}
th.yurt_name{
	width: 25%; 
}
th.yurt_system{
	width: 25%; 
}
th.yurt_location{
	width: 17%;
}
th.yurt_maps{
	width: 33%;
}
table.yurt td{
	border-bottom-style:solid; border-width: 1px; border-color:#a45209; padding: 2px; vertical-align:top;
}


/* HOT SPRINGS TABLES */
table.springs{
	width: 100%; border-collapse:collapse; border:solid; border-width: 1px; border-color:#a45209; margin-bottom:10px;
}
table.springs th{
	text-align:left; font-weight:bold; font-size:1.1em; color:white;
	background-color:#a45209; padding: 2px;
}
th.springs_name{
	width: 35%; 
}
th.springs_location{
	width: 35%;
}
th.springs_details{
	width: 30%;
}
table.springs td{
	border-bottom-style:solid; border-width: 1px; border-color:#a45209; padding: 2px; vertical-align:top;
}

/* REPAIRS FOR SLOPPY BROWSERS *********************************************************************
div.col_cont_full_width p {
  margin: 0px; margin-bottom: 6px;
	padding: 0px; padding-right: 0px; padding-left: 0px;
	font-size: 1.0em; 
}  */