div.menu {
width:760px; 
font-size:0.85em !important;
font-family:Arial !important;
z-index:500;
background:#000;
position:inherit;
}

/* remove all list styling */
div.menu ul { padding:0; margin:0; list-style-type:none; }

div.menu ul ul { width:80px; }

/* float the list to make it horizontal */
div.menu li {
float:left;
width:152px;
position:relative;
}

/* links style for the top level */
div.menu a, div.menu a:visited {
display:block;
font-size:9px !important;
text-decoration:none;
color:#fff;
width:141px; 
height:30px;
border:1px solid #fff;
border-width:1px 1px 0 0;
background:#000;
padding-left:10px;
line-height:29px;
}

/* hack this for IE5.5 broken box model, make it fixed */
* html div.menu a, * html div.menu a:visited { width:152px; w\idth:141px; }

/* second level background style */
div.menu ul ul a.drop, div.menu ul ul a.drop:visited { background:#cccccc; }

/* second level hover style */
div.menu ul ul a.drop:hover{ background:#00a5ef; }

div.menu ul ul :hover > a.drop { background:#00a5ef; }

/* third level background style */
div.menu ul ul ul a, div.menu ul ul ul a:visited { background:#ccc; }

/* third level hover style*/
div.menu ul ul ul a:hover { background:#ccc; }

/* hide the sub levels give them no room */
div.menu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:31px;
left:0; 
width:152px;
}

/* another hack for IE5.5 */
* html div.menu ul ul { top:30px; t\op:31px; }

/* position the third level flyout menu */
div.menu ul ul ul{ left:152px; top:0; width:152px; }

/* position the third level flyout menu for a left flyout */ 
div.menu ul ul ul.left { left:-152px; }

/* tables doesnt affect the layout - required for IE to work */ 
div.menu table { position:absolute; top:0px; left:0; }

/* style the second level links style */
div.menu ul ul a, div.menu ul ul a:visited {
background:#ccc; 
color:#000; 
height:auto; 
line-height:1.07em; 
padding:5px 10px; 
width:131px /*129px*/
/* hack for IE5.5 */
}

* html div.menu ul ul a{ width:152px; w\idth:131px; }

/* top level hover style */
div.menu a:hover, div.menu ul ul a:hover{ color:#fff; background:#00a5ef; }
div.menu :hover > a, div.menu ul ul :hover > a { color:#fff; background:#00a5ef; }

/* third level hover style */
div.menu ul ul ul a:hover {background:#00a5ef;}

/* second level visible when hover on first level list */
div.menu ul li:hover ul, div.menu ul a:hover ul{ visibility:visible;  }

/* third level hidden when you hover on first level list */
div.menu ul :hover ul ul{ visibility:hidden; }

/* third level visible when you hover over second level list */
div.menu ul :hover ul :hover ul{ visibility:visible; }


/* fourth level+ hidden when you hover on second level link */
div.menu ul :hover ul :hover ul ul{ visibility:hidden;}

/* fourth level visible when you hover over third level link */
div.menu ul :hover ul :hover ul :hover ul { visibility:visible;}