JSFiddle - React, Tailwind, and code Playground

by Alex Slepenkov

HTML

<div class="wrapper">
<div class="emboss">
  text
</div>
</div>

CSS

.wrapper{
  background:url(http://www.hdwallpapers.in/walls/mountain_reflections-HD.jpg);
  width:100%;
  height:1000px
}
.emboss{
  width:100%;
  height:450px;

  background:rgba(0,0,0,0.2);
  box-shadow:inset -5px -5px 5px 0 rgba(0,0,0,.5), 
             inset 5px 5px 5px 0 rgba(255,255,255,0.5);
  font-size:40px;
  text-align:center;
  font-family:"Myriad Pro", Arial, Helvetica, sans-serif;
  text-transform:uppercase;
  color:#333;
  }