Menu "Pestañas"

HOLITAS, hoy vengo con un tutorial de un menu muy bonito son como pestañas o algo parecido, yo lo use en una plantilla clasica y me funciono muy bien
Prueba:

Nombre pagina

Nombre pagina

Nombre pagina

;

Lo primero que deben hacer es ir a Diseño > añadir un Gadget > HTML/ JavaScript > pegan el siguiente Codigo:

<style>
.men3a:hover {
 bottom:207px;
background: #A9E2C7;/*Fondo del Pestaña al pasar el cursor*/
padding-right: 15px;  /* altura de la Pestaña al pasar el cursor*/
padding-bottom:14px;  /*ancho de la Pestaña al pasar el cursor*/
border-top-right-radius: 40px 55px; /* si no deseas bordes redondeados al pasar el cursor borra esto*/
border-top-left-radius: 40px 55px;
}
.men3a {
bottom:201px;
border-top-right-radius: 50px 55px;
border-top-left-radius: 50px 55px;/*Redondear los bordes de la Pestaña*/
}
.men3 {
background: #A9E2C7;/*Fondo de las Pestañas*/
color: #fff;/*Color de la letra*/
-webkit-transition: none;
-moz-transition: none;
transition: none;
}
.box {
border: none;
font-family: inherit;
font-size: inherit;
cursor: pointer;
 padding:8px 15px; /*Tamaño y altura de la eiqueta 8 es el ancho ,15 es la altura*/
display: inline-block;
margin: 5px 5px;/*Espacios entre las Pestañas*/
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 700;
outline: none;
position: relative;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
</style>
<div class="box men3 men3a"><a href="Url de pagina">Nombre pagina</a></div>
<div class="box men3 men3a"><a href="Url de pagina">Nombre pagina</a></div><div class="box men3 men3a"><a href="Url de pagina">Nombre pagina</a></div>


Y luego Peronalisalo como quieras aqui las ntrucciones

PERSONALIZA:
Fondo al pasar el cursor
Altura al pasar el cursor
Ancho al pasar el cursor
Bordes al pasar el cursor
Bordes
Fondo
Color de la letra
Tamaño del menu
Espacio entre los menus
Agregar mas pestañas Agrega <div class="box men3 men3a"><a href="Url de pagina">Nombre pagina</a></div> despues de style