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


    .btn_abrir {
        top: 10px;
    }

    .btn_abrir i {
        font-size: 35px;
    }

    .btn_cerrar {
        width: 60px;
        height: 60px;
    }


    #logo_hm {
        width: 90px;
    }

    .lista_hm {
        top: 100px;
    }

    .hm_element {
        gap: 20px;
    }


    ul li {
        padding: 15px;
    }

    li {
        font-size: 25px;
    }

    .socialfooter {
        text-align: center;
        padding: 20px;

    }

    .socialfooter i {
        padding-inline: 5px;


    }


    .title {
        padding-top: 0px;
    }

    h2 {
        font-size: 22px;
    }

    h3 {
        font-size: 16px;
        text-align: center;
    }

    p {
        font-size: 14px;
        padding: 20px;
    }

    .footer2 {
        font-size: 12px;
        padding: 10px;
    }


}