JSFiddle - React, Tailwind, and code Playground
HTML
<div class="offerBox">
<div class="obOffer">
<div class="obOfferTitle">Free</div>
<div class="obOfferPrice">Free</div>
</div>
<div class="obOffer obHiLight">
<div class="obOfferTitle">Title</div>
<div class="obOfferPrice">$10</div>
</div>
<div class="obOffer">
<div class="obOfferTitle">Title 2</div>
<div class="obOfferPrice">$10</div>
</div>
</div>
CSS
.offerBox {
border-radius: 6px 6px 6px 6px;
width: 300px;
margin: 10px;
}
.obOffer {position:relative; width: 33%; float: left;height: 100px; text-align:center; z-index:0;}
.obOfferPrice {
padding: 10px;
color: white;
background-color: #85AADD;
}
.obHiLight {
z-index:10;
box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.6);
}