JSFiddle - React, Tailwind, and code Playground

by Mohamed Mulla

HTML

<div class="video">    <iframe
 src="//player.vimeo.com/video/113002663?title=0&amp;byline=0&amp;portrait=0&amp;autoplay=1&amp;loop=1"
 width="960" height="540" frameborder="0" webkitallowfullscreen
 mozallowfullscreen allowfullscreen></iframe>   <div
 class="overlay"></div> 
     <h1>Kahn Design</h1>
</div>

CSS

body {
    margin: 0;
    padding: 0;
}
.video h1{
    position:absolute;
    top:50px;
    left:50px;
    z-index: 3;
    color:white;
    font-family :arial;
}
.video {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%}
    
    .video iframe {
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 100%;
        }
    
    .video .overlay {
        position: absolute;
        z-index: 2;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.9);
        }