html - Horizontal lines are not displaying in proper position between text in a site -

here can see " top offers", "top category", "featured products", " top categories" , "top brands",

but can see text "top brands" , it's not in between 2 lines, line displaying below " top categories

images". want move line near top brands other sections.

please me find solution

thanks in advance

<div class=" grid_25">   <br><br> <div class="horizontal_line"> <div><span>top brands</span></div> </div> <br><br> <a href="shop-by-brand/fisher-price.html"> <img class="fluid51" style="max-width: 31.6%;" src="brand1.jpg" alt=""> </a>  <a href="shop-by-brand/funskool.html"><img class="fluid52" style="max-width: 31.6%;" src="brand6.jpg" alt=""> </a>  <a href="shop-by-brand/masoom.html"><img class="fluid53" style="max-width: 31.6%;" src="brand7.jpg" alt=""> </a> <br>  <a href="shop-by-brand/zephyr.html"> <img class="fluid54" style="max-width: 31.6%;" src="brand4.jpg" alt=""> </a>  <a href="shop-by-brand/peacock.html"><img class="fluid55" style="max-width: 31.6%;" src="brand8.jpg" alt=""> </a>  <a href="shop-by-brand/ekta.html"><img class="fluid56" style="max-width: 31.6%;" src="brand9.jpg" alt=""> </a> </div> 

the problem in every grid_25 , grid_24 have mentioned 2 line breaks via <br> gave wanted , u have forgot mention in grid_25 added in html inspect elemeent , below how page looks.