@charset "utf-8";
/* CSS Document */
	
a.sublink{
	text-decoration:none;
	color:#333333;
	font-size:80%;
	}

	
#histPics{
	width:12em;
	float: left;
	background-color:#996633;
	margin: .35em .7em .35em 0;
	}

#bottomhr{
	color:#FF0000;
	}
#jackpic{
	float:right;
	width:23.3em;
	margin: .35em 0 .35em .7em;
	}
#histPics img, #jackpic img{
	width:100%;
	}
	
.image2+.image2{
	clear:right;
	}

/*temporary rule to keep headings lined up properly until all content is in place */	
p+h3{
	clear:left;
	}	
	
/**************************************************************************************************/
/*For creating "Tabbed Panels" as separate web pages.  Include all list items on each page of the tab
 *group, and make sure any new tabs include the "selectedTab" class*/

ul.tabs{
	margin-left:1em;
	width:100%;/*For IE: fixes positioning problem when preceeded by a p element*/
	}
	
/*applies to containers for the "tabs"*/
.tabs li{
	font: bold .9em sans-serif;
	list-style-type:none;
	float:left;
	margin: 2em .1em 0 5px;/*tab spacing*/
	
	/*background-color:#bbbbbb;*/
	/*border:#333333 1px solid;/*match border of div.contentPanel*/
	
	background-image:url(../images/tabTop.jpg);
	background-repeat:no-repeat;
	background-position:top center;
	width:126px;
	text-align:center;
	white-space:nowrap;/*allows for nicer degredation of tabs when zooming in Safari*/
	
	/*absolute positioned and high z-index to slide tabs down and 
	 *have them line up on top of div.contentPanel top border*/
	position:relative;
	top:1px;
	z-index:100;
	}
	
div.contentPanel{
	background-color:#eeeeee;
	margin:0px 2em 2em 1em;
	clear:left;
	padding:2em;
	border:#333333 1px solid;
	min-height:500px;
	z-index:90;/*z-index less than tabs*/
	}

/*change tab background color or image on hover*/		
.tabs li:hover{
	/*background-color:#CCCCFF;*/
	background-image:url(../images/tabHover.png);
	background-position:top;
	}

/*Current tab looks the same whether you are hovering over it or not*/	
li.selectedTab,
li.selectedTab:hover{
	/*bottom border and background of the current tab must match background
	 *background of div.contentPanel (or border bottom and image color*/
	/*background-color:#eeeeee;*/
	border-bottom:#eeeeee 1px solid;
	/*tab image is 124px wide while selectedtab container is 126,
	 *pros:image's border renders well in all browsers
	 *cons:leaves 1px gap at bottom corners of tab*/
	background-image:url(../images/tabSelected.png);
	background-position:top;
	}


/*make sure only background and not text change when hovering on
 *a tab.  Also make sure the current tab doesn't change.
 *For ease of use, links are block elements that should roughly  
 *fill the tab that contains them*/
li.selectedtab,	
ul.tabs li a,
ul.tabs li a:visited,
ul.tabs li a:link,
ul.tabs li a:hover,
ul.tabs li a:active{
	text-decoration:none;
	font-weight:bold;
	font-size:90%;
	color:#000000;
	display:block;
	padding:5px .5em 5px .5em;
	height:18px;
	position:relative;
	top:3px;
	}