.homepage_banner {
    height: 622px;
    top: 80px;
}

img.homepage_banner_photo {
    position: absolute;
    display: block;
    height: 622px;
    width: auto;
    left: 0;  /* -20px */
    bottom: 0px;
}

img.homepage_banner_circle {
    position: absolute;
    display: block;
    height: 770px;
    width: auto;
    bottom: -48px;
    left: 0px;
    z-index: 1;
    pointer-events: none;
}

h1.homepage_banner_title {
    margin-left: 557px;
    padding-top: 253px;
}

.homepage_banner_text {
    margin-left: 557px;
    padding-top: 1.3em;
    max-width: 500px;
}

.homepage_banner_text.shifted {
    margin-left: 0;
}

.light_green_wrapper {
    margin-top: 80px;
    padding-top: 164px;
    padding-bottom: 164px;
}

.light_green_wrapper .standard_text, .light_green_wrapper h2 {
    max-width: 530px;
    margin-left: auto;
    margin-right: auto;
}

.light_green_wrapper h2 {
    text-align: center;
}

.light_green_wrapper .standard_text {
    padding-top: 55px;
}

.block_with_vertical_line {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 100px;
    max-width: 1012px;
    margin-left: auto;
    margin-right: auto;
}

.block_with_vertical_line_content_wrapper {
    /*max-width: 850px;*/
    -ms-flex-negative: 1;
    flex-shrink: 1;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    width: 100%;
}

.block_with_vertical_line_gray_content {
    padding: 30px;
    background-color: #f6f6f6;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    box-shadow: inset 0 2px 4px 1px rgb(203 206 206);
}

.block_with_vertical_line_content_image_wrapper {
    margin-top: 34px;
    border-radius: 7px;
    height: 0;
    padding-bottom: 50%;
    overflow: hidden;
}

.block_with_vertical_line_content_image_wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.block_with_vertical_line_content_image {
    width: 100%;
    height: 0;
    padding-bottom: 50%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 0px;
    border-radius: 7px;
    cursor: pointer;
}

.block_with_vertical_line h3.light {
    padding-bottom: 3px;
}

.block_with_vertical_line_content_text, .narrow_text_block {
    max-width: 530px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 50px;
    padding-left: 0 !important; /* 20px */
    padding-right: 0; /* 20px */
}



.narrow_text_block {
    padding-top: 105px;
}

.block_with_vertical_line_content_text.smaller_padding {
    padding-left: 50px;
}

.vertical_line, .vertical_line_shadow {
    width: 100%;
    -ms-flex-negative: 8;
    flex-shrink: 8;
    min-width: 0;
    top: -7px;
    padding-right: 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.vertical_line.none {
    display: none;
}

.vertical_line_img {
    height: calc(100% + 7px);
    width: auto;
}

.narrow_text_block_content {
    padding-top: 50px;
}

.video_container {
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    margin-top: 60px;
}

.video_container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video_container_img_holder {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

.video_container_img_holder::after, .block_with_vertical_line_content_image::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 150px 150px;
    background-image: url(../../img/play.svg);
}

.narower {
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding-top: 103px;
}

.three_columns {
    column-count: 3;
    padding-top: 80px;
    padding-bottom: 60px;
    column-gap: 55px;
}

.two_columns {
    column-count: 2;
    padding-top: 80px;
    padding-bottom: 60px;
    column-gap: 55px;
}

.one_third_column {
    -ms-flex-preferred-size: 28%;
    flex-basis: 28%;
    padding-bottom: 50px;
}

.one_third_column_image {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.two_columns, .three_columns {
    font-size: 16px;
}

.two_columns p, .three_columns p {
    margin-bottom: 1em;
}

.one_third_column_text_bigger {
    font-size: 19px;
    margin-bottom: 1.75em;
}

.roadshow { max-width: none;}

.roadshow .columns {
    display: flex;
    gap: 1rem;
}
.roadshow .columns .block_with_vertical_line_gray_content{ width: 50%;}

.block_with_vertical_line.full_width {
    margin-left: -3rem;
    margin-right: -1rem;
    max-width: none;
}
.block_with_vertical_line.full_width .vertical_line, 
.block_with_vertical_line.full_width .vertical_line_shadow {
    flex-shrink:24;
    top: -7px;
    padding-right:0;
    box-sizing: border-box;
}

.radius { border-radius: 5px;}

.banner {
    margin-top: 60px !important;
}

@media screen and (max-width: 1440px) {
    img.homepage_banner_photo {
        left: calc(-340px + (-20 + 340) * ((100vw - 320px) / (1440 - 320)));
        height: calc(496px + (622 - 496) * ((100vw - 320px) / (1440 - 320)));
    }

    img.homepage_banner_circle {
        left: calc(-220px + (0 + 220) * ((100vw - 320px) / (1440 - 320)));
        height: calc(590px + (751 - 590) * ((100vw - 500px) / (1440 - 500)));
        bottom: calc(-15px + (-48 + 15) * ((100vw - 320px) / (1440 - 320)));
    }

    .homepage_banner {
        height: calc(576px + (622 - 576) * ((100vw - 320px) / (1440 - 320)));
    }

    h1.homepage_banner_title {
        margin-left: calc(108px + (557 - 108) * ((100vw - 320px) / (1440 - 320)));
        padding-top: calc(364px + (253 - 364) * ((100vw - 320px) / (1440 - 320)));
        font-size: calc(44px + (60 - 44) * ((100vw - 320px) / (1440 - 320)));
    }

    .homepage_banner_text {
        margin-left: calc(108px + (557 - 108) * ((100vw - 320px) / (1440 - 320)));
    }

    .light_green_wrapper {
        padding-top: calc(53px + (164 - 53) * ((100vw - 320px) / (1440 - 320)));
        padding-bottom: calc(53px + (164 - 53) * ((100vw - 320px) / (1440 - 320)));
    }

    .light_green_wrapper .standard_text {
        padding-top: calc(35px + (55 - 35) * ((100vw - 320px) / (1440 - 320)));
    }

    .block_with_vertical_line {
        padding-top: calc(50px + (100 - 50) * ((100vw - 320px) / (1440 - 320)));
    }

    .block_with_vertical_line_gray_content {
        padding: calc(20px + (30 - 20) * ((100vw - 320px) / (1440 - 320)));
    }

    .block_with_vertical_line_content_image_wrapper {
        margin-top: calc(24px + (34 - 24) * ((100vw - 320px) / (1440 - 320)));
    }

    .block_with_vertical_line_content_text, .narrow_text_block {
        padding-top: calc(50px + (68 - 50) * ((100vw - 320px) / (1440 - 320)));
        padding-left: calc(20px + (30 - 20) * ((100vw - 320px) / (1440 - 320)));
        padding-right: calc(20px + (30 - 20) * ((100vw - 320px) / (1440 - 320)));
    }

    .narrow_text_block {
        padding-left: calc(55px + (105 - 55) * ((100vw - 320px) / (1440 - 320)));
    }

    .block_with_vertical_line_content_text.smaller_padding {
        padding-left: calc(35px + (50 - 35) * ((100vw - 320px) / (1440 - 320)));
    }

    .narrow_text_block_content {
        padding-top: calc(32px + (50 - 32) * ((100vw - 320px) / (1440 - 320)));
    }

    .video_container {
        margin-top: calc(50px + (60 - 50) * ((100vw - 320px) / (1440 - 320)));
    }

    .video_container::after, .block_with_vertical_line_content_image::after {
        background-size: calc(50px + (150 - 50) * ((100vw - 320px) / (1440 - 320))) calc(50px + (150 - 50) * ((100vw - 320px) / (1440 - 320)));
    }

    .narower {
        padding-top: calc(53px + (103 - 53) * ((100vw - 320px) / (1440 - 320)));
    }

    .three_columns {
        padding-top: calc(40px + (80 - 40) * ((100vw - 320px) / (1440 - 320)));
        padding-bottom: calc(40px + (60 - 40) * ((100vw - 320px) / (1440 - 320)));
    }

    .three_columns {
        font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1440 - 320)));
    }

    .one_third_column_text_bigger {
        font-size: calc(17px + (19 - 17) * ((100vw - 320px) / (1440 - 320)));
    }

}

@media screen and (max-width: 830px) {

    .three_columns {
        column-count: 2;
    }

    .one_third_column {
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media screen and (max-width: 560px) {

    .two_columns, .three_columns {
        column-count: 1;
        max-width: 330px;
        margin-left: auto;
        margin-right: auto;
    }
    .roadshow .columns {flex-wrap: wrap;}
    .roadshow .columns .block_with_vertical_line_gray_content{ width: 100%;}
    .block_with_vertical_line.full_width {
        margin-left: 0;
        margin-right: 0;
        max-width: none;
    }
    .block_with_vertical_line.full_width .vertical_line, 
    .block_with_vertical_line.full_width .vertical_line_shadow {
    flex-shrink:8;
    padding-right:1rem;
}

}

@media screen and (max-width: 400px) {

    .button_wrapper {
        text-align: left;
    }

    .block_with_vertical_line_content_text, .narrow_text_block {
        padding-left: 0;
        padding-right: 0;
    }

    h1.homepage_banner_title {
        margin-left: calc(116px + (190 - 116) * ((100vw - 320px) / (400 - 320)));
    }

    img.homepage_banner_photo {
        left: calc(-160px + (-20 + 340) * ((100vw - 320px) / (1440 - 320)));
        height: calc(496px + (622 - 496) * ((100vw - 320px) / (1440 - 320)));
    }
}

@media screen and (max-width: 678px) {

    img.homepage_banner_photo {
        width: 100vw;
        left: -33vw;
        height: auto;
    }
    img.homepage_banner_circle {
        left: auto;
        right: 36vw;
        top: 15px;
        bottom: auto;
        height: calc(400px + (622 - 496) * ((100vw - 320px) / (1440 - 320)));
    }
    h1.homepage_banner_title {
        margin-left: 0;
        margin-right: 0;
        padding-top: 0;
    }
    .homepage_banner {
        height: auto;
        max-height: 55vh;
    }
}

@media screen and (max-width: 400px) {
    body { overflow-x: hidden; width: 100vw;}
    h1.homepage_banner_title {
        padding-top: 37vh;
        margin-left: 43vw;
        padding-bottom: 3vh;
    }
    
    .homepage_banner_text.shifted {
        padding: 60px 0;
        margin-top: 0!important;
        background-color: #F3F4F4;
        position: relative;
    }
    .homepage_banner_text.shifted:before,
    .homepage_banner_text.shifted:after {
        content: "";
        display: block;
        top: 0;
        bottom: 0;
        position: absolute;
        background-color: #F3F4F4;
        z-index: 0;
        width: 100vw;
    }
    .homepage_banner_text.shifted:before {right: 100%;}
    .homepage_banner_text.shifted:after {left: 100%}
    .homepage_banner_text_inner { margin: 0 0 20px;}
}