Splitting footer column / changing the codes

Thank you for your help!
Where can I change the footers sizes?
footer-column footer-column-6 col-md-4 col-sm-12
I would like to have it like this so then it would look great:
footer-column footer-column-6 col-md-4 col-sm-6

It looks okay with this <p style=”padding-left:10%”> codes inside the footer column 6 but not perfect.

<p>Olemme suomalainen verkkokauppa, joka on keskittynyt nimensä mukaisiin tuotteisiin.</p>
<div style=”display:flex”>
<p>
<i class=”fa fa-location-arrow” style=”width: 15px; text-align: center; margin-right: 4px; color: #676767;”></i> Mindeninkuja 6 A, Espoo 02780<br>
<i class=”fa fa-mobile” style=”width: 15px; text-align: center; margin-right: 4px; color: #676767;”></i> Puh: +358 10 778 7730<br>
<i class=”fa fa-id-card-o” style=”width: 15px; text-align: center; margin-right: 4px; color: #676767;”></i> Y-tunnus: 2206707-0
</p>
<p style=”padding-left:10%”>
</p>
</div>
<p></p>

I did it your way and it looks good but the mobile version is little bit different.
How can I make the blocks come near each other in the mobile?
Look at the image (Blocks).

I tried this but it didn’t split this in mobile. Maybe I had too big widget title ( <h5 class=”widget-title”>TIEDOT</h5> )? It split these in tablet mode.

Thank you for the video!