body {
  background-color: #fed;
  font-family: Arial, Helvetica, sans-serif;
  margin: 0px;
}
.parag.ohno {
  position: absolute;
  left: 20%;
  top: 60%;
  transform: translate(-50%, -75%);
  color: #fde;
}
.delay {
  animation: ease;
  transition-duration: 200ms;
}
.parag {
  position: absolute;
  left: 50%;
  top: 75%;
  transform: translate(-50%, -75%);
  color: #3d7;
}
.parag.dark {
  color: aliceblue;
}
p {
  text-align: center;
}
button {
  cursor: poinnter;
  border: none;
}
#resetbtn {
  transform: translate(-50%, 50%);
}
.button {
  background-color: aquamarine;
  padding: 1% 2%;
  border-radius: 15% 10%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -100%);
  animation: ease;
  transition-duration: 200ms;
}
.button.dark {
  background-color: aliceblue;
  animation: ease;
  transition-duration: 200ms;
}
.button.dark:hover {
  background-color: blueviolet;
  animation: ease;
  transition-duration: 200ms;
}
.button:hover {
  background-color: #3d7;
  animation: ease;
  transition-duration: 200ms;
}
.dark {
  background-color: #034;
}
.animation {
  position: absolute;
  left: 50%;
  top: 45%;
  transform: translate(-50%, -100%);
}
.hidden {
  visibility: hidden;
  position: absolute;
  left: 50%;
  top: 35%;
  transform: translate(-50%, -100%);
}
.visible {
  visibility: visible;
  position: absolute;
  left: 50%;
  top: 35%;
  transform: translate(-50%, -100%);
}
