/*DFL Index (Main Page) Styles*/

/* =INDEX PAGE
----------------------------------------------- */


/*Body element applied to all fish pages.*/
	body {
		background-color:	#08203a;		/* #622415 */
		width:					750px;
		margin-right:			auto;
		margin-left:				auto;
		margin-top:				0px;
		margin-bottom:		10px;
		padding:					0;
		background-repeat:	repeat-x;
	}
	
/*Sets the main page's background image.*/
	.index_middle {
		background-image:	url("./images/bg.jpg") ;
		width:				750px;
		height:				600px;	
	}
/*These position the section links on the main page.  Be wary of changing, as there are separate IE hacks for every title.  If you can think of a better means of doing this, then by all means implement it.*/
	.title_1 h4, div.title_1 a, div.title_2 h4, div.title_2 a, div.title_3 h4, div.title_3 a, div.title_4 h4, div.title_4 a {
		font-family:		sans-serif;
		color:				#003366;  /* #022454; */
		font-size:			12px;
		line-height:		75%;
		text-decoration:	none;
	}
	.title_1 h3, div.title_1 a, div.title_2 h3, div.title_2 a, div.title_3 h3, div.title_3 a, div.title_4 h3, div.title_4 a  {
		font-family:		Arial, Helvetica, Verdana, sans-serif;
		font-size:			20px;
		color:				#022454;
		line-height:		0%;
		text-decoration:	none;
	}
	.title_1 {
		position: 			absolute; 
		height:				50px;
		width:				300px;
		left: 				480px; 
		top: 				220px;
	}
	.title_2 {
		position: 			absolute; 
		height:				50px;
		width:				300px;
		left: 				400px; 
		top: 				300px; 
	}
	.title_3 {
		position: 			absolute; 
		height:				50px;
		width:				300px;
		left: 				325px; 
		top: 				380px; 
	}
	.title_4 {
		position: 			absolute; 
		height:				50px;
		width:				300px;
		left: 				310px; 
		top: 				416px; 
	}
	
	h4.sub_header {
		color:				#CC6600;
		margin:				10px 0 0px 0;
		}
		
	h3 {
		color:			#000000;
	}

	h3.terms_section {
		color: #CC6600;
		margin-top: 10px;
		}
	
	.use_warning {
		font-weight: bold;
		color: #CC6600;
		}
		
	.name {
		text-align: right;
		font-weight: bold;
		}
		
	.dfl_logo {
		z-index: 1;
		position: absolute;
		top: 7px;
		right: 6px;
		}
	
/* =BACKGROUND NOFISH
----------------------------------------------- */

/*This div has the same fomatting but no fish.*/
	.index_middle_no_fish {
		background-color:	#f4e7cc;
		height: 100%;
		/* overflow: auto; */
		font-size:			11px;
		padding:			0px 50px 0px 50px;
		font-weight:		normal;
		letter-spacing:		1.02px;
	}
	
	.index_middle_no_fish .title {
		font-size:			10px;
		color:				#003366;  /* #0099cc; */
		font-weight:		bold;
		letter-spacing:		1.1px;
		}

	.index_middle_sub_sub, .index_middle_sub  {
		font-size:			12px;
		padding:			0px 50px 0px 50px;
		font-weight:		bold;
	}

/* =LISTS
----------------------------------------------- */

/* Top nav aranges the navigation for the top of the index page.*/
	.index_top {
		background-color:	#0c3e57; /* #336 */
		width:				750px;
		height:				50px;
	}
	#top_nav ul li a {
		font-family:		Arial, Helvetica, Verdana, sans-serif;
		font-weight:		bold;
		font-size:			15px;
		color:				#4abbd6; /* #fde7bd */
		text-decoration:	none;
		padding-left:		.5em;
		letter-spacing:		.1375em;
		position:			relative;
	}
	#top_nav ul {
		margin:				0;
		padding:			0;
		list-style-type:	none;
		text-align:			left;
		padding-top:		5px;
	}
	#top_nav ul li{
		display:			inline;
	}
	#top_nav li{
		padding-left:		3px;
	}
	
	/* Bottom nav arranges the navigation at the bottom of the main page.  Be wary, there is another IE hack here. */
	div.index_bottom {
		background-color:	#300;
		width:				750px;
		height:				50px;
		position:			static;
		margin-top:			-16px;
		z-index:			-1;
	}
	* html div.index_bottom {
		margin-top:			0px;
	}
	#bottom_nav a {
		font-family:		Arial, Helvetica, Verdana, sans-serif;
		font-weight:		bold;
		font-size:			14px;
		color:				#cc643d;  
		text-decoration:	none;
		letter-spacing:		.1375em;
	}
	#bottom_nav ul {
		list-style: 		none;
		padding-right:		60px;
	}
	#bottom_nav li {
		float:				right;
		margin:				12px;
		margin-top:			10px;
	}
	* html #bottom_nav li {
		margin-top:			12px;
	}
	
	@media print{

.objectbox_left,
.objectbox_right {border: 1px solid black;}

#major_div_2 img{display: none;}

.index_middle_middle {position: absolute; top: 0px; left: -50px;}

.index_middle_middle img{display: inline;}

}


/* =BANNERS
----------------------------------------------- */
.top_banner.references{
	background-image:	url(images/banner_references.jpg);
	}
	
.top_banner.teachers{
	background-image:	url(images/banner_ft.gif);
	}
	
.top_banner.links{
	background-image:	url(images/banner_links.jpg);
	}
	
.top_banner.aboutus{
	background-image:	url(images/banner_aboutus.gif);
	height: 			65px;
	margin-bottom:		10px;
	}

.top_banner.about {
	background-image:	url(images/banner_about.gif);
	height: 			65px;
	margin-bottom:		10px;
	}
	
.top_banner.terms {
	background-image:	url(images/banner_terms.gif);
	height: 			65px;
	margin-bottom:		10px;
	}
	
.top_banner.contactus {
	background-image:	url(images/banner_contact.gif);
	height: 			65px;
	margin-bottom:		10px;
	}
	
/* =FLOATS
----------------------------------------------- */

/* Float right and left changed to a class; can be used on images or divs */

.frr {
	float:				right;
	margin:				5px 0px 5px 10px;	/* if looks ugly or don't need, clear wth style in the actual tag */
	text-align:			right;
	}
	
.frl {
	float:				right;
	margin:				5px 0px 5px 10px;	/* if looks ugly or don't need, clear wth style in the actual tag */
	text-align:			left;
	}
	
.fll {
	float:				left;
	margin:				5px 10px 5px 0px;	/* if looks ugly or don't need, clear wth style in the actual tag */
	text-align:			left;
	}
	
.flr {
	float:				left;
	margin:				5px 10px 5px 0px;	/* if looks ugly or don't need, clear wth style in the actual tag */
	text-align:			right;
	}

.cl {
	margin:				0px auto;
	text-align:			left;
	}
.cc {
	margin:				0px auto;
	text-align:			center;
	}
.cr {
	margin:				0px auto;
	text-align:			right;
	}

	
/* =CAPTIONS
----------------------------------------------- */

.com_name {
	text-transform:		capitalize;
}

.sci_name {
	font-style:			italic;
	}

.caption {
		font-size:			10px;
		font-family:		Verdana, Arial, Helvetica, sans-serif;
	}
	
	.caption .related {
		margin-top:			5px;
	}
	
	.caption .related h5 {
		font-size:			10px;
		font-family:		Verdana, Arial, Helvetica, sans-serif;
		font-weight:		bold;
	}
	
	.caption .com_name {
		font-family:		Verdana, Arial, Helvetica, sans-serif;
		}
	
	.caption .zoom {
		background: url('images/zoom.gif') no-repeat;
		padding-left: 14px;
		margin-left:	2px;
		display: inline;
		}
		
	.caption .video {
		background: url('images/video.gif') no-repeat;
		padding-left: 	21px;
		font-size:		12px;
		display: 		inline;
		line-height:	20px;
		}
	
	.caption .desc {
		display:			block;
		}
		
	.caption .title {
		display:			block;
		font-weight:		bold;
		}
	.caption .com_name {
		font-weight: 		bold;
		}
		
	.caption .source {
		display:			block;
		color:				#333333;
		}
	.caption .source  a:link, .caption .source  a:visited, .caption .source  a:active, .caption .source  a:hover  {
		font-weight:		bold;
		text-decoration:	none;
		color:				#999999;
		}	
		
	.caption .source .tiny {
		font-size:			9px;
		color:				#999999;
		}
	.caption .source .tiny a:link, .caption .source .tiny a:visited, .caption .source .tiny  a:active, .caption .source .tiny  a:hover  {
		font-weight:		bold;
		text-decoration:	none;
		color:				#999999;
		}	

	.caption.tiny {
		font-size:			8px;
	}
		
	.caption .linkout {
		display: 			block;
		margin:				2px 0;
		color:				#999999;
		}
		
	.col_third .caption .linkout a {
		display: inline;
		}

	.caption a:link, .caption a:visited, .caption a:active, .caption a:hover  {
		font-weight:		bold;
		text-decoration:	none;
		}