Dar estilo as colunas do pé do blog (footer) no novo Blogger

Continuando a costumização do blog, vamos agora dar estilo as colunas que ficam ao pé do blog.

Você já sabe que uso o modelo Simple, para as costumizações que faço,  mas não custa lembrar.

Vá até o Modelo de seu blog, clique em Editar modelo

Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo. 

Agora procure por:  

]]></b:skin>  

 

Acima dele cole este código abaixo

/*Footer widget-------------------------------------------------------------------------*/
#footer-2-1, #footer-2-2,  #footer-2-3 {
margin: 10px 2px;
padding: 3px;
background: #FA6C1E;/*cor de fundo do exterior do widget*/
}

#footer-2-1 h2, #footer-2-2 h2,  #footer-2-3 h2{
text-align: center;
padding: 2px 0;
font-size: 16px;
background: #FEECFE;/*cor de fundo do título*/
}
#footer-2-1 ul li, #footer-2-2 ul li,  #footer-2-3 ul li{
padding:  0;
margin: 0;
list-style-type:none;
text-align: left;
font-size: 12px;
}
#footer-2-1 .widget, #footer-2-2 .widget,  #footer-2-3 .widget{
margin: 16px 3px ;
padding: 2px;
background: #C7DEFD;/*cor de fundo do interior widget*/
moz-box-shadow: 0 0 5px 5px #888;
-webkit-box-shadow: 0 0 5px 5px#888;
box-shadow: 0 0 5px 5px #888;
}

#footer-2-1 .widget-content, #footer-2-2 .widget-content, #footer-2-3 .widget-content {
margin: 1px;
padding: 3px 1px;
background: #FEF4CC;/*cor de fundo do conteúdo*/
}

Salve.

Se não quiser a sombra nos widgets, apague o código na cor azul
Código na cor rosa é a distância das listas de link da borda do widget
Código em vermelho são as cores dos widgets

Se preferir algo mais clean como este modelo abaixo:

Copie o código abaixo e cole antes de:

]]></b:skin> 

/*Footer widget-------------------------------------------------------------------------*/
#footer-2-1, #footer-2-2,  #footer-2-3 {
margin: 10px -10px;
padding: 3px;
}
#footer-2-1 ul li, #footer-2-2 ul li,  #footer-2-3 ul li{
padding:  0;
margin: 0;
list-style-type:none;
text-align: left;
font-size: 12px;
}
#footer-2-1 .widget, #footer-2-2 .widget,  #footer-2-3 .widget{
margin: 16px 12px ;
padding: 10px  -12px;
border: 1px solid #ccc;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-moz-box-shadow: 0px 10px 10px -7px #888;
-webkit-box-shadow:0px 10px 10px -7px #888;
}