Personalizando o menu de páginas

Gente, eu consegui sozinha personalizar o menu de páginas, #OMG *---* ficou muito perfeito, se quiserem o exemplo, é o menu desse blog. (A Rita que fez o cabeçalho do blog e eu fiz o Layout, é da minha colega).
Só testei no modelo travel do blogger, ok?

Se usarem creditem, e se for reblogar, me avise e coloque os créditos.

---> Vá no HTML do seu blog e procure por .tabs-inner .widget ul { vai estar mais ou menos assim:

.tabs-inner .widget ul {
padding: 0;
background: $(tabs.background.color) $(tabs.background.gradient) repeat scroll top center;
}

Substitua o "background: $(tabs.background.color) $(tabs.background.gradient) repeat scroll top center;" por:

margin-left: 150px;
margin-right: 20px;
margin-top: -70px;

É a posição do menu: Os dois primeiros são pra direita e pra esquerda, e o outro é pra cima, editem os números ;) Ainda não salve, só vá visualizando.

---> Depois procure por  .tabs-inner .widget li a { vai estar mais ou menos assim:

.tabs-inner .widget li a {
display: inline-block;
padding: 1em 1.5em;
color: $(tabs.text.color);
font: $(tabs.font);
}

Substitua todo essa código por:

.tabs-inner .widget li a {
display: inline-block;
padding: 0em 0.9em;
color: $(tabs.text.color);
font: $(tabs.font);
-moz-border-radius: 20px; /* Para Firefox */-webkit-border-radius: 20px; /*Para Safari e Chrome */border-radius: 20px; /* Para Opera 10.5+*/ background: #000;
margin-right: 10px;
}

Ainda não salve, só visualize. Logo abaixo disso, vai ter esse código:

.tabs-inner .widget li.selected a,
.tabs-inner .widget li a:hover {
position: relative;
z-index: 1;
background: $(tabs.selected.background.color) $(tabs.selected.background.gradient) repeat scroll top center;
color: $(tabs.selected.text.color);
}

Substitua todo ele por isso:

.tabs-inner .widget li a {
display: inline-block;
padding: 0em 0.9em;
color: $(tabs.text.color);
font: $(tabs.font);
-moz-border-radius: 20px; /* Para Firefox */-webkit-border-radius: 20px; /*Para Safari e Chrome */border-radius: 20px; /* Para Opera 10.5+*/ background: #000;
margin-right: 10px;
}

.tabs-inner .widget li.selected a,
.tabs-inner .widget li a:hover {
position: relative;
z-index: 1;
-moz-border-radius: 20px; /* Para Firefox */-webkit-border-radius: 20px; /*Para Safari e Chrome */border-radius: 20px; /* Para Opera 10.5+*/ background: #000;
margin-right: 10px;background: #CCCCCC; /* browsers sem suporte a css3 */

background: -webkit-gradient(linear, left top, left bottom, from(#CCCCCC), to(#FF0080));/* webkit browsers */

background: -moz-linear-gradient(top, #CCCCCC, #FF0080);/* firefox3.6+ */

filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#CCCCCC', EndColorStr=' #FF0080');/* IE */
color: $(tabs.selected.text.color);

}

Pronto, visualize, se estiver tudo certo, mude as cores pelas da sua preferência e salve! Não se esqueça de creditar