Я хочу изменить порядок делений в нижнем колонтитуле для разрешения вкладок и мобов, но не могу получить ссылки на социальные ссылки ниже блока адресов, может кто-нибудь предложить решение, почему это не работает: проблема в том, что логотип и социальные ссылкивложенный в один и тот же div?
<footer class="container-fluid">
<div class="row">
<div class="col-12 col-md-5 col-lg-4 d-flex justify-content-center align-items-end address-block">
<p class="address-footer">
<em>Cyalk Cmunions Ltd</em><br>
Heate use<br>
Rans Lane<br>
Aybury<br>
Bus<br>
H9 8RT<br><br>
<span>Company registered number: 06416</span>
</p>
</div>
<div class="col-12 col-md-2 col-lg-4 d-flex justify-content-center align-items-center flex-column logof-block">
<div class="logo-footer">
<img src="~/img/logo-footer-rgb-group.png" alt="logo-footer">
</div>
<div class="social-footer">
<a href="#">
<img class="bloggerw-icon" src="~/img/blogger.png" alt="blogger icon">
</a>
<a href="https://www.facebook.com/cikcomms/">
<img class="facew-icon" src="~/img/facebook.png" alt="face icon">
</a>
<a href="#">
<img class="linkedinw-icon" src="~/img/linked-in.png" alt="linkedin icon">
</a>
<a href="#">
<img class="pinterestw-icon" src="~/img/pinterest.png" alt="pinterest icon">
</a>
<a href="https://twitter.com/CitkComms?lang=en">
<img class="twitterw-icon" src="~/img/twitter.png" alt="twitter icon">
</a>
<a href="#">
<img class="youtubew-icon" src="~/img/youtube.png" alt="youtube icon">
</a>
<a href="#">
<img class="instagram-icon" src="~/img/instagram.png" alt="instragram icon">
</a>
</div>
</div>
<div class="col-12 col-md-5 col-lg-4 d-flex justify-content-center align-items-end contactf-block">
<p class="contact-footer">
New Business Sales <em class="nr1f">03 2414 101</em><br />
Provisioning & Engineering <em class="nr2f">33 2414 102</em><br />
Support <em class="nr3f">0333 2414 103</em><br />
Accounts & Billing <em class="nr4f">33 2414 104</em><br><br />
<span>Terms, Conditions and Complaints</span>
</p>
</div>
</div>
</footer>
//////////////// ///////// div для маленьких экранов ////////
@media (max-width: 768px) {
.logo-footer {
order: 1;
}
.address-block {
order: 2;
}
.social-footer {
order: 3;
}
.contactf-block {
order: 4;
}
}