html - Page curl drop shadow also at the top? -

refering css effect from: best way kind of drop shadow?

how (if @ all) possible apply same effect on top of image?

try

http://jsfiddle.net/mpntp/433/

body {     padding:20px 0 30px;     font:14px/1.5 arial, sans-serif;     text-align:center;     color:#333;     background:#faf0d9; }  .drop-shadow {     position:relative;     float:left;     width:40%;         padding:1em;      margin:2em 10px 4em;      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; }  .drop-shadow:before, .drop-shadow:after {     content:"";     position:absolute;      z-index:-2; }  .drop-shadow p {     font-size:16px;     font-weight:bold; }  /* lifted corners */  .lifted {     -moz-border-radius:4px;           border-radius:4px; }  .lifted:before, .lifted:after {      top:15px;     left:10px;     width:50%;     height:20%;     max-width:300px;     -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);  }  .lifted:after {     right:10px;      left:auto;  -webkit-transform:rotate(-3deg);            -moz-transform:rotate(-3deg);            -ms-transform:rotate(-3deg);             -o-transform:rotate(-3deg);             transform:rotate(-3deg); }   <div class="drop-shadow lifted">     <p>lifted corners</p> </div>