JSFiddle - React, Tailwind, and code Playground
Link Shadows
by CBroe
HTML
<span>Foo</span>
<span>Barz</span>
<span>Bazzleraps</span>CSS
html { background:url(http://cdn2.spiegel.de/images/image-765061-galleryV9-ujyn.jpg) repeat-x top center; background-size:cover; padding:2em; }
span { display:inline-block; position:relative; top:0; left:0; padding:.5em 1em; margin:.5em; font-size:2em; font-weight:bold; color:#fff; background:#333; border:1px solid #000; -webkit-transition:all 1s; cursor:pointer; }
span:after { content:""; position:absolute; top:.25em; left:.25em; width:100%; height:100%; background:rgba(0, 0, 0, .25); z-index:-1; -webkit-transition:all 1s; }
span:hover { top:-.5em; left:-.5em; -webkit-transition:all 1s; }
span:hover:after { top:2em; left:2em; width:75%; height:75%; -webkit-transition:all 1s; }