.map-container {
  height: 656px;
  position: relative;
  max-width: 1320px;
  margin-right: auto;
  margin-left: auto;
}

.map {
  height: 100%;
  border-radius: 0.375rem;
}

.gmnoprint,
.gm-fullscreen-control {
  display: none;
}

.popup {
  position: absolute;
  bottom: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.popup-title-container {
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
}

.popup-title {
  text-align: center;
}

.popup-arrow-left-container,
.popup-arrow-right-container {
  position: absolute;
  background-color: #fff;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 6px;
}

.popup-arrow-left-container {
  z-index: 3;
  left: 8px;
  user-select: none;
}

.popup-arrow-right-container {
  right: 8px;
  user-select: none;
}
.popup-arrow-right-only {
  transform: rotate(180deg);
}

.popup-title-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32px;
  background-color: #fff;
  border-radius: 6px;
  position: relative;
  justify-content: center;
  max-height: 88px;
  width: 100%;
}

.popup-title {
  height: 24px;
  display: flex;
  align-items: center;
  margin-top: 4px;
}

.popup-title-chevron-container {
  position: absolute;
  background-color: var(--main-red);
  top: -16px;
  width: 36px;
  border-radius: 4px;
  display: flex;
  justify-content: center;
}

.popup-description-container {
  background-color: #fff;
  color: var(--grey);
  margin: 0 24px;
  padding: 32px 16px;
  border-radius: 4px;
  position: relative;
  z-index: 2;
}

.popup-description {
  overflow-y: scroll;
  max-height: 220px;
  margin-top: 10px;
}

.popup-carousel {
  overflow-x: scroll;
  overflow: -moz-scrollbars-none;
  -ms-overflow-style: none;
  display: flex;
  align-items: center;
  overflow-y: hidden;
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */
}

.popup-carousel::-webkit-scrollbar {
  width: 0 !important;
}

.popup-carousel .carousel-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  max-height: 137px;
  margin-right: 20px;
}

.popup-carousel .carousel-cell img {
  max-height: 137px;
  border-radius: 6px;
}
@media screen and(max-width:900px) {
  .popup-enabled-image {
    max-height: 200px;
  }
}

@media screen and (min-width: 900px) {
  .map-container {
    margin-top: 80px;
  }

  .popup-arrow-left-container,
  .popup-arrow-right-container {
    background-color: #fff;
  }
  .popup-arrow-left-container:hover,
  .popup-arrow-right-container:hover {
    cursor: pointer;
  }

  .popup-title-container {
    transform: translate(0, -650px);
  }

  .popup-title-center {
    background-color: white;
  }

  .popup-title {
    font-size: 32px;
    line-height: 32px;
  }

  #popup-title-chevron-container {
    display: none;
  }

  .popup-description-container {
    width: 448px !important;
    height: 600px;
    transform: translate(100px, 70px);
    background-color: #fff;
    border-radius: 0.375rem;
    padding-bottom: 50px;
  }

  .popup-description {
    color: #000;
  }

  .popup-carousel {
    width: 100%;
    height: 300px;
    max-height: 300px;
    overflow-y: scroll;
  }

  .popup-carousel .carousel-cell {
    width: 400px;
    max-height: 300px;
    height: 300px;
  }

  .popup-carousel .carousel-cell img {
    width: 400px;
    max-height: 300px;
    height: 300px;
  }

  .popup-carousel-container {
    position: relative;
    height: 300px;
    width: 300px;
  }

  #popup-carousel-desktop {
    max-height: 300px;
    height: 300px;
  }

  #popup-carousel-desktop-content {
    max-height: 300px;
    height: 300px;
    display: flex;
    justify-content: center;
  }

  #popup-carousel-desktop-content .carousel-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: 300px;
    height: 300px;
    border-radius: 6px;
  }

  #popup-carousel-desktop-content .carousel-cell img {
    max-height: 300px;
    height: 300px;
    width: 100%;
    border-radius: 6px;
  }

  #popup-description-container {
    padding: 24px;
  }

  #popup-description-container .nav {
    width: 32px;
    height: 32px;
    top: 164px;
    border-radius: 6px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #popup-description-container .nav .popup-arrow {
    width: 10px;
    top: 164px;
    border-radius: 6px;
    filter: invert(21%) brightness(50%) contrast(600%);
  }

  #popup-description-container .nav-right {
    right: 5px;
  }

  #popup-description-container .nav-left {
    left: 5px;
  }
}
