.grid {
    --col-padding: 1.6rem;
    --col-padding-top: 1.6rem;
    --col-padding-bottom: 1.6rem;
    --col-margin-top: 0;
    --col-margin-bottom: 2.4rem;
    --col-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-flow: row wrap;
    width: 100%;
}

    .grid .column {
        --width: var(--col-width);
        --margin: var(--col-margin-top) 0 var(--col-margin-bottom) 0;
        --padding: var(--col-padding-top) var(--col-padding) var(--col-padding-bottom) var(--col-padding);
    }

.grid.has-centered.is-vertical {
    align-items: center;
}

.grid.has-spacing {
    justify-content: space-between;
}

.grid.has-row-margin .column {
    margin: var(--margin);
}

.grid.is-vertical {
    flex-direction: column;
}

.grid.is-flex-start {
    align-items: flex-start;
}

.grid .column {
    flex: none;
    padding: var(--padding);
    width: var(--width);
}


@media (min-width: 1024px) {
    .grid .column {
        flex: 1;
    }
}

.grid .column.is-end {
    margin-left: auto;
}

.grid .column.is-center {
    margin: 0 auto;
}

.grid.has-no-col-padding > .column {
    padding: 0;
}

@media (min-width: 768px) {
    .grid .column.is-shrink {
        flex: none;
        width: auto;
    }

    .grid .column.is-1 {
        --width: 8.3333333333%;
        flex: none;
    }

    .grid .column.is-offset-1 {
        margin-left: 8.3333333333%;
    }

    .grid .column.is-2 {
        --width: 16.6666666667%;
        flex: none;
    }

    .grid .column.is-offset-2 {
        margin-left: 16.6666666667%;
    }

    .grid .column.is-3 {
        --width: 25%;
        flex: none;
    }

    .grid .column.is-offset-3 {
        margin-left: 25%;
    }

    .grid .column.is-4 {
        --width: 33.3333333333%;
        flex: none;
    }

    .grid .column.is-offset-4 {
        margin-left: 33.3333333333%;
    }

    .grid .column.is-5 {
        --width: 41.6666666667%;
        flex: none;
    }

    .grid .column.is-offset-5 {
        margin-left: 41.6666666667%;
    }

    .grid .column.is-6 {
        --width: 50%;
        flex: none;
    }

    .grid .column.is-offset-6 {
        margin-left: 50%;
    }

    .grid .column.is-7 {
        --width: 58.3333333333%;
        flex: none;
    }

    .grid .column.is-offset-7 {
        margin-left: 58.3333333333%;
    }

    .grid .column.is-8 {
        --width: 66.6666666667%;
        flex: none;
    }

    .grid .column.is-offset-8 {
        margin-left: 66.6666666667%;
    }

    .grid .column.is-9 {
        --width: 75%;
        flex: none;
    }

    .grid .column.is-offset-9 {
        margin-left: 75%;
    }

    .grid .column.is-10 {
        --width: 83.3333333333%;
        flex: none;
    }

    .grid .column.is-offset-10 {
        margin-left: 83.3333333333%;
    }

    .grid .column.is-11 {
        --width: 91.6666666667%;
        flex: none;
    }

    .grid .column.is-offset-11 {
        margin-left: 91.6666666667%;
    }

    .grid .column.is-12 {
        --width: 100%;
        flex: none;
    }
}

.has-start {
    justify-content: flex-start !important;
}

.has-centered {
    justify-content: center !important;
}

.has-end {
    justify-content: flex-end !important;
}

.has-half{width: 50%;}

@media screen and (max-width: 1280px) {
    #actualites .grid .column.is-6 {
        width: 66%;
    }
    #actualites .grid .column.is-3 {
        width: 33%;
    }
}

@media screen and (max-width: 1024px) {
    #actualites .grid .column.is-3 {
        width: 50%;
    }
    .has-swipeMobile {
        width: 100vw;
        flex-wrap: nowrap;
        overflow-x: scroll;
        gap: 1.2rem;
        margin-left: -1.6rem;
        padding: 2.4rem 1.6rem;
    }

    .has-swipeMobile > .column{
        width: 40%!important;
        padding: 0;
    }

    .has-inlineMobile > .column{
        width: auto !important;
    }
}
@media screen and (max-width: 720px) {
    .has-swipeMobile > .column {
        width: 80%!important;
        padding: 0;
    }
    #actualites .grid .column.is-3 {
        width: 100%;
    }
}