.splash-container {
  width: 100vw !important;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background: #181818;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  align-content: center;
}

.splash-flex {
  min-height: 60pt;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  align-content: center;
}

/* HTML: <div class="loader"></div> */
.splash-loader {
  height: 45px;
  --c:no-repeat linear-gradient(#316583,#316583,#316583);
  background:
    var(--c) left,
    var(--c) center,
    var(--c) right;
  background-size: 16px 100%;
  animation:
    l33-1 1.5s infinite,
    l33-2 1.5s infinite;
}
@keyframes l33-1 {
  0%,100% {width:45px}
  35%,65% {width:65px}
}
@keyframes l33-2 {
  0%,40%  {transform: rotate(0) }
  60%,100%{transform: rotate(90deg) }
}

.splash-load-text {
  padding-top: 15px;
  text-align: center;
  font: 14pt "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: white;
}