JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://rawgit.com/noelboss/featherlight/master/src/featherlight.css">
<script src="https://rawgit.com/noelboss/featherlight/master/src/featherlight.js"></script>
<link rel="stylesheet" href="https://rawgit.com/noelboss/featherlight/master/src/featherlight.gallery.css">
<script src="https://rawgit.com/noelboss/featherlight/master/src/featherlight.gallery.js"></script>
<a href="https://www.barnes-history.org.uk/Gill Map/testmap.html" data-featherlight="iframe" data-featherlight-iframe-height="575" data-featherlight-variant="custom-class-800" data-featherlight-iframe-width="800" data-featherlight-iframe-scrolling="auto"><span>The Growth of East Sheen in the Victorian Era</span></a>
<br><br>
<a href="https://www.barnes-history.org.uk/Bombmap/mappage.html" data-featherlight="iframe" data-featherlight-iframe-height="800" data-featherlight-variant="custom-class-1350" data-featherlight-iframe-width="1350" data-featherlight-iframe-scrolling="auto"><span>World War II Bombs in Barnes, Mortlake and East Sheen</span></a>

CSS

.inline { display: none }

@media only screen and (max-width: 800px) {
  .custom-class-800,
  .custom-class-800 .featherlight-content{
    width: 100%;
  }
  .custom-class-800 .featherlight-content .featherlight-inner {
    margin: 0 auto;
  }
}

@media only screen and (max-width: 1350px) {
  .custom-class-1350,
  .custom-class-1350 .featherlight-content {
    width: 100%;
    margin: 0;
  }
}