#nav-menu
{ width:95% }
#nav-menu ul
{ list-style: none;
padding: 0;
margin: 0;
}
#nav-menu li
{ float: left;
margin: 0 0.15em;
}
#nav-menu li a
{ height: 2em;
line-height: 2em;
float: left;
width: 9em;
display: block;
border: 0.1em solid #dcdce9;
color: #0d2474;
text-decoration: none;
text-align: center;
}
/* the following controls the look of the list items */
#nav-menu ul li
{ position: relative; }
/* this looks weird because of the nesting, any UnorderedLists in a list item
will now be directly under (top=0) and to the right (left=149 pixels) of the original
list item. "display: none" is vital to hiding the list unless hovered
left: 149px;
*/
#nav-menu li ul {
position: absolute;
left: 0px;
top: 2em;
display: none;
}
/* when a list item is hovered over it will display the nested UnorderedList as a block */
#nav-menu li:hover ul {
display: block;
z-index: 100;
}
/* Hide from IE5-Mac \*/
#nav-menu li a
{ float: none }