A Pen by Juan Gallardo.

A-Pen-by-Juan-Gallardo.markdown

A Pen by Juan Gallardo

A Pen by Juan Gallardo on CodePen.

License.

index.html

<div class="outside">
  <div class="container">
  
    <a class="button" href="#">
      Get Started
    </a>
  
  </div> <!--/ .container -->
</div> <!--/ .outside -->
  

style.css

/*resets */
body { margin:0; padding: 0; }
/* containers */
.outside {
  background: #d2d1d0; height: 100%; width: 100%;
  position: fixed; top: 0; left: 0; 
  z-index: -10;
}
.container { /* color */
  background-color: rgb(246, 246, 246);
  background-image: url('http://31.media.tumblr.com/tumblr_lxx81sbsSm1qbd38ro1_500.jpg');
  background-position: bottom center;
  width: 360px;
  height: 360px;
  max-width: 100%;
  margin: 0 auto;
  position: absolute;
  top: 24px;
  left:0;bottom:0; right:0;
}
/* button styles 
======================== */
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
.button { /* modify in production */
  position:absolute; 
  bottom: 24px;
  right: 60px;
}
.button {
  background-color: #f3f3f3;
  border-radius: 6px;
  color: rgb(30, 30, 30);
  font-family: 'Open Sans', sans-serif;
  letter-spacing: 0.133px;
  padding: 6px 12px;
  text-decoration: none;
}