.block-4-freier-text .headlineWrap{
    margin-bottom: 6rem;
}

.block-4-freier-text .textWrap.greyBack{
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
}

.block-4-freier-text .flexRow{
    position: relative;
    z-index: 3;
}

.block-4-freier-text .innerWrap{
    position: relative;
}

.block-4-freier-text .innerWrap:before{
    content: '';
    position: absolute;
    top: 0;
    left: calc( 100% / 12 );
    width: calc( 100% * 10 / 12 );
    height: 100%;
    background-color: var(--blue6);
    z-index: 1;
}

.block-4-freier-text .innerWrap:after{
    content: '';
    position: absolute;
    top: 1rem;
    right: calc( (100% / 12) + 3rem );
    -webkit-transform: translateY(50%);
        -ms-transform: translateY(50%);
            transform: translateY(50%);
    width: 8.6rem;
    height: 12.8rem;
    background-image: url('../../assets/images/drei-boxen-versetzt.svg');
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 2;
}

.block-4-freier-text .textWrap.greyBack h1,
.block-4-freier-text .textWrap.greyBack h2,
.block-4-freier-text .textWrap.greyBack h3,
.block-4-freier-text .textWrap.greyBack h4,
.block-4-freier-text .textWrap.greyBack p{
    color: var(--white);
}

.block-4-freier-text .textWrap.twoColText{
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
    -webkit-column-gap: 8rem;
       -moz-column-gap: 8rem;
            column-gap: 8rem;
}

.block-4-freier-text .textWrap.threeColText{
    -webkit-column-count: 3;
       -moz-column-count: 3;
            column-count: 3;
    -webkit-column-gap: 8rem;
       -moz-column-gap: 8rem;
            column-gap: 8rem;
}


@media(max-width: 1199px){
    .block-4-freier-text .innerWrap:before{
        width: 100%;
        left: 0;
    }
    
    .block-4-freier-text .innerWrap:after{
        right: 3rem;
    }
        
    .block-4-freier-text .textWrap.twoColText,
    .block-4-freier-text .textWrap.threeColText{
        -webkit-column-count: 2;
           -moz-column-count: 2;
                column-count: 2;
        -webkit-column-gap: 5rem;
           -moz-column-gap: 5rem;
                column-gap: 5rem;
    }
}

@media(max-width: 991px){
    .block-4-freier-text .textWrap.greyBack{
        padding-left: 3rem;
        padding-right: 9rem;
    }   

    .block-4-freier-text .innerWrap:after{
        right: 2rem;
        width: calc( 8.6rem * .6 );
        height: calc( 12.8rem * .6 );
    }
}

@media(max-width: 767px){
    .block-4-freier-text .textWrap.greyBack{
        padding-top: 7.5rem;
        padding-right: 3rem;
    }   

    .block-4-freier-text .innerWrap:after{
        top: -7rem;
    }

    .block-4-freier-text .textWrap.twoColText,
    .block-4-freier-text .textWrap.threeColText{
        -webkit-column-count: 1;
           -moz-column-count: 1;
                column-count: 1;
        -webkit-column-gap: 0;
           -moz-column-gap: 0;
                column-gap: 0;
    }
}

.block-4-freier-text .textWrap.threeColText.multiCol{
    position: relative;
}

.block-4-freier-text .textWrap.threeColText.multiCol:after {
    content: '';
    position: absolute;
    width: calc(10.9rem * .7);
    height: calc(16rem * .7);
    background-image: url(../../assets/images/drei-boxen-versetzt.svg);
    z-index: 2;
    background-size: cover;
    background-repeat: no-repeat;
    right: 0;
}