JSFiddle - React, Tailwind, and code Playground

by Pangur Ban

HTML

<div id="box"></div>

CSS

#box {
	 position: relative;
	 width: 60%;
    height: 100px;
	 background: #ddd;
	 border-radius: 4px;
	 padding: 2em 1.5em;
	 color: rgba(0,0,0, .8);
	 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);
	 box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
	 transform: rotate(-3deg);
	}
	 
	#box:after {
	 transform: rotate(3deg);
	 right: 10px;
	 left: auto;
	}