@media screen and (min-width: 1080px) {


    /***** Structure *****/
    #contact {
        position: relative;
    }
    #contact section {
        margin: 50px 0;
    }

    /***** Intro *****/
    #contactIntro {
        position: relative;
    }
    #contactIntro {
        display: grid;
        grid-template-columns: 50% auto;
        align-items: center;
        gap: 20px;
    }
    #contactIntro {
        padding: 50px 5%;
    }
    #contactIntro div {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    #contactIntro div h6, #contactIntro h2, #contactIntro h5, #contactIntro div p {
        color: #fff;
    }
    #contactIntro h6 {
        font-family: 'content-font';
        font-size: 10px;
        font-weight: 100;
        text-align: left;
        text-transform: uppercase;
        letter-spacing: 4px;
    }
    #contactIntro h2 {
        font-family: 'title-font';
        font-size: 28px;
        text-transform: uppercase;
        letter-spacing: 4px;
    }
    #contactIntro div h5, #contactIntro div p {
        font-family: 'content-font';
        font-size: 16px;
        font-weight: 400;
        text-align: justify;
        line-height: 25px;
    }
    #contactIntro div p {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    #contactIntro div p {
        background-color: var(--primary);
        width: fit-content;
        padding: 0 10px;
    }
    #contactIntro div p span {
        position: relative;
        left: -10px;
    }
    #contactIntro div p span {
        background-color: #fff;
        padding: 5px 10px;
    }
    #contactIntro div p span {
        font-weight: 600;
        color: #000;
    }



}