Edit in JSFiddle

<div class="shadow shadow1">
    <h2>Raised Box</h2>
</div>
<div class="shadow shadow2 drop-shadow">
    <h2>Lifted Corners</h2>
</div>
<div class="shadow shadow3 drop-shadow">
    <h2>Lifted Left Corner</h2>
</div>
<div class="shadow shadow4 drop-shadow">
    <h2>Lifted Right Corner</h2>
</div>
<div class="shadow shadow5 drop-shadow">
    <h2>Box Lifted Raised</h2>
</div>
<div class="shadow shadow6 drop-shadow">
    <h2>Bottom Curve</h2>
</div>
<div class="shadow shadow7 drop-shadow">
    <h2>Horizontal Curves</h2>
</div>
<div class="shadow shadow8 drop-shadow">
    <h2>Vertical Curves</h2>
</div>
<div class="shadow shadow9 drop-shadow">
    <h2>Curled Corners</h2>
</div>
<div class="shadow shadow2 shadow10 drop-shadow">
    <h2>Rotated Box</h2>
</div>
<div class="shadow shadow11 drop-shadow">
    <h2>Perspective</h2>
</div>

body {
    background: lightgray;
    font-family: Helvetica, Sans, Arial;
}
.shadow {
	background: white;
    display: inline-block;
    float: left;
	margin: 15px;
	width: 44%;
}
.shadow h2 {
    color: #666;
	text-align: center;
	padding: 10px 0;
}
.drop-shadow {
   position: relative;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.drop-shadow:before, 
.drop-shadow:after {
    content: "";
    position: absolute;
    z-index: -2;
}


/* Shadow 1 */
.shadow1 {
	-webkit-box-shadow: 0 10px 6px -6px #999;
	   -moz-box-shadow: 0 10px 6px -6px #999;
	        box-shadow: 0 10px 6px -6px #999;
}

/* Shadow 2 */
.shadow2:before, 
.shadow2:after {
  background: #666;
  bottom: 15px;
  left: 10px;
  max-width: 300px;
  top: 80%;
  width: 50%;
  -webkit-box-shadow: 0 15px 10px #333;
     -moz-box-shadow: 0 15px 10px #333;
          box-shadow: 0 15px 10px #333;
  -webkit-transform: rotate(-3deg);
     -moz-transform: rotate(-3deg);
      -ms-transform: rotate(-3deg);
       -o-transform: rotate(-3deg);
          transform: rotate(-3deg);
}
.shadow2:after {
  left: auto;
  right: 10px;
  -webkit-transform: rotate(3deg);
     -moz-transform: rotate(3deg);
       -o-transform: rotate(3deg);
      -ms-transform: rotate(3deg);
          transform: rotate(3deg);
}

/* Shadow 3 */
.shadow3:before {
  background: #666;
  bottom: 15px;
  left: 10px;
  max-width: 300px;
  top: 80%;
  width: 50%;
  -webkit-box-shadow: 0 15px 10px #333;
     -moz-box-shadow: 0 15px 10px #333;
          box-shadow: 0 15px 10px #333;
  -webkit-transform: rotate(-3deg);
     -moz-transform: rotate(-3deg);
      -ms-transform: rotate(-3deg);
       -o-transform: rotate(-3deg);
          transform: rotate(-3deg);
}

/* Shadow 4 */
.shadow4:after {
  background: #666;
  bottom: 15px;
  left: auto;
  max-width: 300px;
  right: 10px;
  top: 80%;
  width: 50%;
  -webkit-box-shadow: 0 15px 10px #333;
     -moz-box-shadow: 0 15px 10px #333;
          box-shadow: 0 15px 10px #333;
  -webkit-transform: rotate(3deg);
     -moz-transform: rotate(3deg);
      -ms-transform: rotate(3deg);
       -o-transform: rotate(3deg);
          transform: rotate(3deg);
}

/* Shadow 5 */
.shadow5:before, 
.shadow5:after {
  background: #666;
  bottom: 25px;
  left: 10px;
  max-width: 300px;
  top: 60%;
  width: 50%;
  -webkit-box-shadow: 0 35px 10px #999;
     -moz-box-shadow: 0 35px 10px #999;
          box-shadow: 0 35px 10px #999;
  -webkit-transform: rotate(-8deg);
     -moz-transform: rotate(-8deg);
      -ms-transform: rotate(-8deg);
       -o-transform: rotate(-8deg);
          transform: rotate(-8deg);
}
.shadow5:after {
  left: auto;
  right: 10px;
  -webkit-transform: rotate(8deg);
     -moz-transform: rotate(8deg);
       -o-transform: rotate(8deg);
      -ms-transform: rotate(8deg);
          transform: rotate(8deg);
}

/* Shadow 6 */
.shadow6:before, 
.shadow6:after {
    bottom: 0;
    left: 30px;
    right: 30px;
    top: 50%;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
       -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
            box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-border-radius: 100px / 10px;
         border-radius: 100px / 10px;
}
.shadow6:after {
    left: auto;
	right: 30px;
    -webkit-transform: skew(8deg) rotate(3deg);
       -moz-transform: skew(8deg) rotate(3deg);
        -ms-transform: skew(8deg) rotate(3deg);
         -o-transform: skew(8deg) rotate(3deg);
            transform: skew(8deg) rotate(3deg);
}

/* Shadow 7 */
.shadow7:before, 
.shadow7:after {
    bottom: 0;
    left: 10px;
    right: 10px;
    top: 0;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
       -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
            box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-border-radius: 100px / 10px;
         border-radius: 100px / 10px;
}
.shadow7:after {
    left: auto;
	right: 10px;
    -webkit-transform: skew(8deg) rotate(3deg);
       -moz-transform: skew(8deg) rotate(3deg);
        -ms-transform: skew(8deg) rotate(3deg);
         -o-transform: skew(8deg) rotate(3deg);
            transform: skew(8deg) rotate(3deg);
}

/* Shadow 8 */
.shadow8:before, 
.shadow8:after {
    bottom: 10px;
    left: 0;
    right: 0;
    top: 10px;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
       -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
            box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-border-radius: 100px / 10px;
         border-radius: 100px / 10px;
}
.shadow8:after {
    left: auto;
	right: 10px;
    -webkit-transform: skew(8deg) rotate(3deg);
       -moz-transform: skew(8deg) rotate(3deg);
        -ms-transform: skew(8deg) rotate(3deg);
         -o-transform: skew(8deg) rotate(3deg);
            transform: skew(8deg) rotate(3deg);
}

/* Shadow 9 */
.shadow9 {
    border: 1px solid #efefef;
    -moz-border-radius: 0 0 120px 120px / 0 0 6px 6px;
         border-radius: 0 0 120px 120px / 0 0 6px 6px;
}
.shadow9:before, 
.shadow9:after {
    bottom: 12px;
    height: 55%;
    left: 10px;
    max-width: 200px;
    max-height: 100px;
    right: 10px;
    width: 50%;
    -webkit-box-shadow: 0 8px 12px rgba(0,0,0,0.5);
       -moz-box-shadow: 0 8px 12px rgba(0,0,0,0.5);
            box-shadow: 0 8px 12px rgba(0,0,0,0.5);
    -webkit-transform: skew(-8deg) rotate(-3deg);
       -moz-transform: skew(-8deg) rotate(-3deg);
        -ms-transform: skew(-8deg) rotate(-3deg);
         -o-transform: skew(-8deg) rotate(-3deg);
            transform: skew(-8deg) rotate(-3deg);
}
.shadow9:after {
    left: auto;
    right: 10px;
    -webkit-transform: skew(8deg) rotate(3deg);
       -moz-transform: skew(8deg) rotate(3deg);
        -ms-transform: skew(8deg) rotate(3deg);
         -o-transform: skew(8deg) rotate(3deg);
            transform: skew(8deg) rotate(3deg);
}

/* Shadow 10 */
.shadow10 {
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
    -webkit-transform: rotate(-3deg);
       -moz-transform: rotate(-3deg);
        -ms-transform: rotate(-3deg);
         -o-transform: rotate(-3deg);
            transform: rotate(-3deg);
}
.shadow10 > :first-child:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Shadow 11 */
.shadow11:before {
    bottom: 5px;
    height: 35%;
    left: 80px;
    max-width: 200px;
    max-height: 50px;
    width: 50%;
    -webkit-box-shadow: -80px 0 8px rgba(0, 0, 0, 0.4);
       -moz-box-shadow: -80px 0 8px rgba(0, 0, 0, 0.4);
            box-shadow: -80px 0 8px rgba(0, 0, 0, 0.4);
    -webkit-transform: skew(50deg);
       -moz-transform: skew(50deg);
        -ms-transform: skew(50deg);
         -o-transform: skew(50deg);
            transform: skew(50deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}
.shadow11:after {
    display: none;
}