/**
 * Two level CSS Menu
 * Developer: Qingmin Liu
 * Date: 4/2007
 * @copyright: IS Dept. WFHC.
 */

.clearit {
	clear: both;
	height: 0;
	line-height: 0.0;
	font-size: 0;
}

#menubar, #menubar li, #menubar ul {
	padding: 0;
	margin: 0;
	list-style: none;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:12px;
}

#menubar a:link, #menubar a:visited{
	display: block;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
	color: #000000;
	background: transparent;
	padding: 2px;
}

/* Static menu when mouse over */
#menubar a:hover{
	background:#8B4513;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight:bold;
	color:#FFFFFF;
	border-style: outset;
	border-width: 0px; 
	border-color: #660033;
}

/* Make active menu when mouse over
#menubar a:hover{
	background:#8B4513;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight:bold;
	color:#FFFFFF;
	border-style: outset;
	border-width: 1px; 
	border-color: #660033;
}
*/
#menubar a:active{
/*	background: #99FFFF; */
	font-family:Arial, Helvetica, sans-serif;
	background-color: #D19800;
	/*
	border-width: 1px;
	margin-bottom:-1px;
	margin-top:-1px;
	margin-left:-1px;
	margin-right:-1px;
	*/
}

/**
	The Root-Level list items. Floating left allows
	them to appear horizontally. 
*/
#menubar li {
	float: left;
	width: auto;
}

/*
	Sets width for Sub-Menu box and the List Items inside - in proportional em units. 
	This allows the sub-menu width to expand if users resize the text in their browsers.
*/
#menubar li ul, #menubar ul li  {
	font-weight: normal;
	text-align:left;
	width: 17em;
}

/*
	The sub-menu links. We set color and turn off the right border, which
	would otherwise be inherited from the root link rule. We set top and 
	bottom padding less than the root items and increas the left padding
	to indent the sub-menu links a small amount in from the root links.
*/
#menubar ul li a  {
	color: #565656;
	border-right: 0;
	padding: 3px 12px 3px 12px;
}

#menubar li ul {
	position: absolute;
	display: none;
	background-color: #FFFFFF;
	border-right: 1px solid #0099FF;
	border-bottom: 1px solid #0099FF;
	z-index:10;
}

/*
	Changes color when the Root-Level menu items are moused over. 
	The second selector sets color and background when Root-Level items are accessed 
	with the keyboard tab key. The third selector sets an active state 
	to support keyboard access in MSIE. The fourth selector is assigned to IE5 and IE6 
	Windows via the IE7Menu script.	Note that IE7 supports hover on elements 
	other than links and so behaves like Firefox, Opera, and Safari - making 
	the menu operable even if JavaScript is not enabled.
*/

#menubar li ul li:hover a, #menubar li ul li a:focus, #menubar li ul li a:active, #menubar li ul li.hvr a {
	font-size: 12px;
	font-style:italic;
	color: #FFFFFF;
	background-color: #8B4513;
}

/*
	Set the Sub-Menu UL to be visible when its associated
	Root-Level link is moused over. The second selector is 
	assigned to IE5 and IE6 via the IE7Menu script.
*/
#menubar li:hover ul, #menubar li.hvr ul {
	display: block;
	background-color:#FCEDE0;
}

/*
	Sets the Text color of the Sub-Level links when the Root-Level
	menu items are moused over. The second selector is assigned to IE5 and IE6 
	via the IE7Menu script. The color set should march the normal Sub-Level 
	link color in the rule: menubar ul li a. The background color must be transparent 
	to allow the underlying gradient background on the UL to show through.
*/
#menubar li:hover ul a, #menubar li.hvr ul a {
	color: #000000;
	background-color: transparent;
}

/*
	The normal hover class for Sub-Level links. The Important directive
	is required for older browsers.
*/
#menubar ul a:hover {
	background-color: #8B4513!important;
	color: #FFFFFF!important;
}