/**
 * Fichier  : /menus/footer/assets/css/contact.css
 * Fonction : style des informations de contact
 */


/* ==================================================
   CONTACT
================================================== */

#footer .contact .inner {
    display: flex;
    flex-direction: column;
    gap: 1em;
}


/* ==================================================
   LIGNES
================================================== */

#footer .contact .inner div {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
}

#footer .contact .inner div:nth-child(3) {
    align-items: flex-start;
}


/* ==================================================
   ICÔNES
================================================== */

#footer .contact .inner div svg {
    width: auto;
    height: 20px;
}

#footer .contact .inner div svg {
    color: #fff;
}


/* ==================================================
   TEXTES
================================================== */

#footer .contact .inner div a,
#footer .contact .inner div p {
    position: relative;
}

#footer .contact .inner div a,
#footer .contact .inner div p {
    font-family: 'content-font';
    font-size: 14px;
}

#footer .contact .inner div svg,
#footer .contact .inner div a,
#footer .contact .inner div p {
    color: #fff;
}


/* ==================================================
   RESPONSIVE
================================================== */

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

    #footer .contact .inner {
        gap: 20px;
    }

    #footer .contact .inner div {
        flex-direction: column;
        gap: 5px;
    }

    #footer .contact .inner div:nth-child(3) {
        align-items: center;
    }

    #footer .contact .inner div svg {
        height: 25px;
    }

    #footer .contact .inner div a,
    #footer .contact .inner div p {
        text-align: center;
    }

}