.preloader {
    position: fixed;
    top: 0;
    left: 0;
  
    width: 100%;
    height: 100%;
  
    z-index: 100000;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  
    background-color: #fff;
  
    transition: 750ms ease-in-out  opacity;
}

.preloader.stop .preloader__logo_item--2{
    margin: 0;
    opacity: 1;
}
  
.preloader.hide {
    opacity: 0;
    pointer-events: none;
}
  
.preloader__percent {
    margin-top: auto;
    margin-bottom: 8.125em;
}

.preloader__percent  p {
    color: #121111;
    font-size: 3em;
    font-family:'Arial' !important; 
    font-weight: 400 !important;
}

  
.preloader__logo {
      perspective: 1000px;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: auto;
    }
  
.preloader__logo_item--1 {
    width:  10.75em;
}

.preloader__logo_item--2 {
    width: 4.375em;

    animation: laod 1s ease-in-out infinite;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    transform: translateZ(0.1px) rotate(0deg);

    will-change: width, transfrom;
}

.preloader__logo_item--3 {
    width: 10.75em;
}
   
@media (max-width: 1200px) {
    .preloader{
        font-size: 0.725rem;
    }   
}

@media (max-width: 500px) {
    .preloader{
        font-size: 0.425rem;
    }
}
  
  @keyframes laod {
    0% {
        width: 4.375em;
      transform: translateZ(0.1px) rotate(0turn);
    }
  
    50% {
      transform: translateZ(0.1px) rotate(0.5turn);
    }
  
    100% {
        width: 4.375em;
      transform: translateZ(0.1px) rotate(1turn);
    }
  }
  
  @keyframes blink {
    0% {
      opacity: 0.2;
    }
    20% {
      opacity: 1;
    }
    100% {
      opacity: 0.2;
    }
  }
  
  .preloader__percent span {

    animation-name: blink;
  
    animation-duration: 1.4s;

    animation-iteration-count: infinite;
   
    animation-fill-mode: both;
  }
  
  .preloader__percent span:nth-child(2) {
  
    animation-delay: 0.2s;
  }
  
  .preloader__percent span:nth-child(3) {
 
    animation-delay: 0.4s;
  }