<div class="box">
</div>

<div class="box-2"></div>
.box {
  width: 100%;
  height: 500px;
  background-color: #66ccff;
clip-path: polygon(0 0, 100% 0%, 100% 53%, 0 100%);
 z-index:455;
}

.box-2{
  height: 500px;
  background-color: #ffffcc;
  margin-top:-15rem;
  z-index:2;
 clip-path: polygon(0 45%, 100% 0, 100% 100%, 0 100%);
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.