JSFiddle - React, Tailwind, and code Playground

HTML

<div id="underground"></div>
<div id="overlay">
	<div id="center"></div>	
</div>

CSS

#underground {
		background-color: #725;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;	
	}
	#overlay {
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		overflow: hidden;	
	}
	#overlay #center {
		width: 400px;
		height: 200px;
		background-color: #ABD;
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -100px;
		margin-left: -200px;
		border-width: 100%;
		border-color: #FFF;
		border-style: solid;
	}