/********************************************************************
 * Description: CSS for TOP_SECTION, everything under TOP_SECTION will
 *				be in the #TOP_SECTION group, top section includes logo
 *				and navbar
 *
 * Update:	7/28/2006 Huming Tang, Added head_white to set the white search header
 * Author:	Jesscia Honikman, Huming Tang
 ********************************************************************/

/*GENERAL top section css*/
#TOP_SECTION 
{
	width:770px;
	background-color: white;
}


/*Header white color*/ 
#TOP_SECTION .head_white{
	color: white;
}

/*this is for home page only, the header column is column position at 1/2 of header width*/
#TOP_SECTION .header_column_left{
	float:left;
	width:385px;
	height:73px;
	padding:0px;
	margin:0px;
	border-width: 0px;	
}

#TOP_SECTION .header_column_right{
	float:left;
	width:360px;
	height:73px;
	padding:0px;
	margin:0px;
	border-width: 0px;	
}

/*this is the home page search style... the big purple thingy*/
/*this is the home page search style... and the problem is that align center is not working in firefox... so use
absolute padding*/
#TOP_SECTION .homepage_search{
	padding-top: 45px;
	padding-left: 113px;
}

#TOP_SECTION .search_box_hp{
	width: 160px;
}

/*use this to fix the mac safari bug*/
#TOP_SECTION .utility_link,
#TOP_SECTION .utility_link_active
{ 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 11px;
	font-weight: normal; 
	color: purple;
	text-decoration: none;
	height:20px;
}
html>body #TOP_SECTION .utility_link
html>body #TOP_SECTION .utility_link_active{
	font-size: 10px;
}

#TOP_SECTION .utility_link_active { 
	font-weight:bold;	
}

#TOP_SECTION .utility_link:hover { 
	
	text-decoration: underline;
}

/* 
	the top navigation css, top navigation is the navigation bar directly under the logo
*/

/*here we define the style of the top most links: e-mail page and print page*/
#TOP_SECTION .top_util_links {
	background-color: #ECECEC;
	text-align: right;
	font-size: 10px;
	height:20px;
	width:770px;
}


/* this is deprecated due to the need to use active link from the menu script
ul should contain all the font information for the top navigation*/

#TOP_SECTION ul{
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-weight: bold; 
	line-height: 35px;
	margin: 0px;
    padding: 0px;
	white-space: nowrap;
}
#TOP_SECTION li{ 

	color: #FFFFFF;
	list-style-type: none;
	display: inline;
	margin: 0px;
	text-align: left;

}

#TOP_SECTION li a{ 

list-style-type: none;
display: inline;
padding-left:10px;
padding-right:10px;
padding-top:11px !important;
padding-bottom:11px !important;
text-decoration: none;
text-align: center;

}

#TOP_SECTION li a:hover{ 
background-color:#E3D9EC;
text-decoration: none;
list-style-type: none;
display: inline;
}

#TOP_SECTION li a:active{ 
color: purple;
background-color:#E3D9EC;
text-decoration: none;
list-style-type: none;
display: inline;
}


/*Search box style information*/
#search-header .search_box{ 
font-family: Verdana, Arial, Helvetica, sans-serif; 
height: 12px;
font-size:10px;
width: 150px;
border-width: 1px;
border-style:solid;
border-color:#333333;


}

/*search box radio button style*/
#TOP_SECTION .radio_box {
	border-width: 0px;
}



/*here we need to vertial align the search box*/
#Layer2 {
	text-align: center;
}/********************************************************************
 * Description: CSS for TOP_SECTION, everything under TOP_SECTION will
 *				be in the #TOP_SECTION group, top section includes logo
 *				and navbar
 *
 * Update:	7/28/2006 Huming Tang, Added head_white to set the white search header
 * Author:	Jesscia Honikman, Huming Tang
 ********************************************************************/

/*GENERAL top section css*/
#TOP_SECTION 
{
	width:770px;
	background-color: white;
	height:123px;
	/*defines the gradient of util link bar*/
	background: white url(../images/top_gradient.jpg) top left repeat-x;
}


/*Header white color*/ 
#TOP_SECTION .head_white{
	color: white;
}

/*this is for home page only, the header column is column position at 1/2 of header width*/
#TOP_SECTION .header_column{
	float:left;
	width:385px;
	height:73px;
	padding:0px;
	margin:0px;
	border-width: 0px;
	
}

/*this is the home page search style... the big purple thingy*/
/*this is the home page search style... and the problem is that align center is not working in firefox... so use
absolute padding*/
#TOP_SECTION .homepage_search{
	padding-top: 45px;
	padding-left: 113px;
}

#TOP_SECTION .search_box_hp{
	width: 160px;
}

/*use this to fix the mac safari bug*/
#TOP_SECTION .utility_link,
#TOP_SECTION .utility_link_active
{ 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 11px;
	font-weight: normal; 
	color: purple;
	text-decoration: none;
	height:20px;
}
html>body #TOP_SECTION .utility_link
html>body #TOP_SECTION .utility_link_active{
	font-size: 10px;
}

#TOP_SECTION .utility_link_active { 
	font-weight:bold;	
}

#TOP_SECTION .utility_link:hover { 
	
	text-decoration: underline;
}

/* 
	the top navigation css, top navigation is the navigation bar directly under the logo
*/

/*here we define the style of the top most links: e-mail page and print page*/
#TOP_SECTION .top_util_links {
	background-color: #ECECEC;
	text-align: right;
	font-size: 10px;
	height:20px;
	width:770px;
}


/* this is deprecated due to the need to use active link from the menu script
ul should contain all the font information for the top navigation*/

#TOP_SECTION ul{
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-weight: bold; 
	line-height: 35px;
	margin: 0px;
    padding: 0px;
	white-space: nowrap;
}
#TOP_SECTION li{ 

	color: #FFFFFF;
	list-style-type: none;
	display: inline;
	margin: 0px;
	text-align: left;

}

#TOP_SECTION li a{ 

list-style-type: none;
display: inline;
padding-left:10px;
padding-right:10px;
padding-top:11px !important;
padding-bottom:11px !important;
text-decoration: none;
text-align: center;

}

#TOP_SECTION li a:hover{ 
background-color:#E3D9EC;
text-decoration: none;
list-style-type: none;
display: inline;
}

#TOP_SECTION li a:active{ 
color: purple;
background-color:#E3D9EC;
text-decoration: none;
list-style-type: none;
display: inline;
}


/*Search box style information*/
#search-header .search_box{ 
font-family: Verdana, Arial, Helvetica, sans-serif; 
height: 12px;
font-size:10px;
width: 150px;
border-width: 1px;
border-style:solid;
border-color:#333333;


}

/*search box radio button style*/
#TOP_SECTION .radio_box {
	border-width: 0px;
}

/*bug fix*/
/*since there is search box in layer1, we have to put the layer1 custom style here*/

/*this is used to fix the bug where firefox will not inherit color of div without defined height*/
#TOP_SECTION {
	height: 123px;
}

/*here we need to vertial align the search box*/
#Layer2 {
	text-align: center;
}

#Layer1 {
	
	height: 15px;
	width:370px;
	float: left;
	z-index:1;
	clear: both;
	vertical-align: bottom;
}

/*setting for all components in top util section*/
#Layer1,
#search-header
{
	margin: 5px;
	margin-bottom:0px;
	padding-top: 3px;
	padding-bottom: 2px;	
}

/*this is the image layer that contains the header images*/
#Layer2 {
	
	width:770px;
	z-index:2;
	left: 0px;
	margin:0px;
	padding:0px;
	background-color: #43276F;
	clear: both;
	float: left;
	height: 73px;
	background-color: white;
	
	
}

/*this is the style for search header*/
#search-header {
	/*height is required at 20px to get correct positioning*/
    height:20px;
	width:350px;
	float: right;
	z-index:1;
	font-size: 11px;
	text-align:right;
	
			
}

#search-header *{
	vertical-align: top;
}

/*global link setting*/
a {
	text-decoration:none;
	color:white;
}


/*global search form setting*/
.search-form {
	display: inline;   		
}

/*the gray divider that seperates the links |*/
.gray_divider {
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 11px;
	line-height: 16px;
	font-weight: normal; 
	color: #666666;
	text-decoration: none;
	margin-top: 10px;
}

/* 
	the utility css, utiliy is the list of links pointed to other page above the logo, 
	off means the current page is not of the link
	on means the current page is of the link
*/

.utility_link{ 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 10px;
	font-weight: normal; 
	color: purple;
	text-decoration: none;
	height:20px;
}

.utility_link:active { 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 10px;
	font-weight: bold; 
	color: purple;
	text-decoration: none;
	height:20px;
}

.utility_link:hover { 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 10px;
	font-weight: normal; 
	color: purple;
	text-decoration: underline;
}

/*this is the top navigation nav bar*/
#Layer3 {
	width:770px;
	z-index:1;
	background: #5a3b7e url(/images/nav_bg.jpg) top left repeat-x;
	clear:both;
	float: left;
	
}

/*style for the search links above the search box*/
#TOP_SECTION .search_util_link

{
	padding-bottom:5px;
	padding-top: 10px;
	font-weight: bold;
	
}

/*this customize the search link and the form field*/
#TOP_SECTION .search_util_link,
#TOP_SECTION .form
{
	
	text-align:right;
	padding-right: 5px;
}


/*Search box style information*/
#Layer2 .search_box
{ 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	height: 12px;
	font-size:10px;
	width: 150px;
	border-width: 1px;
	border-style:solid;
	border-color:#333333;


}

/*this need to be redefined in this context because the top container changed*/
/*style for standard link in center section*/
#TOP_SECTION a{ 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	line-height: 13px;
	font-weight: normal; 
	/*font-size: 11px;*/
	color: #0079AA;
	text-decoration: none;
}

#TOP_SECTION #Layer1,
#TOP_SECTION #search-header
{
	padding-top: 25px;
	/*font-weight: bold;*/
	padding-left: 0px;
}