JSFiddle - React, Tailwind, and code Playground

HTML

<body>

    <!-- Not really a video, but it will be... -->    
    <div id="video">
        <video poster="http://placekitten.com/1000/1000"></video>
    </div>

    <div id="wrapper">
        <div id="cutter">
            <p>Hello, I want this div to cut through to the "video," through the solid body... like a clear window.</p>
            <p>I made the #wrapper a little transparent so you could see there is something under it, but the idea is that     it would be opaque.</p>
        </div>
    </div>
</body>

CSS

#video { position: fixed; height: 100%; width: 100%; z-index: -5; }

/* Made a bit transparent so you can see what we're cutting through to */
#wrapper { position: fixed; height: 100%; width: 100%; z-index: 5; background: rgba(200, 54, 54, 0.9); }

#cutter {
    background: lightgray;
    height: 400px;
    width: 400px;
    margin: 50px;
    padding: 1px 15px;
}