rc-web@23: #nav { rc-web@23: margin: 0; rc-web@23: padding: 1px 1px 0; rc-web@23: background: #7d7d7d; rc-web@23: line-height: 100%; rc-web@23: border-radius: 1em; rc-web@23: -webkit-border-radius: 1em; rc-web@23: -moz-border-radius: 1em; rc-web@23: -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4); rc-web@23: -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4); rc-web@23: position:absolute; rc-web@23: left: 0px; rc-web@29: bottom: -50px; rc-web@23: } rc-web@23: #nav li { rc-web@23: margin: 0 5px; rc-web@23: padding: 0 0 8px; rc-web@23: float: left; rc-web@23: position: relative; rc-web@23: list-style: none; rc-web@23: } rc-web@23: rc-web@23: rc-web@23: /* main level link */ rc-web@23: #nav a { rc-web@23: font-weight: bold; rc-web@23: color: #e7e5e5; rc-web@23: text-decoration: none; rc-web@23: display: block; rc-web@23: padding: 8px 20px; rc-web@23: margin: 0; rc-web@23: rc-web@23: -webkit-border-radius: 1.6em; rc-web@23: -moz-border-radius: 1.6em; rc-web@23: rc-web@23: text-shadow: 0 1px 1px rgba(0,0,0, .3); rc-web@23: } rc-web@23: #nav a:hover { rc-web@23: background: #000; rc-web@23: color: #fff; rc-web@23: } rc-web@23: rc-web@23: /* main level link hover */ rc-web@23: #nav .current a, #nav li:hover > a { rc-web@23: background: #666; rc-web@23: color: #444; rc-web@23: border-top: solid 1px #f8f8f8; rc-web@23: rc-web@23: -webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2); rc-web@23: -moz-box-shadow: 0 1px 1px rgba(0,0,0, .2); rc-web@23: box-shadow: 0 1px 1px rgba(0,0,0, .2); rc-web@23: rc-web@23: text-shadow: 0 1px 0 rgba(255,255,255, 1); rc-web@23: } rc-web@23: rc-web@23: /* sub levels link hover */ rc-web@23: #nav ul li:hover a, #nav li:hover li a { rc-web@23: background: none; rc-web@23: border: none; rc-web@23: color: #666; rc-web@23: rc-web@23: -webkit-box-shadow: none; rc-web@23: -moz-box-shadow: none; rc-web@23: } rc-web@23: #nav ul a:hover { rc-web@23: background: #0078ff !important; rc-web@23: color: #fff !important; rc-web@23: rc-web@23: -webkit-border-radius: 0; rc-web@23: -moz-border-radius: 0; rc-web@23: rc-web@23: text-shadow: 0 1px 1px rgba(0,0,0, .1); rc-web@23: } rc-web@23: rc-web@23: /* dropdown */ rc-web@23: #nav li:hover > ul { rc-web@23: display: block; rc-web@23: } rc-web@23: rc-web@23: /* level 2 list */ rc-web@23: #nav ul { rc-web@23: display: none; rc-web@23: rc-web@23: margin: 0; rc-web@23: padding: 0; rc-web@23: width: 185px; rc-web@23: position: absolute; rc-web@23: top: -55px; rc-web@23: left: 0; rc-web@23: background: #ddd; rc-web@23: border: solid 1px #b4b4b4; rc-web@23: rc-web@23: -webkit-border-radius: 10px; rc-web@23: -moz-border-radius: 10px; rc-web@23: border-radius: 10px; rc-web@23: rc-web@23: -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3); rc-web@23: -moz-box-shadow: 0 1px 3px rgba(0,0,0, .3); rc-web@23: box-shadow: 0 1px 3px rgba(0,0,0, .3); rc-web@23: } rc-web@23: #nav ul li { rc-web@23: float: none; rc-web@23: margin: 0; rc-web@23: padding: 0; rc-web@23: } rc-web@23: rc-web@23: #nav ul a { rc-web@23: font-weight: normal; rc-web@23: text-shadow: 0 1px 0 #fff; rc-web@23: } rc-web@23: rc-web@23: /* level 3+ list */ rc-web@23: #nav ul ul { rc-web@23: left: 181px; rc-web@23: top: -3px; rc-web@23: } rc-web@23: rc-web@23: /* rounded corners of first and last link */ rc-web@23: #nav ul li:first-child > a { rc-web@23: -webkit-border-top-left-radius: 9px; rc-web@23: -moz-border-radius-topleft: 9px; rc-web@23: rc-web@23: -webkit-border-top-right-radius: 9px; rc-web@23: -moz-border-radius-topright: 9px; rc-web@23: } rc-web@23: #nav ul li:last-child > a { rc-web@23: -webkit-border-bottom-left-radius: 9px; rc-web@23: -moz-border-radius-bottomleft: 9px; rc-web@23: rc-web@23: -webkit-border-bottom-right-radius: 9px; rc-web@23: -moz-border-radius-bottomright: 9px; rc-web@23: } rc-web@23: rc-web@23: /* clearfix */ rc-web@23: #nav:after { rc-web@23: content: "."; rc-web@23: display: block; rc-web@23: clear: both; rc-web@23: visibility: hidden; rc-web@23: line-height: 0; rc-web@23: height: 0; rc-web@23: } rc-web@23: #nav { rc-web@23: display: inline-block; rc-web@23: } rc-web@23: html[xmlns] #nav { rc-web@23: display: block; rc-web@23: } rc-web@23: rc-web@23: * html #nav { rc-web@23: height: 1%; rc-web@23: }