/* 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 27px 0;
}
#titleBar img {
	max-width: 100%;
}

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

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

/* wraps main page content
----------------------------------------------- */
#main {
	float: none;
	width: 98.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; }
/* not supported in FF 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;
}

.clear { clear: both; }
.hideThis { display: none; }
.hidden { display: none; }
.unhidden { display: block; }


/* navigation bar
----------------------------------------------- */
#navBar {
	display: none;
}

/* 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;
}

/* 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;
}

/* ptmcclellan.html */
table.album {
 	width: 90%;
	margin: 0 auto;
	border: 2px groove #fff;
	border: 1px solid #888;
}
table.album td {
	text-align: center;
	vertical-align: middle;
	padding: 10px;
	border: none;
}
table.album td div {
	padding: 10px 0px 0px 0px;
}


/* Current ride page: 2013_rides.html */
div.rides {
	padding: 0;
	margin: 0 auto;        /* centers the table - replaces align on table elements */
}
div.rides .row {
	padding: 0;
}
div.rides .item {
    width: 45%;
	vertical-align: top;
    display: inline-block;
	margin: 0px;
	padding: 10px 2%;
}
div.rides .ride_illustration {
	text-align: center;
}
div.rides .ride_illustration img {
	max-width: 100%;
}
div.rides .ride_illustration .caption {
	padding: 0;
	margin: 0;
	font-size:smaller;
	font-weight: bold;
}
div.rides .ride_title {
	font-weight: bold;
	text-align: center;
}

/* 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 (max-width: 639px) {
	/* 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 */
}
