.demo {
  width: 100px;
  height: 102px;
  border-radius: 100%;
  position: absolute;
  top: calc(50vh - 50px);
  left: calc(50% - 50px);
}

.circle {
  width: 100%;
  height: 100%;
  position: absolute;
}

.circle .inner {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  border: 5px solid rgba(255, 255, 255, 0.7);
  border-right: none;
  border-top: none;
  background-clip: padding;
  box-shadow: inset 0px 0px 10px rgba(255, 255, 255, 0.15);
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.circle:nth-of-type(0) {
  transform: rotate(0deg);
}

.circle:nth-of-type(0) .inner {
  animation: spin 2s infinite linear;
}

.circle:nth-of-type(1) {
  transform: rotate(70deg);
}

.circle:nth-of-type(1) .inner {
  animation: spin 2s infinite linear;
}

.circle:nth-of-type(2) {
  transform: rotate(140deg);
}

.circle:nth-of-type(2) .inner {
  animation: spin 2s infinite linear;
}

.demo {
  animation: spin 5s infinite linear;
}
/******** Content ********/
#content .context .travel-guide {
  text-transform: uppercase;
  font-family: var(--fmo-b);
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--greyish-brown);
}

/*------- Content -------*/
/******** Map ********/
#map {
  align-items: center;
  border: solid 1px #bababa;
  border-left: unset;
  border-right: unset;
}

#map .map-img {
  width: 100%;
  position: relative;
}

#map .map-img img {
  width: 100%;
}

#map .wrap-info {
  width: 50%;
}

#map .wrap-info {
  padding-left: var(--widthSpace-2);
  padding-right: calc(20vw + 10px);
}

.wrap-info {
  position: relative;
}

/* .wrap-info::before {
    content: '';
    width: 5%;
    transform: translateX(-50%);
    border-bottom: solid 1px var(--primary-color);
    position: absolute;
    left: 0;
    top: 13%;
    opacity: 0;
    transition: .7s ease-in-out;
}*/

.wrap-info .line-out::before {
  width: calc(60% - 20px) !important;
}

#map .wrap-info h3 {
  padding-bottom: var(--heightSpace-2);
  margin-bottom: 0;
  letter-spacing: 1px;
}

#map .wrap-info p {
  letter-spacing: 1px;
}

#map .wrap-info p + p {
  text-transform: lowercase;
  font-family: var(--fmo-b);
}

#map .wrap-info .grid div:last-child p {
  margin-bottom: 0;
}

#map .gg-map-img {
  position: absolute;
  bottom: 5%;
  left: 5%;
  width: 15%;
}

#map .gg-map-img img {
  width: 100%;
  max-width: 140px;
}

/*------- Map -------*/
/******** Stay Connected ********/
#stay-connect {
  padding: 5rem calc(20vw + 10px) 1rem;
  /* padding-left: calc(20vw); */
  /* padding-right: calc(20vw); */
}

#stay-connect p:first-child {
  text-transform: uppercase;
  font-size: var(--fontsize-ParagraphTitle);
}

#stay-connect p:last-child a {
  font-weight: bold;
  color: var(--primary-color);
}

#stay-connect p:last-child a:hover {
  color: var(--color-hover-button);
}

/*------- Stay Connected -------*/
/******** Insta Feed ********/
.insta-gallery-list,
.insta-gallery-item {
  padding: 7px !important;
}
/*------- Insta Feed -------*/

@media only screen and (max-width: 992px) {
  #map .map-img,
  #map .wrap-info {
    width: 100%;
  }

  #map .wrap-info {
    padding: 0;
    padding-left: calc(var(--widthSpace-1) - 1vw);
    padding-right: calc(var(--widthSpace-1) - 1vw);
    margin: var(--heightSpace-2) 0;
  }

  #map .map-img > img {
    padding-right: 0;
    object-fit: cover;
    object-position: right;
  }

  #stay-connect {
    padding: 5rem 0 1rem 15vw;
  }
}

@media only screen and (max-width: 992px) and (min-width: 768px) {
  #map .map-img {
    width: 50%;
    align-self: stretch;
  }

  #map .wrap-info {
    width: 50%;
    padding-left: var(--widthSpace-2);
    padding-right: 20px;
  }

  #map .map-img img {
    height: 100%;
    object-fit: cover;
    object-position: right;
  }

  #stay-connect {
    padding: 5rem 15px 1rem 15px;
    padding-right: 20px;
    padding-left: 20px;
  }

  .gallery__row {
    justify-content: space-around !important;
  }
  .gallery__row__img {
    width: 48% !important;
  }
}

@media only screen and (max-width: 1412px) and (min-width: 903px) {
  .gallery__row__img {
    width: 18% !important;
  }
}
@media only screen and (max-width: 1144px) and (min-width: 993px) {
  #map .wrap-info {
    padding-left: var(--widthSpace-2);
    padding-right: var(--widthSpace-3);
  }
}
@media (max-width: 767px) {
  .daterangepicker {
    z-index: 9999999999999;
  }
}