/* Add this style to limit the infowindow size */
.gm-style-iw {
  max-width: 320px !important;
}

.gm-style .gm-style-iw p {
  margin-top: 5px;
  margin-bottom: 10px;
  font-size: 14px !important;
}

.gm-style .gm-style-iw h3 {
  margin-top: 5px;
  margin-bottom: 0;
  font-size: 18px; /* Increased the font-size to 22px */
}

.gm-style .gm-style-iw-c {
  padding: 0;
}

.gm-style .gm-style-iw-d {
  overflow: auto !important;
}

.popup-img {
  min-height: 180px; /* Replace 200px with the average height of your images or any suitable height. */
  position: relative;
}

.popup-img .link-container {
  position:absolute; 
  bottom: 10px;
  left: 10px;
  right: 10px;
}

.popup-img .link-container a {
  color: var(--white);
  text-shadow:2px 2px 4px var(--black);
}

.popup-img .link-container a:hover {
  color: var(--main);
}

.popup-img img {
  padding: 0; /* Remove padding from image */
  width: 100%;
}

.popup-content {
  padding: 0; /* Remove padding from the outer div */
}

.popup-content .content {
  padding: 0 10px 20px 12px; /* Add padding to content */
}

/* Customization of the close button. This might not work across all versions of Google Maps. */
.gm-ui-hover-effect {
    filter: invert(100%) sepia(0%) saturate(582%) hue-rotate(101deg) brightness(106%) contrast(101%);
    text-shadow: 2px 2px 4px #000000;
    top: 0 !important;
    right: 0 !important;
    transform: scale(2); /* Double the size */
}