/* common styling */

.level1 {
  background:#000;
  color:#FFF;
  text-align:center;
  font-weight:bold;
  font-size : 12px;
}

.level2 {
  background:#F00;
  color:#FFF;
  text-align:center;
  font-weight:bold;
  font-size : 12px;
}

.level3 {
  background:#00F;
  color:#FFF;
  text-align:center;
  font-weight:bold;
  font-size : 12px;
}

.menu {
  font-family : "Verdana", "Arial", sans-serif; 
  width:89px; 
  font-size : x-small;
  line-height : 1.2em; 
  vertical-align : middle; 
  margin : 0;
}

.menu ul li a, .menu ul li a:visited {
  display:block; 
  text-decoration:none; 
  color:#000; 
  width:89px; 
  height:auto; 
  text-align:center;
  vertical-align:middle;
  background:#ccc; 
  font-size: 12px;
  line-height : 130%;
  border-bottom : 1px solid #999;
}

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

.menu ul li {
  float:left; 
  margin-left : -1px;
  padding-left : 1px;
  position:relative;

}

.menu ul li ul {
  display: none;
}

/* specific to non IE browsers */
.menu ul li:hover a {
  color:#fff; 
  background:#000;
  height:auto; 
}

.menu ul li:hover ul {
  display:block; 
  position:absolute; 
  top:0; 
  left:90px; 
  width:89px;
}

.menu ul li:hover ul li a.hide {
  background:#ccc; 
  color:#000;
  height:auto; 
}

.menu ul li:hover ul li:hover a.hide {
  width:89px;
}

.menu ul li:hover ul li ul {
  display: none;
}

.menu ul li:hover ul li a {
  display:block; 
  background:#f00; 
  color:#fff; 
  width:89px;
  height:auto; 
}

.menu ul li:hover ul li a:hover {
  background:#f00;
  color:#fff;
  height:auto; 
}

.menu ul li:hover ul li:hover ul {
  display:block; 
  position:absolute; 
  left:90px; 
  top:0; 
}

.menu ul li:hover ul li:hover ul li a {
  display:block; 
  width:89px; 
  background:#ccc; 
  color:#000;
  height:auto; 
}

.menu ul li:hover ul li:hover ul li a:hover {
  background:#00f; 
  color:#fff;
  height:auto; 
}