/* Preloader */
.preloader-block {
  position: fixed;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw;
  height: 100vh;

  background: #1c1d21;
  z-index: 200;
  overflow: hidden;
  transition: var(--transition);
  transform: translateY(-100vh);
}
.preloader-block.active {
  transition: var(--transition) !important;
  transform: translateY(0) !important;
}

.preloader-block.bottom {
  transition: 0s;
  transform: translateY(100vh);
}


.preloader-block__image {
  position: relative;
  width: 122px;
  height: 128px;
}
.preloader-block__image-axe {
  position: absolute;
  top: 10px;
  right: 23px;
  width: 49.51px;
  height: 33.36px;
  background: url('../img/preloader/axe.svg') no-repeat center / contain;
  transition: .2s cubic-bezier(.72,.26,.84,.33);
  z-index: 2;
}
.preloader-block__image-sparks {
  display: none;
  position: absolute;
  top: 31px;
  left: 41px;
  width: 44.27px;
  height: 11.44px;
  background: url('../img/preloader/sparks.svg') no-repeat center / contain;
  transition: .2s cubic-bezier(.19,1,.22,1);
  opacity: 0;
  z-index: 1;
}
.preloader-block__image-beam {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 85.04px;
  background: url('../img/preloader/beam.svg') no-repeat center / contain;
  z-index: 2;
}

.preloader-block.animate .preloader-block__image-axe {
  animation: preloader-axe .5s linear ;
  animation-delay: 0s;
}

@keyframes preloader-axe {
  0% {
    transform: translate3d(0, 0, 0) rotateZ(0);
    animation-timing-function: cubic-bezier(.17,.84,.44,1);
  }
  40% {
    transform: translate3d(10px,-10px,0) rotateZ(90deg);
    animation-timing-function: cubic-bezier(.6,.04,.98,.34);
  }
  100% {
    transform: translate3d(0, 0, 0) rotateZ(0);
  }
}

.preloader-block.animate .preloader-block__image-beam {
  animation: preloader-beam .2s linear ;
  animation-delay: .52s;
  animation-timing-function: cubic-bezier(.25,.46,.45,.94);
}
@keyframes preloader-beam {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(10px);
  }
  100% {
    transform: translateY(0);
  }
}


/* .preloader-block__image {
  width: 400px;
  height: 300px;
  background: url('../img/preloader/preloader.png') no-repeat center / contain;
}
.preloader-block__image > * {
  display: none;
} */


/* Notice */
.notice-block {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw;
  height: 0;

  background: rgba(28, 29, 33, 0.99);
  z-index: 150;
  overflow: hidden;
}
.notice-block.active {
  height: 100vh;
}

.notice-block__js {
  text-align: center;
  width: 300px;
}
.notice-block__js-image {
  width: 200px;
  height: 145px;
  background: url('../img/JS.svg') no-repeat center / contain;
  margin: 0 auto;
  margin-bottom: 20px;
}


/* Go to home */
.goToHome {
  position: fixed;
  bottom: 20px;
  left: 40px;

  display: flex;
  align-items: center;
  width: 70px;
  height: 70px;
  padding: 10px;

  background-color: #1C1D21;
  border-radius: 70px;
  box-shadow: 0px 3px 6px 2px #000000b4;
  transition: var(--transition);
  overflow: hidden;
  z-index: 100;
}
.goToHome:hover {
  width: 150px;
}
.goToHome:hover .goToHome__img {
  background-color: #f0af4e;
}

.goToHome__img {
  width: 50px;
  min-width: 50px;
  height: 50px;

  margin-right: 10px;
  border-radius: 50px;
 /*  border: 2px solid #0b0b0c; */

  background-color: #519427;
  background-image: url('../img/home.svg');
  background-repeat: no-repeat;
  background-size: 70%;
  background-position: center;

  transition: var(--transition);
}


.goToHome span {
  font-family: 'Catorze27 Style 1';
  font-size: 20px;
  white-space: nowrap;
}