/* --------------------------------------- */
/* ---------- MOBILE XS - 300px ---------- */

@media (min-width:1px) {

    body {
        background: rgb(255,255,255,1);
        background: linear-gradient(90deg, rgba(231,197,255,0.7) 0%, rgba(255,255,255,0) 12%, rgba(254,253,255,0) 88%, rgba(231,197,255,0.7) 100%);
    }

    .section-legal {
        padding-top: 8rem;
        padding-bottom: 4rem;
    }

    .section-legal .row {
        max-width: 90%;
        margin:auto;
    }

    h1 {
        font-size: 46px;
        text-align: center;
        color: #854A97;
        margin-bottom: 1.5rem;
    }

    .paragraphe {
        margin-bottom: 1rem;
    }

}



/* ----------------------------------------------- */
/* ---------- PETIT TABLETTE SM - 576px ---------- */
@media (min-width:576px) {

    .section-legal .row {
        max-width: 70%;
    }

    h1 {
        font-size: 60px;
    }

}

/* -------------------------------------- */
/* ---------- ECRAN LG - 992px ---------- */
@media (min-width:992px) {

    main {
        background-image: url("../images/divers/motif-triangle-legal.svg"), url("../images/divers/motif-triangle-legal-droite.svg");
        background-size: 7rem, 7rem;
        background-position-x: -2%, 102%;
        background-repeat: repeat-y, repeat-y;
    }

    .section-legal {
        padding-top: 10rem;
    }

    .section-legal .row {
        max-width: 50%;
    }

}

/* ---------------------------------------------- */
/* ---------- ECRAN LARGE XXL - 1400px ---------- */
@media (min-width:1400px) {

    body {
        background: linear-gradient(90deg, rgba(231,197,255,0.7) 0%, rgba(255,255,255,0) 8%, rgba(254,253,255,0) 92%, rgba(231,197,255,0.7) 100%);
    }

    main {
        background-size: 9rem, 9rem;
    }

}