JSFiddle - React, Tailwind, and code Playground

fsdfsdfs

by Matt Reynolds

HTML

<div id="layer1">
LOREM IPSUM ETC ETC...
</div>
<div id="mapMain">
</div>
<script async defer
      src="https://maps.googleapis.com/maps/api/js?&callback=initMap">
    </script>

CSS

#mapMain {
  height: 500px;
  width: 500px;
  z-index: -1;
}

#layer1 {
  z-index: 10;
  position: relative;
  top: 100px;
  left: 50px;
  background: white;
  width: 300px;
  padding: 15px;
  box-shadow: 5px 5px 5px;
  -webkit-box-shadow: 5px 5px 5px;
  -moz-box-shadow: 5px 5px 5px;
  font-family: monospace;
}

JavaScript

new google.maps.Map(document.getElementById('mapMain'), {
center: {lat:54.0, lng:42.4},
zoom: 8
});