Menu #1 : Menu Codes

Hola!  Les traigo este menu  que actualmente tengo en el blog *-*

Antes que  todo creditos a Lunany ya que el tutorial es de ella 

El menu es este :

Empezamos:

copia el siguiente codigo en un Gadget HTML

<style>@font-face {font-family: "codes"; src: url('http://static.tumblr.com/jecwjgj/VL1mzno56/code.ttf');}
.mencode {
font-family: "codes";
font-size: 30px;/*Tamaño de la Letra*/
color: #F8F5B6;/*Color de la letra*/
text-shadow: 1px 1px 1px #F3BABA;/*Color de sombra de la letra*/
text-transform: uppercase;
display: inline-block;
margin-right: 20px;
-webkit-transition: all 0.3s ease;
}
.mencode:hover {
color: #C8F3DF;/*Color de la letra al pasar el cursor*/
text-shadow: 1px 1px 1px #F8CECE;/*Color de sombra de la letra*/
-webkit-transition: all 0.3s ease;
}
</style><div style="position: absolute; margin-top: -150px; left: 200px;">
<a href="URL DE LA PAGINA"><div class="mencode">NOMBRE DE LA PAGINA</div></a>
<a href="URL DE LA PAGINA"><div class="mencode">NOMBRE DE LA PAGINA</div></a>
<a href="URL DE LA PAGINA"><div class="mencode">NOMBRE DE LA PAGINA</div></a>
<a href="URL DE LA PAGINA"><div class="mencode">NOMBRE DE LA PAGINA</div></a>
</div>

150:si aumentas el numero se ira mas ariba y si disminuyes el numero se ira mas abajo el menu

200:Si aumentas se ira mas a la derecha y si disminuyes se ira mas a la izquierda 

Para aumentar mas solo colocan despues de </a> lo siguiente :

<a href="URL DE LA PAGINA"><div class="mencode">NOMBRE DE LA PAGINA</div></a>

Creditos: Lunany