html,
body,
#root {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.shinyText {
  transform: translate(-50%, -50%);
  padding: 12px 30px;
  color: #ffffff;
  font-size: 1em;
  background: linear-gradient(to right, #727272 0, white 4%, #727272 8%);
  background-position: 0;
  -webkit-text-fill-color: transparent;
  animation: shine 7s infinite linear;
  animation-fill-mode: forwards;
  -webkit-text-size-adjust: none;
  -webkit-background-clip: text;
  text-decoration: none;
  white-space: nowrap;
}
@media only screen and (min-width: 670px) {
  .shinyText {
    font-size: 1.5em;
    background: linear-gradient(to right, #727272 0, white 10%, #727272 20%);
    -webkit-background-clip: text;
    padding: 12px 85px;
  }
}

@keyframes shine {
  0% {
    background-position: 0px;
  }
  60% {
    background-position: 280px;
  }
  100% {
    background-position: 280px;
  }
}

@media only screen and (min-width: 700px) {
  @keyframes shine {
    0% {
      background-position: 0px;
    }
    60% {
      background-position: 450px;
    }
    100% {
      background-position: 450px;
    }
  }
}