/* CSS Document */


/* HACK EXPLANATION:  if IE6 is used, the columns don't dislpay properly unless I use absolute positioning... however, 
if absolute positioning is used, then the columns don't force the container div to match the height of the tallest column.
So, with IE6 the only column affecting the page's height is the left column (the story column)... so I manually force the height of 
that div to be 600px for IE 6.   THIS FIX ASSUMES that the photo column and news/links column does not extend past 600 pixels tall (pretty much one whole screen height).  */

/* Hides from IE5-mac \*/
* html .IE6Broken { position: absolute; left:0;}
/* End hide from IE5-mac */

/* Hides from IE5-mac \*/
* html .IE6BrokenFloatColumn { height:600px;}
/* End hide from IE5-mac */



body {
  	padding: 0px;
	margin: 0px;
}
#header { width: 983px; }
#headerLeft { padding: 0px; margin: 0px; }
#headerRight { float:right; }

#headerLinks ul { padding: 0px; margin: 0px; list-style: none;}
#headerLinks li { padding: 0px; margin: 0px; float: left; }
#headerLinks { 
	padding: 24px 0 12px 0;
	margin: 0 0 12px 0;
	font: bold 11px Arial, Helvetica, sans-serif; color: #b7b7b7; 
}
#headerLinks a { 
	padding: 4px 2px;
	font: bold 11px Arial, Helvetica, sans-serif ;
	color: #b7b7b7;
	text-decoration: none;
}
#headerLinks a:hover { color:#9d9d9d;}
#headerSearch { 
	clear: left; 
	padding: 0px 0px 0px 0px;
	margin: 0px;
}
#headerSearch a { 
	font: bold 11px Arial, Helvetica, sans-serif ;
	color: white;
	background-color: #b8b8b8;
	text-decoration: none;
	padding: 6px 10px;
}

#header div.colorBar {
	width: 983px;
	background-color: #185d61; <!-- 690c1e; (maroon) 185d61(green) -->
	height: 20px;	
	padding: 0pxp; margin: 0px;
}

#container_outer {
	background-image:url(../imgs/background_fauxColumns.gif); padding: 0px; margin: 0px;
	width: 983px;
}
#container_outer.home {	background-image:url(../imgs/home_fauxColumns.gif); padding: 0px; margin: 0px; }
#container{
    width:618px;
	float: left; padding: 0px; margin: 0px;
}

#menu {
  	background-image: url(../imgs/menu_bgFill.gif);
	width: 618px;
	height:25px;
	line-height:normal;
	float: left;
}

#menu ul { padding: 0px; margin: 0px; list-style: none;}
#menu li { padding: 0px; margin: 0px; float: left; background:url(../imgs/menu_dividerRight.gif) no-repeat right top;}
#menu #current { background:url(../imgs/menu_bgCURRENT_left2.gif) no-repeat left top; }
#menu a { 
	display: block; 
	padding: 5px 6px 5px 6px;
	font: bold 12px Arial, Helvetica, sans-serif;
	color: #363636;
	text-decoration: none;
}
#menu #current a { background:url(../imgs/menu_bgCURRENT_right2.gif) no-repeat right top; }
#menu a:hover {
	background:url(../imgs/menu_bgFill_hover.gif) repeat-x top;
}

#leftColumn {
	width: 476px;
	float:left;
}
#storyHeader { margin: 20px 30px 0px 30px; }
#storyHeader h1 { font: bold 24px Arial, Helvetica, sans-serif; padding: 10px 0px; margin: 0px; }
#storyHeader h2 { font: 16px Arial, Helvetica, sans-serif; padding: 0px; margin: 0px;}
#leftColumn div.colorBar {
	border-bottom: solid 1px #b9b9b9;
	height: 20px;
}
#storyBody { 
	margin: 20px 30px; 
	font: 12px Arial, Helvetica, sans-serif; 
	color: #4f4f4f;
}

#centerColumn {

	margin: 20px 0px;
	text-align: center;
	/*position:absolute; left: 0px;*/
	width: 142px;
	margin-left: 476px;
	font: 10px Arial, Helvetica, sans-serif;
}

#slideshowInstructions {
	font: 10px Arial, Helvetica, sans-serif;
	color: #b9b9b9;
	text-align: left;
	padding: 0px 10px;
}

#centerColumn a img {
 	text-align: center;
	border: none;
	padding: 4px 0px;
}

#rightColumn{
	/*position:absolute; left: 0px;*/
	padding: 0px;
    width:365px;
	margin-left: 618px;
	background:url(../imgs/menu_bgFill.gif) repeat-x top;
}

#rightColumn h3 { padding: 0 0 4px 0; margin: 0; font: bold 12px Arial, Helvetica, sans-serif; color: #4a4a4a; }

#submenu.insidePage{ 
	background-color:#f3eac1; 
	margin-right: 34px;   
	padding: 14px 18px 24px 18px; 
	border-bottom: 8px solid white;
	border-left: 2px solid white;
}
#submenu h1 { padding: 0px 0px; margin: 0; font: bold 18px Arial, Helvetica, sans-serif; color:#534e3b; }
#submenu ul { padding: 0px; margin: 10px 0px; }
#submenu li { 
	list-style: none; 
	padding: 0px 14px 8px 14px; 
	background: url(../imgs/submenu_bulletTriangle.gif) no-repeat top left; 
	font: 11px Arial, Helvetica, sans-serif normal;
}
#submenu.insidePage li { background: url(../imgs/submenu_bulletTriangle.gif) no-repeat top left;  }
#submenu ul li a { text-decoration: none; 	color: #534e3b;}
#submenu ul li a:hover {color: #908974;}
#bottomRightBlock {
	padding: 14px 18px 24px 18px; 
	margin-right: 34px;   
	font: 11px Arial, Helvetica, sans-serif normal;
	color: #4c4c4c;
}
#bottomRightBlock h1 {
	padding: 0px 0px 10px 0px; margin: 0; 
	font: bold 18px Arial, Helvetica, sans-serif; color:#6c0b1f; 
	text-decoration: none;
}
#bottomRightBlock h1 a { text-decoration: none; }
#bottomRightBlock a {color: #6c0b1f; }

#clear { clear: both; padding: 0px; margin: 0px; background-color: white; }

#footer { 	width: 983px; }
#footer img { float: right; padding: 4px 26px;}
#footer div.colorBar { background-color: #dadada;  height: 10px; clear:both;}


ul.archive { padding: 0px; margin: 4px 0px;}
ul.archive li {
 	list-style: none; 
	padding: 0px 14px 8px 14px; 
	background: url(../imgs/home_bulletTriangle.gif) no-repeat top left; 
	font: 11px Arial, Helvetica, sans-serif normal;  }
ul.archive li a { text-decoration: none; 	color: #6c0b1f;}
ul.archive li a:hover {color: #908974;}

.thumbnailBox img{
	border: 0; 
}

.classActs {
	color: #5a0000;
	font-weight: bold;
}

/*LIGHT BOX STYLE **********************************************************************************************/
#lightbox{
	position: absolute;
	left: 0;
	margin-top: -65px;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 4px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../imgs/lightBox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../imgs/lightBox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../imgs/lightBox/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}