/* PARALLAX SCI-FI */
.parallax-container {
    height: auto;
    background-color: #1c1f33;
}
    
.parallax-wrapper .space-arch, .parallax-wrapper .space-subject {
    width: 100%;
    transform-origin: center;
    height: 100vh;
    position: absolute;
    background-size: 100%;
    background-repeat: no-repeat;
}

.parallax-wrapper {
    width: 100vw;
    overflow: hidden;
    background-image: url('/images/portfolio/sci-fi/parallax-space-bg.jpg');
    background-size: 110%;
    background-repeat: no-repeat;
    position: relative;
    z-index: 0;
    aspect-ratio: 16/9;
    margin: 0 auto;
    text-align: center;
}

.parallax-wrapper .space-arch {
    background-image: url('/images/portfolio/sci-fi/parallax-space-arch.png');
    z-index: 2;
    width: 100%;
}
    
.space-subject {
    background-image: url('/images/portfolio/sci-fi/parallax-space-subject.png');
    height: 100vh;
    z-index: 2;
}

.parallax-wrapper h1 {
    position: absolute;
    width: 100%;
    z-index: 6;
    margin: 0;
    padding: 0;
    color: #fff;
    text-transform: uppercase;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
}

h1.text-mask {
    overflow: hidden;
}

h1.text-mask span {
    display: block;
}





/* PARALLAX HORROR */
.parallax-horror-container {
    height: auto;
}
    
.parallax-horror-wrapper .para-bg img, .parallax-horror-wrapper .para-ol-1 img, .parallax-horror-wrapper .para-ol-2 img {
    width: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transform-origin: center;
    position: absolute;
}

.parallax-horror-wrapper {
    width: 100vw;
    overflow: hidden;
    position: relative;
    z-index: 0;
    aspect-ratio: 16/9;
    margin: 0 auto;
    text-align: center;
}

.parallax-horror-wrapper .para-bg img {
    width: 100%;
}

.parallax-horror-wrapper .para-ol-1 img {
    width: 100%;
    z-index: 2;
}
    
.para-ol-2 img {
    width: 100%;
    z-index: 2;
}

.parallax-horror-wrapper h1 {
    position: absolute;
    width: 100%;
    z-index: 6;
    margin: 0;
    padding: 0;
    color: #fff;
    text-transform: uppercase;
    top: 70%;
    /* transform: translateY(-50%); */
    text-align: center;
}

h1.text-mask {
    overflow: hidden;
}

h1.text-mask span {
    display: block;
}