.map-wrapper {
  height: 600px;
  margin: 0;
  padding: 0;
  align-self: center;

  .map {
    height: 600px;
    position: relative;
  }
}

@media screen and (max-width: 768px) {
  div.ol-attribution.ol-unselectable.ol-control.ol-uncollapsible {
    width: 80%;
  }
}

.ol-zoom-in {
  cursor: pointer;
}
.ol-zoom-out {
  cursor: pointer;
}
.ol-full-screen-false {
  cursor: pointer;
}
.ol-full-screen-true {
  cursor: pointer;
}
.ol-popup {
  position: absolute;
  background-color: white;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  padding: 15px;
  padding-right: 30px;
  border-radius: 10px;
  border: 1px solid #cccccc;
  bottom: 12px;
  left: -50px;
  width: fit-content;
  white-space: nowrap;
  font: message-box;
}
.ol-popup:after,
.ol-popup:before {
  top: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.ol-popup:after {
  border-top-color: white;
  border-width: 10px;
  left: 48px;
  margin-left: -10px;
}
.ol-popup:before {
  border-top-color: #cccccc;
  border-width: 11px;
  left: 48px;
  margin-left: -11px;
}
.ol-content span {
  font-family: Verdana;
}
.ol-popup-closer {
  background-color: transparent;
  border: solid transparent;
  position: absolute;
  top: 0px;
  right: 0px;
}
.ol-popup-closer:after {
  color: #000;
  content: "\2716";
  cursor: pointer;
}