/* =main nav*/

/* style the outer div to give it width */
.menu { width : 1200px; margin-left : 15px; padding : 10px 0 0px 0; /*border-bottom : 5px solid #e9dec7;*/  }
#f0 .menu { border-bottom-width : 0; }

/* remove all the bullets, borders and padding from the default list styling */
.menu ul { padding : 0; margin : 0; list-style-type : none; }
.menu ul ul { width : 150px; }

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon - the width changes spacing between top level items */
.menu li { position : relative; float : left; width : 95px; }

/* style the links for the top level */
.menu a, .menu a:visited { display : block; text-decoration : none; color : #2a2e32; width : 80px; border : 1px solid #d3bd8e; background-color : #fff; padding-left : 5px; height : 30px; line-height : 1.1; }
div.menu a:hover {text-decoration:none;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
z-index : 4; 
visibility:hidden;
position:absolute;
height:0;
top:31px;
left:0; 
width:150px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited { 
background-color : #C9D4E0;
border:#C9D4E0; 
color:#000; 
height:auto; 
line-height:1em; 
padding:5px 10px; 
width:128px;
text-align:left;
}

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

/* 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; }