Menu Slim

Olá meninas e meninos, trouxe mais um menu para vocês, já vi este menu em  tumblrs.

Para ver o menu clique aqui

Para colocar este menu em seu blog, copie o código abaixo e cole acima da tag ]]></b:skin> 

/*---Início do Menu Slim by Teen World---*/
un {
font-family: tahoma; /* Fonte do Menu */
width: 69%; /* Tamanho do Menu */
float: left;
background: #fff; /* Cor do fundo do menu */
padding: 7px;
text-align:right;
margin: 0px;
border-radius:50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px ; /* tamanho das Pontinhas da Borda */
border-right: 6px solid #C374D4;/* Tamanho e cor da pontinha redonda da borda */
border-top: 1px solid #C374D4;/* Tamanho e cor do contorno de cima */
border-bottom: 1px solid #C374D4;/* Tamanho e cor do contorno de baixo */
-webkit-transition-duration: .80s; /* Duração do Efeito */
font-size: 8px; /* Tamanho da fonte */
color: #C374D4; /* Cor da fonte*/
}
un:hover {
font-family: tahoma; /* Fonte do Menu quando passa o mouse */
width: 179%; /* Tamanho do Menu quando passa o mouse */
float: left;
background: #fff; /* Cor do fundo do Menu quando passa o mouse */
padding: 7px;
text-align: center;
margin: 0px;
-moz-border-radius: 50px;
-webkit-border-radius:50px; /* tamanho das Pontinhas da Borda quando passa o mouse*/
border-right: 7px solid #FF8080;/* Tamanho e cor da pontinha redonda da borda  quando passa o mouse*/
border-top: 1px solid #FF8080;/* Tamanho e cor do contorno de cima quando passa o mouse*/
border-bottom: 1px solid #FF8080;/* Tamanho e cor do contorno de baixo quando passa o mouse*/
-webkit-transition-duration: .80s; /* Duração do Efeito  */
font-size: 10px; /* Tamanho da fonte do Menu quando passa o mouse */
color: #000; /* Cor da fonte do Menu quando passa o mouse */
}
/*---Fim do Menu Slim by Teen World---*/

Personalize as cores.

Para fazer o menu slim funcionar, copie o código abaixo e coloque no gadget htm/java script

<div style="position: absolute; margin-top: 140px; left: -220px;">
<a href="Link aqui"><un>Home </un></a>
<a href="Link aqui"><un>F.A.Q </un></a>
<a href="Link aqui"><un>Goodies </un></a>
<a href="Link aqui"><un>Sobre </un></a>
</div>

Atenção:
Onde tem-  margin-top:140px e left:-220px - deve ajustar os valores de acordo com seu blog.