.d-section-layout-left-image,
.d-section-layout-right-image,
.d-section-layout-top-image,
.d-section-layout-bottom-image {
    position: relative;
    display: flex;
}


    .d-section-layout-left-image > .w-bg-layer,
    .d-section-layout-right-image > .w-bg-layer,
    .d-section-layout-top-image > .w-bg-layer,
    .d-section-layout-bottom-image > .w-bg-layer {
        position: relative;
        margin-top: auto;
        margin-bottom: auto;
        /*    min-height: 300px;
*/
    }
    .d-section-layout-left-image > .w-content,
    .d-section-layout-right-image > .w-content,
    .d-section-layout-top-image > .w-content,
    .d-section-layout-bottom-image > .w-content {
        padding: 3%;
        margin-top: auto;
        margin-bottom: auto;
    }

.d-section-layout-top-image > .w-bg-layer,
.d-section-layout-bottom-image > .w-bg-layer {
    height: 300px;
}
    .d-section-layout-left-image > .w-bg-layer,
    .d-section-layout-right-image > .w-bg-layer {
        background-origin: content-box;
        padding: 15px;

    }




@media (max-width: 600px) {
    /*mobile*/
    .d-section-layout-left-image > .w-content,
    .d-section-layout-right-image > .w-content,
    .d-section-layout-left-image > .w-bg-layer,
    .d-section-layout-right-image > .w-bg-layer {
        flex-basis: auto;
    }

    .d-section-layout-left-image > .w-bg-layer,
    .d-section-layout-right-image > .w-bg-layer {
        flex-basis: auto;
    }
    .w-site .d-section-layout-left-image {
        flex-direction: column-reverse;
    }

    .w-site .d-section-layout-right-image  {
        flex-direction: column;
    }
}
@media (min-width: 600px) {

    .d-section-layout-left-image > .w-bg-layer,
    .d-section-layout-right-image > .w-bg-layer,
    .d-section-layout-left-image > .w-content,
    .d-section-layout-right-image > .w-content,
    .d-section-layout-left-image > .w-bg-layer,
    .d-section-layout-right-image > .w-bg-layer {
        flex: 0 0 50%;
        min-width: 0; /* important */
        box-sizing: border-box;
    }
    .control-type-panel, .w-panel.d-section-layout-left-image,
    .control-type-panel, .w-panel.d-section-layout-right-image {
        flex-wrap: nowrap;
    }
 
}



.d-section-layout-left-image {
    flex-direction: row-reverse;
}

.d-section-layout-right-image {
    flex-direction: row;
}

.d-section-layout-bottom-image {
    flex-direction: column-reverse;
}

.d-section-layout-top-image {
    flex-direction: column;
}

.d-section-layout-behind-image {
}