body{background:#eee;margin:50px;padding:0}.example{background:#ffffff;width:770px;height:570px;margin:20px auto;padding:15px;border-radius:2px;-moz-border-radius:3px;-webkit-border-radius:3px}#nav{display:inline-block;width:100%;margin:0 auto;padding:0;background:#a8060b;text-align:left;border-radius:10px}#nav li{margin:6px;float:left;position:relative;list-style:none}#nav a{font-weight:700;color:#fff;text-decoration:none;display:block;padding:2px 6px 2px 2px;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;text-shadow:0 2px 2px rgba(0,0,0,.7)}#nav .current a,#nav li:hover>a{background:#ccdce3;color:#000;border-top:1px solid #f8f8f8;box-shadow:0 -1px 2px rgba(0,0,0,.7);-moz-box-shadow:0 2px 2px rgba(0,0,0,.7);-webkit-box-shadow:0 2px 2px rgba(0,0,0,.7);text-shadow:0 2px 2px rgba(255,255,255,.7)}#nav li:hover li a,#nav ul li:hover a{background:0 0;border:none;color:#000}#nav ul li a:hover{background:#ccdce3 url(../images/bg.png) repeat-x 0 -100px;color:#000;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;text-shadow:0 2px 2px rgba(0,0,0,.7)}#nav ul li:first-child>a{-moz-border-radius-topleft:10px;-moz-border-radius-topright:10px;-webkit-border-top-left-radius:10px;-webkit-border-top-right-radius:10px}#nav ul li:last-child>a{-moz-border-radius-bottomleft:10px;-moz-border-radius-bottomright:10px;-webkit-border-bottom-left-radius:10px;-webkit-border-bottom-right-radius:10px}#nav li:hover>ul{opacity:1;visibility:visible}#nav ul{opacity:0;visibility:hidden;padding:0;width:150px;position:absolute;background:#ccdce3;border:1px solid #78a;z-index:999;border-radius:10px;transition:opacity .25s linear,visibility .1s linear .1s}#nav ul li{float:none;margin:0}#nav ul a{font-weight:400;text-shadow:0 2px 2px rgba(255,255,255,.7)}#nav ul ul{left:160px;top:0}#nav>li{border-right-color:#fff;border-right-width:1px;border-right-style:solid}#nav>li:last-child{border-right-color:#a8060b}