body {
  font-family: 'Lato', sans-serif !important;
}

#app:not(:empty) + #splash {
  display: none !important;
}

#splash {
  color: #4A4A4A;
  height: 100%;
  text-align: center;
  margin-top: 5em;
}

#splash-wait {
  font-size: 2em;
  padding: 0.5em;
}

#splash-loading {
  background: #D8D8D8;
  border-radius: 8px;
  height: 8px;
  margin: 3em auto;
  overflow: hidden;
  width: 50%;
}

#splash-loading:after {
  animation: splash-loading 1.5s linear infinite;
  background: #22AD5B;
  border-radius: 8px;
  content: ' ';
  display: block;
  height: 100%;
  position: relative;
  right: 10%;
  width: 10%;
  will-change: auto;
}

@keyframes splash-loading {
  0% {
    right: 10%;
  }
  
  15% {
    right: 0;
    width: 10%;
  }

  30% {
    right: -30%;
    width: 30%;
  }
  
  45% {
    right: -45%;
    width: 45%;
  }
  
  60% {
    right: -60%;
  }
  
  75% {
    right: -75%;
    width: 25%;
  }
  
  90% {
    right: -90%;
    width: 10%;
  }
  
  100% {
    right: -100%;
  }
}