JSFiddle - React, Tailwind, and code Playground

by Alex Slepenkov

HTML

<div id="back" style="height:700px;width:700px;background-color: #b3b3b3;position: relative">
  <div class="crop-back"></div>
  <div style="position: relative; width: 257px; height: 217px; top: 255px; left: 174px;" class="crop"></div>
</div>

CSS

.crop {
  border: 2px solid #1b6d85;
  display: block;
  overflow: hidden;
  background-color: #b3b3b3
}

.crop-back {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #000000;
  opacity: 0.75;
}