.pace {
  -webkit-pointer-events: none;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  z-index: 2000;
  position: fixed;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 5px;
  width: 10vw;
  background: #131418;
  overflow: hidden;
}

.pace.pace-inactive {
  display: none;
}

.pace .pace-progress {
  background: url(../../img/logo_king.svg);
  background-repeat: no-repeat;
  background-position: center;
  display: block;
  position: absolute;
  z-index: 2000;
  top: calc(50% - 50px);
  right: 100%;
  width: 100vw;
  height: 100px;
  /*background: -moz-linear-gradient(left, #e52cad 1%, #0b5bd3 36%, #c0d91a 86%, #b0b7e6 100%); /* FF3.6-15 */*/
  /*background: -webkit-linear-gradient(left, #e52cad 1%,#0b5bd3 36%,#c0d91a 86%,#b0b7e6 100%); /* Chrome10-25,Safari5.1-6 */*/
  /*background: linear-gradient(to right, #e52cad 1%,#0b5bd3 36%,#c0d91a 86%,#b0b7e6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */*/
  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e52cad', endColorstr='#b0b7e6',GradientType=1 ); /* IE6-9 */*/
  margin: 0 auto;
  pointer-events: none;
  transform: translate3d(100%, 0px, 0px) !important;
  -webkit-animation: fade 5s infinite;
  -moz-animation: fade 5s infinite;
  -ms-animation: fade 5s infinite;
  animation: fade 2s infinite;
  opacity: 1;
}
@keyframes fade {
 from,
  50%,
  to{
    opacity: 0;
  }
  25%,
  75% {
    opacity: 1;
    -webkit-animation-timing-function: ease-in;
  }
}



.pace{
    width: 100vw;
    height: 100vh;
    background: #131418;
    z-index: 90000!important;
    overflow: hidden!important;
}
.pace-done .pace{
    display: none!important;
}

@media screen and (max-width:720px){
  .pace .pace-progress{
      top: calc(50% - 40px);
      height: 80px;
  }
}