SOURCE

<div class="skewed-bg">
	<div class="content">
		<h1 class="title">Skewed background with CSS</h1>
     <p class="text">This is a quick example to show @AlbertGlezRoges how to get skewed backgrounds with plain HTML & CSS.</p>
	</div>
</div>

<footer class="footer">
	<p class="credits">
    Pen by Jose L Pimienta @pipozoft 
  </p>
</footer>

body {
  background: #222;
  color: #FFF;
}

.skewed-bg {
  background: #00B285;
  padding: 200px 0;
  transform: skew(0deg, -10deg);
  margin-top: -200px;
}
.skewed-bg .content {
  transform: skew(0deg, 10deg);
  text-align: center;
}
.skewed-bg .content .title {
  padding-top: 100px;
  font-weight: normal;
}
.skewed-bg .content .text {
  width: 60%;
  margin: 25px auto;
  color: #ccfff2;
}

.footer {
  padding-top: 300px;
}
.footer .credits {
  text-align: center;
  color: #666;
}
.footer .credits .link {
  color: #00B285;
  text-decoration: none;
}