<link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Lato:400,700,900' rel='stylesheet' type='text/css'>
<div class="overlay">
<h1>Infinite Scrolling Background</h1>
<p>A Quick Codepen by Scott Marshall</p>
  <div class="btn-wrap">
  <a href="https://codepen.io/ScottMarshall/pen/vAtgB">See The Form Demo</a>
  </div>
</div>

.overlay{
  position:fixed;
   background:url(http://subtlepatterns2015.subtlepatterns.netdna-cdn.com/patterns/footer_lodyas.png);
  -webkit-animation:100s scroll infinite linear;
  -moz-animation:100s scroll infinite linear;
  -o-animation:100s scroll infinite linear;
  -ms-animation:100s scroll infinite linear;
  animation:100s scroll infinite linear;
  top:0;
  left:0;
  width:100%;
 height:100%;
}

h1{
  text-align:center;
  color:#FFF !important;
  margin-top:10%;
  font:60px Lobster;
  text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);
}

p{
  color:#FFF;
  text-align:center;
  font:15px Lobster;
  text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);
}


@-webkit-keyframes scroll{
  100%{
    background-position:0px -3000px;
  }
}

@-moz-keyframes scroll{
  100%{
    background-position:0px -3000px;
  }
}

@-o-keyframes scroll{
  100%{
    background-position:0px -3000px;
  }
}

@-ms-keyframes scroll{
  100%{
    background-position:0px -3000px;
  }
}

@keyframes scroll{
  100%{
    background-position:0px -3000px;
  }
}


.btn-wrap{
  margin:0 auto;
  width:200px;
  padding-top:50px;
}

a{
  background:#e74c3c;
  color:#FFF;
  position:relative;
  padding:15px;
  font-weight:900 !important;
  text-transform:uppercase;
  border-radius:5px;
  font:14px lato;
  opacity:0.8;
  letter-spacing:1px;
  text-decoration:none;
  box-shadow:#c0392b 0px 7px 2px,#000 0px 8px 5px;
}

a:hover{
  opacitY:1;
}
a:active{
  top:4px;
  box-shadow:#c0392b 0px 3px 2px,#000 0px 3px 5px;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.