<svg viewBox="0 0 600 100">
  <defs>
    <filter id="dropshadow" height="130%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="2" />
      <feOffset dx="2" dy="2" result="offsetblur" />
      <feComponentTransfer>
        <feFuncA type="linear" slope="0.2" />
      </feComponentTransfer>
      <feMerge>
        <feMergeNode />
        <feMergeNode in="SourceGraphic" />
      </feMerge>
    </filter>
    <linearGradient id="gr">
      <stop stop-color="lightblue" offset="0" />
      <stop stop-color="#fff" offset="1" />
    </linearGradient>
  </defs>
  <path d="M0,0 600,10 600 100 0,50z" fill="url(#gr)" filter="url(#dropshadow)">
</svg>
<div class="item" style="background: brown; min-height: 400px;margin-top: -100px; padding: 100px 20px 20px 20px; box-sizing: border-box; color: white">
  Lorem ipsum dolor, sit amet consectetur adipisicing elit. Laboriosam repellat voluptas minus molestias quisquam enim impedit aut ut commodi, aspernatur suscipit quidem deserunt labore temporibus. Minus ducimus quis harum porro. Doloribus blanditiis saepe amet ipsam. Voluptatem necessitatibus, omnis suscipit magnam, eaque hic provident sed officiis obcaecati laboriosam autem doloremque rerum nihil tempora velit expedita molestiae aperiam enim dolore repudiandae! Aliquam officia velit voluptatibus dolorem non, quos nisi, ipsam dolor qui commodi maiores iusto porro. Vel illum tenetur quam, reprehenderit similique commodi laudantium eius officia laboriosam, autem cum incidunt. Velit odio in provident sequi magnam tenetur beatae labore omnis at impedit.
</div>

body {
  margin: 0;
  background: blue;
}