.overlay[data-v-de8bc816] {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #FFF;
  z-index: 100;
  text-align: center;
  font-size: 100px;
  cursor: pointer;
}


.container[data-v-78fb99d2] {
  position: relative;
}
.instructionsText[data-v-78fb99d2] {
  width: 100%;
  height: 100%;            
  position: absolute;
  top: 0;
  left: 0;
  color: #FFF;
  text-shadow: 0px 0px 10px #000000;
  background-color: #00000000;
  font-family: sans-serif;
  font-weight: 800;
}


.color-grid[data-v-5a328193] {
  display: grid;
  grid-template-columns: 100px 100px 100px;
  grid-gap: 20px;
}


.animated-background[data-v-ad0ed4dc] {
  text-align: center;
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.7);
  z-index: 45;
  animation-name: fade-animation-data-v-ad0ed4dc;
  animation-duration: 6s;
  animation-timing-function: ease-in;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-direction: normal;
}
@keyframes fade-animation-data-v-ad0ed4dc {
0% {
    opacity: 0.7;
}
100% {
    opacity: 0;
}
}
.content[data-v-ad0ed4dc] {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.animated-text[data-v-ad0ed4dc] {
  color: #FFFFFF;
  font-size: 200px;
  font-family: Quicksand;
  animation-name: zoom-animation-data-v-ad0ed4dc;
  animation-duration: 6s;
  animation-timing-function: ease-in;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-direction: normal;
}
@keyframes zoom-animation-data-v-ad0ed4dc {
0% {
    transform: scale(0.03);
}
100% {
    transform: scale(5);
    opacity: 0;
}
}