/* common styling */
/* set up the overall width of the menu div, the font and the margins */

.menu {
  position: relative;
  top: 121px;
  left: 14px;
  z-index:100;
}


/* remove the bullets and set the margin and padding to zero for the unordered list */
.menu ul {
  padding:0; 
  margin:0;
  list-style-type: none;
}


/* float the list so that the items are in a line and their position relative so that the drop down list will appear in the right place underneath each list item */
.menu ul.outer li {
  float:left; 
  position:relative;
  font-weight: bold;
  height: 20px;
}

.menu ul.inner li {
  clear: both;
  height: auto;
}

.menu ul.outer li a {
  padding: 0px 5px;
  border-right: 1px solid #666;
}

.menu ul.outer li.last a {
  border: none;
}


.menu ul.inner li a {
  border: none;
}

.menu ul li a, .menu ul li a:visited {
  display:block; 
  text-align: left; 
  color: #525252;
  text-decoration: none;
}


/* make the dropdown ul invisible */
.menu ul.inner {
  display: none;
}

.menu ul.inner li {
  font-weight: normal;
  border: none;
  padding: 3px 0px;
}


/* specific to non IE browsers */

.menu ul li a:hover {
  text-decoration: underline;
  color: #000;
}


/* make the sub menu ul visible and position it beneath the main menu list item */
.menu ul.outer li:hover ul.inner {
  display:block; 
  
  background: #E1E7CA url(images/submenu_box_header.jpg) repeat-x scroll 0%;
  background-position: 0px 0px;
  border: 1px solid #ccc;
  border-top: none;
  width: 120px;
  
  padding-top: 5px;
  top: 20px;
  left:0pt;
  position: absolute;
  z-index: 100;
}


/* style the background and foreground color of the submenu links */
  .menu ul li:hover ul li a {
  display:block;
}


/* style the background and forground colors of the links on hover */
  .menu ul li:hover ul li a:hover {
  color: #000;
}