#loaderDoor {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 1.3vw;
    transform: translateX(-49%);
    left: 50%;
    width: 6vw;
    height: 7.2vw;
}

.backDoorLeft {
    position: relative;
    width: 50%;
    height: auto;
    /* margin-top: 50px; */
}

.doorLeft {
    position: absolute;
    top: 0px;
    left: -0.3vw;
    width: 3.3vw;
    height: 100%;
    transform-origin: left;
    transition: all 2s ease-in-out;
}
.backDoorRight {
    position: relative;
    width: 50%;
    height: auto;
    /* margin-top: 50px; */
}

.doorRight {
    position: absolute;
    top: 0px;
    right: -0.3vw;
    width: 3.3vw;
    height: 100%;
    transform-origin: right;
    transition: all 2s ease-in-out;
}
.doorRight img,.doorLeft img{
    width: 100%;
    height: 100%;
}
.doorOpenLeft
{
  /*prespectiv creates the door open effect*/
  transform: perspective(1200px) translateZ(0px) translateX(0px) translateY(0px) rotateY(-105deg);
}
.doorOpenRight
{
  /*prespectiv creates the door open effect*/
  transform: perspective(1200px) translateZ(0px) translateX(0) translateY(0px) rotateY(105deg);
}
.hotelFacade {
    position: absolute;
    background: #d15460;
    transition: transform 2s ease-in-out, opacity 1s ease-in-out, visibility 1s ease-in-out ;
    transform: scale(1) translateX(0) translateY(0);
    transform-origin: bottom center;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.hotelFacade.zoomDoor
{
  /*prespectiv creates the door open effect*/
  transform: scale(12) translateX(0) translateY(10%);
  transform-origin: bottom center;
}
.hotelFacade .img-facade
{
  height: 100%;
  margin: 0 auto;
}
.hotelFacade.opacityNone
{
  opacity: 0;
  visibility: hidden;
}
.bg_container{
    height: 100%;
}

body {margin: 0; padding: 0;}
@media screen and (max-width: 991px) {

    .doorRight {
    position: absolute;
    top: 0px;
    right: -0.1vw;
    width: 100%;
    height: 100%;
    transform-origin: right;
    transition: all 2s ease-in-out;
}
.doorLeft {
    position: absolute;
    top: 0px;
    left: -0.1vw;
    width: 100%;
    height: 100%;
    transform-origin: left;
    transition: all 2s ease-in-out;
}
.bg_container{
    position: relative;
    top: 50%;  
    height: 121vw;
    transform: translateY(-50%);
}

#loaderDoor {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: inherit;
    transform: translateX(-49%);
    left: 50%;
    width: 17.2vw;
    height: 14.4vw;
    top: 82.5%;
}
.hotelFacade {
    position: fixed;
    background: #d15460;
    transition: transform 2s ease-in-out, opacity 1s ease-in-out, visibility 1s ease-in-out;
    transform: scale(1) translateX(0) translateY(0);
    transform-origin: bottom center;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
}
.hotelFacade.zoomDoor
{
  /*prespectiv creates the door open effect*/
  transform: scale(12) translateX(0) translateY(27%);
  transform-origin: bottom center;
}
}