#background-video {
    object-fit: cover;
    max-height: 800px;
}
.layout-video .position-absolute.w-100.bottom-0.text-left {
    bottom: 65px !important;
}

.composition {
    position: relative;
}
.composition .block-editor-block-list__block.wp-block-columns,
.composition .block-editor-block-list__block.wp-block-column{
    pointer-events: auto
}
.composition .block-editor-block-list__block.wp-block-columns .block-editor-block-list__layout .wp-block-columns {
    pointer-events: auto;
}
.block-list-appender {
    pointer-events: auto;
}

    .composition.gap-xs .colonnes { gap: 20px !important; }
    .composition.gap-sm .colonnes { gap: 30px !important; }
    .composition.gap-md .colonnes { gap: 40px !important; }
    .composition.gap-lg .colonnes { gap: 60px !important; }
    .composition.gap-xl .colonnes { gap: 80px !important; }
    .composition.gap-xxl .colonnes{ gap: 100px !important; }

    .composition.layout-imageTop .wp-block-columns,
    .composition.layout-imageBottom .wp-block-columns {
        flex-direction: column; }

    .composition.align-items-stretch .colonne-1 { display: flex; flex-direction: column; }
    .composition.align-items-stretch .colonne-1 > * { flex-grow: 1; }

    .composition.layout-texte .colonne-0 { flex: 0 1 auto; width: 100%; display: none; }
    .composition.layout-texte .colonne-1 { flex: 0 1 auto; width: 100%; }

    .composition.layout-imageTop .colonne-0 { flex: 0 1 auto; width: 100%; }
    .composition.layout-imageTop .colonne-1 { flex: 0 1 auto; width: 100%; }

    .composition.layout-imageBottom  .colonne-0 { flex: 0 1 auto; width: 100%; order: 1; }
    .composition.layout-imageBottom  .colonne-1 { flex: 0 1 auto; width: 100%; order: 0; }

    .composition.layout-imageLeft-25 .colonne-0 { flex: 0 1 auto; width: 25%; }
    .composition.layout-imageLeft-25 .colonne-1 { flex: 0 1 auto; width: 75%; }

    .composition.layout-imageLeft-33 .colonne-0 { flex: 0 1 auto; width: 33%; }
    .composition.layout-imageLeft-33 .colonne-1 { flex: 0 1 auto; width: 66%; }

    .composition.layout-imageLeft-50 .colonne-0 { flex: 0 1 auto; width: 50%; }
    .composition.layout-imageLeft-50 .colonne-1 { flex: 0 1 auto; width: 50%; }

    .composition.layout-imageLeft-66 .colonne-0 { flex: 0 1 auto; width: 66%; }
    .composition.layout-imageLeft-66 .colonne-1 { flex: 0 1 auto; width: 33%; }

    .composition.layout-imageLeft-75 .colonne-0 { flex: 0 1 auto; width: 75%; }
    .composition.layout-imageLeft-75 .colonne-1 { flex: 0 1 auto; width: 25%; }

    .composition.layout-imageRight-25 .colonne-0 { flex: 0 1 auto; width: 25%; order: 1; }
    .composition.layout-imageRight-25 .colonne-1 { flex: 0 1 auto; width: 75%; order: 0; }

    .composition.layout-imageRight-33 .colonne-0 { flex: 0 1 auto; width: 33%; order: 1; }
    .composition.layout-imageRight-33 .colonne-1 { flex: 0 1 auto; width: 66%; order: 0; }

    .composition.layout-imageRight-50 .colonne-0 { flex: 0 1 auto; width: 50%; order: 1; }
    .composition.layout-imageRight-50 .colonne-1 { flex: 0 1 auto; width: 50%; order: 0; }

    .composition.layout-imageRight-66 .colonne-0 { flex: 0 1 auto; width: 66%; order: 1; }
    .composition.layout-imageRight-66 .colonne-1 { flex: 0 1 auto; width: 33%; order: 0; }

    .composition.layout-imageRight-75 .colonne-0 { flex: 0 1 auto; width: 75%; order: 1; }
    .composition.layout-imageRight-75 .colonne-1 { flex: 0 1 auto; width: 25%; order: 0; }

    .composition #background-video { position: relative; width: 100% }

    @media (max-width: 576px) {
        .composition .colonne-0 { width: 100% !important; }
        .composition .colonne-1 { width: 100% !important; }
        .composition.gap-xs .colonnes { gap: 20px !important; }
        .composition.gap-sm .colonnes { gap: 20px !important; }
        .composition.gap-md .colonnes { gap: 20px !important; }
        .composition.gap-lg .colonnes { gap: 20px !important; }
        .composition.gap-xl .colonnes { gap: 20px !important; }
        .composition.gap-xxl .colonnes{ gap: 20px !important; }
    }