JSFiddle - React, Tailwind, and code Playground

HTML

<link href='http://fonts.googleapis.com/css?family=Raleway:500,600,700,400' rel='stylesheet' type='text/css'>
<img src="http://oi62.tinypic.com/2eb4xh2.jpg">
    
    <div><h1>Lorem ipsum dolor sit amet</h1></div>

CSS

img{
    width:670px;
}

h1{
color: #fff;
font-family: Raleway;
width: 100%;
font-size: 35px;
font-weight: 400;
left: 20px;
z-index:999;
position:relative;
top:-20px;
}

div {
    position:absolute;
    top:250px;
    left:140px;
    width:500px;
    height:50px;
    background-color: rgba(0,0,0,0.5);
    z-index:0;
}