.poster {
    width: 100vw;
    height: 100vh;
    position:relative
}

.poster__wrap {
    display: grid;
    grid-template-areas: "main";
    height: 100vh;
    width: 100vw;
    position:relative
}

.poster__right__wrap {
    display: grid;
    grid-template-areas: "main";
    top:-100%;
    height: 144.4vh;
    width: 100vw;
    position:relative
}

.poster__backdrop {
    grid-area:main
}

.poster__backdrop img {
    width: 100vw;
    height: 100vh;
    object-fit:cover
}

.poster__frontdrop {
    grid-area: main;
    z-index:2
}

.poster__sticky {
    position: sticky;
    -webkit-position: sticky; /* Chrome / Safari */
    -moz-position: sticky; /* Firefox */
    -ms-position: sticky; /* IE 10+ */
    -o-position: sticky; /* Opera */
    -khtml-position: sticky; /* Konqueror */
    top:0
}

@media screen and (min-width: 1025px) {
    .poster__sticky {
        margin:0 150px
    }
}

@media screen and (min-width: 769px) {
    .poster__sticky {
        padding:80px 0
    }

    .poster__sticky .logo__sticky {
        padding:0 40px;
        margin:0
    }
}

@media screen and (max-width: 1024px) and (min-width: 769px) {
    .poster__sticky {
        margin:30px 80px
    }
}

@media screen and (max-width: 768px) {
    .poster__sticky {
        padding:35px 40px;
        margin:0
    }
}

.poster__title {
    max-width: 385px;
    font-family:"5031687";
    font-weight: normal;
    letter-spacing: .5px;
    line-height: 1.26;
    color:#000
}

@media (min-width: 769px) {
    .poster__title {
        font-size: 38px;
        margin-bottom:35px
    }

    .poster__cap-right {
        margin-top:-15px
    }

    .poster__text-right {
        position: absolute;
        left: 470px;
        top:162px;
        right: 0;
        bottom:0
    }

    .sticker {
        width: 20%;
        min-width: 90px;
        height: auto;
        margin-top:24px
    }
}

@media screen and (max-width: 768px) {
    .poster__title {
        font-size: 24px;
        margin-bottom:15px
    }
}

.poster__cap {
    max-width: 385px;
    font-family:"5031687";
    font-weight:bolder;
    font-size: 15px;
    line-height: 1.26;
    letter-spacing: .5px;
    margin-bottom:20px;
    color:#000
}

.poster__text {
    max-width: 385px;
    font-family:"5031567";
    font-weight: normal;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: .5px;
    color:#000
}

.poster__video {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom:0
}

.poster__media {
    position: absolute;
    left: 470px;
    top:90px;
    right: 0;
    bottom:0
}

.poster__chart {
    grid-area: main;
    margin-bottom: 80px;
    z-index:0
}

.chart {
    width: 100%;
    height: auto;
    max-width: 800px;
    margin-top: 54px;
    position:relative
}

.still {
    width: 280px;
    height: auto;
    margin-top: 80px
}

.logo__sticky {
    width: 33%; /*width: 100%;*/ /* wenn mehrere Bilder (hier Logos) nebeneinander */
    height: auto;
    margin-top: 30px;
}

.poster__mobile {
    margin:0
}

@media (min-width: 840px) {
    .poster__mobile {
        display: none;
    }
}

@media (max-width: 839px) {
    .poster__media {
        display: none;
    }

    .poster__text-right {
        display: none;
    }

    .screen {
        display: none;
    }

    .poster__mobile {
        width: 100%;
        height: auto;
    }
}

.poster__arrow--default {
    margin:0
}

@media (min-width: 769px) {
    .poster__arrow--default {
        opacity: 0;
        transform: translateY(-10px);
        transition:all .5s ease-in-out
    }
}

@media (min-width: 769px) {
    .poster__frontdrop:hover .poster__arrow--default {
        opacity: 1;
        transform: translateX(0)
    }
}