Menu de gotinha

Hello, famers! Estão bem? Hoje eu fiz um menu especialmente pra vocês. Na verdade, é o primeiro menu que eu faço, então me desculpem se não estiver tão bom assim. É um menu de gotinha, eu achei bem fofo. Ele tem o efeito hover (quando passa o mouse) bem suave, e as letras ficam com um espaço entre elas. Se estiver algo errado com ele, é só me avisar que eu arrumo. Não se esqueçam dos créditos :D

Aqui tem um print de como ficou o menu:

Super bonitinho, né? Podem perceber que quase todos os cantos são arredondados, exceto um, que é o que dá o efeito "gotinha". O efeito normal é esse que está com o fundo preto. E ao passar ao mouse, a cor muda suavemente e as letras ficam com um espacinho, como eu já disse. Se gostarem, o código é esse:

/*-Início Menu de Gotinha On The Fame-*/
mdg {
font-family: verdana; /* fonte do menu */
width: 20%; /* largura */
float: left; /* posicionamento do menu */
background: #000000; /* cor de fundo */
padding: 3px; /* altura */
text-align: center; /* posicionamento do texto */
margin: 2px; /* espaço */
-webkit-border-radius: 15px 15px 15px 0px; /* bordas */
-webkit-transition-duration: .90s; /* duração do efeito */
font-size: 08pt; /* tamanho da fonte */
color: #ffffff; /* cor da fonte */
letter-spacing: 0px; /* espaço das letras */
}
mdg:hover {
font-family: verdana; /* fonte do menu hover */
width: 20%; /* largura hover */
float: left; /* posicionamento do menu hover */
background: #e5e5e5; /* cor de fundo hover */
padding: 3px; /* altura hover */
text-align: center; /* posicionamento do texto hover */
margin: 2px; /* espaço hover */
-webkit-border-radius: 15px 15px 15px 0px; /* bordas hover */
-webkit-transition-duration: .90s; /* duração do efeito hover */
font-size: 08pt; /* tamanho da fonte hover */
color: #000000; /* cor da fonte hover */
letter-spacing: 3px; /* espaço das letras hover */
}
/*-Fim Menu de Gotinha On The Fame-*/

Percebam que tá tudo explicadinho no próprio código. Recomendo que só mecham no width, no background, no font-size e no color. Agora cole tudo acima de ]]></b:skin>, no seu HTML.  Logo depois, adicione um gadget de HTML/JavaScript e para cada link, cole:

<a href="LINK"><mdg>NOMEDOLINK</mdg></a>

Gostaram, amores? Espero que sim. Fiz com muito carinho pra vocês e a única coisa que eu peço é: use com créditos! Beijos enormes.