/*Стиль оформления меню мы будем определять с помощью суффикса. Если при
создании модуля меню вы не пропишите суффикс, то меню будет иметь вид списка,
как у модуля «Последние новости» на скриншоте.

Для горизонтального меню обязательно нужно задать особый стиль оформления.

Открываем файл menu.css и прописываем в нем оформление модуля меню с суффиксом
_topmenu*/

.moduletable_topmenu {
  font:bold 14px Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  text-align:center;
  background-color:#004f64;
  height:36px;
  border-bottom:4px solid #fff;
}

/*Оформление списка меню*/

.moduletable_topmenu ul {
  margin-top:10px;
  float:left;
  left:50%;
  position:relative;
}

/*Оформление блоков (пунктов) списка меню.*/

.moduletable_topmenu ul li {
  float:left;
  left:-50%;
  list-style:none;
  position:relative;
  border-left:2px ridge #fff;
  border-right:2px ridge #fff;
  margin-left:-2px;
}

/*Оформление ссылок в блоках списка меню.*/

.moduletable_topmenu ul li a {
  display:block;
  padding:0 15px;
  text-decoration:none;
  color:#fff;
}

/*Ссылки при наведении*/

.moduletable_topmenu li a:hover{
  display:block;
  color:#98cfdd;
  text-decoration:underline;
}

/*Я предлагаю задать вам свой особый стиль оформления и для вертикального меню
сайта. Как я писала выше, если при создании модуля вертикального меню, вы не
пропишите суффикс _menu, то меню будет иметь вид обыкновенного списка.

Оформление модуля вертикального меню с суффиксом _menu*/

.moduletable_menu {
  font: bold 12px Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  text-align:left;
  padding:0px;
  margin:5px;
}

/*В отличии от горизонтального меню, где, как правило, не выводится заголовок
модуля, вертикальное меню часто имеет заголовок, поэтому пропишем стиль его
оформления.*/

.moduletable_menu h3{
  font: bold 12px Arial, Helvetica, sans-serif;
  padding:5px 0 5px 10px;
  color:#fff;
  background-color:#004f64;
}

/*Оформление блоков списка*/

.moduletable_menu ul li {
  list-style:none;
}

/*Оформление ссылок в блоках меню*/

.moduletable_menu ul li a {
  display:block;
  padding:10px;
  text-decoration:none;
  color:#004f64;
  border-bottom:2px dotted #004f64;
}

/*Ссылка при наведении*/

.moduletable_menu li a:hover{
  display:block;
  text-decoration:underline;
  color:#fe1919;
}