.menu 
{
  float: left;

  position: relative; 

  z-index: 1000;

  /* bottom: 29px; right: 0px; */

  /* width: 906px; */

  /* background-color: #080; */

  /* border-bottom: solid 0px #000; */
}




/* remove all the bullets, borders and padding from the default list styling */
.menu ul 
{
  padding: 0;
  margin: 0;
  list-style-type: none;
  /*  width: 160px;  */
  position: relative;
  border-top: solid 0px #666;

  white-space: nowrap;
}

.menu li ul.sub
{
  /* width: 113px; */

  border-top: solid 3px #000;

  position: absolute; 
  top: 23px;
}







/* style the list items */
.menu li 
{
  height: 23px;
  border-bottom: solid 0px #000;
  background-color: #080;

  margin-bottom: 0;

  display: inline;

  float: left;  /* needed for IE7 whitespace issue */
}

.menu li.this, .menu li:hover.this
{
  background-color: #ff8019;
}

.menu li li
{
  height: 22px;
  border-bottom: solid 1px #000;
  background-color: #963;
}


.menu li:hover 
{ 
  position: relative;  

  background-color: #96F384;
}

.menu li li:hover 
{ 
  background-color: #ff8019;
}




/* style the links */
.menu a, .menu a:visited 
{
  display: block;  
  text-decoration: none;
  height: 23px;
  /* width: 110px; */
  color: #fff;
  font: bold 11px verdana, tahoma, sans-serif;
  padding: 0 22px;
  text-align: center;
  text-transform: uppercase;

  float: left;
}

.menu a.this, .menu a:visited.this
{
  color: #000;
}

.menu li ul a, .menu li ul a:visited 
{
  height: 22px;
  width: 132px; 
  color: #fff;
  font: bold 9px verdana, tahoma, sans-serif;
  padding: 0;
  text-align: left;
  text-transform: none;
}



/* style the link hover */
.menu a:hover
{
  color: #000;

  position: relative;
}

.menu a:hover.this
{
  color: #000; 
}

.menu li ul a:hover
{
  color: #000;
}



.menu li a span
{
  padding: 5px 0 0 0;
  display: block;
}

.menu li li a span
{
  padding: 5px 0 0 5px;
  display: block;
}






/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu li ul 
{
  visibility: hidden;
  position: absolute;
  top: 0px;

  /* set up the overlap (minus the overrun) */
  left: 0;

  /* set up the overrun area */
  padding: 0;

  /* this is for IE to make it interpret the overrrun padding */
  /* background:transparent url(transparent.gif); */
}




/* for IE5.5 and IE6 you need to style each level hover */

/* make the second level visible when hover on first level list OR link */

.menu ul li:hover ul,
.menu ul a:hover ul 
{
  visibility: visible;
  background: #fff;
}