JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css">
<div class="overlay mouse-events-off">
<div class="progress progress-striped active">
<div class="bar" style="width: 40%;"></div>
</div>
</div>
CSS
.overlay {
background-color: black;
background-color: rgba(0,0,0,.2);
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
/* opacity: 0.2; */
/* also -moz-opacity, etc. */
z-index: 100;
}
.progress {
position: absolute;
top: 50%;
left: 50%;
width:300px;
height:20px;
margin:-10px 0 0 -150px;
z-index:101;
opacity:1.0;
}