.preloader {
  position: fixed;
  display: block;
  width: 100vw;
  height: 100vh;
  background: #0e0e0e33;
  top: 0;
  left: 0;
  z-index: 1050;
  will-change: auto; }
  .preloader .preloader-steps {
    width: 354px;
    -ms-flex-item-align: center;
        align-self: center;
    position: relative;
    top: calc(50% - 82px);
    left: calc(50% - 177px);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
    .preloader .preloader-steps img {
      margin-right: 16px; }
    .preloader .preloader-steps .leftFoot {
      position: absolute;
      z-index: 1;
      -webkit-animation: leftFoot 2s infinite ease-in-out;
              animation: leftFoot 2s infinite ease-in-out; }
    .preloader .preloader-steps .leftStepOne {
      opacity: 0;
      -webkit-animation: leftStepOne 2s infinite ease-in-out;
              animation: leftStepOne 2s infinite ease-in-out; }
    .preloader .preloader-steps .leftStepTwo {
      opacity: 0;
      -webkit-animation: leftStepTwo 2s infinite ease-in-out;
              animation: leftStepTwo 2s infinite ease-in-out; }
    .preloader .preloader-steps .leftStepThree {
      opacity: 0;
      -webkit-animation: leftStepThree 2s infinite ease-in-out;
              animation: leftStepThree 2s infinite ease-in-out; }
    .preloader .preloader-steps .right {
      padding-left: 26px;
      -webkit-transform: scale(1, -1);
          -ms-transform: scale(1, -1);
              transform: scale(1, -1); }
    .preloader .preloader-steps .rightFoot {
      position: absolute;
      z-index: 1;
      -webkit-transform: scale(1, -1);
          -ms-transform: scale(1, -1);
              transform: scale(1, -1);
      -webkit-animation: rightFoot 2s infinite ease-in-out;
              animation: rightFoot 2s infinite ease-in-out; }
    .preloader .preloader-steps .rightStepOne {
      opacity: 0;
      -webkit-animation: rightStepOne 2s infinite ease-in-out;
              animation: rightStepOne 2s infinite ease-in-out; }
    .preloader .preloader-steps .rightStepTwo {
      opacity: 0;
      -webkit-animation: rightStepTwo 2s infinite ease-in-out;
              animation: rightStepTwo 2s infinite ease-in-out; }
    .preloader .preloader-steps .rightStepThree {
      opacity: 0;
      -webkit-animation: rightStepThree 2s infinite ease-in-out;
              animation: rightStepThree 2s infinite ease-in-out; }

@-webkit-keyframes leftFoot {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); }
  16% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  32% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  48% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  64% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  80% {
    -webkit-transform: translateX(258px);
            transform: translateX(258px); }
  96% {
    -webkit-transform: translateX(258px);
            transform: translateX(258px); }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); } }

@keyframes leftFoot {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); }
  16% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  32% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  48% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  64% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  80% {
    -webkit-transform: translateX(258px);
            transform: translateX(258px); }
  96% {
    -webkit-transform: translateX(258px);
            transform: translateX(258px); }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); } }

@-webkit-keyframes leftStepOne {
  0% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes leftStepOne {
  0% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes leftStepTwo {
  0% {
    opacity: 0; }
  16% {
    opacity: 0; }
  32% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes leftStepTwo {
  0% {
    opacity: 0; }
  16% {
    opacity: 0; }
  32% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes leftStepThree {
  0% {
    opacity: 0; }
  48% {
    opacity: 0; }
  64% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes leftStepThree {
  0% {
    opacity: 0; }
  48% {
    opacity: 0; }
  64% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes rightFoot {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); }
  16% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); }
  32% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  48% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  64% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  80% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  96% {
    -webkit-transform: translateX(258px);
            transform: translateX(258px); }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); } }

@keyframes rightFoot {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); }
  16% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); }
  32% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  48% {
    -webkit-transform: translateX(86px);
            transform: translateX(86px); }
  64% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  80% {
    -webkit-transform: translateX(172px);
            transform: translateX(172px); }
  96% {
    -webkit-transform: translateX(258px);
            transform: translateX(258px); }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px); } }

@-webkit-keyframes rightStepOne {
  0% {
    opacity: 0; }
  16% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes rightStepOne {
  0% {
    opacity: 0; }
  16% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes rightStepTwo {
  0% {
    opacity: 0; }
  32% {
    opacity: 0; }
  48% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes rightStepTwo {
  0% {
    opacity: 0; }
  32% {
    opacity: 0; }
  48% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes rightStepThree {
  0% {
    opacity: 0; }
  64% {
    opacity: 0; }
  80% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes rightStepThree {
  0% {
    opacity: 0; }
  64% {
    opacity: 0; }
  80% {
    opacity: 1; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }