.footer-bg {
    margin-top: 20px; /* Ajusta el valor según la separación deseada */
    background-color: #dce1e6; /* Color de fondo celeste oscuro */
    color: #0419a1; /* Color de texto blanco */
    padding: 20px 0; /* Añade espacio interno al footer */
    border-radius: 20px; /* Hace que las esquinas sean redondeadas */
    overflow: hidden; /* Asegura que el contenido no sobresalga de las esquinas redondeadas */
   
}

.footer-social-icons {
    list-style: none;
    padding: 0;
    display: flex;
}

.footer-social-icons li {
    margin-right: 10px; /* Ajusta el espaciado entre los iconos */
}

.footer-social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #137ff4; /* Color de fondo del círculo */
    color: white;
    transition: background-color 0.3s; /* Transición para el cambio de color */
}

.footer-social-icons a:hover {
    background-color: #1c87fa; /* Cambia el color al pasar el cursor */
}
.footer-links a {
    color: white; /* Color de texto blanco por defecto */
    transition: color 0.3s; /* Transición para el cambio de color */
}

.footer-links a:hover {
    color: #ffc107; /* Cambia el color al pasar el cursor */
}

/* Agrega los estilos a los enlaces dentro del footer */
.footer-bg ul li a {
    color: rgb(13, 13, 13); /* Color de texto blanco por defecto */
    transition: color 0.3s; /* Transición para el cambio de color */
}

.footer-bg ul li a:hover,
.footer-bg ul li a:focus {
    color: #dfe0f6; /* Cambia el color al pasar el cursor o hacer clic */
}







.image-wrapper {
    display: flex;
    justify-content: center; /* Centra el contenido */
    align-items: center;
    gap: 1px; /* Espacio entre las columnas */
}

.image-column.left {
    display: flex;
    flex-direction: column; /* Para que img1 e img2 estén en columna */
    align-items: center;
}

.image-column.right img {
    width: 100px !important; /* Fuerza el tamaño de img3 */
    height: auto;
}

.image-column img {
    width: 190px; /* Ajusta el tamaño para que no ocupen mucho espacio */
    max-width: 100%;
    height: auto;
    margin-bottom: 10px; /* Espacio entre img1 y img2 */
}


@media (max-width: 768px) {
    .image-wrapper {
        flex-direction: column;
        align-items: center;
    }

    .image-column.right {
        display: flex;
        justify-content: center; /* Centra img3 horizontalmente */
        width: 100%; /* Ocupa todo el ancho disponible */
    }
}




.copyright-text {
    margin-bottom: 30px; /* Ajusta el margen inferior según lo desees */
}