.dropmenu {
width:900px;
height:27px;
position:relative;
z-index:100;
font-family:arial, sans-serif;
text-align: center;
text-transform: uppercase;
padding: 0 0 0 3px;
}
 
/* remove all the bullets, borders and padding from the default list styling */
.dropmenu ul {
padding:0;
margin:0;
list-style-type:none;
}
 
.dropmenu ul ul {
width:176px;
}
 
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.dropmenu li {
float:left;
width:176px;
position:relative;
}
 
/* style the links for the top level */
.dropmenu a, .dropmenu a:visited {
display:block;
font-size:10px;
text-decoration:none;
color:#fff;
width:165px;
height:27px;
background: url(images/nav_bg.png) no-repeat center;
padding-left:10px;
line-height:27px;
}
 
/* style the second level background */
.dropmenu ul ul a.drop, .dropmenu ul ul a.drop:visited {
background:#d4d8bd ;
}
 
/* style the second level hover */
.dropmenu ul ul a.drop:hover{
background:#c9ba65;
}
 
.dropmenu ul ul :hover > a.drop {
background:#c9ba65;
}
 
/* hide the sub levels and give them a positon absolute so that they take up no room */
.dropmenu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:26px;
left:0;
width:176px;
}
 
/* style the table so that it takes no ppart in the layout - required for IE to work */
.dropmenu table {
position:absolute;
top:0;
left:0;
border-collapse:collapse;;
}
 
/* style the second level links */
.dropmenu ul ul a, .dropmenu ul ul a:visited {
background: #eee;
color:#000;
height:auto;
line-height:22px;
padding:5px 10px;
width:155px;
border-bottom: 1px solid #fff;
}
 
/* style the top level hover */
.dropmenu a:hover {
color:#333;
background: #ccc;
text-decoration: none;
}
 
.dropmenu ul ul a:hover{
color:#333;
background: #FBEACC;
text-decoration: none;
}
 
.dropmenu :hover > a {
color:#fff;
background: url(images/nav_bg.png) no-repeat center;
}
 
.dropmenu ul ul :hover > a {
color:#333;
background: #FBEACC;
}
 
/* make the second level visible when hover on first level list OR link */
.dropmenu ul li:hover ul, .dropmenu ul a:hover ul{
visibility:visible;
}
 
/*********** Hacks for IE ***********/
 
* html .dropmenu ul ul a, * html .dropmenu ul ul a:visited {
width:173px;
w\idth:155px;
}
 
* html .dropmenu ul ul {
top:27px;
t\op:28px;
}
 
* html .dropmenu a, * html .dropmenu a:visited {
width:176px;
w\idth:165px;
}
 
* html .dropmenu {
width:901px;
w\idth:900px;
}