.voivodeship_map_wrapper {
  margin: 30px;
  display: inline-block;
  position: relative;
}
.voivodeship_map_wrapper__pin {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.voivodeship_map_wrapper__pin .pin {
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 100%;
  transform: translate(-50%);
  background-color: gold;
  position: absolute;
}
.voivodeship_map_wrapper__pin .pin:before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  top: 50%;
  left: 50%;
  border-radius: 100%;
  transform: translate(-50%, -50%);
  background-color: red;
  position: absolute;
  z-index: 10;
}
.voivodeship_map_wrapper__grid {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.voivodeship_map_wrapper__grid > .axis-x-line {
  position: absolute;
  top: 0;
  height: 100%;
  width: 1px;
  background-color: blue;
}
.voivodeship_map_wrapper__grid > .axis-x-line::before {
  content: attr(data-position);
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1rem;
  color: blue;
}
.voivodeship_map_wrapper__grid > .axis-y-line {
  position: absolute;
  left: 0;
  height: 1px;
  width: 100%;
  background-color: red;
}
.voivodeship_map_wrapper__grid > .axis-y-line::before {
  content: attr(data-position);
  position: absolute;
  left: -30px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
  color: red;
}

.front-realizations-map__point {
  z-index: 10;
  --tw-rotate: -7deg;
  transform: var(--tw-transform);
  transform: var(--tw-transform);
}

@media (min-width: 992px) {
  .front-realizations-map__point {
    position: absolute;
  }
  .front-realizations-map__point {
    --tw-translate-x: -50%;
    transform: var(--tw-transform);
  }
  .front-realizations-map__point {
    --tw-translate-y: -50%;
    transform: var(--tw-transform);
  }
}

.front-realizations-map__point {
  width: 70vw !important;
}
@media all and (min-width: 768px) {
  .front-realizations-map__point {
    width: auto !important;
  }
}
@media all and (max-width: 768px) {
  .front-realizations-map__point {
    left: 0 !important;
    top: 0 !important;
  }
}
.front-realizations-map__point.is-active {
  z-index: 30;
}
.front-realizations-map__pin {
  position: relative;
  z-index: 10;
  display: none;
  height: 2rem;
  width: 2rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgba(50, 50, 50, var(--tw-text-opacity));
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  transition-property: background-color, border-color, color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
@media (min-width: 992px) {
  .front-realizations-map__pin {
    display: flex;
  }
}
.front-realizations-map__pin > svg {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.front-realizations-map__pin.is-active {
  z-index: 30;
  --tw-scale-x: 1.25;
  --tw-scale-y: 1.25;
  transform: var(--tw-transform);
  transform: var(--tw-transform);
  --tw-bg-opacity: 1;
  background-color: rgba(243, 125, 17, var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}
.front-realizations-map__pin.is-active > svg {
  --tw-scale-x: 1.25;
  --tw-scale-y: 1.25;
  transform: var(--tw-transform);
  transform: var(--tw-transform);
}
.front-realizations-map__tooltip {
  z-index: 20;
  margin-top: 1rem;
  width: 100%;
  max-width: 100vw;
  transform: var(--tw-transform);
  --tw-bg-opacity: 1;
  background-color: rgba(251, 113, 133, var(--tw-bg-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding: 2rem;
  text-align: left;
}
@media (min-width: 992px) {
  .front-realizations-map__tooltip {
    position: absolute;
  }
  .front-realizations-map__tooltip {
    top: 0px;
  }
  .front-realizations-map__tooltip {
    left: 50%;
  }
  .front-realizations-map__tooltip {
    display: none;
  }
  .front-realizations-map__tooltip {
    width: 330px;
  }
  .front-realizations-map__tooltip {
    --tw-translate-y: -100%;
    transform: var(--tw-transform);
  }
  .front-realizations-map__tooltip {
    --tw-translate-x: -50%;
    transform: var(--tw-transform);
  }
  .front-realizations-map__tooltip {
    opacity: 0;
  }
}
.front-realizations-map__tooltip.is-active {
  display: block;
  opacity: 1;
}
@media (min-width: 992px) {
  .front-realizations-map__tooltip--small {
    top: -8px;
  }
}

.poland-map {
  position: relative;
  display: inline-block;
}
.poland-map__voivodeship {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0.55;
}

.resize-drag {
  border-radius: 8px;
  border: 1px solid red;
  padding: 0;
  margin: 0;
  background-color: transparent;
  touch-action: none;
  box-sizing: border-box;
}
