/* This css is optimized for modern browsers and some parts of the
styling have been dumbed-down for the benefit of IE6 and lower. */

.preload,
.preload img {
	position: absolute;
	left: -3000px;
	top: -3000px;
	width: 1000px;
	}

html, body, p, img, h1, h2 {
	margin: 0; padding: 0; border: 0;
	}

html {
	height: 100%;
	margin-bottom: 1px;
	padding-bottom: 1px;
	}

body {
	min-height: 100%;
	margin-bottom: 1px;
	padding-bottom: 1px;
	font-size: 100%;
	font-family: 'trebuchet ms', arial, sans-serif;
	background: #b5a8a0 url(../images/general/sepiafade1.png) 0 175px repeat-x fixed;
	}

#wrapper {
	background: url(../images/general/bannerimage2.jpg) 50% 0 no-repeat; /* for IE6 only */
	width: 600px;
	padding: 240px 10px 50px 350px;
	margin: 0 auto;
	position: relative;
	zoom: 1;
}

.brclear {     /* Use a break with this class to clear float containers */
	clear:both;
	height:0;
	margin:0;
	font-size: 1px;
	line-height: 0;
	}

h1,
a span {
	position: absolute;
	left: -3000px;
	width: 1000px;
	}

h2 {
	font-size: 1.4em;
	margin: 1em 0 .4em 1em;
	color: #700;
	}

h3 {
	font-size: 1.1em;
	margin: 1em 0 .3em 0;
	color: #400;
	}

h4 {
	font-size: 1em;
	margin: 1em 0 .3em 0;
	color: #000;
	}

a {zoom: 1;}

a:focus {
	outline: none;
	}

.realtext {
	font-size: 1px;
	visibility: hidden;
	position: absolute;
	text-decoration: none;
	}

.topmask {
	position: fixed;
	_position: absolute;
	top: 0;
	left: 46%;
	_left: 0;
	margin-left: -1150px;
	_margin-left: 0;
	padding-bottom: 20px;
	_padding-bottom: 0;
	background: url(../images/general/whitefade.png) left bottom repeat-x;
	_background: none;
	z-index: 100;
	_width: 100%;
	height: 210px;
	}

.topmask img,
.topmask a.floatleft {
	float: left;
	}

.guestbooklink {  display: none; /* DISABLED*/
	position: fixed;
	_position: absolute;
	top: 30px;
	right: 30px;
	}

.homelink {
	position: absolute;
	width: 500px;
	height: 150px;
	left: 1120px;
	top: 60px;
	text-decoration: none;
	color: black;
	}

.homelink span {
	visibility: hidden;
	}

.topmask .bannerimage {
	_display: none;
	}

#fixedbox {
	position: fixed;
	top: 130px;
	width: 60%;
	z-index: 10000;
	}

.localhikes-index .pageblurb,
.reports-index .pageblurb,
.home-index .pageblurb {
	position: absolute;
	width: 300px;
	height: 130px;
	left: 820px;
	top: 60px;
	background: url(../images/general/blurb-reports.png) no-repeat;
	}


/*XXXXXXXXXXXXXXX #mainColumn rules XXXXXXXXXXXXXXX*/

#mainColumn {
	zoom: 1;
	}

#mainColumn .shadowtextbox {
	width: 39em;
	max-width: 590px;
	margin-bottom: 8px;
	}

#mainColumn img {
	border: 1px solid #444;
	margin-bottom: 30px;
	display: block;
	}

/*XXXXXXXXXXXXXXX #smallColumn rules XXXXXXXXXXXXXXX*/

#smallColumn {
	position: absolute;
	left: 35px;
	top: 210px;     /* must match top value mentioned in general.js */
	width: 319px;     /* declared so JS can modify it - must be 19px more than thumb widths */
	padding-bottom: 50px;
	z-index: 1000;
	font-size: .95em;
	}

#smallColumn .shadowtextbox {
	idth: 310px;
	margin-bottom: 8px;
	}



/*XXXXXXXXXXXXXXX Rules for main box module XXXXXXXXXXXXXXX*/

.shadowtextbox .shadow-four {
	background: #f8f8f8 url(../images/general/texttile1.gif);
	border: 1px solid #aaa;
	padding: 10px 25px 20px;
	}

.shadowtextbox p.avatar {
	padding-left: 100px;
	min-height: 130px;
	background: url(../images/general/avatar.gif) no-repeat;
	}

.shadowtextbox p {
	font-family: georgia, serif;
	line-height: 1.3;
	color: #421;
	margin: 0 0 .6em 0;
	text-align: justify;
	}

.shadowtextbox a {
	color: #821;
	}

.shadowtextbox a:hover,
.shadowtextbox a:focus {
	color: #281;
	}

#mainColumn .shadowtextbox. .shadow-four {
	background: #e8e4d5;
	}

#smallColumn .shadowtextbox .shadow-four {
	background: #f0ddcc;
	}



/*XXXXXXXXXXXXXXX .rightfloatbox rules XXXXXXXXXXXXXXX*/

.rightfloatbox {
  float: right;
  position: relative;
  width: 180px;
  padding: 8px 12px 5px;
  margin: 10px -10px 5px 20px;
  border: 1px solid #000;
  background: #fff url(../images/general/mouse1.jpg) 100% 50px no-repeat;
  text-decoration: none;
  font-size: .8em;
  font-family: arial;
  }

.rightfloatbox h3 {
  height: 55px;
  margin: 0;
  font-size: 1.3em;
  font-family: arial;
  color: black;
  background: url(../images/general/coachhead1.gif) no-repeat;
  }

.rightfloatbox h3 span {
  position: absolute;
  left: -3000px;
  }

.rightfloatbox p {
  margin-right: 50px;
  text-align: right;
  font-family: arial;
  color: black;
  }

.rightfloatbox:hover p {
	color: #281;
  }



/*XXXXXXXXXXXXXXX Arrow Button rules XXXXXXXXXXXXXXX*/

#buttonHolder {
	position: fixed;
	width: 80px;
	height: 260px;
	top: 50%;
	margin-top: -130px;
	margin-left: -85px;
	z-index: 1000000;
	}

#upbutton,
#downbutton {
	background: url(../images/general/scrollarrows.png) 100% 0 no-repeat;
	width: 80px;
	height: 120px;
	}

#upbutton {
	background-position: 100% -120px;
	margin-bottom: 20px;
	}

#downbutton {
	background-position: 100% -240px;
	}

#upbutton:hover,
#upbutton:focus {
	background-position: 100% 0;
	}

#downbutton:hover,
#downbutton:focus {
	background-position: 100% -360px;
	}


/*XXXXXXXXXXXXXXX hovered shadow rules for default thumb/popup pairs XXXXXXXXXXXXXXX*/

.thumb-pop-parent {
	width: 311px;
	position: relative;
	margin: 0 8px 10px 0;
	zoom: 1;
	}

.thumb-pop-parent:hover {
	z-index: 100;
	}

.thumb-pop {
	position: absolute;
	left: -3000px;  /* starts hidden */
	bottom: 15px;
	z-index: 1;
	width: 300px;
	padding-top: 20px;
	background: url(../images/general/bgfix.gif);
	}

.thumb-pop a {
	display: block;
	padding: 10px 10px 20px 25px;
	text-decoration: none;
	text-align: center;
	background: #c7f5ff url(../images/general/cloud-bg2.jpg) bottom;
	color: #631;
	font-weight: bold;
	line-height: 1.4;
	border: 1px solid;
	border-color: #d8d5d1 #aaa #aaa #d4d1c9;
	border-color: #b8b5b1 #888 #888 #b4b1a9;
	zoom: 1;
	}

.thumb-pop-parent:hover .thumb-pop {
	left: 285px;  /* hover reveals popup */
	}

.thumb-container {
	z-index: 100;
	}

.thumb-container a {
	display: block;
	width: 300px;
	height: 194px;
	border: 1px solid #ccc;
	border-color: #aaa #555 #555 #aaa;
	}

.thumb-container a.hikethumb {background: url(../images/thumbs/hikethumb.jpg) no-repeat;}
.thumb-container a.bigjohnthumb {background: url(../images/thumbs/bigjohnthumb.jpg) no-repeat;}
.thumb-container a.mcotrthumb {background: url(../images/thumbs/mcotrthumb.jpg) no-repeat;}

.thumb-container a.sierra2006thumb {background: url(../images/thumbs/sierra2006.jpg) no-repeat;}
.thumb-container a.gc2007thumb {background: url(../images/thumbs/gc2007.jpg) no-repeat;}
.thumb-container a.supai2007thumb {background: url(../images/thumbs/supai2007.jpg) no-repeat;}
.thumb-container a.sierra2007thumb {background: url(../images/thumbs/sierra2007.jpg) no-repeat;}
.thumb-container a.powell2007thumb {background: url(../images/thumbs/powell2007.jpg) no-repeat;}
.thumb-container a.gc2008thumb {background: url(../images/thumbs/gc2008.jpg) no-repeat;}
.thumb-container a.powell2008thumb {background: url(../images/thumbs/powell2008.jpg) no-repeat;}


.thumb-container a:focus {
	width: 296px;
	height: 190px;
	border: 3px solid #39b;
	border-color: #5bf #149 #149 #39b;
	background-position: -2px -2px;
	}

.thumb-pop-parent .grayout {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../images/general/sepiawash.png);
	cursor: pointer;
	}

.thumb-pop-parent:hover .grayout {
	left: -3000px;
	}



/*XXXXXXXXXXXXXXXXXX Dropshadow/hover rules  XXXXXXXXXXXXXXX*/

.shadow-one {
	position: relative;
	background: url(../images/dropshadows/upperrightfade3-pad3.png) 100% 3px no-repeat;
	_background: none;
	}

.shadow-two {
	position: relative;
	padding: 9px 0 0 9px;
	background: url(../images/dropshadows/lowerleftfade3-pad3.png) 3px 100% no-repeat;
	_background: none;
	}

.shadow-three {
	position: relative;
	background: url(../images/dropshadows/drop3-pad3.png) 100% 100%;
	_background: none;
	}

.shadow-four {
	position: relative;
	display: block;
	left: -6px;
	top: -6px;
	}

.thumb-pop>.shadow-one,
.thumb-container
	{background: url(../images/dropshadows/upperrightfade3-pad3.png) 100% 3px no-repeat;}     /* unhovered */

.thumb-pop>*>.shadow-two,
.thumb-container>.shadow-two
	{background: url(../images/dropshadows/lowerleftfade3-pad3.png) 3px 100% no-repeat;}     /* unhovered */

.thumb-pop>*>*>.shadow-three,
.thumb-container>*>.shadow-three
	{background: url(../images/dropshadows/drop3-pad3.png) 100% 100%;}     /* unhovered */

.thumb-pop>*>*>*>.shadow-four,
.thumb-container>*>*>.shadow-four
	{
	left: -6px;
	top: -6px;
	}     /* unhovered */



.thumb-pop-parent:hover .thumb-container
	{background: url(../images/dropshadows/upperrightfade9.png) 100% 0 no-repeat;	_background: none;}     /* hovered */

.thumb-pop-parent:hover .thumb-container>.shadow-two
	{background: url(../images/dropshadows/lowerleftfade9.png) 0 100% no-repeat;	_background: none;}     /* hovered */

.thumb-pop-parent:hover .thumb-container>*>.shadow-three
	{background: url(../images/dropshadows/drop9.png) 100% 100%;	_background: none;}     /* hovered */

.thumb-pop-parent:hover .thumb-container>*>*>.shadow-four
	{
	left: -9px;
	top: -9px;
	}     /* hovered */

