las imágenes en rosa (kittycakes_designsystem-03-left.png, designsystem-03-right.png" )están sobre los iconos de redes sociales que son links y no me permiten dar click sobre ellos esto esta hecho en Bootstrap necesito acomodarlas debajo de los botones para poder dar click, mas que una respuesta necesito documentación sobre ello.
<div class="row text-center">
<div class="col">
</div>
<div class="col ">
<div class="row text-center mx-auto">
<div class="col ">
<a href=""><img src="assets/img/whatsapp.png" alt=""></a>
</div>
<div class="col">
<a href=""><img src="assets/img/whatsapp.png" alt=""></a>
<div class="row text-center">
<p class="mx-auto mt-5">Kitty Cakes Pastelitos 2022</p>
</div>
</div>
<div class="col">
<a href=""><img src="assets/img/whatsapp.png" alt=""></a>
</div>
</div>
</div>
<div class="col">
</div>
<div class="row overlay-footer">
<div class="col-6">
<img src="assets/img/kittycakes_designsystem-03-left.png"
class="float-left" alt="" width="864px">
</div>
<div class="col-6">
<img src="assets/img/kittycakes_designsystem-03-right.png"
class="float-right" alt="" width="864px">
</div>
</div>
</div>
</div>
</footer>
z-index
ni agregaría posiciones absolutas en estilosin-line
. Una mejor opción es convertir esas imágenes a backgrounds de los contenedores que ya tienes definidos. Añade un código reproducible dando clic en editar para darte una respuesta.