body {
  font-family: "Barlow", sans-serif;
   font-weight: 400;
  font-style: normal;
}
.font-mulish-200{
  font-family: "Mulish", sans-serif;
   font-weight: 200;
  font-style: normal;
}
.font-mulish {
  font-family: "Mulish", sans-serif;
   font-weight: 300;
  font-style: normal;
}
.font-mulish-400{
   font-family: "Mulish", sans-serif;
   font-weight: 400;
  font-style: normal;
}
.font-mulish-500{
   font-family: "Mulish", sans-serif;
   font-weight: 500;
  font-style: normal;
}
.font-mulish-600{
  font-family: "Mulish", sans-serif;
  font-weight: 600;
  font-style: normal;
}
.font-mulish-700{
  font-family: "Mulish", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.font-mulish-800{
  font-family: "Mulish", sans-serif;
   font-weight: 800;
  font-style: normal;
}
.font-mulish-900{
  font-family: "Mulish", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.container-1100 {
  max-width: 100%;
  margin: 0 auto;
  padding: 0rem 1.25rem;
  width: 100%;
  @media screen and (min-width: 48rem) {
    max-width: 68.75rem;
    padding: 0rem 0rem;
  }
}
.full-width {
  width: 100%;
  margin: 0 auto;
}

/* .swiper-button-prev, .swiper-button-next{
  width: 1.25rem;
  height: 1.25rem;
  
} */


.home-slider .swiper-button-prev, .home-slider .swiper-button-next{
  width: 2rem;
  height: 2rem;
}

.main-slider .swiper-button-prev, .main-slider .swiper-button-next{
  width: 2rem;
  height: 2rem;
}

.home-slider {
  .swiper{
    .swiper-button-prev, .swiper-button-next{
      opacity: 0;
      transition: opacity 0.3s ease-in-out;
    }
    &:hover{
      .swiper-button-prev, .swiper-button-next{
        opacity: 1;
        transition: opacity 0.3s ease-in-out;
      }
    }

    .swiper-button-prev{
      left: 1.25rem;
      svg{
        display: none;
      }

      &::after{
        content:"";
        width: 2rem;
        height: 2rem;
        display: block;
        border-radius: 50%;
        background-color: #fff;
        box-shadow: 0 0 .3125rem rgba(0,0,0,0.3);
        background-image: url("/images/arrow-prev.png");
        background-repeat: no-repeat;
        background-size: 80%;
        background-position: center center;
        }
    }

    .swiper-button-next{
      right: 1.25rem;
        svg{
          display: none;
        }
        &::after{
          content:"";
          width: 2rem;
          height: 2rem;
          display: block;
          border-radius: 50%;
          background-color: #fff;
          box-shadow: 0 0 .3125rem rgba(0,0,0,0.3);
          background-image: url("../images/arrow-next.png");
          background-repeat: no-repeat;
          background-size: 80%;
          background-position: center center;
          }
      }

  }

}

.main-slider {
  .swiper-button-prev-unique{
    width: 2rem;
    height: 2rem;
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    left: -2.5rem;
    font-size: 0rem;
    &::after{
      content:"";
      width: 2rem;
      height: 2rem;
      display: block;
      border: .0625rem solid #A7A9AC;
      background-color: #fff;
      background-image: url("/images/arrow-prev.png");
      background-repeat: no-repeat;
      background-size: 80%;
      background-position: center center;
      }
    
  }
  .swiper-button-next-unique{
    width: 2rem;
    height: 2rem;
    cursor: pointer;
    position: absolute;
    top: 50%;
    right: -2.5rem;
    transform: translateY(-50%);
    z-index: 10;
    font-size: 0rem;
    
    &::after{
      content:"";
      width: 2rem;
      height: 2rem;
      display: block;
      border: .0625rem solid #A7A9AC;
      background-color: #fff;
      background-image: url("../images/arrow-next.png");
      background-repeat: no-repeat;
      background-size: 80%;
      background-position: center center;
      }
  }
}



.point-line{
  margin: .625rem 0rem;
}
.point-line li{
  border-right: 0rem solid #595A5C;
  padding:.5rem 0rem;
  @media screen and (min-width: 64rem) {
    border-right: .0625rem solid #595A5C;
    padding:0rem 2.5rem;
  }
}
.point-line li:last-child {
  border-right: 0rem solid #595A5C;
}

.facilitysIcon{
  list-style: none;
  padding: 0rem;
  margin: 0rem 0 1.25rem 0rem;
}

.facilitysIcon li{
  margin-bottom: .625rem;
  font-size: 1rem;
  display: flex;
  align-items: center;

  &::before{
    content: "";
    display: inline-block;
    margin-right: .625rem;
    width: 1.5625rem;
    height: 1.5625rem;
    background-image: url('/images/facilitys-icon.png');
    background-size: contain;
    background-repeat: no-repeat;
  }
}

.placesIcon{
  list-style: none;
  padding: 0rem;
  margin: 0rem 0 1.25rem 0rem;
}

.placesIcon li{
  margin-bottom: .625rem;
  font-size: 1rem;
  display: flex;
  align-items: center;

  &::before{
    content: "";
    display: inline-block;
    margin-right: .625rem;
    width: 1.5625rem;
    height: 1.5625rem;
    background-image: url('/images/arrow-circle-icon.png');
    background-size: contain;
    background-repeat: no-repeat;
  }
}

input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}
input[type="date"] {
    /* Hides the native icon in Firefox by using 'appearance: none' */
    appearance: none; 
    -moz-appearance: none;
}

.resort-list .swiper-button-prev, .resort-list .swiper-button-next{
  width: 2rem;
  height: 2rem;
}

.resort-list {
  .swiper{
    .swiper-button-prev, .swiper-button-next{
      opacity: 0;
      transition: opacity 0.3s ease-in-out;
    }
    &:hover{
      .swiper-button-prev, .swiper-button-next{
        opacity: 1;
        transition: opacity 0.3s ease-in-out;
      }
    }

    .swiper-button-prev{
      left: 1.25rem;
      svg{
        display: none;
      }

      &::after{
        content:"";
        width: 2rem;
        height: 2rem;
        display: block;
        border-radius: 50%;
        background-color: #fff;
        box-shadow: 0 0 .3125rem rgba(0,0,0,0.3);
        background-image: url("../images/arrow-prev.png");
        background-repeat: no-repeat;
        background-size: 80%;
        background-position: center center;
        }
    }

    .swiper-button-next{
      right: 1.25rem;
      background-color: transparent;
        svg{
          display: none;
        }
        &::after{
          content:"";
          width: 2rem;
          height: 2rem;
          display: block;
          border-radius: 50%;
          background-color: #fff;
          box-shadow: 0 0 .3125rem rgba(0,0,0,0.3);
          background-image: url("../images/arrow-next.png");
          background-repeat: no-repeat;
          background-size: 80%;
          background-position: center center;
          }
      }

  }

}


/* .popular-destination .swiper-horizontal .swiper-pagination{
    position: absolute;
    bottom: 0rem;
} */

.popular-destination .custom-pagination {
  position: relative;
  bottom: -1.25rem !important;
  display: flex;
  justify-content: center;
  gap: .3125rem;
  margin: 0 auto;
}

.popular-destination .custom-pagination .swiper-pagination-bullet {
  width: .5rem;
  height: .5rem;
  background: #ccc;
  border-radius: 50%;
  opacity: 1;
  transition: background 0.3s;
}

.popular-destination .custom-pagination .swiper-pagination-bullet-active {
  background: #13BDCE;
}

/* Details gallery slider css  */

swiper-container{
    display: flex;
     justify-content: center;
     align-items: center;
   }
   .gallerySwiper img{
    display: flex;
    object-fit: cover;
    width: 100%;
    height: 30rem;
   }
   .mySwiper2{
   box-sizing: border-box;
   padding: .9375rem 0rem;
   }
   .mySwiper2 img{
    display: flex;
    width: 10.8rem;
    height: 9.375rem;
     object-fit: cover;
    }


    swiper-slide {
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    swiper-slide {
      background-size: cover;
      background-position: center;
    }
    .swiper-slide-visible{
      border: 2px solid #fff;
      border-radius: 0.5rem;
      opacity: 0.8;
    }
    .mySwiper2 .swiper-slide-thumb-active {
      opacity: 1;
      border: 2px solid #13BDCE;
      border-radius: 0.5rem;
      overflow: hidden;
    }
/* Details gallery slider css  */
.activitie-list ul{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: .625rem;
}
.activitie-list ul li{
  padding: .3125rem .75rem;
  font-size: 14px;
  color: #364153;
  background-color: #fff;
  border-radius: .25rem;
  border: 1px solid #BBBDBF;
}

.resort-template-default header{
 background-color: #fff;
     border-bottom: 1px solid #e1e1e1;
}

.resort-template-default header .menu li a{
  color: #000;
}


.tab-list .tab-button.active, .tab-button-resorts.active{
    color: #13bdce;
}
.tab-list .tab-button.active:after, .tab-list .tab-button-resorts.active:after{
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #13bdce;
}

.tab-list .tab-button:after, .tab-list .tab-button-resorts:after{
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #fff;
    margin-top: 15px;
}


    .tab-button.active-tab {
        color: #E03F4C; /* Text color for active tab */
    }

    .resort-package{
      display: block;
      background-color: #13BDCE;
      color: #fff;
      padding: 0px 100px 0 20px;
      min-width: 328px;
    }



.hotel-search-container{
  max-width:100%;
  width:100%;
  }

.hotel-search-box{
display:flex;
gap:30px;
background:#fff;
padding:20px 20px;
border-radius:10px;
box-shadow:0 4px 20px rgba(0,0,0,0.1);
flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-end;
}

.search-field{
flex:1;
position:relative;
}

/* .search-field input{
width:100%;
padding:12px;
border:1px solid #ddd;
border-radius:6px;
} */
.search-field select{
  width:100%;
padding:15px 12px;
border:1px solid #ddd;
border-radius:6px;
}

#suggestions{
position:absolute;
top:45px;
left:0;
width:100%;
background:white;
border:1px solid #ddd;
border-radius:6px;
display:none;
max-height:250px;
overflow:auto;
z-index:999;
}

.suggestion{
padding:10px;
cursor:pointer;
border-bottom:1px solid #eee;
}

.suggestion:hover{
background:#f3f3f3;
}

.search-btn{
background:#0071c2;
color:#fff;
border:none;
padding:12px 25px;
border-radius:6px;
cursor:pointer;
}

.tg-tour-about-inner {
    box-shadow: 0 0 15px 0 #efefef;
    border: 1px solid #e9e9e9;
    border-radius: 15px;
    background: #fff;
    padding: 40px 38px 35px 40px;
}

.tg-tour-details-gallery-navigation button {
  width: 50px;
  height: 50px;
  text-align: center;
  line-height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background-color: #fff;
  color: var(--tg-common-black);
  position: absolute;
  top: 48%;
  left: 40px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 1;
  font-size: 20px;
  display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
@media (max-width: 575px) {
  .tg-tour-details-gallery-navigation button {
    left: 15px;
  }
}
.tg-tour-details-gallery-navigation button:hover {
  background:#13BDCE;
  color: #fff;
  border-color: #13BDCE;
}
.tg-tour-details-gallery-navigation button.tg-tour-details-gallery-next {
  right: 40px;
  left: auto;
}
@media (max-width: 575px) {
  .tg-tour-details-gallery-navigation button.tg-tour-details-gallery-next {
    right: 15px;
  }
}



.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover {
    cursor: not-allowed;
    color: rgba(57, 57, 57, 0.5) !important;
}


.tg-booking-add-input-field {
  background: #f3f3f4;
  border-radius: 8px;
  padding: 10px 35px;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  position: relative;
  width: 100%;
  font-family: "Mulish", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 15px;
}

.search-field span.location{
  position: absolute;
    left: 14px;
    top: 57%;
}

.search-field span.check-in-out{
  position: absolute;
    left: 14px;
    top: 57%;
}
.search-field span.guest{ 
  position: absolute;
    left: 14px;
    top: 30%;
}

.tg-booking-add-input-field .angle-down{
  display: flex;
    align-items: center;
    margin-right: -20px;

}