.archiveBanner .zoneImg img{
    border-radius: 60px;
}
.archiveBanner .fleche svg path{ 
    stroke-width: 1;
}
.archiveBanner .bgPoly{
    background-color: #710196;
    clip-path: polygon(0 0, 100% 0, 100% 60%, 0% 100%);
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    width: 100%;
    top: 0;
    bottom: 0;
}

/* APPARENCES */
/* alignement image */
.archiveBanner.left .zoneText{
    order: 2;
    grid-column-start: 8;
    grid-column-end: 13;
}
.archiveBanner.left .zoneImg{
    order: 1;
    grid-column-start: 1;
    grid-column-end: 7;
}

.archiveBanner.left .bgPoly{
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 60%);
}

.archiveBanner.left .fleche{
    left: auto;
    right: -50%;
    rotate: -180deg;
}

/* quand pas image */ 
.archiveBanner:not(.withImg) .fleche{
    left: auto;
    right: -50%;
    top: -500px;
    transform: scale(1);
    bottom: auto !important;
}

/* MOBILE */
@media (max-width: 769px) {
    .archiveBanner.left .zoneText{
        order: 2;
        grid-column-start: 1;
        grid-column-end: 12;
    }
    .archiveBanner.left .contImg{
        order: 1;
        grid-column-start: 1;
        grid-column-end: 12;
    }
    .archiveBanner .contImg{
        order: 2;
    }
    .archiveBanner .zoneText{
        order: 1;
    }
    .archiveBanner .bgPoly{
        background-color: #710196;
        clip-path: polygon(0 0, 100% 0, 100% 93%, 0% 100%);
        position: absolute;
        z-index: 1;
        left: 0;
        right: 0;
        width: 100%;
        top: 0;
        bottom: 10%;
    }
    .archiveBanner .zoneImg img{
        border-radius: 20px;
    }
}