Menu cute (horizontal)

Menu cute (horizontal)
Hoje trago para vocês esse menu que é bem fofo e serve tanto para usar no topo do seu blog/site quanto na sidebar. O menu é esse abaixo:


Para usar esse menu, copie o código abaixo e cole no seu css (entre <style> e </style>):
/*Menu horizontal sweetpoison*/
.toposweet1 a{outline: 1px dashed #fff;outline-offset: -4px;background: url("http://i.imgur.com/kNxGJPX.png")no-repeat; margin:1px;padding-top:8px;padding-bottom:8px;padding-left:15px;padding-right:15px;
color:#ffffff;font-family: georgia; color: #ffffff; word-spacing: 0px; letter-spacing: 0px;font-size:16px;font-weight: 300;text-transform: lowercase;-webkit-transition: all ease-out 0.70s;
}
.toposweet1 a:hover{outline: 1px dashed #fff;outline-offset: -3px;background: url("http://i.imgur.com/BYRsSds.png")no-repeat;margin:1px;padding-top:8px;padding-bottom:8px;padding-left:15px;padding-right:15px;color:#eeeeee;font-family: georgia; word-spacing: 0px; letter-spacing: 0px;font-size:16px;font-weight: 300;text-transform: lowercase;-webkit-transition: all ease-out 0.70s;
}

Altere a cor da fonte e fundo se preferir. Copie o código abaixo e coloque onde você quer que apareça o seu menu. Não esqueça de fazer a substituição de nome e url.

<div class="toposweet1"><a href="http://SEULINKAQUI">Teste1</a></div>

Espero que gostem e se for útil, não esqueçam dos créditos! 

Facebook Twitter Pinterest Google+ Email Addthis