/*** ESSENTIAL STYLES ***/ .nav, .nav * { margin: 0; padding: 0; list-style: none; } .nav { line-height: 1.0; } .nav ul { position: absolute; top: -999em; width: 15em; /* left offset of submenus need to match (see below) */ } .nav ul li { width: 100%; } .nav li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } .nav li { float: left; position: relative; } .nav a { display: block; position: relative; } .nav li:hover ul, .nav li.sfHover ul { left: 0; top: 36px; /* match top ul list item height */ z-index: 99; } ul.nav li:hover li ul, ul.nav li.sfHover li ul { top: -999em; } ul.nav li li:hover ul, ul.nav li li.sfHover ul { left: 15em; /* match ul width */ top: 0; } ul.nav li li:hover li ul, ul.nav li li.sfHover li ul { top: -999em; } ul.nav li li li:hover ul, ul.nav li li li.sfHover ul { left: 15em; /* match ul width */ top: 0px; } /*** DEMO SKIN ***/ .nav { float: left; font-weight: bold; font: 1.1em Arial, Verdana, sans-serif; } ul.nav ul { margin-top: 0px; padding-top: 11px; background:transparent url(../images/menu-bg.png) top left no-repeat; margin-left: 2px; } .nav a { text-decoration:none; padding: 10px 10px; } .nav a, .nav a:visited { /* visited pseudo selector so IE6 applies text colour*/ color: #fff; } ul.nav li { color: #777; } .nav li li a { color: #777; } .nav li li a:visited { color: #777; } .nav li ul { } .nav li:hover, .nav li.sfHover, .nav a:focus, .nav a:hover, .nav a:active { outline: 0; color: #ccc; background: none; } .nav li ul li:hover, .nav li ul li.sfHover, .nav li ul li a:focus, .nav li ul li a:hover, .nav li ul li a:active { color: #000; background: #ddd; }