body {
  margin: 0;
  padding: 0;
}

@-webkit-keyframes dots {
  0% {background-position: 0px;}
  100% {background-position: 30px;}
}
.splashtext {
  font-size: 20pt;
  width: 100%;
  height: 20%;
  margin: auto;
  position: absolute;
  top:50%;
  text-align: center;
}
.splash-screen span {
  background: linear-gradient(to right, transparent 50%, black 50%);
  color: transparent;
  -webkit-background-clip: text;
  -webkit-animation: dots 1s infinite steps(25);
  padding-right: 30px;
  margin-right: -40px;
}
.splash-screen {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: linear-gradient(128deg, #6e988d, #859fda, #1996f0, #a6aaf5, #a1c5cf);
  background-size: 1000% 1000%;
  display:flex;
  align-items: center;
  -webkit-animation: ColorFade 22s ease infinite;
  -moz-animation: ColorFade 22s ease infinite;
  animation: ColorFade 22s ease infinite;
}
@-webkit-keyframes ColorFade {
  0% {background-position:9% 0%}
  50% {background-position:92% 100%}
  100% {background-position:9% 0%}
}
@-moz-keyframes ColorFade {
  0% {background-position:9% 0%}
  50% {background-position:92% 100%}
  100% {background-position:9% 0%}
}
@keyframes ColorFade {
  0% {background-position:9% 0%}
  50% {background-position:92% 100%}
  100% {background-position:9% 0%}
}

#root {
  opacity: 1;
  transition: opacity 1s ease-in-out;
}