﻿#main {
    padding: 0;
    position: relative;
}

#main .title {
    text-align: center;
    padding: 3.75rem 0 3.75rem 0;
}

.line {
    height: 1px;
    background: black;
    background: -webkit-gradient(linear, 0 0, 100% 0, from(#000), to(#000), color-stop(50%, #333));
}

#video {
    background: url('https://cdn.originpc.com/img/landing/2025/arc-raiders-bundle/video-bg.jpg') center center no-repeat;
    background-size: cover;
}

#dlss-4 {
    background: url('https://cdn.originpc.com/img/landing/2025/arc-raiders-bundle/dlss-4-bg.jpg') center center no-repeat;
    background-size: cover;
}

#bundle {
    background: #ece2d0;
}

@media screen and (min-width: 992px) {
    #main .title {
        text-align: left;
        top: 16%;
        position: absolute;
        width: 30%;
        height: 100%;
    }
}

@media screen and (min-width: 2493px) {
    #main .title {
        width: 23%;
    }
}

@media screen and (min-width: 2772px) {
    #main .title {
        width: 20%;
    }
}

@media screen and (max-width: 480px) {
    .show-on-desktop {
        display: none;
    }
}

@media screen and (min-width: 481px) {
    .hide-on-desktop {
        display: none;
    }
}

.promo {
    position: relative;
}

.promo .title {
    position: relative;
}

@media screen and (min-width: 992px) {
    .promo .title {
        position: absolute;
        top: 20%;
        width: 36%;
    }

        .promo .title h1 {
            font-size: 3em;
        }
}

@media screen and (min-width: 2000px) {
    .promo .title {
        top: 28%;
        width: 24%;
    }
}

@media screen and (max-width: 992px) {
    .promo .title {
        padding: 3rem 0 3rem 0;
        text-align: center;
    }

    #main {
        margin-top: 4rem;
    }
}