Create stylish menu with css

Biscuit type menu through css:-

The HTML

<div id="nav-wrapper">
  <ul id="nav">
    <li><a href="">Home</a></li>
    <li><a href="">About</a></li>
    <li><a href="">Services</a></li>
    <li><a href="">FAQ</a></li>
    <li><a href="">Contact</a></li>
  </ul>
</div>

The CSS

#nav-wrapper {
width:465px;
margin:0 auto;
padding:20px 0;
background:#3D3331;
}
ul#nav {
font-family: Verdana;
font-size:14px;
list-style:none;
margin:0 auto;
padding:0;
width:455px;
overflow: auto;
}
ul#nav li {
display:inline;
}
ul#nav li a {
text-decoration:none;
display: block;
padding:5px 21px;
background:#5F3222;
color:#eee;
float:left;
text-align:center;
border-top:2px solid #815444;
border-right:2px solid #3d1000;
border-bottom:2px solid #3d1000;
border-left:2px solid #815444;
}
ul#nav li a:hover {
background:#a37666;
color:#000;
border-top:2px solid #815444;
border-right:2px solid #c59888;
border-bottom:2px solid #c59888;
border-left:2px solid #815444;
}