body {
  padding: 0;
  margin: 0 0 200px 0;
}
.hero {
  display: inline-block;
  width: 100%;
  height: 200px;
  position: relative;
}
.diagonal-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 200px;
  background: #2b5876;
  background: -webkit-linear-gradient(to right, #4e4376, #2b5876); 
  background: linear-gradient(to right, #4e4376, #2b5876);
  z-index: -1;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 80%);
}