.cb-row {
    display: flex;
    gap: 10px;
    padding: 0 20px;
    flex-wrap: wrap;
}

@media (min-width: 768px) {
    .cb-row {
        padding: 20px;
    }
}

@media (min-width: 768px) {
    .cb-row {
        flex-wrap: nowrap;
    }
}

.cb-column {
    display: flex;
    gap: 10px;
    width: 100%;
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    .cb-column {
        flex-direction: row;
        flex: 1;
        width: auto;
        margin-bottom: 0;
    }
}

.cb-column.all-vertical {
    flex-wrap: wrap;
}

.cb-column.all-vertical .cb-image {
    flex: 0 0 100%;
    height: auto;
    padding: 0 10px;
}

@media (min-width: 768px) {
    .cb-column.all-vertical .cb-image {
        height: 90px;
    }
}

.cb-column.all-vertical .cb-texts {
    flex: 0 0 100%;
    font-size: 1.125rem;
}

.cb-image {
    flex: 0 0 20%;
}

.cb-texts {
    flex: 0 0 75%;
    font-size: 1.125rem;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.flex-width-9 {
    flex: 0 0 20%;
}

@media (min-width: 768px) {
    .flex-width-9 {
        flex: 0 0 9%;
    }
}

.flex-width-20 {
    flex: 0 0 20%;
}

.with-separator {
    position: relative;
}

@media (min-width: 768px) {
    .with-separator::after {
        content: "";
        position: absolute;
        right: 0;
        bottom: 5%;
        background: var(--global--color-green);
        width: 1.5px;
        height: 90%;
    }
}
