/* ================================================================ 
            Файл скачан с сайта http://megaweb.su/
=================================================================== */
/* Это CSS3 хак анимации для Safari и Chrome  */
html { -webkit-animation: safariSelectorFix infinite 1s; }
@-webkit-keyframes safariSelectorFix { 0% {
zoom:1;
}
100% {
zoom:1;
}
}
/* Меню стиль  */
.menu { padding:0 20px; margin:0 auto; list-style:none; height:36px; background:#999; width:600px; position:relative; border:1px solid #999; -webkit-border-radius:18px; -moz-border-radius:18px; border-radius:18px; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0)), color-stop(20%, rgba(255, 255, 255, 0.4)), color-stop(30%, rgba(255, 255, 255, 0.2))); background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.4) 20%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0)); }
.menu li { float:left; position:relative; z-index:10; margin:4px 0; }
.menu li.slide { position:absolute; left:21px; top:0; width:100px; height:28px; background:#069; z-index:1; -webkit-border-radius:14px; -moz-border-radius:14px; border-radius:14px; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 1)), color-stop(20%, rgba(255, 255, 255, 0.2)), color-stop(30%, rgba(255, 255, 255, 0.3))); background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.2) 20%, rgba(255, 255, 255, 0.4) 30%, rgba(255, 255, 255, 1)); -webkit-transition: 0.25s; -moz-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; }
.menu li.current ~ li.slide {
left:20px;
}
.menu li a { display:block; width:100px; line-height: 28px; color:#000; font-family:arial, sans-serif; font-size:14px; font-weight:bold; float:left; text-decoration:none; text-align:center; }
.menu li:hover a { color:#600; }
* html .menu li a:hover { background:#0cf; color:#c60; } /* для  IE6 */
 .menu li.p1:hover ~ li.slide {
left:20px;
}
.menu li.p2:hover ~ li.slide {
left:120px;
}
.menu li.p3:hover ~ li.slide {
left:220px;
}
.menu li.p4:hover ~ li.slide {
left:320px;
}
.menu li.p5:hover ~ li.slide {
left:420px;
}
.menu li.p6:hover ~ li.slide {
left:520px;
}