/* Global styles - all media
----------------------------------------------- */
		
html {
	height: 100%;
	overflow-y: scroll; /* forces vertical scrollbar */
}
body {
	background: #ddddff;
	color: black;
}

/* wraps all page elements
----------------------------------------------- */
#wrapper {
	margin: 0 auto 0 auto;
	border: 2px outset #eee;
	border: 1px solid #888; /* test */
	width: 100%;
	max-width: 960px;
	min-width: 480px;
	background: #eee;
	font-family: Georgia, "Times New Roman", Times, serif;
}

/* contains title bar images
----------------------------------------------- */
#titleBar {
	text-align: center;
	margin: 0 0 10px 0;
/* 	border: 1px solid #888;  test */
}
#titleBar img {
	max-width: 100%;
}

/* wraps MenuBar1
----------------------------------------------- */
#menuWrapper {
/*	margin: 0px 1.0%; */
	width: 90%;
    margin: 0 auto;
	padding: 0;
}

/* wraps navBar and main divs
----------------------------------------------- */
#mainCols {
	overflow: hidden; /* addresses escaping enclosed floating element */
	margin: 0;
	padding: 0px 1.0%;
	clear: both;
}

/* wraps main page content
----------------------------------------------- */
#main {
	float: left; /* if not float, beware of IE6 "3 pixel text jog" bug */
	width: 82.0%;
	text-align: left;
	padding: 0px 1.0%;
	border: 0;
	margin: 0; /* if margin-left is nonzero then address the IE6 double-margin bug */
}


/* Links: order here is important!
----------------------------------------------- */
a { text-decoration : none; }
a:link { color: #0066cc; }
a:visited { color: #743399; }
a:hover, a:active { text-decoration : underline; color: #ff4b33; }
/* This style is not supported in Firefox 2.0 */
a[href^='mailto:'] {
	background: url(../images/envelope.gif) no-repeat left center;
	padding-left: 20px;
	margin-left: 5px;
}

a[href$='.pdf'] {
	background: url(../images/pdf.gif) no-repeat right top;
	padding-right: 20px;
	margin-right: 5px;
}
a img {
    border: 0; /* don't inherit from a:link or a:visited (IE) */
}

/* use the same as regular text, in spite of variable width font.
----------------------------------------------- */
pre {
	font-family: Arial, Helvetica, sans-serif;
}

/* positions an element below a floated element
----------------------------------------------- */
.clear { clear: both; }

/* hides/unhides this element
----------------------------------------------- */
.hideThis { display: none; }
.hidden { display: none; }
.unhidden { display: block; }

/* navigation bar
----------------------------------------------- */
#navBar {
	font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
	font-weight: normal;
	font-size: 0.875em; /* 14/16 */
	float: right;
	width: 14.0%;
	text-align: left;
	padding: 30px 0px 0px 0px; /* Shift the navBar contents further below the MenuBar1 */
	border: 0;
	margin: 0; /* if margin-left is nonzero then need to address the IE6 double-margin bug */
}

/* wraps Google Search
----------------------------------------------- */
#googleSearch {
	text-align: center;
	margin: 0;
	padding: 0;
	clear: both;
}

/* wraps footer - copyright
----------------------------------------------- */
#footer p {
	text-align: center;
	font-size: .83em;
	padding: 10px 0 0 0;
	border-top: 1px solid #666;
	clear: both;
}

/* main page content styles
----------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
	color: #800000;
}

#main h1,
#main h2,
#main .center {
	text-align: center;
}
#main .leftText {
	text-align: left;
	float: left;
}
#main .rightText {
	text-align: right;
	float: right;
}
#main p.toTop {
	font-size: 1.17em;
	font-weight: bold;
	text-align: center;
}
#main .leftPhoto {
	float: left;
}
#main .centerPhoto {
	text-align: center;
}
#main .rightPhoto {
	float: right;
	margin: 0 0 3% 3%;
}

#main ol, #main ul {
	padding-left: 2em;
	margin: 1.12em 0;
}
#main ol li, #main ul li {
	margin: 0;
}
#main img.fill {
	max-width: 100%;
}
#main span.larger {
	font-size: larger;
}

/* used in clm_quotations.html */
#main .floatLeft {
	float: left;
}
#main .floatRight {
	float: right;
}

/* "Show more" button */
#main button,
#main input[type="button"] {
    margin: 0 0 1em 0;
}

/* navigation bar styles
----------------------------------------------- */
#navBar a {
	background-color: #66CC66;
	color: #333;
	text-decoration : none;
	display: block;
	border-right: 1px solid #006600;
	border-bottom: 1px solid #006600;
	padding-top: 0.25em; /* 4/16 */
	padding-right: 0.3125em; /* 5/16 */
	padding-bottom: 0.25em; /* 4/16 */
	padding-left: 0.3125em; /* 5/16 */
}
#navBar a:link, #navBar a:visited {
}
#navBar a:hover {
	background-color: #99ff99;
	color: #000;
}
#navBar a:active {
/*	PJM: Apparently, if we include the a:hover highlighting here we can encounter a IE7 bug 
    wherein after linking with another window the highlighting will remain on when we return to the original page. */
}

/* Category sections have bottom margin to space the categories apart but no left padding. */
#navBar ul {
	display: block;
	list-style: none;
	padding: 0;
	margin: 0 0 0.9375em 0; /* Shift subsequent category sections further down the navBar */
}
#navBar ul ul {
	margin: 0.3125em 0 0 0; /* push navBar links further below the navBar title */
}
#navBar li {
	margin: 0 0 0.3125em 0; /* vertically separate navBar links 5/16 */
}

/* turn off display of section sub-links for now... */
#navBar ul ul ul {
	display: none;
}
/* don't display category section unless in that category */
#navBar > ul {
	display: none;
}

/* Category titles and home links are bold */
#navBar > ul > li,
#navBar > ul > li a {
	font-weight: bold;
}

/* Category home, section links, and section sub-links have increasing left padding */
#navBar ul a {
	font-weight: normal;
	padding-left: 0.3125em; /* 5/16 */
}
#navBar ul ul a {
	font-weight: normal;
	padding-left: 0.75em;
}
#navBar ul ul ul a {
	font-weight: normal;
	padding-left: 1em;
}

/* selective display category sections */
.climbPage #navBar ul.climbLinks,
.skiPage #navBar ul.skiLinks
{
	display: block;
}

/* Highlight a page list element link when its page is displayed.
   Use a child selector to keep highlighting from being inherited by nested lists. */
.climbHomePage #navBar li.climbHomeLink > a,
.nskiPage #navBar li.skiLink > a,
.mex90Page #navBar li.mex90Link > a,
.ecu92Page #navBar li.ecu92Link > a,
.den96Page #navBar li.den96Link > a,
.pta99Page #navBar li.pta99Link > a,
.res00Page #navBar li.res00Link > a,
.nw18Page #navBar li.nw18Link > a,
.wa9erPage #navBar li.wa9erLink > a,
.emc8Page #navBar li.emc8Link > a,
.mccPage #navBar li.mccLink > a,
.azp100Page #navBar li.azp100Link > a,
.orp100Page #navBar li.orp100Link > a,
.or100Page #navBar li.or100Link > a,
.ca14Page #navBar li.ca14Link > a,
.co14Page #navBar li.co14Link > a,
.wshptsPage #navBar li.wshptsLink > a,
.us48p100Page #navBar li.us48p100Link > a,
.clinkPage #navBar li.clinkLink > a,
.cquotPage #navBar li.cquotLink > a,
.skiHomePage #navBar li.skiHomeLink > a,
.skiLocalPage #navBar li.skiLocalLink > a
{
	background-color: #99ff99;
}

/* bounding border styles
----------------------------------------------- */
div.rectgroup
{
	padding: 10px;
	border: 1px solid #800000;
}

/* Table styles
----------------------------------------------- */

/* Figures with linked images and captions.
   Putting these in a table can force captions to wrap.
----------------------------------------------- */
table.figureTable {
	border-collapse: collapse;
	margin: 0 auto; /* centers the table */
}
table.figureTable td {
	text-align: center; /* horizontal cell alignment */
	vertical-align: middle;
	padding: 5px;
	border: 0;
}

.figurelinkC, .photolinkC {
	margin: 0 auto;
	text-align: center;
	padding: 0 5px 5px 5px;
}

.figurelink .photolink {
	padding: 0 5px 5px 5px;
}
/* need to override the #main p style */
#main .figurelink p,
#main .figurelinkC p {
	font-size: .83em;
	text-align: center;
	margin: 0;
}

/* weather.html, clm_links.html */
table.links {
 	width: 90%;
	margin: 0 auto; /* centers the table */
}
table.links tr {
	vertical-align: top; /* replaces valign on tr elements */
}
table.links td {
	text-align: center;
	vertical-align: top;
	padding: 10px;
	border: 1px solid #888;
}
table.links h3 {
	text-align: center;
}
table.links p {
	text-align: center;
}

/* bicycling.html, skiing.html */
table.links-left {
	margin: 0 auto; /* centers the table */
}
table.links-left td {
	text-align: left;
	vertical-align: top;
	padding: 10px;
	margin: 0;
	border: 2px groove #fff;
	border: 1px solid #888;
}

/* bk_death_valley_2000.html, etc. */
table.itinerary {
	width: 90%;
	margin: 0 auto; /* centers the table */
}
table.itinerary th, table.itinerary td {
	padding: 8px;
	border: 1px solid #888;
}
table.itinerary .miles, table.itinerary .gain {
	text-align: center;
}

/* mtn_jefferson.html, etc */
table.collection {
	width: 90%;
	margin: 0 auto; /* centers the table */
}
table.collection td {
	text-align: center;
	vertical-align: middle;
	padding: 10px;
	border: 1px solid #888;
}
table.collection td.here {
	font-size: larger;
}

/* clm_co14ers.html, etc. */
table.peakList {
	width: 95%;
	margin: 0 auto; /* centers the table */
}
table.peakList th, table.peakList td {
	text-align: center;
	vertical-align: middle;
	padding: 10px;
	border: 1px solid #888;
}
table.peakList td.footnote {
	text-align: left;
}
table.peakList th {
	font-weight: bold;
}
table.peakList td.here {
	font-size: larger;
}

/* clm_co14ers.html */
table.ratingList {
	width: 40%;
	margin: 0 auto; /* centers the table */
}
table.ratingList th, table.ratingList td {
	text-align: center;
	vertical-align: middle;
	padding: 10px;
	border: 1px solid #888;
}

/* Adjustments for Screen Size and Orientation - Two Columns
------------------------------------------------------------ */
/*    
 iPhone/iPod:         320 x 480
 iPhone/iPod Retina:  640 x 960
 iPad:                768 x 1024 (p) or  1024 x 768 (l)
*/
@media screen and (min-width: 640px) and (max-width: 768px) {
	/* We reduce the #navbar font and narrow #main */
	#navBar { font-size: 0.8125em; /* 13/16 */ width: 16.0%; }
	#navBar a {
		padding-top: 0.375em; padding-bottom: 0.375em; /* 6/16 */
	    padding-right: 0.4375em; padding-left: 0.4375em; /* 7/16 */
	}
	#main { width: 80.0%; }
}
@media screen and (max-width: 639px) {
	/* We further reduce the #navbar font and narrow #main */
	#navBar { font-size: 0.75em; /* 12/16 */ width: 18.0%; }
	#navBar a {
		padding-top: 0.5em; padding-bottom: 0.5em; /* 8/16 */
	    padding-right: 0.5625em; padding-left: 0.5625em; /* 9/16 */
	}
	#main { width: 78.0%; }

	/* We create two rows of larger menu tabs and turn on the mobile site tab */
	ul.MenuBarHorizontal li {  margin-left: 1%; width: 30%; }
	/* By default, hide the menu tab to the mobile site. */
}

@media all and (orientation:portrait) {
/* Style adjustments for portrait mode goes here */
}

@media all and (orientation:landscape) {
/* Style adjustments for landscape mode goes here */
}
