About Box Shadows
The box-shadow CSS property adds a shadow around an element’s entire box. Multiple shadows can be set by separating each effect by commas. A box shadow is described by X and Y offsets, blur, spread radius and color.
border-radius is specified on the element, the box shadow takes on the rounded corners.
box-shadow: x-offset y-offset blur-radius spread-radius color | inset
Horizontal offset relative to the element. Positive numbers move the shadow to the right. Negative numbers move it to the left. If 0, the shadow’s horizontal position is placed behind the element.
Vertical offset relative to the element. Positive numbers move the shadow down. Negative numbers move it up. If 0, the shadow’s vertical position is placed behind the element.
Blur radius. The bigger the value, the bigger and lighter the blur. Negative values are not allowed. If 0, the shadow will have a sharp edge.
Spread radius. Positive values will cause the shadow to grow bigger. Negative values will cause the shadow to shrink.
Color value of the shadow.