menu chocolate bar

Yoo milk-shakes de baunilha ^y^ como estão? Espero que bem. Eu finalmente tô terminando um livro aqui e minha internet está achando que aqui é a casa da tia Joana ¬¬ e, pior de tudo (além da internet dando pau), é que meu pai tá enrolando pra comprar meu The Sims 4, e eu tô quase pirando com isso! Mas no meu tempo livre e na minha criatividade dando "Oi", eu resolvi fazer um menuzinho simples, que já tinha sido pedido há muito tempo atrás. O nome é esse porque eu achei muito parecido com uma barra de chocolate HSEUHSUE' enfim, espero que gostem e comam muito desse menu. Vamos ao tutorial? 

{preview aqui}

1. Vá em Modelo >> Editar HTML >> Dê Ctrl + F e procure por ]]><

Assim que achar a tag procurada, cole esse código acima dela:

.menuchocolatebar {
font-family: PF Arma Five;
font-size: 8px;
text-align: center;
color: #85552a;
text-shadow: inset 1px 0px 1px #85552a;
box-shadow: inset 0px 0px 1px #b38257;
letter-spacing: 2px;
background: #cc9974;
outline-offset: -3px;
outline: 1px solid #b38257;
border: 1px dotted #b38257;
widht: 12px;
height: 6px;
float: center;
padding: 4px;
line-height: 6px;
margin: 2px;
border-radius: 2px;
-webkit-transition-duration: .80s;
}
.menuchocolatebar:hover {
color: #b38257;
background: #85552a;
text-shadow: inset 1px 0px 1px #b38257;
box-shadow: inset 0px 0px 1px #b38257;
widht: 6px;
letter-spacing: 0px;
border-radius: 0px;
-webkit-transition-duration: .80s;
}

Peço que modifiquem apenas as cores e as sombras, que são as seguintes:

color: #CORDASUAFONTE;
text-shadow: inset 1px 0px 1px #CORDASOMBRADOTEXTO;
box-shadow: inset 0px 0px 1px #CORDASOMBRADACAIXINHA;
background: #CORDASUACAIXINHA;
outline: 1px solid #CORDASUABORDAADENTRADA;
border: 1px dotted #CORDASUABORDANORMAL;

2. Agora, vá em Layout >> Adicionar um Gadget >> HTML/JavaScript

E em seguida cole esse código dentro do seu gadget:

<div class="menuchocolatebar"><a href="http://LINK">nome</a></div>
<div class="menuchocolatebar"><a href="http://LINK">nome</a></div>
<div class="menuchocolatebar"><a href="http://LINK">nome</a></div>
<div class="menuchocolatebar"><a href="http://LINK">nome</a></div>

Mude as partes destacadas, e agora é só salvar!

Eu sei que o menu não está lá a perfeição, mas esse é o segundo que faço, e até que ficou bonzinho. Besitos, amorecos <3
PS: Fico feliz que tenham gostado da Bru >..<