:root {
    --colorA: rgb(189, 255, 201);
    --colorB: rgb(143, 53, 245);

    --colorC: rgb(254, 249, 113);
    --colorD: rgb(255, 25, 163); 

    --colorE: rgb(255, 188, 227);
    --colorF: rgb(255, 18, 57);

    --colorG: rgb(129, 219, 126);
    --colorH: rgb(70, 42, 6);;

    --colorI: rgb(231, 173, 252);
    --colorJ: rgb(24, 96, 15);

    --colorK: rgb(255, 255, 255);
    --colorL: rgb(0, 0, 0);

    --colorM: #fff3c9;
    --colorN: #2d59dc;

    --colorO: rgb(255, 218, 125);
    --colorP: rgb(255, 60, 0);

    --colorQ: rgb(53, 157, 255);
    --colorR: rgb(199, 234, 255);

    --colorS: rgb(46, 51, 90);
    --colorT: rgb(255, 165, 106);

    --color1: var(--colorM);
    --color2: var(--colorN);

    --color2bis: var(--colorN);

    --flexGauche: 0.645;
    --flexDroite: 1.3;


    --height-header: 3vw;
    --border-top-header: none ;
    --grid-template-columns-header-top: auto auto auto 4vw;

    --font-size-MainTitle: auto;
    --width-MainContact: auto;

    --flex-direction-body: column;
    
}

.tel-broken{display: none;}

@media (max-width: 710px) {

.header{display: none;}
.header-custom{display: none;}
.container{display: none;}

.tel-broken{
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    background-color: var(--color1);
    color: var(--color2);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 3vw;
    text-align: center;
    gap: 2vw;
}

.tel-broken img{
    max-width: 20%;
    height: auto;
}

}