@keyframes correct {
  from {
    background-color: lightgrey;
  }
  50% {
    background-color: mediumseagreen;
  }
  to {
    background-color: lightgrey;
  }
}
@keyframes incorrect {
  from {
    background-color: lightgrey;
  }
  50% {
    background-color: red;
  }
  to {
    background-color: lightgrey;
  }
}
body {
  font: Montserrat;
}
#q {
  text-align: center;
  font-size: 8vh 4vw;
}
#ans {
  text-align: center;
}
.a {
  font-size: 4vh;
  height: 15vh;
}
.result {
  font-size: 4vh;
  border-style: solid;
  border-width: 1px;
  background-color: lightgray;
}
.correct {
  animation-duration: 1s;
  animation-name: correct;
  animation-iteration-count: infinite;
}
.incorrect {
  animation-duration: 1s;
  animation-name: incorrect;
  animation-iteration-count: infinite;
}