JSFiddle - React, Tailwind, and code Playground

HTML

<iframe id="ytPlayer" class="white_content" style="z-index: 1004;display: block;" frameborder="0" allowfullscreen="1" title="YouTube video player" width="532" height="329" src="http://www.youtube.com/embed/xHLnZMjJ8bY?autoplay=0&amp;enablejsapi=1&amp;origin=http%3A%2F%2F127.0.0.1%3A81"></iframe>
<div id="ytinfo" class="white_content" style="display: block;">
   <div id="ytName">A.R Rahman Maahi Ve Song Highway | Alia Bhatt, Randeep Hooda | Imtiaz Ali</div>
   <div id="ytDesc">
      <p>Maahi Ve Full Song (Audio) ► http://youtu.be/S1aQhVUy_9g
         Highway "Patakha Guddi" Song ► http://youtu.be/LijcpDrSNVI
      </p>
   </div>
</div>
<div id="fade" class="black_overlay" onclick="closeLightBox()" style="display: block;">
   <div style="
      z-index: 9999;
      left: 78%;
      top: 11%;
      width: 22px;
      position: absolute;
      "> <img src="https://airasiaxtakeover.appspot.com/imgs/1060/WhiteClose.png"></div>
</div>

CSS

.black_overlay{
			display: none;
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: black;
			z-index:9999;
			-moz-opacity: 0.8;
			opacity:.80;
			filter: alpha(opacity=80);
		}
		.white_content {
			display: none;
			position: absolute;
			top: 10%;
			left: 23%;
			width: 50%;
			height: 50%;
			padding: 16px;
			background-color: black;
			z-index:1002;
			overflow: auto;
		}