<div id="video_box">
<div id="video_overlays"></div>
<div>
<video id="player" src="http://video.webmfiles.org/big-buck-bunny_trailer.webm" type="video/webm" onclick="this.play();">Your browser does not support this streaming content.</video>
</div>
</div>
for this you need to just add css like this:
#video_overlays {
position: absolute;
background-color: rgba(0, 0, 0, 0.46);
z-index: 2;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
#video_box{position: relative;}