Como deixar esta barra assim?

Qual é minha questão:
Olá pessoal do FdF,hoje eu quero mudar esta barra do meu forum igual a esta:Tem jeito?

Eu vi ela nesse forum: http://pro-pixel.net

Endereço do meu fórum:
http://tree-pixel.forumeiros.com

Versão do fórum:
PUNBB

Olá!
Aceda a Folha de Estilo CSS:

Painel de Controle Visualização Imagens e Cores Cores Folha de estilo CSS

Código:

Código:

#pun-head #pun-navlinks {
-moz-border-radius: 4px 4px 0 0;
-webkit-border-top-left-radius: 4px;
-webkit-border-top-right-radius: 4px;
background: #D7D7D7 url(http://www.ipbforumskins.com/skindemo/public/style_images/splat33x/primary_nav.jpg) repeat 0 0;
border-bottom: 1px solid #C4C4C4;
border-radius: 4px 4px 0 0;
min-height: 38px;
padding: 4px 4px 0;
}
#pun-navlinks li {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: #6F6F6F;
display: block;
float: left;
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: 700;
height: 35px;
line-height: 35px;
outline: none;
padding: 0 5px;
text-decoration: none;
text-shadow: #fff 0 1px 0;
text-transform: uppercase;
}
#pun-navlinks a {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: #6F6F6F;
display: block;
height: 35px;
line-height: 35px;
outline: none;
padding: 0 11px;
text-shadow: #fff 0 1px 0;
}
#pun-navlinks a:hover {
-moz-box-shadow: inset rgba(0,0,0,0.75) 0 1px 3px, rgba(255,255,255,0.45) 0 0 0 1px, rgba(255,255,255,0.8) 0 1px 0;
-webkit-box-shadow: inset rgba(0,0,0,0.75) 0 1px 3px, rgba(255,255,255,0.45) 0 0 0 1px, rgba(255,255,255,0.8) 0 1px 0;
background: #D75D2D url(http://i.imgur.com/6Q5jveW.png) repeat 50% 0;
box-shadow: inset rgba(0,0,0,0.75) 0 1px 3px, rgba(255,255,255,0.45) 0 0 0 1px, rgba(255,255,255,0.8) 0 1px 0;
color: #fff;
padding: 0 11px;
position: relative;
text-decoration: none;
text-shadow: #076eaf 0 1px 1px;
}

e Valide!

Até mais.

Muito Obrigado