Tutorial: Modificando a linha de separação dos Gadgets

Olá meninas e meninos, como vão? Hoje vou ensinar um tutorial que descobri, que é personalizar (Mudar) a aquela barrinha que separa os gadgets. Bem é simples e fácil também.Para vocês entenderem melhor o que é, tem uma imagem abaixo de como vai ficar:

                                 
 Então vamos, lá! clique em leia mais para saber como fazer!

Então gente vamos lá ao tutorial.
1- vá no seu html e  procure pelo seguinte código:

.sidebar .widget {

 2- Abaixo dele vai está mais ou menos assim:


  border-bottom: 2px solid $(widget.border.bevel.color);
  padding-bottom: 10px;
  margin: 10px 0;
}


3- então você vai apagar somente isso:


  border-bottom: 2px solid $(widget.border.bevel.color);


4- e cole isso no lugar:


border-bottom: 1px dashed #ffffff;


5- ai é só editar conforme a legenda abaixo:

Vermelho: a espessura da borda.
Verde: é a forma (jeito) da borda. Se quiser, veja nesse link AQUI!
Roxo: é a cor da borda. Se quiser, veja cores em html aqui!

Bem gente, é só isso!
beijos gente, comentem bastante!