Boostrap dekoracyjne podkreślenie heading

Witam jak wykonać w boostrapie takie podkreślenie:

na css-tricks były przykłady
https://css-tricks.com/styling-underlines-web/

A gdyby diva zrobic pod tym napisem i dac mu obramowanie tylko na dole, a jesli chodzi o kolor, to zrobic nastepnego diva w nim i na okreslona szerokosc i wysokosc, tyle ze tlem w wybranym kolorze, ewentualnie nie robic tego drugiego diva, tylko ten pierwszy styknie i zrobic mu tlo do polowy, czy tam ile trzeba..

hr {
	display: block;
    height: 7px;
    width: 100%;
    border: 0;
    border-bottom:  1px solid black;
    margin: 1em 20;
    padding: 10; 
}
.line {
	height: 0px;
	margin-top: -28px;
	width: 265px;
	border-bottom: 7px solid red;
}

Tak to rozwiazalem. Temat można zamknac.