.mainstage.v2 .container {
    color: var(--text);
    position: relative;
}

.mainstage.v2 img {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    opacity: 0.7;
    object-fit: cover;
}

.mainstage.v2 .overlay {
    background-color: var(--main-bg);
}
.mainstage.v2 .container::after {
    content: '';
    width: 100%;
    display: block;
    padding-bottom: 50%;
}

.mainstage.v2 .info {
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.mainstage.v2.fade {
    position: relative;
}
.mainstage.v2.dark-bg.fade::after {
    content:'';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30%;
    background-image: linear-gradient(to bottom, transparent, var(--main-bg));
}
.mainstage.v2.light-bg.fade::after {
    content:'';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30%;
    background-image: linear-gradient(to bottom, transparent, var(--primary));
}
.mainstage.v2.brown-bg.fade::after {
    content:'';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background-image: linear-gradient(to bottom, transparent, #919183);
}
.mainstage.v2.nov-wil img {
    object-position: 0% 11%;
    
}


@media screen and (max-width: 1024px) {
    
    .mainstage.v2 .container.blk-bg-1024{
        background-color: black;
        color: var(--dark-text);
    }
    .mainstage.v2 .info {
        top:60%;
    }

    .mainstage.v2.dark-bg.fade::after {
        content:'';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 30%;
        background-image: none;
        
    }
    .mainstage.v2 .container::after {
    content: '';
    width: 100%;
    display: block;
    
}
    .willem .mainstage.v2 .info {
        top:50%;
    }
    .alice .mainstage.v2 .info {
        top:60%;
    }
    .sleep-para .mainstage.v2 .info{
        top: 70%;
    }
    .fishermaid .mainstage.v2 .info {
        top: 50%;
    }
    
    .brocc .mainstage.v2 .overlay {
        background-color: var(--primary);
        color: var(--dark-text);
    }
}
@media screen and (max-width: 800px) {
    .alice, .brocc, .fishermaid, .sleep-para .mainstage.v2 .info {
        top:50%;
    }
    .sleep-para .mainstage.v2 .info{
        top: 70%;
    }
    .mainstage.v2.brown-bg.fade::after {
        background-image: none;
    }
    .willem .mainstage.v2 .overlay {
        background-color: #0f0f0d;
    }
    .willem .mainstage.v2 .info {
        top:60%;
    }
}
@media screen and (max-width: 540px) {
    .alice, .brocc .mainstage.v2 .info {
        top:60%;
    }
    .fishermaid .mainstage.v2 .info {
        top: 60%;
    }
    .sleep-para .mainstage.v2 .info{
        top: 88%;
    }
    .willem .mainstage.v2 .info {
        top: 65%;
    }
    .willem .mainstage.v2 .overlay {
        background-color: #0b0b0a;
    }
}
@media screen and (max-width: 500px) {
    .fishermaid .mainstage.v2 .info {
        top: 60%;
    }  
    .brocc .mainstage.v2 .info {
        top: 70%;
    }
    .sleep-para .mainstage.v2 .info{
        top: 80%;
    }
    .willem .mainstage.v2 .info {
        top: 65%;
    }
}