body{
  background-image: url("https://bettysgraphics.neocities.org/images/backgrounds/pattern%20608.gif");
    margin: 0;
    padding: 0;
    height: 100%;
    display: flex;
    align-items: stretch;
    justify-content: center;
    animation: backgroundScroll 40s linear infinite;
}

@keyframes backgroundScroll {
    0%   {background-position: 0 0;}
    100%  {background-position: -400px -400px;}
}

@font-face {
    font-family: "Decoder"; 
    src: url("/fonts/DECODER_.TTF") format("truetype");
}


.buttonarea button {
  width: 100%;
  background-color: transparent;
  cursor: pointer;
  transition: background-color 0.3s;
  border: none;
  animation: rotate 2s infinite alternate;;
}

  @keyframes rotate {
    0% { transform: rotate(-2deg); }
    100% { transform: rotate(2deg); }
  }


.backgroundoverlay {
  background:url(https://i.pinimg.com/originals/52/b3/ca/52b3caaa9e283398b6d5b80a11938bed.gif);
  height: 100%;
  width: 100%;
  position: absolute;
}

.buttonarea {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
}

.center {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}