/* GENERIC DROP DOWN MENU CSS */

/*
This will create a horizontal menu with drop downs.
It works for 2 levels. It is easy to make it work for three levels but 3 levels is painful to use.

*** You need to include ieddenabler.js to make this css work with Internet Explorer.

If the menu is generated by sectionnav module you have some extra markup to play with.
The active menu a tag is given an id of active_menu and it's parent li tags are suppose to be classed with active_parent.
*/

/* top level items */
/* styling of top level items affects all levels */
#nav ul {
height: 20px;
margin: 0px;
display:block;
list-style:none;
padding:0px 0px 0px 4px;
margin:0px;
background-color:#000000;
/*width:760px;*/
}
#nav li {
display: block;
float: left;
width: 117px;
height: 20px;
line-height: 20px;
text-align:center;
margin:0px;
padding:0px;
position: relative;
background-color:#000000;
}
#nav li a {
display:block;
font-family:Tahoma,Arial, Helvetica, sans-serif;
font-weight:bold;
text-align:center;
text-decoration:none;
text-transform:uppercase;
margin:0px;
color: #fff;
font-size: 10px;
width: 117px;
/*border-left:1px solid #222;
border-right:1px solid #222;*/
background-color:#000000;
}
#nav li a.menu-parent {
background-image:url(arrow-down.gif);
background-position:108px 8px;
background-repeat:no-repeat;
}
#nav li a.menu-parent:hover,#nav li a.menu-parent:active {
background-image:url(arrow-down-o.gif);
background-position:108px 8px;
background-repeat:no-repeat;
}
#nav li a:link,#nav li a:visited {
}
#nav li a:hover,#nav li a:active {
text-decoration:none;
color: #000000;
background-color:#EBE3C3;
}
/* second level items */
/* you may need to override styles of top level items */
#nav li li {
width: 117px;
height:auto;
float:left;
background:#000;
}
#nav li li a {
line-height:normal;
padding:5px 0px 5px 0px;
}
/*
#nav a#active_menu,#nav a#active_menu:link,#nav a#active_menu:visited,#nav a#active_menu:hover,#nav a#active_menu:active {
}
#nav a.active_parent:link,#nav a.active_parent:visited,#nav a.active_parent:hover,#nav a.active_parent:active {
}
*/
#nav li li:hover,#nav li li.over {
color: #ff0000
}
/* hide lower level uls */
#nav li ul {
display:none;
position:absolute; 
top:20px;
left:0px;
margin:0px;
padding:0px;
width:117px;
}
/* show the ul inside the current hovered li */
/* the class over is used for ie because it only sees hovers on a tags */
#nav li:hover ul,#nav li.over ul {
display: block;
color: #000000
}
#nav li:hover,#nav li.over {
color: #000000;
}