CSS3 Diagonal Section Dividers

HTML

<section class="diagonal">

CSS

body {
    background: #333;
    margin: 0px;
}
section {
    position: relative;
    margin-top:100px;
}
section:before {
    position: absolute;
    content:'';
}
.diagonal {
    background: teal;
    z-index: 1;
    padding: 3em;
}
.diagonal:before {
    -webkit-transform: rotate(-3deg);
    transform: rotate(-3deg);
    -webkit-transform-origin: 3% 0;
    transform-origin: 3% 0;
    top: 0;
    left: -25%;
    z-index: -1;
    width: 150%;
    height: 75%;
    background: inherit;
}