:root:root [data-designpart=row-flow] {
    display: flex;
    gap: calc(32px * var(--fo-spacing-coef));
    margin: 10px auto
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow] {
        flex-direction: column;
        gap: calc(32px * var(--fo-spacing-coef) * .75)
    }
}
:root:root [data-designpart=row-flow]+[data-designpart=row-flow] {
    margin-top: calc(32px * var(--fo-spacing-coef))
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow]+[data-designpart=row-flow] {
        margin-top: calc(32px * var(--fo-spacing-coef) * .75)
    }
}
:root:root [data-designpart=row-flow]+[data-designpart=row-flow] div.col:not(:root) {
    padding: 0
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow]+[data-designpart=row-flow] div.col:not(:root):first-child::before {
        display: inline-flex
    }
}
@media screen and (min-width:770px) {
    :root:root [data-designpart=row-flow]+[data-designpart=row-flow] div.col:not(:root):first-child .component:not(:root).image::before {
        display: inline-flex
    }
}
:root:root [data-designpart=row-flow] div.col:not(:root) {
    padding: 0
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow] div.col:not(:root) {
        position: relative
    }
}
@media screen and (min-width:770px) {
    :root:root [data-designpart=row-flow] div.col:not(:root):is(.vertical_position_top, .vertical_position_middle, .vertical_position_bottom) {
        display: flex;
        flex-direction: column;
        align-self: auto !important
    }
    :root:root [data-designpart=row-flow] div.col:not(:root):is(.vertical_position_top, .vertical_position_middle, .vertical_position_bottom) .component:not(:last-child) {
        margin-bottom: 0
    }
    :root:root [data-designpart=row-flow] div.col:not(:root).vertical_position_top {
        justify-content: start
    }
    :root:root [data-designpart=row-flow] div.col:not(:root).vertical_position_middle {
        justify-content: center
    }
    :root:root [data-designpart=row-flow] div.col:not(:root).vertical_position_bottom {
        justify-content: end
    }
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow] div.col:not(:root)::before {
        content: "";
        background-image: url(../images/arrow-h.svg);
        background-repeat: no-repeat;
        background-size: contain;
        width: 100px;
        height: 40px;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%,0) rotate(90deg);
    }
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow] div.col:not(:root):first-child::before {
        display: none
    }
}
@media screen and (min-width:770px) {
    :root:root [data-designpart=row-flow] div.col:not(:root):first-child .component:not(:root).image::before {
        display: none;
        left: -15px
    }
}
:root:root [data-designpart=row-flow] div.col:not(:root) .component:not(:root) {
    padding: 0 10px
}
:root:root [data-designpart=row-flow] div.col:not(:root) .component:not(:root):not(:first-child) {
    margin-top: calc(16px * var(--fo-spacing-coef))
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow] div.col:not(:root) .component:not(:root):not(:first-child) {
        margin-top: calc(16px * var(--fo-spacing-coef) * .75)
    }
}
@media screen and (min-width:770px) {
    :root:root [data-designpart=row-flow] div.col:not(:root) .component:not(:root).image {
        position: relative
    }
}
@media screen and (min-width:770px) {
    :root:root [data-designpart=row-flow] div.col:not(:root) .component:not(:root).image::before {
        content: "";
        background-image: url(../images/arrow-h.svg);
        background-repeat: no-repeat;
        background-size: contain;
        width: calc(32px * var(--fo-spacing-coef));
        height: 40px;
        position: absolute;
        top: 50%;
        left: calc(-32px * var(--fo-spacing-coef));
        transform: translate(0, -50%)
    }
}
:root:root [data-designpart=row-flow] div.col:not(:root) .component:not(:root).heading:not(:root) :is(h1, h2, h3, h4, h5) {
    margin-bottom: 0
}
@media screen and (max-width:769px) {
    :root:root [data-designpart=row-flow] div.col:not(:root) .component:not(:root).richtext {
        text-align: center
    }
}