/* remove all the bullets, borders and padding from the default list styling */
#main-nav ul {padding:0; margin:0; list-style-type:none; float:right;}
#main-nav ul ul {}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#main-nav li {float:left; position:relative; border-left:#3c3c3c solid 1px; border-right:#8a8a8a solid 1px;}
#main-nav li li{border:0px;}
/* style the links for the top level */
#main-nav a, #main-nav a:visited {display:inline-block; text-align:center; padding:14px 9px 0 9px; height:38px;}
/* a hack so that IE5.5 faulty box model is corrected */
* html #main-nav a, * html #main-nav a:visited {}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#main-nav ul ul {visibility:hidden; position:absolute; top:52px; left:0; background:#ffffff; border:1px solid #666666; padding:5px;}
#sub-info{left:-124px !important;}
#sub-contact{left:-96px !important;}

/* another hack for IE5.5 */
* html #main-nav ul ul {top:52px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
#main-nav table {position:absolute; top:0; left:0; border-collapse:collapse;}

/* style the second level links */
#main-nav ul ul a, #main-nav ul ul a:visited {color:#666666; border-bottom:1px solid #666666; text-align:left; width:160px; padding:4px 0 4px 0; height:auto;}
/* yet another hack for IE5.5 */
* html #main-nav ul ul a, * html #main-nav ul ul a:visited {}

/* style the top level hover */
#main-nav a:hover {background:#333333;}
#main-nav ul ul a:hover{background:#efefef;}
#main-nav :hover > a {background:#333333;} 
#main-nav ul ul :hover > a {background:#efefef;}

/* make the second level visible when hover on first level list OR link */
#main-nav ul li:hover ul,
#main-nav ul a:hover ul{visibility:visible;}