FOOTER INDEX

<footer>
<div class="footer-container">
<div class="footer-column">
<h3><i class="fas fa-cogs"></i> Nuestra Plataforma</h3>
<ul style="background-color: #3330;">
<li>Sencillez y agilidad</li>
<li>Una herramienta que se adapta a las necesidades y procesos actuales
de tu organización</li>
<li>Data Analytics para medir la operación en tiempo real</li>
<li>APIs de integración</li>
<li>Privacidad y resguardo de datos</li>
</ul>
<a href="sobrenos.html" class="footer-link"><i class="fas fa-info-
circle"></i> Sobre nosotros</a>
</div>
<div class="footer-column">
<h3><i class="fas fa-cubes"></i> Módulos Disponibles</h3>
<p>Toma el control absoluto para entregar la mejor experiencia a tus
pacientes.</p>
<div class="hex-container">
<!-- Aquí coloca tus hexágonos o enlaces a los módulos disponibles -->
</div>
</div>
<div class="footer-column">
<h3><i class="fas fa-map-marker-alt"></i> Ubicación</h3>
<div id="map"><iframe src="https://www.google.com/maps/embed?pb=!1m18!
1m12!1m3!1d14029.25880567122!2d-65.78533767015857!3d-28.470067763185654!2m3!1f0!
2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x942428bf1d0f9fcd%3A0x7e1edd4b1609861a!
2sSan%20Fernando%20del%20Valle%20de%20Catamarca%2C%20Catamarca!5e0!3m2!1ses-419!
2sar!4v1685286269393!5m2!1ses-419!2sar" width="200" height="100" style="border:0;"
allowfullscreen="" loading="lazy"
referrerpolicy="no-referrer-when-downgrade"></iframe></div>
</div>
<div class="footer-column">
<h3><i class="fas fa-whatsapp"></i> Contacto</h3>
<p>Contáctanos a través de:</p>
<a href="mailto:elcorreoquequieres@correo.com" class=""><img
src="./img/gmail.png" width="20px" alt="Email"><strong>E-mail</strong></a>
<a href="https://wa.me/11111111" class="whatsapp-link"><img
src="./img/btn-whatsapp-mob.png" width="20px" alt="WhatsApp"><strong>
11111111</strong></a>
<p>Nuestras Redes:</p>
<a href="#" class=""><img src="./img/facebook.png" width="20px"
alt="Facebook"><strong>Facebook</strong></a>
<a href="#" class=""><img src="./img/instagram.png" width="20px"
alt="Instagram"><strong>Instagram</strong></a>
</div>
</div>
</footer>
<section class="sub-footer" style="background-color: #41234e; text-align:
center; padding: 10px;">
<div class="sub-footer-container">
<div class="row">
<div class="col-sm-10 text-center text-sm-left">
<span class="">Ges-Far 2023 ©. <span class="d-block d-sm-inline mb-
2">Todos los derechos reservados.</span></span>
</div>
<div class="col-sm-2 text-center text-sm-right">
 <a href="#" target="_blank" class="hvr-float-shadow">
<img src="./img/silueta logo.png" width="48px" alt="Ges-Far">
</a>
</div>
</div>
</div>
</section>

CSS FOOTER

/* footer */
footer {
width: 100%;
background-color: #683a7c;
padding: 20px;
}
.footer-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.footer-column {
width: calc(25% - 20px);
margin-bottom: 20px;
}

.footer-column h3 {
font-size: 18px;
font-weight: bold;
margin-bottom: 10px;
}

.footer-column ul {
list-style: disc;
padding-left: 20px;
margin: 0;
}

.footer-link {
display: block;
margin-top: 10px;
color: rgb(18, 18, 29);
}

.whatsapp-link {
display: inline-block;
margin-top: 10px;
color: rgb(5, 65, 5);
text-decoration: none;
}

#map {
width: 100%;
height: 200px;
background-color: #ccc;

}@media only screen and (max-width: 768px) {

.footer-column {
 width: 100%;
}
}