.img-overlay-wrap {
  position: relative;
  display: inline-block; /* <= shrinks container to image size */
  margin: 0 auto;
}

.img-overlay-wrap img { /* <= optional, for responsiveness */
   display: block;
   max-width: 100%;
   height: auto;
}

.img-overlay-wrap svg {
  position: absolute;
  top: 0;
  left: 0;
}

circle {
  stroke: black;
  stroke-width: 1;
  fill: #044B94;
  fill-opacity: 0;
}

polygon {
  opacity: 0;
  fill: #222222;
}

polygon:hover {
  opacity: 0.2;
  transition: opacity .05s ease-in-out;
}

.btn-outline-secondary { border-color: #b3b3b3; }

.status-Ledig { color: #27ae60 !important; }
.status-Reserveret { color: #fde397 !important; }
.status-Solgt { color: #ff2727 !important; }

polygon.Ledig { fill: #27ae60; }
polygon.Reserveret { fill: #fde397; }
polygon.Solgt { fill: #ff2727; }
polygon.Selected { fill: #adadad; opacity: 1; }


.legend { list-style: none; padding: 10px; border: 1px solid #d8d8d8; }
.legend li { float: left; margin: 0 10px; font-size: 13px !important;}
.legend span { float: left; width: 17px; height: 17px; margin: 2px; }
.legend .superawesome { background-color: #27ae60; }
.legend .awesome { background-color: #f9c85b; }
.legend .kindaawesome { background-color: #ff2727; }
.legend .notawesome { background-color: #999; }
.legend .round { border-radius: 50%; opacity: 0.4; }


.popover { min-width: 255px; }