.backDoor {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
}

.door,
.door2 {
    background-color: rgb(43, 38, 38);
    position: absolute;
    width: 50%;
    height: 100%;
    opacity: 1;
    z-index:100;
    
}

.door {
    transform-origin: left;
    top: 0px;
    left: 0px;
}

.door2 {
    transform-origin: right;
    top: 0px;
    right: 0px;
}

.doorOpen {
    /*prespectiv creates the door open effect*/
    transition: all 2.5s ease-in-out;
    transform: perspective(1200px) translateZ(0px) translateX(0px) translateY(0px) rotateY(65deg);
}

.doorOpen2 {
    /*prespectiv creates the door open effect*/
    transition: all 2.5s ease-in-out;
    transform: perspective(1200px) translateZ(0px) translateX(0px) translateY(0px) rotateY(-65deg);
}

.doors-hidden{
    transition: opacity 1.8s ease; /* Delay opacity fade by 0.5s */
    opacity: 0;
}