.prelodr {
  position: fixed;
  height: 100%;
  width: 100%;
  display: table;
  left: 0;
  top: 0;
  background-color: #96bc33;
  font-family: Arial, sans-serif;
  font-size: 16px;
  cursor: default;
  opacity: 0;
  visibility: 0;
  transition: opacity .3s .3s cubic-bezier(.4, 0, .2, 1);
  z-index: 300;
}

.prelodr>span,
.prelodr>span>span {
  position: relative;
  text-align: center;
  vertical-align: middle
}

.prelodr>span {
  display: table-cell
}

.prelodr>span>span {
  display: inline-block;
  background-color: #96bc33;
  color: #fff;
  font-weight: 600;
  text-align: center;
  min-width: 150px;
  transition: opacity .3s cubic-bezier(.4, 0, .2, 1), transform .3s cubic-bezier(.4, 0, .2, 1);
  transform: scale(.95);
  transition-delay: .2s;
  padding: .7em 2em .9em
}

.prelodr.prelodr-hide {
  display: none
}

.prelodr.prelodr-in {
  opacity: 1;
  visibility: visible
}

.prelodr>span>span.prelodr-in {
  opacity: 1;
  visibility: visible;
  transform: scale(1)
}

.prelodr .prelodr-progressbar:after {
  left: 50%
}*/

@keyframes prelodr-background {
  0%,
  24.9% {
    background-color: #0f9d58
  }
  25%,
  49.9% {
    background-color: #da4733
  }
  50%,
  74.9% {
    background-color: #1d6fee
  }
  100%,
  75% {
    background-color: #fdba2c
  }
}