<ul class="navigation">  
<li><a href="/">ССЫЛКА 1<span class="ui_icon home"></span></a></li>  
<li><a href="/">ССЫЛКА 2<span class="ui_icon aboutus"></span></a></li>  
<li><a href="/">ССЫЛКА 3<span class="ui_icon services"></span></a></li>  
<li><a href="/">ССЫЛКА 4<span class="ui_icon icon gallery"></span></a></li>  
<li><a href="/">ССЫЛКА 5<span class="ui_icon contactus"></span></a></li>  
<li><a href="/">ССЫЛКА 6<span class="ui_icon other"></span></a></li>  
<li><a href="/">ССЫЛКА 7<span class="ui_icon user"></span></a></li>  
</ul>

ul.navigation {  
  width: 270px;  
  list-style: none;  
  margin: 0;  
  padding: 0;  
  text-align: left;}  

ul.navigation li {  
  display: inline-block;  
  margin: 0px;  
  padding: 0;}  

ul.navigation a {  
  display: block;  
  width: 190px;  
  height: 33px;  
  padding: 12px 0 0 80px;  
  margin-bottom: 5px;  
  color: #8a8980;  
  font-size: 16px;  
  font-weight: normal;  
  text-decoration: none;  
  position: relative;}  

ul.navigation a .ui_icon { position: absolute; top: 0; left: 15px; width: 40px; height: 40px; }  

ul.navigation a .home { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_home.png) no-repeat; }  
ul.navigation a .aboutus { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_aboutus.png) no-repeat; }  
ul.navigation a .services { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_services.png) no-repeat; }  
ul.navigation a .gallery { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_portfolio.png) no-repeat; }  
ul.navigation a .contactus { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_contact.png) no-repeat; }  
ul.navigation a .other { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_other.png) no-repeat; }  
ul.navigation a .user { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_user.png) no-repeat; }  

ul.navigation a .home2 { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_home_hover.png) no-repeat; }  
ul.navigation a .aboutus2 { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_aboutus_hover.png) no-repeat; }  
ul.navigation a .services2 { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_services_hover.png) no-repeat; }  
ul.navigation a .gallery2 { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_portfolio_hover.png) no-repeat; }  
ul.navigation a .contactus2 { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_contact_hover.png) no-repeat; }  
ul.navigation a .other2 { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_other_hover.png) no-repeat; }  
ul.navigation a .user2 { background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_user_hover.png) no-repeat; }  

ul.navigation a:hover, ul.navigation a.selected {  
  color: #201f1b;  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_menu_hover.png) no-repeat left;}  

ul.navigation a:hover .home, ul.navigation a.selected .home {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_home_hover.png) no-repeat;}  

ul.navigation a:hover .aboutus, ul.navigation a.selected .aboutus {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_aboutus_hover.png) no-repeat;}  

ul.navigation a:hover .services, ul.navigation a.selected .services {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_services_hover.png) no-repeat;}  

ul.navigation a:hover .gallery, ul.navigation a.selected .gallery {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_portfolio_hover.png) no-repeat;}  

ul.navigation a:hover .contactus, ul.navigation a.selected .contactus {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_contact_hover.png) no-repeat;}  

ul.navigation a:hover .other, ul.navigation a.selected .other {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_other_hover.png) no-repeat;}  

ul.navigation a:hover .user, ul.navigation a.selected .user {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_user_hover.png) no-repeat;}  

ul.navigation a:hover .home2, ul.navigation a.selected .home2 {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_home_hover.png) no-repeat;}  

ul.navigation a:hover .aboutus2, ul.navigation a.selected .aboutus2 {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_aboutus_hover.png) no-repeat;}  

ul.navigation a:hover .services2, ul.navigation a.selected .services2 {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_services_hover.png) no-repeat;}  

ul.navigation a:hover .gallery2, ul.navigation a.selected .gallery2 {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_portfolio_hover.png) no-repeat;}  

ul.navigation a:hover .contactus2, ul.navigation a.selected .contactus2 {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_contact_hover.png) no-repeat;}  

ul.navigation a:hover .other2, ul.navigation a.selected .other2 {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_other_hover.png) no-repeat;}  

ul.navigation a:hover .user2, ul.navigation a.selected .user2 {  
  background: url(http://megascripts.ru/demo/prostoe_menu/templatemo_user_hover.png) no-repeat;}  

ul.navigation a:focus {outline: none;}