<form id='form'>
  Enter Phrase<br>
  <input id='input' type="text" name="firstname"><br>
</form>
<div id='text'>Example Text</div>

body{
  background:
    radial-gradient(hsl(0, 100%, 27%) 4%, hsl(0, 100%, 18%) 9%, hsla(0, 100%, 20%, 0) 9%) 0 0,
    radial-gradient(hsl(0, 100%, 27%) 4%, hsl(0, 100%, 18%) 8%, hsla(0, 100%, 20%, 0) 10%) 50px 50px,
    radial-gradient(hsla(0, 100%, 30%, 0.8) 20%, hsla(0, 100%, 20%, 0)) 50px 0,
    radial-gradient(hsla(0, 100%, 30%, 0.8) 20%, hsla(0, 100%, 20%, 0)) 0 50px,
    radial-gradient(hsla(0, 100%, 20%, 1) 35%, hsla(0, 100%, 20%, 0) 60%) 50px 0,
    radial-gradient(hsla(0, 100%, 20%, 1) 35%, hsla(0, 100%, 20%, 0) 60%) 100px 50px,
    radial-gradient(hsla(0, 100%, 15%, 0.7), hsla(0, 100%, 20%, 0)) 0 0,
    radial-gradient(hsla(0, 100%, 15%, 0.7), hsla(0, 100%, 20%, 0)) 50px 50px,
    linear-gradient(45deg, hsla(0, 100%, 20%, 0) 49%, hsla(0, 100%, 0%, 1) 50%, hsla(0, 100%, 20%, 0) 70%) 0 0,
    linear-gradient(-45deg, hsla(0, 100%, 20%, 0) 49%, hsla(0, 100%, 0%, 1) 50%, hsla(0, 100%, 20%, 0) 70%) 0 0;
  background-color: #300;
  background-size: 100px 100px;
}
@font-face {
  font-family: 'Electrolize';
  font-style: normal;
  font-weight: 400;
  src: local('Electrolize'), local('Electrolize-Regular'), url(http://themes.googleusercontent.com/static/fonts/electrolize/v2/DDy9sgU2U7S4xAwH5thnJ4bN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
#form{
  color: white;
  position: relative;
  text-align: center;
  font-family: 'Electrolize';
  font-weight: bold;
}
#input{
  position: relative;
  text-align: center;
  font-family: 'Electrolize';
  font-weight: bold;
}
#text{
  color: white;
  position: relative;
  margin-top: 10px;
  height: 200px;
  width: 100%;
  font-size: 200px;
  text-align: center;
  font-family: 'Electrolize';
  font-weight: bold;
  animation: sparkle 3s infinite;
}
@keyframes sparkle{
  0%   {text-shadow: 0 0 30px #FFF000;}
  
  40%  {text-shadow: 0 0 50px #FFF000;}
  
  50%  {text-shadow: 0 0 30px #FFF000;}
  
  60%  {text-shadow: 0 0 50px #FFF000;}
  
  100% {text-shadow: 0 0 30px #FFF000;}
}

var input = document.getElementById('input');
var text = document.getElementById('text');
var form = document.getElementById('form');
var width = $(window).width();
$("input").keypress(function(event) {
    if (event.which == 13) {
      event.preventDefault();
      word = input.value;
      text.innerHTML = word.toString();
      form.reset();
      animate('#text');
    }
});
function animate(element){
  $(element).animate({
    left: -width,
    color: '#000000'
  }, 0);
  $(element).animate({
    left: 0,
    color: '#f8f8ff'
  }, 1000);
}