navigation

<div id="navi"><center>
<a href="" class="navlink"> link name </a>
<a href="" class="navlink"> link name </a>
<a href="" class="navlink"> link name </a>
<a href="" class="navlink"> link name </a>
<a href="" class="navlink"> link name </a>
<a href=""> link name </a>
</center>
</div>


<style>
#navi {
margin: 0px;
top: 0px;
position: absolute;
left: 0px;
height: 30px;
width: 100%;
font-family: trebuchet MS;
font-size: 12pt;
text-transform: uppercase;
text-align: center;
letter-spacing: 2pt;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
background-color: #111312;
padding-bottom: 6px;
border-bottom: 2px solid #282828;
}

.navlink:link, .navlink:active, .navlink:visited {
color: #C5F7F0;
border-left: 5px solid #C5F7F0;
border-right: 5px solid #C5F7F0;
font-family: Trebuchet MS;
font-size: 10pt;
font-weight: bold;
text-transform: uppercase;
font-weight: lighter;
padding: 2px;
width: 130px;
text-align: center;
display: inline-table;
background: #72577C;
margin-top: 6px;
border-radius: 20px;
letter-spacing: 1px;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
}

.navlink:hover {
color: #72577C;
border-left: 5px solid #72577C;
border-right: 5px solid #72577C;
text-transform: uppercase;
font-style: normal;
font-weight: lighter;
text-align: center;
display: inline-table;
background: #C5F7F0;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
}

</style>