#topMenu
{
  height: 30px;
  background-color: #000000;
  background-image: url( '../images/menuBg.jpg');
}

#topMenu li:hover, #topMenu li.hover
{
    position:static;
}

#nav, 
#nav ul 
{ /* all lists */
  padding: 6px 0px 0px 10px;
  margin: 0;
  list-style: none;
  line-height:1px;
  border:0px solid #ffffff;
}

#nav a
{
  display: block;
  width: 10em;
  color: #ffffff;
  text-decoration:none;
  font-weight:bold;
  font-family: inherit;
  font-size:inherit;
  height: 18px;
  border:0px solid #ffffff;
}

#nav a:hover
{
    text-decoration: underline;
}

#nav li 
{ /* all list items */
  float: left;
  line-height: 14px;
  font-family: inherit;
  width: 10em; /* width needed or else Opera goes nuts */
}

#nav li.menuHeader
{
  font-weight:bold;
  color: #F5FEAA;
  border-bottom: 1px solid #666;
}

#nav li ul 
{ /* second-level lists */
  position: absolute;
  background: #787878;
  width: 10em;
  border: 1px solid #454545;
  border-top:0px;
  padding:5px;
  left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#nav li:hover ul, 
#nav li.sfhover ul 
{ /* lists nested under hovered list items */
  left: auto;
}