<div class="header">
  <div class="header__inner"></div>
</div>
body {
  margin: 0;
  padding: 0;
}

.header {
filter: drop-shadow(0 10px 0 rgb(62, 76, 119)) drop-shadow(0 10px 0 rgb(144, 166, 185));
  padding-bottom: 100px;
}

.header__inner {
  width: 100%;
  height: 70vh;
  min-height: 600px;
  background: url(https://images.unsplash.com/photo-1595296647731-432e76106504?ixlib=rb-1.2.1&q=85&fm=jpg&crop=entropy&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ)  no-repeat center center;
  background-size: cover;
clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 80%);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.