Shadow on the right

HTML

<div id="shadow_1">&nbsp;</div>
<div id="shadow_2">&nbsp;</div>
<div id="shadow_3">&nbsp;</div>
<div id="shadow_4">&nbsp;</div>

CSS

div { margin: 20px auto; width:50%; height:60px; padding:20px;  border:1px solid #0F526D; }
#shadow_1 {
    box-shadow: 10px 0 0px 5px #666666 inset;
}
#shadow_2 {
    -webkit-box-shadow: 15px 0 10px -5px #666666; 
    -moz-box-shadow: 15px 0 10px -5px #666666; 
    box-shadow: 15px 0 10px -5px #666666; /* растяжение = - размытие/2 (10/2) , сдвиг = сдвиг-растяжение (10-(-5)) */
}
#shadow_3 { position: relative; }
#shadow_3:after { /* имитация тени */
    content:'';
    display: block;
    position:absolute;
    top:-3px; /* размер padding */
    right:0;
    width:20px;
    height:100%;
    padding:3px; /* примерно половина растяжения плюс border */
    -webkit-box-shadow: 15px 0 10px -5px #666666;
    box-shadow: 15px 0 10px -5px #666666; /* растяжение = - размытие/2 (10/2) , сдвиг = сдвиг-растяжение (10-(-5)) */ 
    -moz-box-shadow: 15px 0 10px -7px #666666; 
}
#shadow_4 { position: relative; background:#fff; }
#shadow_4:after { /* имитация тени */
    content:'';
    display: block;
    position:absolute;
    border-radius:10px;
    z-index:-1;
    top:-3px; /* размер padding */
    right:0;
    width:40px;
    height:100%;
    padding:3px; /* примерно половина растяжения плюс border */
    -webkit-box-shadow: 15px 0 10px -5px #666666; 
    box-shadow: 15px 0 10px -5px #666666; /* растяжение = - размытие/2 (10/2) , сдвиг = сдвиг-растяжение (10-(-5)) */
    -moz-box-shadow: 15px 0 10px -7px #666666; 
}