CCS - Slick effects with CSS3 box-shadow

#box{ position: relative; width: 60%; background: #ddd; -moz-border-radius: 4px; border-radius: 4px; padding: 2em 1.5em; color: rgba(0,0,0, .8); text-shadow: 0 1px 0 #fff; line-height: 1.5; margin: 60px auto;}#box:before, #box:after{ z-index: -1; position: absolute; content: ''; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width:300px; background: rgba(0, 0, 0, 0.7); -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); -o-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg);}#box:after{ -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto;}
<div id=box><h1>Slick effects with CSS3 box-shadow</h1></div>