Простое горизонтальное меню CSS для сайта

<div class="top-menu2">  
<nav id="top-menu1">  
<ul id="top-nav">  
<li><a href="/">Главная zornet.ru</a></li>  
<li><a href="/forum/">Форум сайта</a></li>  
<li><a href="load/">Файлы скачать</a></li>  
<li><a href="/publ/">Статьи по тематике</a></li>  
<li><a href="http://zornet.ru/load/0-0-0-0-1">Добавить материал</a></li>  
<li><a title="Обратная связь" href="/index/0-3">Обратная связь</a></li>  
</ul>  
<form id="searchform" onsubmit="this.sfSbm.disabled=true" method="get" action="/search/">  
  <input type="text" name="q" value="Поиск.." onblur="if(this.value=='')this.value='Поиск..'" onfocus="if(this.value=='Поиск..')this.value=''"/>  
  <input type="hidden" name="sfSbm"/>  
</form>  
</nav>  
</div>

/******Горизонтальное меню******/  
.top-menu2 {background: #3b3b3b;}  
#top-menu1 {  
height: 57px;  
max-width: 1150px;  
margin: 0px auto;  
}  

#top-nav li {  
float: left;  
position: relative;  
z-index: 999;  
list-style: none;  
}  

#top-nav {  
float: left;  
border-left: 1px solid #2f2f2f;  
-webkit-margin-before: 0;  
-webkit-margin-after: 0;  
-webkit-padding-start: 0;  
}  

#top-nav li a {  
  display: block;  
  color: #f5f5f5;  
  border-right: 1px solid #2f2f2f;  
  line-height: 57px;  
  padding: 0 24px;  
  transition: box-shadow 0.4s, color 0.4s;  
  position: relative;  
}  

#top-nav li a:hover {  
  box-shadow: inset 0 -4px 0 #7babf7;  
  color: #80aef5;  
}  

#searchform {  
  float: right;  
  margin-top: 7px;  
}  

#searchform input[type=text] {  
  display: block;  
  background: url(http://zornet.ru/Aben/ABGEA/Rin/retunga/search-icon.png) no-repeat 11px;  
  padding-left: 32px;  
  border: 1px solid #575656;  
  height: 39px;  
  border-radius: 3px;  
  width: 147px;  
  padding: 0 11px 0 43px;  
  color: #999;  
  font-size: 12px;  
  transition: border 0.4s;  
}  

#searchform input[type=text]:focus {  
  border: 1px solid #b9d4ff;  
}