div.shd-map {
  aspect-ratio:35/32;
  width:700px: 80vh;
  margin:50px auto;
  max-width: min(80vw, 800px);
}

div.shd-map.shdmap {
  aspect-ratio:45/30;
  margin:50px auto;
  max-width: min(80vw, 1000px);
}

div.shd-map.test div.ol-viewport{
    min-height:400px!important;
}

div.shd-map .ol-attribution ul li {
  font-size:12px;
}
div.shd-map .ol-attribution ul li a {
  font-weight:normal!important;
}

div.popover-body div.thumbnailimage {
	max-width:200px;max-height:200px;
	aspect-ratio:1;
	object-fit:cover;
	overflow: hidden;
}
div.popover-body div.thumbnailimage img {
  border-style:outset;
}

div.popover-body div.pin-button a {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 14px;
    margin:12px 6px 6px 6px;
    font-family: -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
    border-radius: 6px;
    border: none;

    color: #fff;
    background: linear-gradient(180deg, #4B91F7 0%, #367AF6 100%);
    background-origin: border-box;
    box-shadow: 0px 0.5px 1.5px rgba(54, 122, 246, 0.25), inset 0px 0.8px 0px -0.25px rgba(255, 255, 255, 0.2);
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
  }
div.popover-body div.pin-button a:focus {
    box-shadow: inset 0px 0.8px 0px -0.25px rgba(255, 255, 255, 0.2), 0px 0.5px 1.5px rgba(54, 122, 246, 0.25), 0px 0px 0px 3.5px rgba(58, 108, 217, 0.5);
    outline: 0;
}

div.popover-body div.thumbnailimage img {width:100%; height:100%;}
div.popover.borderless .popover-body {padding:0;}
div.popover.borderless {border:10px solid rgb(240, 240, 240); border-radius: 15px; background-color:rgb(240, 240, 240);}
div.popover .popover-header {max-width:200px; margin:auto; font-size:18px; text-align:center;font-family:sofia-pro, Arial, sans-serif;padding:7px 14px 13px 14px;}

div.shd-map:-webkit-full-screen {
  height: 100%;
  margin: 0;
  aspect-ratio:auto;
}
div.shd-map:fullscreen {
  height: 100%;
  aspect-ratio:auto;
}
div.shd-map.map .ol-rotate {
  top: 3em;
}

div.popover.bs-popover-auto .popover-arrow:before {
  display:none;
}

div.popover.bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::after{
  border-top-color: rgb(240, 240, 240);
  --bs-popover-arrow-height:1.5rem;
  --bs-popover-border-width: 10;
  --bs-popover-arrow-width:3em;
}

div.popover.bs-popover-auto[data-popper-placement^="right"] > .popover-arrow::after{
  border-right-color: rgb(240, 240, 240);
  --bs-popover-arrow-height:1.5rem;
  --bs-popover-border-width: 10;
  --bs-popover-arrow-width:3em;
  left:-15px;
}

div.popover.bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow::after{
  border-bottom-color: rgb(240, 240, 240);
  border-width:0 1rem 1rem;
  --bs-popover-arrow-height:1.5rem;
  --bs-popover-border-width: 10;
  --bs-popover-arrow-width:3em;
  top:-15px;
}

div.popover.bs-popover-auto[data-popper-placement^="left"] > .popover-arrow::after{
  border-left-color: rgb(240, 240, 240);
  border-width:1rem 0 1rem 1rem;
  --bs-popover-arrow-height:1.5rem;
  --bs-popover-border-width: 10;
  --bs-popover-arrow-width:3em;
  left:6px;
}