/********************************************************************************* 
* Top Navigation Bar Settings - START
*
* Purpose:
*     These settings control the primary entries in the top navigation bar.
*     The flyout entry settings are in a separate file. 
*
* Technical Notes:  
* 1)  These settings are designed to work in popular browsers like
*     IE6, IE7, Firefox, Opera and Google Chrome.
* 2)  Styles suffixed with "Selected" are applied to elements that are for the
*     page actually being displayed to the user.
* 3)  Styles suffixed with "Highlighted" are applied to elements when the 
*     page being displayed is a child (hierarchically underneath) the 
*     highlighted element.
* 4)  Styles suffixed with "NoHref" indicate entries that are simply placeholders
*     to organize a group of pages, but the entry itself isn't a page.  So 
*     these entries cannot be clicked on, but will cause any sub menues to 
*     "fly out" if the mouse is hovered over them.
*
* History:
* 2008-09-20 - Luther Casey
*   - Created file using previous styles created by David Collins, and 
*     styles used for Infocentre as a starting point. 
**********************************************************************************/

/*
* Single UL element that contains all of the top navigation bar elements, including
* flyout menu items if they exist.
* Each primary nav bar entry is an LI element within this UL.
*/
ul.topNavigationMenu_UL1
{
	clear: both;
	
	background-image : url(images/navbar_bg.gif);
    background-repeat: repeat-x;
    background-position: left center;

	border-bottom: 1px solid #ccc;
	border-left: 0;
	border-right: 1px solid #ccc; 
	border-top: 1px solid #ccc;
	
	float:  left;
	height: 1.7em;    
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
	width: 100%;   /* This is the correct setting whether we are in a table or not. */
    
    /*
	* If we don't put this on this element then the flyouts might cover up
	* other elements on the page. 
	*/
    z-index: 99; 
}

/*
* Level 1 LI elements that are always visible as each entry of the navigation bar.  
* Each entry contains an A tag whose settings are below.  Apply borders, 
* backgrounds, and colors to the A elements and not to the LI elements.
*/
li.topNavigationMenu_LI1,
li.topNavigationMenu_LI1Highlighted,
li.topNavigationMenu_LI1Selected
{
	display: block;
	float: left;
	line-height: normal;
	margin: 0;
	padding: 0;
	position: relative;         /* anchor point for absolutely positioned subnavs */
	text-align: center;	
	
	/*
	* If we are displaying the menu in a table then each UL/LI will be in a TD
	* element.  So we want to take up 100% of the TD cell we are in.
	* 
	* If you turn off generation of the table, see notes above for 
	* table.topNavigationMenu_TBL, then each LI will have to have its own width
	*/
	/*width: 100%;       */
}


/*
* Define general characteristics for all 
* A elements that are in each primary navigation LI element 
* and are always visible. We are applying the same settings 
* for all entries (whether selected or not) and then overridding
* some settings for the selected entry below.  
*/
a.topNavigationMenu_A1,
a.topNavigationMenu_A1Highlighted,
a.topNavigationMenu_A1HighlightedNoHref,
a.topNavigationMenu_A1Selected,
a.topNavigationMenu_A1NoHref
{
	display: block;
	float: none;              
	font-size: .85em;         
	font-weight: bold;
	letter-spacing: 0;
	padding-top: .5em;
	padding-bottom: .3em;
	
    /*
	* The padding that will be applied when the "IsAutoCalculateWidthsForNavElements"
	* option is turned off (see RebarControls.skin file).  If the auto widths option
	* is turned on then the framework will override these settings with in-line
	* styles in the rendered html.
	*/
	padding-right: 1em;
	padding-left: 1em;  
	
	text-align: center;
	text-transform: lowercase;
	white-space: nowrap;
	text-decoration: none;
	
	border-left: solid 1px #eee;
	border-right: solid 1px #aaa;
	color: #222;                  
}

/*
* Menu items that are not selected and not highlighted will have
* a gradiant background image.
*/
a.topNavigationMenu_A1:link,
a.topNavigationMenu_A1:visited
{
	/*
	* Default background settings.  DO NOT put these on the UL
	* element or else the rollover/hover colors won't work in IE.
	*/
	background-color: transparent;
	color: #222;                  
}

/*
* The Highlighted or Selected entry will have a different
* gradiant background image to make it stand out.
*/
a.topNavigationMenu_A1Selected,
a.topNavigationMenu_A1Selected:link,
a.topNavigationMenu_A1Selected:visited,
a.topNavigationMenu_A1Highlighted, 
a.topNavigationMenu_A1Highlighted:link, 
a.topNavigationMenu_A1Highlighted:visited,
a.topNavigationMenu_A1HighlightedNoHref
{
	/*
	* Default background settings.  DO NOT put these on the UL
	* element or else the rollover/hover colors won't work in IE.
	*/
/*
	background-color: transparent;
    background-image : url(images/navbar_bg_on.gif);
    background-repeat: repeat-x;
    background-position: left center;
	color: #222;
*/
}

/*
* If the entry is clickable, then change the background when
* the mouse hovers over it and make the hyplink text underlined
* so it is more obvious it is a link.
*/
a.topNavigationMenu_A1:hover,
a.topNavigationMenu_A1Highlighted:hover 
{
	background-color: #fff;
    background-image: none;
	text-decoration: underline;
}   

/*
* The selected entry represents the page the user is already
* on.  It is not clickable, so force the text to NOT have an
* underline, and keep the cursor as the default arrow.
*/
a.topNavigationMenu_A1Selected:hover
{    
	cursor: default;           
	text-decoration: none;
}

/*
* If the menu item does not have an HRef value then it is just a placeholder
* and doesn't actually have a corresponding web page.  So we don't want the
* entry to highlight or the cursor to change, so it will be obvious that
* clicking it won't do anything.
*/
a.topNavigationMenu_A1HighlightedNoHref:hover,
a.topNavigationMenu_A1NoHref:hover
{    
	cursor: default;           
	text-decoration: none;
}