.center {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 65px;
  border: none;
}

h1 {
  text-align: center;
  font-family: "Lucida Console", "Courier New", monospace;
  text-transform: uppercase;
}

.rainbow-text {
  background-image: repeating-linear-gradient(to left,
    violet, indigo, blue, green, yellow,orange,red,
    orange,yellow,green,blue,indigo, violet
  );
  background-size: 500px, 500px;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: sliding-rainbow 2s linear infinite forwards;
}

@keyframes sliding-rainbow {
  0% { background-position-x: 0px; }
  100% { background-position-x: 500px;}
}

.red-button {
  background-color: #ff0000;
  color: #ffffff;
  font-family: "Lucida Console", "Courier New", monospace;
  border: none;
  height: 50px;
  width: 100px;
  border-radius: 15px;
  cursor: pointer;
}

.green-button {
  background-color: #00ff00;
  color: #ffffff;
  font-family: "Lucida Console", "Courier New", monospace;
  border: none;
  height: 50px;
  width: 100px;
  border-radius: 15px;
  cursor: pointer;
}

.blue-button {
  background-color: #0000ff;
  color: #ffffff;
  font-family: "Lucida Console", "Courier New", monospace;
  border: none;
  height: 50px;
  width: 100px;
  border-radius: 15px;
  cursor: pointer;
}

.yellow-button {
  background-color: #ffff00;
  color: #000000;
  font-family: "Lucida Console", "Courier New", monospace;
  border: none;
  height: 50px;
  width: 100px;
  border-radius: 15px;
  cursor: pointer;
}

.black-button {
  background-color: #000000;
  color: #ffffff;
  font-family: "Lucida Console", "Courier New", monospace;
  border: none;
  height: 50px;
  width: 100px;
  border-radius: 15px;
  cursor: pointer;
}