Is it possible to somehow only have inset box-shadow on one side of a div ? Note that I'm talking about an inset box-shadow here, not the normal outer box-shadow.

For example, in the following JSFiddle, you'll see that the inset shadow appears on all 4 sides, in varying degrees.

How do I get it to ONLY show at the top ? Or at most ONLY at top and bottom ?

JSFiddle: http://jsfiddle.net/ahmadka/KFrun/

.box {
  -webkit-box-shadow: inset 0px 5px 10px 1px #000000;
  box-shadow: inset 0px 5px 10px 1px #000000;
}

.text {
  padding: 20px;
}
<div class="box">
  <div class="text">
    Lorem ipsum ....
  </div>
</div>

css
Edit
Report