@charset "UTF-8";

/* SpryMenuBarHorizontal.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/*******************************************************************************

 LAYOUT INFORMATION: describes box model, positioning, z-order

 *******************************************************************************/

/* The outermost container of the Menu Bar, an auto width box with no margin or padding 
BUT for AMSA web  site, 6 px of right side padding was added to make menubar more closely 
fit the complete width of the fixed width web page template. */

ul.MenuBarHorizontal
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	cursor: default;
	width:auto;
	position:relative;
	background-color:#FFFFFF;
}
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
{
	z-index: 1000;
}

/* Menu item containers, position children relative to this container and are a fixed width */


/* THE FOLOWING SECTION, MENU BAR HORIZONTAL LI is what appears on the template page before cursor hovers over it.
This is the horizontal list of the Twelve (12) categories of menu items seen at the very top on every page of the AMSA site.
NOTE: The default width had been set at width: 8em; but that made all menu items too wide and far too wide when not
needed in case of short word on menu.
For AMSA site, the width was set at "auto" to allow for  variable spaces to fit the narrower menu items and 
wider menu items. 
The FONT is set at 11 pixels to just fit in the one line of horizontal menu items and the line height is set at 12 pixels. */

ul.MenuBarHorizontal li
{
	margin: 0;
	padding: 0 0px;
	list-style-type: none;
    font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight:bolder;
	text-align: left;
	color: #A9CFD3;
	background-color: #4A73B4;
	position: relative;
	cursor: pointer;
	width:80;
	float: left;
	border-color:#A9CFD3; 	/* light grey border color  */
	line-height: 12px;
}
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 10px;
	color: #FFFFFF;
	text-align:left;
	background-color: #4A73B4;
	border:thick;
	border-color: #A9CFD3; /* medium blue border color is same as headline in sidebar and background of search bar */
	z-index: 1020;
	cursor: default;
	width: 100px;
	position: absolute;
	left: -1000em;
}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */

ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
{
	left: auto;
}
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
{
	width: 14em;  /* COMMENT FOR AMSA: The default submenu width of 12em is too narrow.
	This WIDTH OF SUBMENUS was set much wider at 14em, 
	instead of 12em in order to fit the long names in AMSA. */
}
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
/* For the AMSA submenues, this Webmaster prefers the submenus to appear slightly below, instead of up from the main meanu item. The setting is at (+) 2% instead of the default value of (-) 5%. 
AND more overlapping so the second submenu is set at overlapping to the right (85%) instead of the default value of (95%)
Firefox displays only 15% overlap but IE displays more than 50% overlap with setting at 85%.
Therefore setting is at 95% to ensure display of submenu when sub-submenu is displayed */

ul.MenuBarHorizontal ul ul
{
	position: absolute;
	margin: 2% 0 0 95%;
}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */

ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
{
	left: auto;
	top: 0;
}

/*******************************************************************************

 DESIGN INFORMATION: describes color scheme, borders, fonts

 *******************************************************************************/

/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
{
	border: 3px solid #A9CFD3;  /* medium blue border color is same as headline in sidebar and background of search bar */
}

	/* Menu and Submenu items are a dense AMSA BLUE color (same as FOOTER and the same as font in Body text)
	and the font color of Right Column (Sidebar1) content.
	The SubMenu items blocks have padding and no text decoration. 
	The Menu and Submenu FONT COLOR is WHITE #FFFFFF. */
	/* NOTE: AMSA Web master is attempting to add white borders around EACH Menu Item and each Submenu Item. */
	
ul.MenuBarHorizontal a
{
	display: block;
	cursor: pointer;
	background-color: #4A73B4;
	padding: 0.5em 0.75em;
	color: #FFFFFF;
	text-decoration: none;
	border-color: #999;  /* medium-dark grey border color  */
	border-width: thick;
}


/* Menu items that have mouse over or focus have a AMSA BLUE background and WHITE text  */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
	background-color: #4A73B4;
	color: #FFFFFF;
	border:thick;
}

/* Menu items that are OPEN WITH SUBMENUS are set to MenuBarItemHover with a YELLOW background and AMSA BLUE text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{
	background-color: #FFE863;
	color: #4A73B4;
}

/*******************************************************************************

 SUBMENU INDICATION: styles if there is a submenu under a given menu item
 AND A SUBMENU BACKGROUND IMAGE - THESE BACKGROUND IMAGES ARE NOT USED IN THE AMSA MENU OR SUBMENU ITEMS

 *******************************************************************************/

/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
{
	background-image: url(../SpryAssets/SpryMenuBarDown.gif); /* This URL MAY BE INCOMPLETE, NEED AMSA AT START? */
	background-repeat: no-repeat;
	background-position: 95% 50%;
}
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
{
	background-image: url(../SpryAssets/SpryMenuBarRight.gif); /* T his URL is COMPLETE, does not NEED AMSA AT START */
	background-repeat: no-repeat;
	background-position: 95% 50%;
}
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
{
	background-image: url(../SpryAssets/SpryMenuBarDownHover.gif); /* This URL MAY BE INCOMPLETE, NEED AMSA AT START? */
	background-repeat: no-repeat;
	background-position: 95% 50%;
}
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
{
	background-image: url(../SpryAssets/SpryMenuBarRightHover.gif);  /* This URL MAY BE INCOMPLETE, NEED AMSA AT START? */
	background-repeat: no-repeat;
	background-position: 95% 50%;
}

/*******************************************************************************

 BROWSER HACKS: the hacks below should not be changed unless you are an expert

 *******************************************************************************/

/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
{
	position: absolute;
	z-index: 1010;
}
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
{
	ul.MenuBarHorizontal li.MenuBarItemIE
	{
		display: inline;
		float: left;
		background: #FFF;
	}
}
