.preloader {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: black;
}

.preloader__text {
  position: relative;
  width: 42.15px;
  height: 57.75px;
}

.preloader__ie {
  display: none;
  max-width: 723px;
  color: white;
}

.preloader__ie div {
  margin-top: 70px;
}

.preloader__ie .message {
  display: none;
}

.preloader__ie .message__lang_uk {
  /*display: block;*/
}

.preloader__ie ::after {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  content: '';
  background: url('/Plastik.png');
  background-repeat: no-repeat;
  background-size: cover;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .preloader__text {
    display: none;
  }

  .preloader__ie {
    display: block;
  }
}

.empty {
  position: absolute;
  top: 0;
  left: 0;
}

.filled {
  position: absolute;
  top: auto;
  bottom: 0;
  width: 42.15px;
  height: 57.75px;
  max-height: 100%;
  overflow: hidden;
  transform-origin: bottom;
  animation: height-auto 3s;
}

.filled svg {
  position: absolute;
  bottom: 0;
}

@keyframes height-auto {
  0% {
    max-height: 0;
  }

  100% {
    max-height: 100%;
  }
}

.preloader__text-wrapper {
  transform-origin: 50% 50%;
}

/* 1 step: fill text */
.preloader_hidden .preloader__text {
  background-position: -100%;
  transition: 1s;
}

/* 2 step: hide text */
.preloader_hidden .preloader__text-wrapper {
  opacity: 0;
  transition: 0.5s;
  transition-delay: 1s;
  transform: scale(0.9);
}

/* 3 step: hide full preloader */
.preloader_hidden {
  opacity: 0;
  transition: 0.5s;
  transition-delay: 1.2s;
}
