#menu {
  display: block;
  font-family: Tahoma, sans-serif;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #000000;
  border: 0px;
  height: 18px;
	
}

#menu a {
  display: block;
  text-decoration: none;
  text-align: center;
  font-weight: bold;
  color: #FFFFFF;
  padding: 2px 7px 0px 7px;
}

#menu ul {
  margin: 0px;
  padding: 0px;
  list-style-type: none;
}

#menu li {
  display: block;
  float: left;
  position: relative;
  height: 18px;
  margin: 0px 0px;
  padding: 0px;
  border-right: 1px solid #BABFBF;
  width: 150px;
}

#menu li li {
  padding: 0px;
  margin: -1px 0px 0px -1px;
  width: 180px;
}

#menu li:hover a { color: #000000; }
#menu li:hover li a { color: #FFFFFF; }
#menu li li:hover a { color: #000000; }
#menu>ul>li:hover {
  background: #EEEEEE url("../images/circle-1.png") no-repeat center bottom;
}
#menu li ul.submenu li:hover {
  background: #E8E8E8 url("../images/circle-2.png") no-repeat 0 50%;
}

#menu li ul {
  margin: 3px 0 0 0;
  visibility: hidden;
  position: absolute;
  z-index: 10;
  padding: 0px;
  color: #FFFFFF;
  background-color: #696969;
  border-bottom: 1px solid #000000;
  width: 180px;
}

/*
DO NOT UNCOMMENT THE CODE. IE doesn't understand the comments and we play on this.
*/
#menu li ul li {
  border: 1px solid #000000;
  border-bottom: 0px;
  //margin: 0 -1px 0 0;
}


* html #menu li a {
  position: relative; /* Fix IE6's inability to expand clickable area */
}

/*
    Using display is better (no scrollbars when page loads),
    but IE can't handle it, so only good browsers should see this
*/
html>body #menu li ul {
  display: none;
}

/* fix the position */
#menu li li ul {
  top: 0;
  left: 100%;
}

/* simulate child selector for IE */
div#menu li:hover ul,
#menu li:hover li:hover ul,
#menu li:hover li:hover li:hover ul {
  visibility: visible;
}
div#menu li:hover li ul,
#menu li:hover li:hover li ul,
#menu li:hover li:hover li:hover li ul {
  visibility: hidden;
}

/* do the normal show, with increased specificity, for good browsers */
#menu ul#menuList li:hover>ul {
  display: block;
  visibility: visible;
	
}
