A Pen by Nick Hudkins.

index.html

<div class="pad">
<header>
  <a href="" class="logo"></a>
</header>

<div class="container">
  <h2>We're growing.</h2>
  <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam porta sem malesuada magna mollis euismod. Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam id dolor id nibh ultricies vehicula ut id elit. Cras mattis consectetur purus sit amet fermentum.</p>
</div>
<div class="contact-form">
  <button class="btn btn--contact">
    <span>Contact</span>
  </button>
</div>
<div class="social-container">
  <a href="" class="link link--twitter">bolsterbuilds</a>
</div>
</div>

style.css

body{
  background-color:black;
  color: white;
}
header{
  border-bottom:2px solid white;
  padding: 40px 0;
  margin: 0 0 40px 0;
}
.logo{
  display: block;
  width:250px;
  height:70px;
  background-color:rgba(255,255,255,.8);
}
.pad{
  margin: 0 40px;
}
.container h2{
  font-size: 40px;
  margin-bottom: 22px;
}
.container p{
  font-size: 18px;
  line-height: 40px;
  max-width: 800px;
}

.btn.btn--contact{
  padding: 10px 20px;
  background-color: transparent;
  border: 2px solid white;
  transition: all 1s;
}
.btn span{
  display:block;
  color:white;
  text-transform: uppercase;
  transition: all 1s;
}

.btn:hover{
  -webkit-transform: rotateX(-900deg);
  cursor: pointer;
}

yAnhI.markdown

yAnhI

A Pen by Nick Hudkins on CodePen.

License.