/**
 * @author Auke van Leeuwen
 */
body {
  font-family: Verdana, sans-serif;
}

#header {
  background: url(../images/header.jpg) repeat-y left top; 
}

#nav {
  position: absolute; /* anchor for rest of the absolute positioning */
  line-height: 1.6;
  left: 176px;
} 

#nav,
#nav ul {
  width: 171px; /* should match 'left' of child <ul /> */
  margin: 0;
  padding: 0;
  list-style: none;
  list-style-image: none;
  height: 163px;
  background: url(../images/menu-bg.png) repeat-y right top;
}

#nav li ul {
  position: absolute;
  top: 0;
  left: 171px; /* match width of parent ul */
}

#nav ul {
  display: none; /* don't display submenu's by default */
}

#nav ul.active {
  display: block; /* but show the 'active' ones */
}

#nav:hover ul,
#nav ul:hover ul {
  display: none; /* if you hover over a menu, hide any submenu's */
}

#nav li:hover {
  background: url(../images/hover-bg.gif) repeat-y right top;
}

#nav li:hover > ul {
  display: block; /* except for the submenu of the 'hovered' li (IE6 doesn't get this rule) */
}

#nav li {
  text-transform: uppercase;
  font-size: 10px;
}

#nav li li {
  text-transform: none; /* counter the rule for the deeper levels */
  font-size: 10px;
}

#nav li {
  text-align: right;
  font-size: 10px;
}

#nav li a {
  display: block;
  font-size: 11px;
  text-decoration: none;
  color: #082a57;
  padding-right: 0.8em;
} 

#nav li.active > a { 
  background: url(../images/active-bg.gif) repeat-y right top;
}

#nav a:hover { 
  background: url(../images/hover-bg.gif) repeat-y right top;
}