JSFiddle - React, Tailwind, and code Playground

HTML

<div id='wrapp'>
<iframe id='player' src="//www.youtube.com/embed/VWSL2SykovA?rel=0"></iframe>
</div>

CSS

#wrapp {
	position: relative;
	padding-bottom:75%;
	padding-top: 25px;
	width:100%;
	height: 0;
	width:70%;
	margin:15px auto;
	z-index:2;
	border:medium ridge #b30000;
	border-radius:9px;
}
#player{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}