Навигация сайта(меню)

#nav, #nav ul{
list-style:none;/* Одновременно можно задать стиль маркера, его положение, изображение, которое будет использоваться в качестве маркера */
padding:0;/* Устанавливает значение полей вокруг содержимого элемента */
width:140px;/* Ширина элемента */
font-size:11pt;/* Размер шрифта */
}
 
#nav ul{
position:relative;/* Устанавливает способ позиционирования элемента относительно окна браузера или других объектов на веб-странице */
z-index:-1;/* Третье измерение, объект накладывается друг на друга */
}
 
#nav li{
position:relative;/* Устанавливает способ позиционирования элемента относительно окна браузера или других объектов на веб-странице */
z-index:100;/* Третье измерение, объект накладывается друг на друг */
}
 
#nav ul li ul li{
margin-top:-23px;/* Устанавливает величину отступа от верхнего края элемента */
-moz-transition:0.4s linear 0.4s;/* Эти строки отвечают за плавное выдвижение меню */
-ms-transition:0.4s linear 0.4s;/*  */
-o-transition:0.4s linear 0.4s;/*  */
-webkit-transition:0.4s linear 0.4s;/*  */
transition:0.4s linear 0.4s;/*  */
}
 
#nav li a{
color:#000000;/* Цвет текста элемента */
display:block;/* Определяет, как элемент должен быть показан в документе */
font-size:12px;/* Размер шрифта */
font-weight:bold;/* Полужирное начертание шрифта */
line-height:25px;/* Межстрочный интервал */
outline:0;/* Одновременно устанавливающее цвет, стиль и толщину внешней границы на всех четырех сторонах элемента */
padding-left:15px;/* Устанавливает значение поля от левого края содержимого элемента */
text-decoration:none;/* Убирает оформление текста в виде его подчеркивания, перечеркивания, линии над текстом и мигания */
}
 
#nav li a.sub{
background-color:#fff;/* Позволяет установить одновременно до пяти характеристик фона */
}
 
#nav li a:hover{
background-color:#a0a0a0;/* Цвет фона элемента */
}
 
#nav ul li a{
background-color:#fff;/* Цвет фона элемента */
color:#000000;/* Цвет текста элемента */
font-size:11px;/* Размер шрифта элемента */
line-height:22px;/* Межстрочный интервал */
border-bottom:1px solid #a0a0a0;;/* Позволяет одновременно установить толщину, стиль и цвет границы внизу элемента */
}
 
#nav ul li a:hover{
background-color:#bfae5e;/* Цвет фона элемента */
color:#000000;/* Цвет текста элемента */
}
 
#nav a.sub:focus{
background-color:#bcbdc1;/* Позволяет установить одновременно до пяти характеристик фона */
outline:0;/* Одновременно устанавливающее цвет, стиль и толщину внешней границы на всех четырех сторонах элемента */
}
 
#nav a:focus ~ ul li{
margin-top:0;/* Устанавливает величину отступа от верхнего края элемента */
-moz-transition:0.4s linear;/*  */
-ms-transition:0.4s linear;/*  */
-o-transition:0.4s linears;/*  */
-webkit-transition:0.4s linears;/*  */
transition:0.4s linear;/*  */
}
 
#nav a.sub:active{
background-color:#bcbdc1;/* Позволяет установить одновременно до пяти характеристик фона */
outline:0;/* Одновременно устанавливающее цвет, стиль и толщину внешней границы на всех четырех сторонах элемента */
}
 
#nav a:active ~ ul li{
margin-top:0;/* Устанавливает величину отступа от верхнего края элемента */
}
 
#nav ul:hover{
display:block;/* Определяет, как элемент должен быть показан в документе */
}