JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<div class="super-container">
     <div class="aspect-container">

         <div class="aspect-critical-content">
         </div>

     </div>
</div>

</body>

CSS

body, html{
    width: 100%;
    height: 100%;
    max-height: 100%;
    max-width: 100%;
}
.super-container{
    position: relative;
    width: 69.8%;
    height: 95%;
    max-width: 2008px;
    margin: 0 auto;
    padding: 0 15.1% 0 15.1%;
    background: rgba(200,200,200,.2);
}
.aspect-container{
    position: relative;
    display: block;
    height: 95%;
    margin: 0 auto;
    background: rgba(200,200,200,.4);
}
.aspect-critical-content{
    position: absolute;
    top:0; right: 0; bottom: 0; left: 0;
    background: rgba(200,0,0,.2);
}