/**********home CSS*************/
/**********home CSS************* styles by Chacha Sikes **  10-23-06  version 1.0/
/**Specific stylesheet for:                 **/
/**                                index.php**/

/******************** feature ***************/


/*modified 07 January by Ted Koterwas: changed left to 0px from -2px and padding to 0px from
2px to make widths add up correctly */

#story{
	position: absolute;
	top: 10px;
	left: 0px;
	width: 650px;
	height: 100%;
	margin: auto;
	padding:0px;
}

/*modified 20 December by Ted Koterwas: changed top to 20px from 25px to make tagline even with page jump bar*/
/*modified 07 January by Ted Koterwas: changed left to 0px from 2px to make it fit within 650px parent div */
#story_title{
	position: absolute;
	top: 20px;
	left: 0px;
	width: 310px;
	height: auto;
	padding: 5px;

}


#story_text{
	position: absolute;
	top: 50px;
	left: 2px;
	width: 650px;
	height: 100px;
	padding: 5px;
}

/*modified 20 December by Ted Koterwas: changed top to 40px from 35px to make page jump bar even with baseline of tagline*/
/*modified 07 January by Ted Koterwas: changed left to 330px from 334px to make it fit within 650px parent div */

#story_jump_bar{
	width: 320px;
	height: 20px;
	position: relative;
	top: 40px;
	left: 330px;
	text-align: right;
}

/*modified 20 December by Ted Koterwas: changed top to 60px from 90px to reduce awkward blank space*/
/*modified 07 January by Ted Koterwas: changed left to 0px from 2px to make widths add up correctly*/

#story_copy{
	position: relative;
	top: 60px;
	left: 0px;
	width: 625px;
	height: 100%;
	padding: 5px;
}

/*modified 07 January by Ted Koterwas: changed left to 4px from 20px to make it line up with the jumpbar
and to allow all imageboxes to shift 15px over to create a margin for the wide boxes */


#box_spacer{
	position: relative;
	left: 4px;
}

#story_image_1{
	width: 320px;
	height: 320px;
	position: absolute;
	top: 90px;
}


#story_image_2{
	width: 320px;
	height: 320px;
	position: absolute;
	top: 90px;
}

#story_image_3{
	width: 320px;
	height: 320px;
	position: absolute;
	top: 90px;
}

#story_image_4{
	width: 320px;
	height: 320px;
	position: absolute;
	top: 90px;
}

#story_image_5{
	width: 320px;
	height: 320px;
	position: absolute;
	top: 90px;
}

#story_image_wide{
	width: 630px;
	height: 320px;
	position: absolute;
	top: 90px;
}

#story_image_content{
	position: absolute;
	top: 10px;
}
#caption{
	width: 320px;
	height: auto;
	position: relative;
	top: 5px;
}


/******************** callouts ***************/

#call_outs{
	width: 320px;
	height: 220px;
	position: absolute;
	top: 480px;
	z-index: 100;

}


#call_out_2{
	width: 320px;
	height: 220px;
	position: absolute;
	top: 480px;

}

#call_out_3{
	width: 320px;
	height: 220px;
	position: absolute;
	top: 480px;

}

#call_out_4{
	width: 320px;
	height: 220px;
	position: absolute;
	top: 480px;

}

#call_out_5{
	width: 320px;
	height: 220px;
	position: absolute;
	top: 480px;

}

#callout_text{
	position: absolute;
	top: 10px;
	
}

#callout_text ul{
	position: relative;
	left: -20px;
	font-weight: bold;
	font-size: 1.1em;
}

#callout_text li{
	position: relative;
	left: 10px;
	font-weight: normal;
		font-size: 0.9em;
}

.story_numbers{
	background-image:url(../images/number_bkg_up.gif);
	background-repeat:repeat;

	padding-left: 3px;
	padding-right: 3px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.95em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
}

.story_numbers_over {
	background-image:url(../images/number_bkg_over.gif);
	background-repeat:repeat;
	padding-left: 3px;
	padding-right: 3px;
	
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.95em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	color: #FFFFFF;	
}

a.story_numbers:hover {
	background-image:url(../images/number_bkg_hover.gif);
	background-repeat:repeat;
	padding-left: 3px;
	padding-right: 3px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.95em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	color: #000000;	
}



#sub_menu_items li, #sub_menu_items2 li{
	list-style:url(../images/gallery_small_arrow.gif);
	text-indent: -14px;
	padding: 2px;
	height: auto;
	position: relative;
}


#sub_menu_items{
	position: relative;
	top: -35px;
	left: -5px;
	height: auto;
}
#sub_menu_items2{
	position: relative;
	top: -50px;
	left: -5px;
	height: auto;
}

	
#sub_menu_items,
#sub_menu_items2, 
#sub_menu_item,
#sub_menu_item_over {
	position: relative;
}


#sub_menu_item,
#sub_menu_item a,
#sub_menu_item a:link,
#sub_menu_item a:active,
#sub_menu_item a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	color: #ffffff;
	position: relative;
	left: 0px;
	height:auto;
	padding: 2px;
}
#sub_menu_item  a:hover{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	color: #FF9933;
	position: relative;
	left: 2px;
	height:auto;
	padding: 2px;
}

#sub_menu_item_over, 
#sub_menu_item_over a{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	color: #FF9933;
	position: relative;
	left: 0px;
	height: auto;
	padding: 2px;
}
#sub_menu_item_over  a:hover{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	color: #FF9933;
	position: relative;
	left: 2px;
	height: auto;
	padding: 2px;
}

#sub_menu{
	width: 124px;
	position: relative;
	top:2px;
	
}

/*
	modified 7 January 2008 by Ted Koterwas: commented out #asset style defintion because it seemed superfluous,
	and it had a width set to greater than the box meant to contain it - this was wreaking havoc in IE6 
*/

/*
#asset{
	width: 350px;
}
*/

#asset a,
#asset a:link,
#asset a:active,
#asset a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight:bold;
	text-decoration: none;
	color: #FFFFFF;
	position: relative;
	height:auto;
	width: 200px;

}

#asset a:hover{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight:bold;
	text-decoration: none;
	color: #FF9933;
	position: relative;
	height:auto;

}

/*
	modified 20 December 2007 by Ted Koterwas: added to top and  bottom padding
	to create enough white space so that when a swf with a control bar replaces the still
	above the caption, there is enough space above it. the bottom padding keeps the caption 
	from being closer to things below it than to the image above. 
*/


#caption, #caption2, #caption3, #caption4, #caption5 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	font-style: normal;
	font-weight: normal;
	text-decoration: none;
	color: #FFFFFF;
	position: relative;
	top: 10px;
	height:auto;
	padding: 15px 0px 18px 0px;
	width: 320px;
}

#caption2, #caption3, #caption4, #caption5 {
	padding: 25px 0px 28px 0px;
}

#this_page_floating_col{
	position: relative;
	top: 10px;
}
	



#box_title{
padding: 3px;
height: auto;
}


	
#still1 {
position:relative;
left: 0px;
top: 0px;
display:block;
height: auto;
z-index: 200;
}

#still2, #still3, #still4, #still5{
position:relative;
left: 0px;
top: 10px;
display:block;
height: auto;
z-index: 200;
}	


#still1 input, #still2 input, #still3 input, #still4 input, #still5 input{
height: auto;

}
/*
	modified 20 December 2007 by Ted Koterwas: changed top from 10px to 23px to align the swf
	with the still it covers
*/
		
#swf1{
position:absolute;
left: 0px;
top: 23px;
display: none;
height: 300px;
}
#swf2, #swf3, #swf4, #swf5{
position:absolute;
left:0px;
top: 30px;
display: none;
height: 300px;
}


#asset_buttons{
	position:relative;
}

#gallery_link{
	position:relative;
	left: 0px;
	top: 60px;
	z-index: 200;
	height: auto;
}
#swf_button1_show, #swf_button2_show, #swf_button3_show, #swf_button4_show, #swf_button5_show{
	position: absolute;
	top: 10px;
	height: 50px;
	left: 0px;
	display:block;
	z-index: 80;
}

/*
	modified 20 December 2007 by Ted Koterwas: changed top from 0px to 10px to match
	the "show" buttons above, to prevent the button from jumping when clicked
*/

#swf_button1_hide, #swf_button2_hide, #swf_button3_hide, #swf_button4_hide, #swf_button5_hide{
	position: absolute;
	top: 10px;
	height: 50px;
	left: 0px;
	display: none;
}



#slideshow_image{
	height: 250px;	

	position: relative;
	}


#slideshow_caption{
	height: 30px;	
	position: relative;
	padding: 3px;
	}

#slideshow_controls{
	height: 30px;	
	text-align: left;
	position: relative;
	left: 0px;
	z-index: 100;
	}
/*
	modified 20 December 2007 by Ted Koterwas: added .floated_link class to float links that would otherwise be covered by
	floated media boxes
*/
	
.floated_link{
	float:left; 
	position:relative; 
	top:80px;
}