.myIcon {
    font-size: 3em;
}

/* Reduce size for screens smaller than 768px (e.g., tablets and mobiles) */
@media screen and (max-width: 768px) {
    .myIcon {
        font-size: 2em;
        /* Smaller size for smaller screens */
    }
}

/* Further reduce size for screens smaller than 576px (e.g., mobile phones) */
@media screen and (max-width: 576px) {
    .myIcon {
        font-size: 1.5em;
        /* Even smaller size for very small screens */
    }

    .logo{
        width: 80%; /* Reduce la imagen al 80% del contenedor */
        max-width: 300px; /* Evita que crezca demasiado en pantallas pequeñas */
        display: block;
        margin: 0 auto; /* Centra la imagen */
    }
}