[Tutorial]Menu Hover

Holaque tal todo??? yo bastante bien,bueno empece la mañana enfadada  pero se me paso rápido bien este tuto me lo han pedido no es mio es un menu que estoy usando arriba en mi cabecera  

lo que esta en azulverdoso es el menu sin pasar el cursor y lo que esta en moradito al pasar el cursor

bien lo primero es

Plantilla>edicion HTLM>Ctrl+F y buscas

/* Content

cuando lo encuentres te sadra esto 

 /* Content

----------------------------------------------- */

y pegais el codigo debajo de todo lo anterior 

#PameMenu{
list-style-type: none;
margin: 0px;
padding: 0px;
width:50px;
letter-spacing:2px;
text-decoration:none;
font-family:verdana;
font-size:10px;
color: #fff;
border:2px solid #fff;
text-align:left;
background:#FFE4E4;
border-radius:0px;
color: #000;
text-decoration: none;
display: orizontal;
padding: 10px 10px 10px 20px;
}
#PameMenu:hover {
background:#DAF1FF;
border:2px solid #fff;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

Editamoss!!

Verde:Es el color del menu si pasar el cursor

Azul:Es el color del menu que cambia al pasar el cursor

Naranja:El ancho del borde del menu el tipo de borde y el color del borde

Guardais y os vais a Diseño>Añadir nuevo gadget>Gadget Javascrip

<a id="PameMenu" href="url de la categoria" title="TITLE">Categoria</a>

Yo creo que esta todo claro si queréis mas categorías solo repetís el código y le ponéis los nombres y tal

C R E D I T O S 

Pame