/**
 * Вертикальное меню
 */

/****************
 * Обязательно. Желательно не изменять.
 */
ul.vmenu li{
  list-style-type:none;
  /* :NOTE: Если есть расстояние между элементами, менюшка не всегда
   * корректно отрабатывает. Не получилось отловить эту особенность,
   * посему блоки пусть немного находят друг на друга */
  margin: 0px -1px -1px 0px;
}
ul.vmenu li{
  position: relative;
  top: 0px;
  left: 0px;
}
ul.vmenu li ul  {
  position: absolute;
  padding: 0px;
}
ul.vmenu, ul.vmenu ul{
  margin: 0;
}
/* Все пункты меню должны быть блоками */
ul.vmenu li{ display: block; }
/* Все подменю изначально скрываем */
ul.vmenu ul{ display: none; }
/* Элементы, над которыми указатель мыши, показываем */
ul.vmenu li:hover>ul{ display: block; }
ul.vmenu ul.over { display: block; }
/* Если записать так, в IE не работает (скорее всего, потому, что встречает непонятную запись "li:hover>ul" и игнорирует все предложение):
ul.vmenu li:hover>ul, ul.vmenu ul.over { display: block; }
 */

/****************
 * Обязательно. Указываем размеры элементов .
 */
ul.vmenu li ul  {
  left: 279px;
  top: -1px;
  _top: 0px;
}
ul.vmenu, ul.vmenu ul{
  width: 280px;
  height: 20px;
  z-index:100;
}

/****************
 * Это так. Для красоты.
 */
ul.vmenu a{
  padding: 3px;
  display: block;
  _display: inline;
  width: 100%;
}

ul.vmenu div{ /* Этот Див нужен только для стрелки справа */
  position: absolute;
  top: 2px;
  right: 0px;
  background-image: url(arr.gif);
  background-repeat: no-repeat;
  background-position: center;
  width: 11pt;
  height: 11pt;
}

/****************
 * Шрифт надписей и цвета.
 */
ul.vmenu{  }
ul.vmenu li{ background-color: #ddddff; border: 1pt solid #0000ff; }
ul.vmenu li{ _border: 0pt; }
ul.vmenu li a{ _background-color: #ddddff; _border: 1pt solid #0000ff; }
ul.vmenu *{ color: #000033;}
ul.vmenu a{ color: inherited; text-decoration: none }

ul.vmenu li:hover{ background-color: #3399ff}
ul.vmenu li:hover>a{ color:#ddddff;}
ul.vmenu a:hover{ _color:#ddddff; _background-color: #000066}

ul.vmenu, ul.vmenu * { font: normal 14px verdana; }

