/* JS disabled styles */ .no-js nav li:hover ul { display:block; } /* base nav styles */ nav { display:block; margin:0 auto 20px; border:1px solid #222; position:relative; background-color:#446cb3; font:16px Tahoma, Sans-serif; } nav ul { padding:0; margin:0; } nav li { position:relative; float:left; list-style-type:none; } nav ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } nav li a { display:block; padding:10px 20px; border-left:1px solid #999; border-right:1px solid #222; color:#eee; text-decoration:none; } nav li a:focus { outline:none; text-decoration:underline; } nav li:first-child a { border-left:none; } nav li.last a { border-right:none; } nav a span { display:block; float:right; margin-left:5px; } nav ul ul { display:none; width:100%; position:absolute; left:0; background:#446cb3; } nav ul ul li { float:none; } nav ul ul a { padding:5px 10px; border-left:none; border-right:none; font-size:14px; } nav ul ul a:hover { background-color:#555; } /* CSS3 */ .borderradius nav { -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; } .cssgradients nav { background-image:-moz-linear-gradient(0% 22px 90deg, #222, #999); background-image:-webkit-gradient(linear, 0% 0%, 0% 70%, from(#9ec1ff), to(#446cb3)); } .boxshadow.rgba nav { -moz-box-shadow:2px 2px 2px rgba(0,0,0,.75); -webkit-box-shadow:2px 2px 2px rgba(0,0,0,.75); box-shadow:2px 2px 2px rgba(0,0,0,.75); } .cssgradients nav li:hover { background-image:-moz-linear-gradient(0% 100px 90deg, #999, #222); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#446cb3), to(#446cb3)); } .borderradius nav ul ul { -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } .boxshadow.rgba nav ul ul { background-color:rgba(0, 0, 120, 0.7); -moz-box-shadow:2px 2px 2px rgba(0,0,0,.3); -webkit-box-shadow:2px 2px 2px rgba(0,0,0,.3); box-shadow:2px 2px 2px rgba(0,0,0,.3); } .rgba nav ul ul li { border-left:1px solid rgba(0,0,0,0.1); border-right:1px solid rgba(0,0,0,0.1); } .rgba nav ul ul a:hover { background-color:rgba(85,85,85,.9); } .borderradius.rgba nav ul ul li.last { border-left:1px solid rgba(0,0,0,0.1); border-bottom:1px solid rgba(0,0,0,0.1); -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } .csstransforms ul a span { -moz-transform:rotate(-180deg);-webkit-transform:rotate(-180deg); } /* fallbacks */ .no-cssgradients nav, .no-js nav { padding-bottom:4px; border:none; background:url(../fallback/navBG.html) repeat-x 0 0; } .no-borderradius nav ul, .no-js nav ul { background:url(../fallback/navRight.html) no-repeat 100% 0; } .no-borderradius nav ul ul, .no-js nav ul ul { background:none; } .no-borderradius nav li, .no-js nav li { height:44px; } .no-cssgradients nav li:hover, .no-js nav li:hover { background:url(../fallback/navOverBG.html) repeat-x 0 0; } .no-borderradius nav li li, .no-js nav li li { height:auto; width:98%; left:-2px; } .no-borderradius nav li:first-child, .no-js nav li:first-child { background:url(../fallback/navLeft.html) no-repeat 0 0; } .no-borderradius nav li:first-child:hover, .no-js nav li:first-child:hover { background:url(../fallback/navOverLeft.html) no-repeat 0 0; } .no-borderradius nav li li:first-child, .no-js nav li li:first-child { background:none; } .no-rgba nav ul ul, .no-js nav ul ul { left:1px; padding-left:2px; background:url(../fallback/subnavBG.html) no-repeat 100% 100%; } .no-rgba nav ul ul a, .no-js nav ul ul a { left:3px; } .no-rgba nav ul ul a:hover { background:url(../fallback/subOverBG.html) repeat 0 0; } .no-csstransforms ul a span { height:7px; width:12px; margin-top:8px; text-indent:-5000px; overflow:hidden; background:url(../fallback/indicator.html) no-repeat 0 0; } .no-borderradius ul ul li.last { margin-bottom:10px; } .no-cssgradients.boxshadow nav { box-shadow:none; }