/*
Name: Kevin Chiu
Date: 05.03.18
Section: CSE 154 AH

This is the stylesheet for the random pokemon generator website.
Styles focus modifying text to blend it into an animated background.
*/

/* Background obtained from https://www.gradient-animator.com/ */
body {
  user-select: none;  
  padding-top: 20%;
  line-height: 3em;
  background: linear-gradient(179deg, #ed1313, #ffffff);
  background-size: 400% 400%;
  -webkit-animation: AnimationName 4s ease infinite;
  animation: AnimationName 4s ease infinite;
}

@-webkit-keyframes AnimationName {
    0%{background-position:53% 0%}
    50%{background-position:48% 100%}
    100%{background-position:53% 0%}
}

@keyframes AnimationName { 
    0%{background-position:53% 0%}
    50%{background-position:48% 100%}
    100%{background-position:53% 0%}
}

body, button {
  background-repeat: no-repeat;
  text-align: center;
  font-family: monospace;
  text-transform: uppercase;
  color: white;
}

h1 {
  font-size: 25pt;
}

button {
  border: hidden;
  background: none;
}

#output {
  padding-left: 40px;
  padding-top: 50pt;
  font-size: 40pt;
  letter-spacing: 30pt;
  font-weight: bold;
}

#credits {
  float: right;
  bottom: 0;
  padding-right: 20px;
  padding-top: 90px;
}