/* Desktop */
@media screen and (min-width : 1280px) {

    #gridcontact{
        display: grid;
        margin-left: 15vw;
        grid-template-columns: repeat(20, 4vw);
        grid-template-rows: repeat(11, 4vw);
    }
    #conttitre{
        grid-column: 9/14;
        grid-row: 2/3;
        padding-left: 2vw;
    }
    #conttitre > h2 {
        font-family: 'garden';
        font-size: 3em;
    }
    #conttrait {
        grid-column: 10/16;
        grid-row: 3/4;
        border-top: solid var(--main-color) 3px;
    }
    #contlien{
        grid-column: 5/13;
        grid-row: 7/11;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: space-around;
    }
    #contlien > p {
        font-family: 'bellerose';
        font-size: 1.5em;
    }
    #contimg{
        grid-column: 14/21;
        grid-row: 1/12;
        z-index: -5;      
    }
    #calendly-button {
        grid-column: 9/12;
        grid-row: 5/6;
        border-radius: 1vh;
        background-color: var(--main-color);
        border: 5px solid #fff;
        color: #fff;
        font-size: 1.2rem;
        cursor: pointer;
    }
    .calendly-inline-widget {display: none;}
}

/* Tablette */
@media  screen and (min-width : 768px) and (max-width : 1279px) {
    #gridcontact {
        margin: 11vh auto 0 auto;
        width: 96%;
         display: flex;
        flex-direction: column;
    }
    #conttitre {
        text-align: center;
    }
    #contlien {
        display: flex;
        flex-direction: column;
        gap: 2vh;
        margin-bottom: 3vh;
        align-items: end;
    }
    #contlien > a {
        width: 100%;
        font-size: 0.8em;
        text-align: end;
    }
    #contlien .smc {
        font-size: 1.1em;
    }
    #calendly-button {
        margin: 3vh 10vw;
        padding: 1vh;
        border-radius: 1vh;
        background-color: var(--main-color);
        border: 5px solid #fff;
        color: #fff;
        font-size: 1.2rem;
        cursor: pointer;
    }
    .calendly-inline-widget {display: none;}
}

/* Mobile */
@media screen and (max-width : 767px) {
    #gridcontact {
        margin: 11vh 2% 0 2%;
        width: 96%;
        display: flex;
        flex-direction: column;
    }
    #conttitre {
        text-align: center;
    }
    #contlien {
        display: flex;
        flex-direction: column;
        gap: 2vh;
        margin-bottom: 3vh;
    }
    #contlien > a {
        width: 100%;
        font-size: 0.8em;
        text-align: right;
    }
    #contlien .smc {
        font-size: 1.1em;
    }
    #calendly-button {
        margin: 3vh 10vw;
        padding: 1vh;
        border-radius: 1vh;
        background-color: var(--main-color);
        border: 5px solid #fff;
        color: #fff;
        font-size: 1.2rem;
        cursor: pointer;
    }
    .calendly-inline-widget {display: none;}
}