<div id="menu">  
  <ul id="navigation">  
  <li><a href="#" title="Главная">Главная</a></li>  
  <li><a href="#" title="Новости">Новости</a><ul><li><a href="#" title="Обновления игры">Обновления игры</a></li></ul></li>  
  <li><a href="#" title="Обучение">Обучение</a>  
  <ul>  
  <li><a href="#" title="Новичкам">Новичкам</a></li>  
  <li><a href="#" title="Интересные секреты">Интересные секреты</a></li>  
  </ul>  
  </li>  
  <li><a href="#" title="Видео">Видео</a><ul><li><a href="#" title="Воды">Воды (записи стримов)</a></li><li><a href="#" title="Интервью">Интервью</a></li></ul></li>  
  <li><a href="#" title="Скачать">Скачать</a>  
  <ul>  
  <li><a href="#" title="Комиксы">Комиксы</a></li>  
  </ul>  
  </li>  
  <li><a href="#" title="Герои">Герои</a></li>  
  <li><a href="#" title="Предметы">Предметы</a></li>  
  <li><a href="#" title="Гайды по героям">Гайды</a></li>  
  <li><a href="#" title="Форум">Галерея</a></li>  
  <li><a href="#" title="Форум">Форум</a></li>  
  <div class="clear"></div>  
  </ul>  
  </div>

/*-----------------------*/  
.clear {  
  clear: both;  
}  

#menu {  
  width: 100%;  
  float: left;  
  position: relative;  
  margin: 50px 0 0 0;  
  padding:0  
}  

#navigation {  
  list-style: none;  
  padding: 0;  
  margin: 0;  
  background: #111;  
}  

#navigation li {  
  float: left;  
  font-family: PT Sans,sans-serif;  
  font-size:14px;  
}  

#navigation li:hover {  
  background: #222;  
}  

#navigation li:first-child {  
  -webkit-border-radius: 5px 5px 0 0;  
  border-radius: 5px 0 0 5px;  
}  

#navigation li a {  
  display: block;  
  padding: 0 20px;  
  text-decoration: none;  
  line-height: 40px;  
  color: #fff;  
}  

#navigation ul {  
  display: none;  
  position: absolute;  
  list-style: none;  
  margin-left: -3px;  
  padding: 0;  
  overflow: hidden;  
}  

#navigation ul li {  
  float: none;  
}  

#navigation li:hover > ul {  
  display: block;  
  background: #222;  
  border: solid 3px #fff;  
  border-top: 0;  
   
  -webkit-border-radius: 0 0 8px 8px;  
  border-radius: 0 0 8px 8px;  
   
  -webkit-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.25);  
  box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.25);  
}  

#navigation li:hover > ul li:hover {  
  -webkit-border-radius: 0 0 5px 5px;  
  border-radius: 0 0 5px 5px;  
}  

#navigation li li a:hover {  
  background: #000;  
}  

#navigation ul li:last-child a,  
#navigation ul li:last-child a:hover {  
  -webkit-border-radius: 0 0 5px 5px;  
  border-radius: 0 0 5px 5px;  
}  
/*-----------------------*/