.scrollmation-text-on-image {
    position: relative;
}

.scrollmation-text-on-image__inner {
    min-height: 100vh;
}

.scrollmation-text-on-image__content-wrapper {
    position: relative;
    z-index: 5;
    padding-top: 0;
    padding-bottom: 0;
    background: transparent;
}

.container.scrollmation-text-on-image__content-wrapper a:not(.eib-button) {
    color: #fff;
    text-decoration: underline;
}

.scrollmation-text-on-image__content > * {
    color: white;
}

.scrollmation-text-on-image__background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.scrollmation-text-on-image__image {
    position: sticky;
    top: 0;

    width: 100%;
    height: 100vh;
    overflow: hidden;

    background-size: cover;
    background-repeat: no-repeat;
    background-position: center right;
}

@media screen and (min-width: 992px) {
    .scrollmation-text-on-image__inner {
        padding-top: 0;
        padding-bottom: 0;
    }

    .scrollmation-text-on-image__content-wrapper {
        padding-top: 0;
        padding-bottom: 0;

        background: transparent;
    }

    .scrollmation-text-on-image__content {
        min-height: 100vh;
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .scrollmation-text-on-image__content:before {
        position: absolute;
        top: 0;
        right: auto;
        bottom: 0;
        left: 0;
        z-index: -1;
        box-shadow: -700px 0 0 #000;
        box-shadow: -30vw 0 0 #000;

        height: auto;
        width: 140%;

        background: linear-gradient(270deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 1%,rgba(0,0,0,.8) 30%,#000 60%);
        opacity: 0.9;

        content: '';
    }

    .scrollmation-text-on-image--right-align .scrollmation-text-on-image__content:before {
        right: 0;
        left: auto;
        box-shadow: 700px 0 0 #000;
        box-shadow: 30vw 0 0 #000;

        background: linear-gradient(-270deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 1%,rgba(0,0,0,.8) 30%,#000 60%);
    }
}

body .scrollmation-text-on-image__content {
    padding-top: 80px;
    padding-bottom: 80px;
}

@media screen and (max-width: 992px){
    .scrollmation-text-on-image__image{
        height: 100%;
        height: -webkit-fill-available!important;
    }
    .scrollmation-text-on-image__background::before {
        background: rgba(0, 0, 0, 0.20);
    }
}