/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/flyout_horizontal.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any way to fit your requirements. 
=================================================================== */ 


/* ================================================================ 
Much credit for the CSS menus goes to Stu Nicholls,
Rodrigo del Busto modified the menu's so they work as drop downs on all major browsers
note that IE7 version of this page uses Javascript, as it does not behave as intended on
a:hover.
Later versions of this page envisage to have Javascript for IE7 removed. 

I have left my development comments in here to help others that might want to use this CSS

=================================================================== */ 

/*  notation:
	.name = class
	#name = id, used only once for item with that "ID"
	name = tag_name, applies to any tag in page with name
*/



/* Main menu for first tool bar, look different to others, so gets its own definition */
	
	#mainmenu {
			align:left;
 			}				
/* img */	
	#mainmenu img {	background: transparent; 	}
/* ul */		
	/* ul of main menu has higer z-index to ensure it stays above other navbars */
	#mainmenu ul {
			z-index:110;			list-style-type:none; 
			margin:0 0 0 0; 		padding:0;
			min-height:25px; 
			}				
/* li */
 	#mainmenu li {
			z-index:110;			float:left;  
 			position:relative;		margin: 5px 5px 5px 7px; 			} 
	#mainmenu li span {
			display:block; 			color:#ffffff; 
			font-size: 12px;		}
	#mainmenu li a, 
	#mainmenu li a:visited {display:block; padding:0; color:#ffffff;} /* top bar text is white because of background */
	#mainmenu li a:hover {border:0;}
	#mainmenu li:hover dd, 
	#mainmenu li a:hover dd {display:block;}      /* this show the DD submenu */
	#mainmenu li:hover dt a, 
	#mainmenu li a:hover dt a { /* change main bar selector background to black */
			color:#ffffff;
			background: #000000; 	
			display:block;}
/* dl */
	#mainmenu dl {
			position:absolute; 
			top:0;	left:0; margin: 0; 	padding: 0; } 				/* this does the main positioning trick */
/* dt */
	#mainmenu dt {margin:0; 	font-size: 12px; float:left;  }
 	#mainmenu dt a, 
	#mainmenu dt a:visited {
			display:block; 
			color:#ffffff;		 /* main element to change text colour  */
			text-decoration:none;}
/* dd */
	#mainmenu dd {
			display: none;
/* magic */		
			opacity: .80;
			filter: alpha(opacity=80);
			-moz-opacity: 0.80;
			filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
		 	background: #cc0000; 	
/* magic */				
			clear: left;
			margin: 0;
			padding: 0px 0px 0px 0px;
			width: 120px;
			color: #ffffff;
			font-size: 12px;
			text-align: left;}
	#mainmenu dd a, 
	#mainmenu dd a:visited {
			padding: 3px 7px 6px 13px;
			color: #ffffff;
			text-decoration: none;
			display: block;
		}
	#mainmenu dd a:hover {
			background: #000000; 
			display: block;		}

/* Menu for generic tool bars, designed for a white background */
		
	.earmenu { 		display:block; 	z-index:100;	}

/* img */			
	.earmenu img {	background: transparent; 	}

/* ul */
	/* ul of main menu has lower z-index to main menu to ensure it stays below other navbars */
	.earmenu ul {
			z-index:100;			list-style-type:none; 
			margin:0 0 0 0; 		padding:0;
			min-height:25px; 		}				
/* li */
	.earmenu li {
			z-index:100;			float:left;  
 			position:relative;  	margin: 5px 5px 5px 7px; 		} 
	.earmenu li span {
			display:block; 			color:#ffffff;
			font-size: 12px;		}
	.earmenu li a, 
	.earmenu li a:visited {display:block; padding:0; color:#000000;} 
	.earmenu li a:hover {border:0;}
 	.earmenu li:hover dd, 
	.earmenu li a:hover dd {display:block;}   	   		/* this show the DD submenu */ 
 	.earmenu li:hover dt a, 
	.earmenu li a:hover dt a 
			{
			color:#ffffff;
			background: #000000; 	
			display:block;	}  	/* change main bar selector background to black */
/* dl */
	.earmenu dl {
			position:absolute; 		
			top:0;	left:0; margin: 0; 	padding: 0; } 		/* this does the main positioning trick */
/* dt */
	.earmenu dt {
			margin:0; 				
			font-size: 12px; 
			float:left;  }
	.earmenu dt a, 
	.earmenu dt a:visited {
			display:block; 			
			color:#cc0000; 		/* main element to change text colour  */
			text-decoration:none;}
/* dd */
	.earmenu dd { 
   			display:none;    
/* magic */		
			opacity: .80;
			filter: alpha(opacity=80);
			-moz-opacity: 0.80;
			filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
		 	background: #cc0000; 	
/* magic */				
			clear:left; 
			margin:0; 
			padding: 0px 0px 0px 0px;			/* shifts dd elements a bit if required */
			width:120px; 
			color: #ffffff; 
			font-size: 12px; 
			text-align:left;}
	.earmenu dd a, 
	.earmenu dd a:visited {
 			padding: 3px 7px 6px 13px; 		
			color: #ffffff;					
			text-decoration: none;
			display: block;					}
	.earmenu dd a:hover {
			background: #000000;			
			display: block;		}