body{
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right:  0;
  display:block;
  overflow: hidden;
  margin: 0;
}
@media screen and (-webkit-min-device-pixel-ratio: 2.5) {
  body{
    font-size: 1.75em;
   }
 }


.App {
  text-align: center;
}
.deadcenter {
  display: flex;
  position: absolute;
  text-align: center;
  justify-content: center;
  align-items: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -2
}


#startButton{
  position: absolute;
  font-size: 3em;
  padding: .5em;
  border-radius: 1em;
  cursor: pointer;
  font-family: 'icomoon';
}

.pulsingRedBlue{
  animation: pulsingRed 3s infinite, pulsingTextRed 3s infinite;
  transition: box-shadow 1s, text-shadow 1s;
  color: rgb(0, 140, 255);

}
button.pulsingRedBlue:hover{
  animation: pulsingBlue 3s infinite, pulsingTextBlue 3s infinite;
  color: grey;
}

@keyframes pulsingBlue {
  0% {
    box-shadow: 0 0 10px grey;
  }
  50% {
    box-shadow: 0 0 10px rgb(0, 140, 255);
  }
  100% {
    box-shadow: 0 0 10px grey;
  }
}
@keyframes pulsingTextBlue {
  0% {
    text-shadow: 0 0 10px grey;
  }
  50% {
    text-shadow: 0 0 10px rgb(0, 140, 255);
  }
  100% {
    text-shadow: 0 0 10px grey;
  }
}

@keyframes pulsingRed {
  0% {
    box-shadow: 0 0 10px rgb(167, 98, 98);;
  }
  50% {
    box-shadow: 0 0 10px #000;
  }
  100% {
    box-shadow: 0 0 10px rgb(167, 98, 98);;
  }
}

@keyframes pulsingTextRed {
  0% {
    text-shadow: 0 0 10px rgb(0, 0, 0);
  }
  50% {
    text-shadow: 0 0 10px red;
  }
  100% {
    text-shadow: 0 0 10px rgb(0, 0, 0);
  
  }
}