html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  overflow: hidden;
}

.marker {
  position: absolute;
  left: 35%;
  top: 50%;
  height: 7%;
}

.overlay {
  background-color: #fff;
  position: absolute;
  left: 0;
  right: 0;
  height: 10%;
  z-index: 100;
}

@media (max-aspect-ratio: 1/1) {
  .container {
    display: inline-block;
    position: relative;
    width: 100%;
  }

  .map {
    width: 100%;
  }
}

@media (min-aspect-ratio: 1/1) {
  .container {
    display: inline-block;
    position: relative;
    height: 100%;
  }

  .map {
    height: 100%;
  }
}