A Pen by ezos86.

index.html

<div class="box tagline-shadow">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis error ipsam sunt nulla deleniti similique culpa inventore dignissimos eaque sint maxime quia praesentium facilis corporis dolorem aperiam animi. Consectetur deleniti.</div>

Shadows-on-Box.markdown

Shadows on Box

Bending bottom side edges up. You may need to adjust the absolute positioning depending on page placement.

A Pen by ezos86 on CodePen.

License.

style.css

.tagline-shadow:before,.tagline-shadow:after{
  top:10px;
  left:10px;
  width:50%;
  height:20%;
  max-width:300px;
  max-height:100px;
  position:absolute;
  content:'';
  z-index:-1;
  -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);-moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);box-shadow:0 15px 10px rgba(0,0,0,0.7);-webkit-transform:rotate(-3deg);-moz-transform:rotate(-3deg);-ms-transform:rotate(-3deg);-o-transform:rotate(-3deg);transform:rotate(-3deg)}
.tagline-shadow:after{right:10px;left:auto;-webkit-transform:rotate(3deg);-moz-transform:rotate(3deg);-ms-transform:rotate(3deg);-o-transform:rotate(3deg);transform:rotate(3deg)}

.box{
  height:100px;
  background-color:#f1f1f1;
  width:100%;
  padding:10px;
  /*border:2px solid #2AA1DA;*/
}