.backend {
  -webkit-animation: flip-backend 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955)
    both;
  animation: flip-backend 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
}

.frontend {
  -webkit-animation: flip-frontend 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955)
    both;
  animation: flip-frontend 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
}

.bgBackend {
  z-index: 1;
  background-image: url('../../images/bg/bg_backend.png');
  background-size: cover;
  /*background-color: #000;*/
  filter: opacity(75%);
  position: absolute;
  top: 0;
  left: 0;
  height: 99vh;
  width: 100%;
  display: none;
  margin: 0;
  padding: 0;
  transform: rotateY(180deg);
}

@-webkit-keyframes flip-backend {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  100% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  }
}
@keyframes flip-backend {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  100% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  }
}

@-webkit-keyframes flip-frontend {
  0% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
}
@keyframes flip-frontend {
  0% {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
}