box with fine border shadow

dabblet.css

/**
 * box with fine border shadow
 */
/* got it from @LeaVerou via http://www.youtube.com/watch?v=3ikye7Qc7Ak&list=WL32E91C6871EAFE00 */
div{
overflow: scroll;
width: 200px;
height: 300px;

margin-top: 100px;

background:radial-gradient(50% 0, rgba(0,0,0,.2), transparent 70%),

radial-gradient(50% 100%, rgba(0,0,0,.2), transparent 70%) bottom;

background-size: 100% 7px;
background-repeat: no-repeat;

dabblet.html

<!-- box with fine border shadow  -->
<div>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
<p>this is it</p>
</div>

settings.json

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}