/* Taken from Neil Marshall's implementation that uses CSS for CSS-compliant browsers and */
/* JavaScript for (sigh) IE	- http://www.eightlines.com/tech/cssmenu/		  */

.menu {
 list-style-type: none;
 margin: 0px;
 padding: 0px; 
 display:none;
}

.subMenu {
 list-style-type: none;
 margin: 0px;
 padding: 0px;
 display: none;
 position: absolute;
 margin-top: 1.2em; 
 background-color: #5790af;
 display:none;
}

.menu li:hover > ul {
 display: block;
}


/* Style definition here */

.menu li {
 padding:2px 20px 2px 10px;
 float: left;
 background-color: #2b456b;
 font: 0.80em Verdana, Helvetica, "Sans Serif"; 
 border-right:1px solid white;
 display:none;
}

.subMenu li {
 margin:0px;
 padding:0px 4px;
 float: none;
 background-color: #5790af;
 font: .85em Verdana, Helvetica, "Sans Serif";   
 display:none;
}

.subMenu {
 border-left: 1px  solid #2b456b;
 border-left: 1px  solid #2b456b;
 padding-bottom:2px;
 display:none;
}

.subMenu a:hover {
 color: white;
 background-color: #2b456b;
 display:none;
}

/* I had to do margin:-2px since sucky IE gives a gap between <a> nested inside a <li>   */
/* and doesnt support li:hover */

.subMenu a {
 margin-top:-2px;
 color: white;
 text-decoration: none;
 display: block;
 width: 10em; 
 display:none;
}