* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  
  a {
    text-decoration: none;
  }
  
  h1 {
    font-size: 76px;
    font-style: normal;
  }
  
  h2 {
    font-size: 44px;
    font-style: normal;
  }
  
  h3 {
    font-size: 34px;
    font-style: normal;
  }
  
  h4 {
    font-size: 26px;
    font-style: normal;
  }
  
  h5 {
    font-size: 22px;
    font-style: normal;
  }
  
  h6 {
    font-size: 18px;
    font-style: normal;
  }

  :root{
    --lucida-writing:lucida-writing;
    --LinLibertine:LinLibertine;
    --Lora-Regular:Lora-Regular;
    --Lora-Medium:Lora-Medium;

    --purple:#712EA1;
    --shade-black:#09000F;
    --dark-grayish-purpl:#464149;
    --soft-lavender-gray:#E7E3E9;
    --light-purple:#F4F0F6;
    --black:#111111;
    --gray:#444444;
    --light-gray:#9C9C9C;
    --medium-light-gray:#BCBCBC;
    --very-light-gray:#DADADA;
    --white:#FCFCFC;
    --whitety:#ffffff;
    --cream:#F6EBE1;
    --shade-purple:#EAE4ED;
    --brand-color:#C5AB51;

  }


@font-face {
  font-family: "lucida-writing"; /* Name for the font */
  src: url("../hotel-pics/writing/Lucida-Handwriting/lucidahandwriting_italic.ttf");
}

@font-face {
  font-family: "LinLibertine"; /* Name for the font */
  src: url("../font/linux_libertine/LinLibertine_aDRS.ttf");
}

@font-face {
  font-family: "Lora-Regular"; /* Name for the font */
  src: url("../font/Lora/static/Lora-Regular.ttf");
}

@font-face {
  font-family: "Lora-Medium"; /* Name for the font */
  src: url("../font/Lora/static/Lora-Medium.ttf");
}





.header-section {
  background: var(--white);
    width: 100%;
  padding-left:20px ;
  padding-right: 40px;
  z-index: 9999;
  position: relative;

  

  }
  
  .hotel-navbar-logo-img {
    object-fit: cover;
    object-position: center;
    width: 180px;
    height: 60px;
  }
  
  .home-title {
    color: var(--black) !important;
    font-size: clamp(12px, 3vw, 16px);
    font-family: var(--Lora-Regular);
  }
  
  .for-padding-home-title {
    padding-left: 180px;
  }
  
  .home-title:hover {
    font-weight: bold;
  }
  
  .about-title {
    color: var(--black) !important;
    font-size: clamp(12px, 4vw, 16px);
    font-family: var(--Lora-Regular);
  }
  
  .about-title:hover {
    font-weight: bold;
  }
  
  .for-padding-about-title {
    padding-left: 40px;
  }
  
  .book-now-link-header-part {
    background: var(--purple);
    color: var(--white);
    font-size: clamp(12px, 4vw, 16px);
    font-family: var(--Lora-Regular);

    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 25px;
    padding-right: 25px;
    border-radius: 10px;
  }
  
  .header-section.nav-link .dropdown:hover {
    display: block;
  }
  
  .dropdown:hover .dropdown-menu {
    display: block !important;
  }
  
  .header-section .dropdown-menu .dropdown-item {
    color: var(--black);
  }
  
  .header-section .dropdown-menu .dropdown-item:hover {
    background: var(--purple);
  }

  .header-section .dropdown-menu .dropdown-item:hover {
    color: var(--white);
  }
  /* header-section */
  
.banner-section{
    background: var(--white);
    padding: 20px;
 
 
}

.banner-swipper-banner{
    width: 100%;
    height: 750px;
    background-position: center;
    background-size: cover;
    border-radius: 25px;
 
    
}

.banner-swipper-overlap{
    border-radius: 25px;
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(7, 7, 7, 0.4);
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}


.Beyond-the-Extraordinary-box{
 margin-top: -20px;
    color: var(--whitety);
    font-family: var(--LinLibertine);
    font-size: clamp(16px, 8vw, 85px);
    text-align: center;

 
}

.swipper-banner-para{
    color: var(--very-light-gray);
    text-align: center;
    font-family: var(--Lora-Regular);
    font-size: clamp(14px, 3vw, 18px);
   
    
}



.discover-more-button-banner{
  margin-top: 40px;
  background: var(--purple);
  border-radius: 5px;
  border: 0;
  padding-top: 18px;
  padding-bottom: 12px;
  padding-left: 28px;
  padding-right: 28px;
  border: none;
  cursor: pointer;
  

}

.discover-more-button-banner h6{
  color: var(--very-light-gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 4vw, 16px);

}


.mySwiper-banner .swiper-button-next,
.mySwiper-banner .swiper-button-prev{

  background: rgba(255, 255, 255, 0.2); /* Semi-transparent white */
  backdrop-filter: blur(10px); /* Glass effect */
  -webkit-backdrop-filter: blur(10px); /* Safari support */
  border-radius: 5px; /* Smooth edges */  
 width: 50px;
 height: 55px;
}

.mySwiper-banner .swiper-button-next::after,
.mySwiper-banner .swiper-button-prev::after{
  font-size: 20px;
  color: var(--black);

}


.mySwiper-banner .swiper-pagination-bullet {
position: relative;
top: -60px !important;
  width: 10px; /* Adjust size */
  height: 10px;
  background: var(--white); /* Change color */
  opacity: 0.5;
  transition: all 0.3s ease-in-out;
}

.mySwiper-banner .swiper-pagination-bullet-active {
  width: 25px; /* Slightly larger when active */
  height: 10px;
  border-radius: 10px;
  background: var(--purple); /* Change active bullet color */
  opacity: 1;
}


/* banner-section */


/* General Styling for the Registration Section */
.resitration-section {
  position: relative; /* Used for positioning child elements */
  margin-top: -70px; /* Moves the section up by 70px */
  z-index: 100; /* Makes sure this section stays above others */
}

.registration-container-background {
  background: var(--black); /* Background color using a CSS variable */
  color: var(--light-gray); /* White text color */
  padding: 25px 0; /* Vertical padding */
  border-radius: 10px;
}

/* Wrapper for the check-in/check-out sections using flexbox */
.check-in-out-wrapper {
  display: flex; /* Flexbox layout for children */
  font-family: var(--Lora-Regular);

}

/* Styling for the text content inside each check-in/check-out box */
.cbx-content {
  font-family: var(--Lora-Regular); /* Font-family from a variable */
  font-size: 14px; /* Font size */

}

/* Each check-in/check-out box setup */
.checkin-box {
  width: 100%; /* Set the width of each box */
  display: flex; /* Flexbox layout */
  justify-content: space-between; /* Space out elements */
  align-items: center; /* Align items vertically */
  position: relative; /* Necessary for the positioning of the divider line */
  padding: 0 50px; /* Horizontal padding */
}

/* Divider line between check-in/check-out boxes */
.checkin-box::after {
  content: ""; /* Empty content for the line */
  width: 1px; /* Width of the line */
  height: 50px; /* Height of the line */
  background-color: rgba(152, 152, 152,0.2); /* Line color */
  position: absolute; /* Positioned absolutely */
  top: 50%; /* Vertically center the line */
  transform: translateY(-50%); /* Perfect vertical centering */
  right: 0; /* Place the line at the right end of the box */
}

/* Remove the divider line for the last check-in/check-out box */
.checkin-box:last-child::after {
  display: none;
}




/* Button inside the check-in/check-out box styling */
.checkin-box button {
  color: var(--white); /* White button text */
  background-color: transparent; /* Transparent background */
  border: none; /* No border */
  font-family: var(--Lora-Regular);
  font-size: 16px; /* Font size */
}

/* Datepicker input styling */
.datepicker {
  width: 120px; /* Fixed width for the input field */
}



/* Calendar icon container */
.calender {
  padding-left: 10px; /* Left padding */
  font-size: 25px; /* Icon size */
}


.for-mobile-home {
  display: none;
}


.Find-Your-Bliss-Azure-Haven-section{


  background-position: center;
  background-size: cover;
  width: 100%;
  height: 1150px;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.Find-Your-Bliss-Azure-Haven-section h1{
  font-size: clamp(16px, 8vw, 48px);
color: var(--black);
font-family: var(--LinLibertine);
padding-top: 125px;
}

.Find-Your-Bliss-Azure-Haven-section p{
  font-size: clamp(14px, 3vw, 19px);
font-family: var(--Lora-Regular);
color: var(--gray);
padding-top: 20px;
}

.negative-margin{
  margin-top: -10px;
 
}

.image-hotel-sunset{
  width: 100%;
  height: 500px;
  object-fit: cover;
  object-position: center;
  border-radius: 15px;
  padding: 5px;

}

.image-of-couple{
  width: 100%;
  height: 500px;
  object-fit: cover;
  object-position: center;
  border-radius: 15px;
  margin-top: 40px;
  padding: 5px;

}

/* Find-Your-Bliss-Azure-Haven-section */

.rooms-and-suites-section{
  background: var(--black);
border-radius: 25px;
padding-top: 60px;
padding-bottom: 60px;
margin-left: 20px;
margin-right: 20px;

}

.room-suite-topics{
 font-family: var(--Lora-Regular);
  font-size: clamp(12px, 3vw, 16px);
text-align: center;
  color:var(--very-light-gray);
  position: relative;
  padding-bottom: 10px;
}

.room-suite-topics::after{
  content: "";
  position: absolute;
  width: 50px;
  height: 4px;
  background: var(--purple);
  bottom: 0px;
  left: 50%; /* Centers the line */
  transform: translateX(-50%); /* Ensures the line is centered even if width changes */
  border-radius: 25px;
} 

.Our-Exquisite-Rooms-topics{
  font-family: var(--LinLibertine);
  color: var(--white);
  font-size: clamp(16px, 5vw, 46px);
  text-align: center;
  padding-bottom: 20px;

}

.room-img-one{
  width: 100%;
  height: 400px;
  border-radius: 20px;
  object-fit: cover;
  object-position: center;
}

.deluxe-room-topic{
  color: var(--white);
  font-size: clamp(16px, 4vw, 26px);
  font-family: var(--Lora-Medium);
  text-align: center;
  padding-top: 20px;

}

.price{
  color: var(--purple);
  font-size: clamp(16px, 4vw, 34px);
  font-family: var(--Lora-Medium);
}

.per-night{
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 4vw, 16px);
  color: var(--light-gray);

}

.price-of-room{
  text-align: center;
}

.size-of-bed{
  color: var(--light-gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 4vw, 16px);
  text-align: center;

}


.mySwiper-room-and-suite{
  height: 600px;
}

.my-swipper-outer-room-and-suite {
  position: relative; /* Ensure the buttons can be positioned relative to this container */
}

   /* Custom Swiper Pagination */
   .mySwiper-room-and-suite .swiper-pagination {
    position: absolute;
    bottom: 0px; /* Adjust position */
    text-align: center;
  }
  
  .mySwiper-room-and-suite .swiper-pagination-bullet {
    width: 10px; /* Adjust size */
    height: 10px;
    background: var(--light-gray); /* Change color */
    opacity: 0.5;
    transition: all 0.3s ease-in-out;
  }
  
  .mySwiper-room-and-suite .swiper-pagination-bullet-active {
    width: 20px; /* Slightly larger when active */
    height: 10px;
    border-radius: 10px;
    background: var(--purple); /* Change active bullet color */
    opacity: 1;
  }

  .my-swipper-outer-room-and-suite .swiper-button-next::after,
  .my-swipper-outer-room-and-suite .swiper-button-prev::after {
    color: var(--white);
    font-size: 40px;

  }
  

  .my-swipper-outer-room-and-suite .swiper-button-next {
    right: -30px; /* Position next button outside */
    
  }
  
  .my-swipper-outer-room-and-suite .swiper-button-prev {
    left: -30px; /* Position prev button outside */
  }

  .view-more-button-div{
    display: flex;
    justify-content: center;
  }

  .view-more-button{
    background: var(--purple);
    color: var(--very-light-gray);
    margin-top: 40px;
   
    border-radius: 5px;
    border: 0;
    padding-top: 18px;
    padding-bottom: 12px;
    padding-left: 45px;
    padding-right: 45px;
    border: none;
    cursor: pointer;
    width: max-content;
    text-align: center;
   

  }


  .view-more-button h6{
    font-size: clamp(12px, 4vw, 16px);
    font-family: var(--Lora-Regular);

  }

  /* rooms-and-suites-section */

  .Essence-of-Luxury-Living-section{
    padding-top: 60px;
    padding-bottom: 60px;
  }


  .Essence-of-Luxury-Living-topic{
    color: var(--black);
    font-family:var(--LinLibertine) ;
    font-size: clamp(16px, 5vw, 44px); /* Maximum 44px */
    padding-bottom: 20px;
  }

  .Essence-of-Luxury-Living-para{
    color: var(--gray);
    font-family: var(--Lora-Regular);
    font-size: clamp(16px, 5vw, 18px); /* Maximum 18px */
  

  }

  .high-quality-room-design{
    padding-top: 10px;
    display: flex;
    gap: 20px;
    text-align: center;
align-items: center;

  }

  .high-quality-room-design img{
    width: 28px;
    height: 28px;
    object-fit: cover;
    object-position: center;
  }

  .high-quality-room-design h6{
    padding-top: 5px;
    color: var(--gray);
    font-family: var(--Lora-Regular);
    font-size: clamp(16px, 5vw, 18px); /* Maximum 18px */
  }

  /* col-lg-6 */
  .for-padding-left{
    margin-left: -60px;
  }


.bord{
  padding: 0;
  margin: 0;
  border: 0 !important;
}

.couple-img-enjoying {
padding: 0px !important;
  height: 330px;
  width: 100%;
  object-fit: cover;
  object-position: center;
  transform: skew(-12deg); /* Adjust skew angle */
  border-radius: 10px;


}

.swimming-pool-img{
  padding: 0px !important;
  height: 600px;
  width: 100%;
  object-fit: cover;
  object-position: center;
  transform: skew(-12deg); /* Adjust skew angle */
  border-radius: 10px;

}

.hotel-view-swimming-pool{
  margin-top: 270px;
  padding: 0px !important; 
  height: 330px;
  width: 100%;
  object-fit: cover;
  object-position: center;
  transform: skew(-12deg); /* Adjust skew angle */
  border-radius: 10px;
}



  /* Essence-of-Luxury-Living-section */

  .Our-Facilities-section{
    background:var(--light-purple) ;
    padding-top:40px ;
    padding-bottom: 40px;
  }

  .Our-Facilities-topics{
    font-family: var(--Lora-Regular);
    font-size: clamp(12px, 3vw, 16px);
  text-align: center;
    color:var(--gray);
    position: relative;
    padding-bottom: 10px;
  }


.Our-Facilities-topics::after{
  content: "";
  position: absolute;
  width: 50px;
  height: 4px;
  background: var(--purple);
  bottom: 0px;
  left: 50%; /* Centers the line */
  transform: translateX(-50%); /* Ensures the line is centered even if width changes */
  border-radius: 25px;
} 

.Unmatched-Facilities-topics{
  font-family: var(--LinLibertine);
  color: var(--black);
  font-size: clamp(16px, 5vw, 46px);
text-align: center;
  padding-bottom: 20px;

}

.gym-img-background{
  border-radius: 10px;
  width: 100%;
  height: 400px;
  background-position: center;
  background-size: cover;
  position: relative;
}

.gym-img-overlap{
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.5));
  position: absolute;
  border-radius: 10px;
  padding: 20px;
}



.topic-gym-img-overlap{
  color: var(--whitety);
  font-size: clamp(14px, 4vw, 22px);
font-family: var(--Lora-Regular);
position: absolute;
bottom: 10px;

}


  /* Our-Facilities-section */


  
.swipper-img-memories-slide{

  background-position: center;
  background-size: cover;
  height: 500px;
  width:100% ;
  position: relative;
  background-repeat: no-repeat;
 
}

.overlay-box-text{
  background: linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.2));
  width: 100%;
  height: 100%;
  position: absolute;
  padding: 20px;
 
}


.for-text {
  position: absolute;
  bottom: 20px;
  background: rgba(0, 0, 0, 0.1); /* Semi-transparent white */
  backdrop-filter: blur(10px); /* Blurry glass effect */
  -webkit-backdrop-filter: blur(10px); /* For Safari */
  padding: 10px 20px;
  border-radius: 10px;
 
 
}


.for-text h4{
  font-family: var(--Lora-Medium);
  font-size: clamp(14px, 2vw, 18px);
  color: var(--white);



}

.for-text h6{
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 1.5vw, 14px);
  color: var(--very-light-gray);
}


.row-of-swipper-memories{
  overflow: visible  ;
}

.mySwiper-Memories-Unforgettable-Events .swiper-button-next,
.mySwiper-Memories-Unforgettable-Events .swiper-button-prev{
  width: 45px;
  height: 50px;
  background: var(--white);
  color: var(--purple);
}

.mySwiper-Memories-Unforgettable-Events .swiper-button-next::after,
.mySwiper-Memories-Unforgettable-Events .swiper-button-prev::after{
  font-size: 20px;
}

.mySwiper-Memories-Unforgettable-Events .swiper-button-next{
  right: 515px;
}


.mySwiper-Memories-Unforgettable-Events .swiper-button-prev{
  left: 515px;
}

.mySwiper-Memories-Unforgettable-Events{
  height: 625px;

}


.mySwiper-Memories-Unforgettable-Events .swiper-pagination-bullet {
  position: relative;
  top: -60px !important;
    width: 10px; /* Adjust size */
    height: 10px;
    background: var(--light-gray); /* Change color */
    opacity: 0.5;
    transition: all 0.3s ease-in-out;
  }
  
  .mySwiper-Memories-Unforgettable-Events .swiper-pagination-bullet-active {
    width: 25px; /* Slightly larger when active */
    height: 10px;
    border-radius: 10px;
    background: var(--purple); /* Change active bullet color */
    opacity: 1;
  }
  
  /* mySwiper-Memories-Unforgettable-Events */

  .discountted-img{
    width: 100%;
    height: 400px;
    border-radius: 20px;
   background-position: center;
   background-size: cover;
  }

  .discountted-img-overlap{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    padding: 15px;
  
  }

  .discountted-img-overlap h6{
  color: var(--white);
  font-size: clamp(8px, 12px, 12px);
  background: red;
  width: max-content;
padding-top:12px ;
padding-bottom:12px ;
padding-left:20px ;
padding-right: 20px;
  border-radius: 5px;
  font-family: var(--Lora-Regular);
  position: absolute;
  right: 15px;

  }


/* OFFERS & DEALS-section  */

.client-one-testiomials-slide{
  width: 100%;
  border-radius: 10px;
  background: var(--white);
  padding: 20px;
  box-shadow: inset  0px 0px 0px 2px rgba(183, 182, 182, 0.1);
  display: flex;
 

}


.clients-one-testimional-img{
  width: 50%;
  height: 100%px;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
}

.introduction-client-one{
padding-left: 40px;
padding-right: 0px;
padding-top: 30px;
}

.star-icon {
display: flex;
gap: 10px;
}

.star-icon img{
  width: 18px;
  height: 18px;
  object-fit: cover;
  object-position: center;
}

.para-said-by-client{
  padding-top: 30px;
  color: var(--gray);
  font-size: clamp(12px, 3vw, 18px);
font-family: var(--Lora-Regular);
padding-bottom: 60px;
}

.para-said-by-client-two{
  padding-top: 30px;
  color: var(--gray);
  font-size: clamp(14px, 3vw, 18px);
font-family: var(--Lora-Regular);
padding-bottom: 10px;
}

.border-of-paragh{
  background:var(--very-light-gray);
  width: 100%;
  height: 2px;
}

.name-clients{
  padding-top: 30px;
  color: var(--black);
  font-size: clamp(14px, 3vw, 18px);
font-family: var(--Lora-Medium);
}

.professor{
  font-size: clamp(10px, 3vw, 14px);
  color:var(--light-gray);
  font-family: var(--Lora-Regular);

}

.mySwiper-Testimonials{
  height: 480px;
}



.mySwiper-Testimonials .swiper-pagination-bullet {
  position: relative;
  
    width: 10px; /* Adjust size */
    height: 10px;
    background: var(--very-light-gray); /* Change color */
    opacity: 0.5;
    transition: all 0.3s ease-in-out;
  }
  
  .mySwiper-Testimonials .swiper-pagination-bullet-active {
    width: 25px; /* Slightly larger when active */
    height: 10px;
    border-radius: 10px;
    background: var(--purple); /* Change active bullet color */
    opacity: 1;
  }


  .mySwiper-Testimonials-outer{
    position: relative;
  }
  
  .mySwiper-Testimonials-outer .swiper-button-next,
  .mySwiper-Testimonials-outer .swiper-button-prev{
    position: absolute;
    color: var(--black);
  }

  .mySwiper-Testimonials-outer .swiper-button-next{
right: -40px;
  }

  .mySwiper-Testimonials-outer .swiper-button-prev{
    left: -40px;
  }
  
  .mySwiper-Testimonials-outer .swiper-button-prev::after{
    font-size: 30px;
  }

  .mySwiper-Testimonials-outer .swiper-button-next::after{
    font-size: 30px;
  }
/* clients-one-testimional-img */
.Your-Ultimate-Dream-Getaway-Awaits-section{
  background-position: center;
  background-size: cover;
  width: 100%;
height: 100%;
  padding-top: 60px;
  padding-bottom: 60px;
}


.Ultimate-Dream-Getaway{
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  border-radius: 10px;
  position: relative;
}

.play-icon-img{
  width: 90px;
  height: 90px;
  object-fit: cover;
  object-position: center;
}
.Ultimate-Dream-Getaway-overlay{
  width: 100%;
  height: 100%;
background: rgba(2, 2, 2,0.2);
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
}



.Your-Ultimate-Dream-Getaway-Awaits-col{
  padding-top: 20px;
}

.Your-Ultimate-Dream-Getaway-Awaits-col h2{
color: var(--white);
font-size: clamp(20px, 6vw, 44px);
font-family: var(--LinLibertine);
padding-bottom: 20px;
}

.Escape-to-unparalleled-paragh{
color:var(--very-light-gray) ;
font-size: clamp(14px, 3vw, 18px);
font-family: var(--Lora-Regular);
padding-bottom: 20px;

}

.book-now-link-ulimate-dream{
  background: var(--purple);
  color: var(--very-light-gray);
  margin-top: 40px;
  border-radius: 5px;
  border: 0;
  padding-top: 18px;
  padding-bottom: 12px;
  padding-left: 45px;
  padding-right: 45px;
  border: none;
  cursor: pointer;
  width: max-content;
  text-align: center; 
}

.book-now-link-ulimate-dream h6{
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 3vw, 16px);

}



.get-off-offer-section {
  display: flex;
  position: relative;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 650px;
}

.shape-img {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

.offer-box-tranparent {
  width: 100%;
  height: 100%;
  background-color: rgba(17, 16, 16, 0.2);
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  text-align: center;
}

.Weekend-Special {
  text-align: center;
  color: var(--white);
  font-family: var(--lucida-writing);
  font-size: clamp(16px, 5vw, 38px);
  font-weight: 600px;
  font-style: italic;

  margin-top: 135px;
  padding-bottom: 20px;
}

.Get-Up-To-offer {
  font-family: var(--LinLibertine);
  font-size: clamp(20px, 6vw, 80px);
  text-align: center;
  color: var(--white);
}

.book-now-box-offer {
  font-family: var(--Lora-Regular);
  font-style: normal;
  background: var(--purple);
  color: var(--white);
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 40px;
  padding-right: 40px;
  font-size: clamp(12px, 3vw, 16px);
  display: inline-block;
  margin-top: 50px;
  border-radius: 5px;
}

/* Get Up To 30% Off on Booking */

.footer-section {
    background: var(--shade-black);
    padding-top: 80px;
    padding-bottom: 80px;
  }
  
  /* background-color-of-footer */
  
  
  
  /* footer-container */
  
  .icon-collection-box {
    padding-top: 20px;
  }
  
  /* icon-collection-box */
  
  .icon-collection {
    display: flex;
    gap: 20px;
    color: var(--white);
  }
  
  /* icon-collection */
  
  .twitter-logo {
    color: var(--white);
    width: 54px;
    height: 54px;
    border-radius: 50%;
    text-align: center;
    font-size: 17px;
    padding: 15px;
    background-color:#1C0D26;
  }
  
  /* twitter-logo */
  
  .footer-logo-img {
    width: 100px;
    height: 80px;

  }
  /* footer-logo-img */
  .Grand-Horizon-paragh {
    color: var(--very-light-gray);
    font-size: clamp(14px, 3vw, 16px);
    font-family: var(--Lora-Regular);
    padding-top: 20px;
  }
  /* Grand-Horizon-paragh */
  .border-line-grand-horizon-paara-box {
    padding-top: 20px;
  }
  
  /* border-line-grand-horizon-paara-box */
  .border-line-grand-horizon-paara {
    width: 70%;
    border: 1px solid #3D5F8C;
  }
  
  /* border-line-grand-horizon-paara  */
  
  /* 
  col-lg-4 */
  
  .Quick-links {
    color: var(--very-light-gray);
    font-family: var(--Lora-Regular);
    font-size: clamp(12px, 3vw, 16px);
    list-style: none;
    padding-bottom: 10px;
  }
  
  /* Quick-links */
  
  .underline-cursor-link {
  background: var(--purple);
  height: 3px;
    width: 44px;
    text-align: center;
    margin-top: -10px;
    border-radius: 10px;
  }
  
  /* underline-cursor-link */
  
  .Quick-links-col {
    list-style: none;
    text-decoration: none;
  }
  
  /* Quick-links-col div*/
  
  a:hover {
    text-decoration: none;
  }
  
  .home-quicks-link {
    font-family: var(--Lora-Regular);
    font-size: clamp(12px, 3vw, 16px);
    font-weight: 400px;
    font-style: normal;
    list-style: none;
    margin-left: -30px;
    color: var(--very-light-gray);
    line-height: 40px;
  }
  
  /* home-quicks-link */
  
  /* Quick-links-div */
  /* col-lg-2 */
  
  .contents-vedio {
    padding-top: 40px;
    color: var(--text-color-light-gray);
    list-style: none;
  }
  /* contents-vedio */
  .contents-vedio-list {
    margin-left: -30px;
    color: var(--very-light-gray);
    font-family: var(--Lora-Regular);
    font-size: clamp(12px, 3vw, 16px);
    font-weight: 400px;
    font-style: normal;
    list-style: none;
    line-height: 40px;
  }
  
  /* contents-vedio-list */
  
  /* contents-vedio col  */
  /* col-lg-2 */
  
  .Get-in-Touch {
    color: var(--very-light-gray);
    font-family: var(--Lora-Regular);
    font-size: clamp(12px, 3vw, 16px);
    font-style: normal;
    line-height: 23px;
  }
  /* Get-in-Touch */
  
  .underline-cursor {
    background: var(--purple);
  height: 3px;
    width: 44px;
    text-align: center;
    margin-top: 10px;
 margin-left: 15px;
    border-radius: 10px;
  }
  
  /* underline-cursor */
  
  .location-intro {
    display: flex;
    gap: 10px;
    color: var(--white);
    padding-top: 20px;

  }
  
  /* location-intro */
  
  .company-email {
    display: flex;
    gap: 10px;
    color: var(--white);
  }
  
  /* company-email */
  
  .contact-number-footer {
    font-family: var(--Lora-Regular);
    font-size: clamp(14px, 3vw, 16px);
    line-height: 25px;
    color: var(--very-light-gray);
  }
  
  /* contact-number-footer  */
  
  .location-direction {
    color: var(--very-light-gray);
    font-size: clamp(12px, 3vw, 14px);
    font-family: var(--Lora-Regular);
    padding-top: 40px;
  
  }
  
  /* location-direction */
  
  .border-line-cursor-for-location {
    margin-left: 20px;
    width: 30px;
    background: var(--purple);
    height: 4px;
      width: 44px;
      text-align: center;
      margin-top: 10px;
  
      border-radius: 10px;
  }
  
  /* border-line-cursor-for-location */
  
  .get-direction-box {
    display: flex;
    gap: 10px;
    text-align: center;
    align-items: center;
    padding-top: 30px;

  }
  
  /*style get-direction-box */
  
  .get-direction {
    color: var(--very-light-gray);
    font-size: clamp(14px, 3vw, 16px);
    font-family: var(--Lora-Regular);
  
  }
  
  /* style get-direction */
  
  .arrow-left {
    color: var(--very-light-gray);
    font-size: 16px;
    margin-top: -10px;
  }
  
  /* style-arrow-left */
  
  .border-get-direction {
    border: 1px solid var(--very-light-gray);
    width: 50%;

  }
  /* Style border-get-direction  */
  
  /* col-lg-3 */
  
  /* Get-in-Touch col  */
  /* row */
  .Copyright-comp {
    color: var(--very-light-gray);
    font-family: var(--Lora-Regular);
    font-size: clamp(12px, 3vw, 16px);

    display: flex;
   
   
  }
  
  /* Copyright-comp  */
  /* row */
  
  /* footer  */

  /* home-page-complete */


/* about-page  */

.background-image-of-service-page {
  width: 100%;
  height: 550px;
  background-position: center;
  background-size: cover;
  position: relative;
  border-radius: 20px;
  
}
.padding_left_right{
  padding: 0 40px;
}

/* background-image-of-service-page */

.black-box {
  width: 100%;
  height: 100%;
  background:black;
  opacity: 0.4;
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  border-radius: 20px;
}
/* black-box */

.our-service-page-slide-container {
  position: absolute;
}

/* our-service-page-slide-container */

.who-we-are {
  color: var(--white);
  text-align: center;
  margin-top: 200px;
  font-family: var(--LinLibertine);
  font-weight: 500;
  font-size: clamp(18px, 6vw, 40px);
  font-style: normal;
}
/* 
who-we-are */

.home-who-we-are-box {
  display: flex;
  justify-content: center;
  width: 200;
}

/* home-who-we-are-box */

.home-link-who-we-are {
  color: var(--white);
  font-family: var(--Lora-Medium);
  font-size: clamp(12px, 4vw, 18px);

  font-style: normal;
}

/* home-link-who-we-are */

.who-we-are-word {
  list-style: disc;
  margin-left: 30px;
  color: var(--white);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 4vw, 18px);
}

/* who-we-are-word */




.Indulge-in-the-Luxury-You-Deserve-section {
  background: var(  --dark-green-shade);
  padding-top: 80px;
  padding-bottom: 40px;
}

.Indulge-in-the-Luxury-You-Deserve {
  color: var(--black);
  font-family: var(--LinLibertine);
  font-size: clamp(18px, 5vw, 46px);
}

.Indulge-img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;

}

.Indulge-in-the-Luxury-1st-part {
  display: flex;
  margin-top: 40px;
  gap: 40px;
}

.Located-at-seaside {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(16px, 3vw, 18px);
  padding-left: 20px;
}

.Indulge-in-the-Luxury-2nd-part {
  border-left: 5px solid var(--purple);

  height: 25%;
margin-top: 20px;
  padding-bottom: 10px;
  padding-top: 10px;
  width: 100%;
  
}

.A-place-that-offers {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 4vw, 20px);
  font-style: normal;
  padding-left: 20px;
}

.Leonardo-P {
  padding-top: 20px;
  font-family: var(--Lora-Regular);
  padding-left: 20px;
  font-size: 18px;
  color: var(--purple);
}

.Hotel-Manager {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  padding-left: 20px;
  font-size: 14px;
}

.couple-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;

}

.your-top-priority-logo {
  width:220px;
  height: 180px;
  object-fit: cover;
  object-position: center;
  position: relative;
  margin-left: -100px;
  margin-top: -240px;
}
/* Indulge-in-the-Luxury-You-Deserve-section */


.Our-Purpose-and-Principles-section {
  background: var(--light-purple);
  padding-top: 80px;
  padding-bottom: 80px;
}

.Our-Purpose-and-Principles-img {
  width: 100%;
  min-height: 100%; /* Ensuring it has height */
  background-position: center;
  background-size: cover;
  position: relative;
  border-radius: 10px;

}

.play-icon-box-about-page {
  position: absolute;
  background-color: rgba(31, 29, 29, 0.1);
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.play-icon-about-page {
 width: 84px;
 height: 84px;
 object-fit: cover;
 object-position: center;
}

.Our-Purpose-and-Principles-box {
  padding-left: 40px;
  padding-top: 20px;
}

.Our-Purpose-and-Principles {
  color: var(--black);
  font-family: var(--LinLibertine);
  font-size: clamp(18px, 5vw, 44px);
  padding-bottom: 20px;
}

.Step-into {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 3vw, 18px);
 
}

.Book-Now-our-purpose {
  color: var(--very-light-gray);
  padding-left: 45px;
  padding-right: 45px;
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: clamp(12px, 3vw, 16px);
  font-family: var(--Lora-Regular);
  background: var(--purple);
  text-align: center;
  display: inline-block;
  margin-top: 20px;
  border-radius: 10px;

}

/* Our Purpose and Principles section */


.Meet-Our-Leadership-Team-section {
  padding-top: 80px;
  padding-bottom: 80px;
}

.Meet-Our-Leadership-Team {
  color: var(--black);
  font-size: clamp(18px, 5vw, 44px);
  font-family: var(--LinLibertine);
  text-align: center;
  padding-bottom: 40px;
}



.women-in-blue-shirt-img-box {
  width: 100%;
  height: 500px;
  background-position: center;
  background-size: cover;
  position: relative;
  border-radius: 10px;

}

.Dianne-Russell {
  color: var(--white);
  font-family: var(--Lora-Regular);
  text-align: left;
  padding-left: 20px;
  font-size: clamp(14px, 4vw, 24px);
  margin-top: 400px;
  position: relative;
  background-color: rgba(70, 68, 68, 0.2);
  display: inline-flex;
}

.ceo-word {
  color: var(--cream);
  font-family: var(--Lora-Regular);
  text-align: left;
  padding-left: 22px;
  font-size: clamp(12px, 3vw, 16px);
  background-color: rgba(70, 68, 68, 0.2);
  display: inline-block;
}

.image-box {
  background: rgba(34, 34, 34, 0.2);
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 10px;
}

/* 
Meet Our Leadership Team */

.Guest-Experiences-and-Reviews-section-sbout-page{
  background: var(--darkest-green-shade);
  padding-top: 80px;
  padding-bottom: 80px;
}


.guest-review-box-one-about-page{
  padding: 20px;
  background: var(--pictures-box-color);
  display: flex;
  gap: 10px;
  height:400px;


}



/*complete-about-page */
.Our-Facilities-section-about-page{
  background: var(--white);
  padding-top:40px ;
  padding-bottom: 40px;
}


.Make-Your-Stay-Memorable-section {
  background: var(--light-purple);
  padding-top: 80px;
  padding-bottom: 80px;
  background-position: center;
  background-size: cover;
}

.Make-Your-Stay-Memorable {
  font-family: var(--LinLibertine);
  color: var(--black);
  text-align: center;
  font-size: clamp(18px, 5vw, 44px);
  padding-bottom: 20px;
}

.wifi-col-background {
  background:var(--darkest-green-shade);
  padding: 40px;
  height: 320px;
  box-shadow: 10px 5px 10px rgba(0, 0, 0, 0.1);
 
}

.router-img-box {
  display: flex;
  justify-content: center;
}

.router-icon {
  width: 100px;
  height: 100px;
  object-fit: cover;
  object-position: center;
 
}

.High-Speed-Wifi {
  color: var(--black);
  font-family: var(--Lora-Regular);
  text-align: center;
  font-size: clamp(12px, 3vw, 18px);
  padding-top: 20px;
}

.Upgrading-your-bandwidth-is-easy-and-it-can-be-para {
  color: var(--gray);
  text-align: center;
  font-family: var(--Lora-Regular);
  text-align: center;
  font-size: 16px;
  padding-top: 5px;
  padding-bottom: 10px;
}

.breakfast-para {
  color: var(--gray);
  text-align: center;
  font-family: var(--lugfa-regular);
  text-align: center;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  padding-top: 5px;
  padding-bottom: 30px;
}

/* Make-Your-Stay-Memorable-section */

/* our-falicilities-page */


/* room-and-suite-page-start */
.room-and-suite-page-section{
  padding-top: 60px;
  padding-bottom: 60px;
}

/* room-and-suite-page-section */



/* restuarant-page */

.A-World-of-Flavors-Awaits-section {
  background-position: center;
  background-size: cover;
  padding-top: 80px;
  padding-bottom: 80px;
  background-color: var(--white);
}

.A-World-of-Flavors-Awaits-img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  height: 640px;
  border-radius: 10px;
 
}

.A-World-of-Flavors-Awaits {
  font-family: var(--LinLibertine);
  font-size: clamp(20px, 4vw, 40px);
  color: var(--black);
  padding-bottom: 10px;


}

.A-World-of-Flavors-Awaits-para {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 3vw, 18px);
  

}

.Day-Hours {
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 4vw, 22px);
  padding-top: 40px;
  color: var(--black);
}

.Breakfast-time {
  color: var(--gray);
  font-size: clamp(12px, 3vw, 18px);
  font-family: var(--Lora-Regular);
  text-align: center;
  font-weight: 400;
  font-style: normal;
}

.clock-icon {
  width: 24px;
  height: 24px;
  object-fit: cover;
  object-position: center;
}

.time-of-breakfast {
  display: flex;
  gap: 10px;
padding-top: 30px;
padding-bottom: 20px;
}
.time-of-lunch {
  display: flex;
  gap: 10px;

}

.time-of-dinner{
  display: flex;
  gap: 10px;
  padding-top: 20px;
}

.A-World-of-Flavors-Awaits-part {
 padding: 30px;
}

.read-more-a-world-of-Flavors {

  margin-top: 50px;
  display: inline-block;
  background: var(--purple);
  color: var(--very-light-gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 3vw, 16px);
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 40px;
  padding-right: 40px;
  border-radius: 5px;

}

/* A-World-of-Flavors-Awaits-section */



.Restaurant-Menu-section {
  background: var(--light-purple);
  padding-top: 80px;
  padding-bottom: 30px;
}


.Restaurant-Menu {
  font-family: var(--LinLibertine);
  font-size: clamp(18px, 5vw, 44px);
  color: var(--black);
  text-align: center;
}

.Breakfast-box {
  background: var(--shade-purple);
  height: 120px;
  width: 140px;
  padding: 20px;
  border-radius: 10px;

}

.Breakfast-icon {
  width: 45px;
  height: 45px;
  object-fit: cover;
  object-position: center;
  margin-left: 25px;
  filter: invert(100%) brightness(100%);
  
}

.Breakfast {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 3vw, 16px);
  padding-top: 10px;
  text-align: center;
  
}

.Breakfast-box:hover {
  background-color: var(--purple);
  color: var(--white);
}

.Breakfast-box:hover .Breakfast {
  color: var(--white);
}

.Breakfast-box:hover .Breakfast-icon {
  color: var(--white);
}




.Breakfast-box:hover .Breakfast-icon {
  filter: brightness(0) invert(1); /* Turns the icon white */
}
.Breakfast-box:hover .Breakfast {
  color: var(--white);
}
/* .Breakfast */




.Appetizers-box {
  background: var(--shade-purple);
  height: 120px;
  width: 140px;
  padding: 30px;
  border-radius: 10px;
  
}

.Appetizers-icon {
font-size: 40px;
object-fit: cover;
object-position: center;
  padding-left: 25px;
  filter: invert(100%) brightness(40%);

}

.Appetizers {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 3vw, 16px);
  padding-top: 10px;
  text-align: center;
}

.Appetizers-box:hover {
  background-color: var(--purple);
}

.Appetizers-box:hover .Appetizers-icon {
  filter: brightness(0) invert(1); /* Turns the icon white */
}

.Appetizers-box:hover .Appetizers {
  color: var(--white);
}

.Burgers-box {
  background: var(--shade-purple);
  height: 120px;
  width: 140px;
  padding: 30px;
  border-radius: 10px;

}

.Burgers-icon {
  font-size: 30px;
  padding-left: 25px;
  filter: invert(100%) brightness(40%);
}




.Burgers-box:hover {
  background-color: var(--purple);
  color: var(--white);
}

.Burgers-box:hover .Burgers-icon {
  filter: brightness(0) invert(1); /* Turns the icon white */
}
.Burgers-box:hover .Breakfast {
  color: var(--white);
}

.Salads-box {
  background: var(--shade-purple);
  height: 120px;
  width: 140px;
  padding: 30px;
  border-radius: 10px;

}

.Salads-icon {
 
  font-size: 30px;
  padding-left: 20px;
  filter: invert(100%) brightness(40%);
}

.Salads-box:hover {
  background-color: var(--purple);
  color: var(--white);
}




.Salads-box:hover .Salads-icon {
  filter: brightness(0) invert(1); /* Turns the icon white */
}
.Salads-box:hover .Breakfast {
  color: var(--white);
}

/* salad */

.Seafood-box {
  background: var(--shade-purple);
  height: 120px;
  width: 140px;
  padding: 30px;
  border-radius: 10px;

}

.Seafood-icon {
  padding-left: 20px;
  filter: invert(100%) brightness(40%);
}

.Seafood-box:hover {
  background-color: var(--purple);
  color: var(--white);
}




.Seafood-box:hover .Seafood-icon {
  filter: brightness(0) invert(1); /* Turns the icon white */
}
.Seafood-box:hover .Appetizers {
  color: var(--white);
}
/* seafood */

.Mains-box {
  background: var(--shade-purple);
  height: 120px;
  width: 140px;
  padding: 30px;
  border-radius: 10px;

}

.Mains-icon {
  padding-left: 22px;
  filter: invert(100%) brightness(40%);
}

.Mains-box:hover {
  background-color: var(--purple);
  color: var(--white);
}





.Mains-box:hover .Mains-icon {
  filter: brightness(0) invert(1); /* Turns the icon white */
}
.Mains-box:hover .Breakfast {
  color: var(--white);
}



.Breakfast-box.active {
  background-color: var(--purple);
}

.Breakfast-box.active .Breakfast{
  color: var(--white);
}


.Breakfast-box.active .Breakfast-icon {
  filter: brightness(0) invert(1); /* Turns the icon white */
}


/* .Breakfast */

.Appetizers-box.active {
  background-color: var(--purple);
}

.Appetizers-box.active .Appetizers{
  color: var(--white);
}


.Appetizers-box.active .Appetizers-icon{
  filter: brightness(0) invert(1); /* Turns the icon white */
}





.Burgers-box.active {
  background-color: var(--purple);
}

.Burgers-box.active .Breakfast{
  color: var(--white);
}


.Burgers-box.active .Burgers-icon{
  filter: brightness(0) invert(1); /* Turns the icon white */
}




.Salads-box.active {
  background-color: var(--purple);
}

.Salads-box.active .Breakfast{
  color: var(--white);
}


.Salads-box.active .Salads-icon{
  filter: brightness(0) invert(1); /* Turns the icon white */
}



.Seafood-box.active {
  background-color: var(--purple);
}

.Seafood-box.active .Appetizers{
  color: var(--white);
}


.Seafood-box.active .Seafood-icon{
  filter: brightness(0) invert(1); /* Turns the icon white */
}



.Mains-box.active {
  background-color: var(--purple);
}

.Mains-box.active .Breakfast{
  color: var(--white);
}


.Mains-box.active .Mains-icon{
  filter: brightness(0) invert(1); /* Turns the icon white */
}






/* main */

.collapse-slider-container {
  min-height: 705px;
  z-index: 10;
}

.background-of-menu-list {
  background: var(--light-purple);
  border: 0;
  min-height: 500px;
}

.Southern-Fried-Chicken {
  color: var(--black);
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 4vw, 22px);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.background-of-menu-list p {
  color: var(--gray);
  font-size: clamp(10px, 3vw, 16px);
  font-family: var(--Lora-Regular);
  margin: 5px 0 0;
}

.price-of-southern-fried-chicken {
  color: var(--purple);
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 4vw, 20px);
}

.doted {
  flex-grow: 1;
  border-bottom: 1px dashed var(--light-gray);

}

.Restaurant-Menu-section-for-mobile {
  display: none;
}
/* Restaurant-Menu-section */






/* restuarant-page */



/* start-hall-page */

/* Elegant-Event-Hall-section */

.Elegant-Event-Hall-section {
  background: var(--white);
  padding-top: 80px;
  padding-bottom: 80px;
  background-position: center;
  background-size: cover;
}

.Elegant-Event-Hall {
  color: var(--black);
  font-family: var(--LinLibertine);
  font-size: clamp(1.5rem, 4vw, 44px);
  text-align: center;
}

.Elegant-Event-Hall-para {
  font-size: clamp(12px, 3vw, 18px);
  color: var(--gray);
  padding-top: 10px;
  font-family: var(--Lora-Regular);

}

.image-slider-container {
  padding: 0 !important;
}

.main-slider {
  padding: 0 !important;
}

.TOTAL-ACCOMMODATIONS-box-whole-part {
  padding-left: 50px;
}

/* Main Image Slider */
.image-slider {
  width: 100%;
  margin: 0;
  padding: 0 !important;
}

.large-slider-image {
  width: 100%;
  height: 400px;
  object-fit: cover;
  border-radius: 10px !important;

  padding: 0 !important;
}

/* Thumbnail Slider */
.thumbnail-slider {
  height: 130px;

}

.small-slider-image {
  width: 140px;
  height: 115px;
  object-fit: cover;
  border-radius: 10px !important;
  padding: 5px !important;
}

/* Custom styling for the arrows */
.custom-prev,
.custom-next {
  background-color: var(--white);
  color: var(--purple);
  border: none;
  padding: 10px 15px;
  cursor: pointer;
  font-size: 20px;
  position: absolute;
  top: 40%;
  width: 60px;
  height: 50px;
  z-index: 10;
}
.custom-prev {
  left: 10px;
}
.custom-next {
  right: 10px;
}

/* Remove all transformations */
.small-slider-image {
  transform: none;
  opacity: 1;
}

.slick-list {
  padding: 0px !important;
  margin: 0;
}

.TOTAL-ACCOMMODATIONS {
  color: var(--gray);
  font-size: 17px;
  font-family: var(--Lora-Regular);
  word-spacing: 2px;
  font-weight: 400;
  font-style: normal;
}

.TOTAL-ACCOMMODATIONS-number {
  color: var(--purple);
  font-family: var(--LinLibertine);
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: clamp(1.25rem, 4vw, 42px);
}

.TOTAL-ACCOMMODATIONS-box {
  border-bottom: 1px solid var(--brand-color);
  width: 350px;
}

.border-padding {
  padding-top: 30px;
  padding-left: 60px;
}

.TOTAL-AMENITIES-box {
  padding-top: 30px;
  border-bottom: 1px solid var(--brand-color);
  width: 350px;
}

.TOTAL-CONFERENCE-box {
  padding-top: 30px;
}

.TOTAL-CONFERENCE-ROOMS-number {
  color: var(--purple);
  font-family: var(--LinLibertine);
  padding-top: 10px;
  padding-bottom: 20px;
  font-size: clamp(1.25rem, 4vw, 42px);
}

/* General Table Styles */

.table-responsive{
  padding: 0;
  border: 2px solid var(--cream);
  border-radius: 10px;
 
}

.custom-table {
  width: 100%;
   margin: 0;
}

.custom-table table {
  border-radius: 50px;
}

.custom-table th,
.custom-table td {
  text-align: start;
  padding-left: 20px;
  padding-bottom: 15px;
}

.custom-table td {
background:transparent;
font-family: var(--Lora-Regular);
font-size: clamp(12px, 3vw, 18px);
  color: var(--gray);
  padding-top: 20px;
   border: 1px solid var(--shade-purple);
}

.custom-table th {
  font-family: var(--Lora-Medium);
  font-size: clamp(12px, 3vw, 18px);
  color: var(--black);
background: var(--light-purple);
  font-weight: normal;
  border: 1px solid var(--shade-purple);
}

.custom-table th,
.custom-table td {
  padding-top: 20px;
}

.Amenities-That-Make-Every-Event-Remarkable-section {
  background: var(--light-purple);
  padding-top: 80px;
  padding-bottom: 80px;
}

.Amenities-That-Make-Every-Event-Remarkable {
  color: var(--black);
  font-family: var(--LinLibertine);
  font-size: clamp(1.25rem, 4vw, 44px);
  text-align: center;

}


.Stationery-box {
background: var(--light-purple);
  height: 120px;
  display: flex;
  color: var(--black);
  gap: 30px;
  padding-left: 40px;
  padding-top: 25px;
  padding-bottom: 25px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); /* Soft shadow */
  border-radius: 10px;
}

.book-icon {
  object-fit: cover;
  object-position: center;
  width: 64px;
  height: 64px;
}

.Stationery {
  font-family: var(--Lora-Medium);
  font-size: clamp(12px, 3vw, 21px);
  padding-top: 25px;
  text-align: center;
}

.Water-Bottles {
  font-family: var(--Lora-Medium);
  font-size: clamp(12px, 3vw, 21px);
  padding-top: 30px;
  text-align: center;
}

/* hall page */


/* photo-page start here */
.photo-gallery-section {
  padding-top: 80px;
}

.row-photo-topic {
  display: flex;
  gap: 10px;
}

.all-photogallery-click-button {
  background: transparent;
  display: inline-block;
  text-align: center;
  width: 155px;
  height: 40px;
  padding-top: 10px;
  color: var(--gray);

}

.all-photogallery-word {
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 1.5vw, 14px);
}

.Interior-photogallery-click-button {
  display: inline-block;
  text-align: center;
  width: 155px;
  height: 40px;
  padding-top: 10px;
  color: var(--gray);
  border: 2px solid var(--very-light-gray);
  border-radius: 5px;

}

.Interior-photogallery-click-button:hover {
  background: var(--purple);
  color: var(--white);
}

.photo-gallery-image-section {  
  padding-top: 40px;
  padding-bottom: 80px;
}

.all-photogallery-img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  object-position: center;

}

.photo-gallery-section-mobile {
  display: none;
}

.photo-gallery-section-nest-hub {
  display: none;
}

.Interior-photogallery-click-button.active {
  background-color: var(--purple); /* Highlight color for active category */
  color: var(--white);
}

/* photo-gallery-section */
/* vedio-page */

.vedio-page-all-img {
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 300px;
  border-radius: 10px;
}

.backgr-play-icon{
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
}



.play-vedio-icon {
  color: var(--white);
  font-size: 60px;
} 

/* vedio-gallery-page */

.Get-In-Touch-form-section {
 background: var(--white);
   padding-top: 80px;
   padding-bottom: 80px;
   background-position: center;
   background-size: cover;
   
 }
 
 .Get-in-Touch-form-img {
   width: 100%;
   height: 660px;
   object-fit: cover;
   object-position: center;
   border-radius: 10px;
   
 }
 
 .Get-In-Touch-topics-form-part {
   padding-top: 10px;
   padding-left: 50px;
 }
 
 .Get-In-Touch-topics-form {
   color:var(--black);
   font-family: var(--LinLibertine);
   font-size: clamp(28px, 5vw, 42px);
 }
 
 .Connect-with-Us-Anytime {
   color: var(--gray);
   font-family: var(--Lora-Regular);
   font-size: clamp(14px, 2vw, 18px);
 }
 
 
 .fill-your-name-form input::placeholder{
   color: var(--gray);
   font-family: var(--Lora-Regular);
   font-size: clamp(12px, 3vw, 16px);
 }
 
 
 .fill-your-name {
   border: 0;
   border-radius: 0;
   height: 55px;
   width: 100%;
   background-color: var(--light-purple);
   border-radius: 5px;
 
 }
 
 
 .fill-email-address-row input::placeholder{
   color: var(--gray);
   font-family: var(--Lora-Regular);
   font-size: clamp(12px, 3vw, 16px);
 }
 
 .messege-form-box textarea::placeholder{
   color: var(--gray) !important;
 }
 
 
 .fill-your-number {
   border-radius: 5px;
   height: 55px;
   width: 100%;
   border: 0;
   background-color: var(--light-purple);
 }
 
 .fill-your-name-form {
   padding: 10px;
   margin: 0;
 }
 
 .fill-email-address-row {
   border: 0;
   padding: 10px;
  
   
 }
 
 .fill-email-address {
   border-radius: 5px;
   border: 0;
   height: 55px;
   background-color: var(--light-purple);
 }
 
 .messege-form {
   height: 200px;
   border: 0;
   border-radius: 5px;
   padding-top: 15px;
   padding-left: 15px;
   background-color: var(--light-purple);
 }
 
 .messege-form-box {
   border: 0;
   padding-top: 12px;
 }
 
 .send-message-button {
   background:var(--purple);
   color: var(--very-light-gray);
   font-family: var(--lora-regular);
   font-size: clamp(14px, 1.5vw, 16px);
   font-weight: 400;
   font-style: normal;
   display: inline-block;
   padding-top: 18px;
   padding-bottom: 18px;
   padding-left: 40px;
   padding-right: 40px;
   margin-top: 20px;
   border-radius: 5px;
 
 }
 
 /* 
 Get-In-Touch-form-section */
 
 .contact-page-information-section {
  background: var(--light-purple);
   padding-top: 60px;
   padding-bottom: 60px;
 }
 
 .location-information-box {
   background: var(--shade-purple);
   padding-top: 30px;
   padding-bottom: 30px;
 
   height: 327px;
   text-align: center;
 }
 
 .location-information-icon-box {
   width: 100px;
   height: 100px;
   text-align: center;
   border-radius: 50%;
 background: var(--light-purple);
   display: inline-block;
   justify-content: center;
   padding: 20px;
 }
 
 .location-information-icon {
   width: 60px;
   height: 60px;
   object-fit: cover;
   object-position: center;
 }
 
 .our-location-information {
   font-family: var(--Lora-Medium);
   text-align: center;
   color: var(--black);
   font-size: clamp(16px, 2vw, 24px);
   padding-top: 30px;
 }
 
 .The-Queen-Walk-para {
   color: var(--gray);
   font-family: var(--Lora-Regular);
   font-size: clamp(14px, 1.5vw, 16px);
   text-align: center;
   padding-top: 10px;
 }
 
 .The-Queen-Walk-para-other {
   color: var(--gray);
   font-family: var(--Lora-Regular);
   font-size: clamp(14px, 1.5vw, 16px);
   text-align: center;
   margin-top: -10px;
 }
 
 .padding-contact-information-col {
   padding: 20px;
 }
 
 /* contact-page-information-section */
 
 /* contact-page */

 
.blog-section {
  padding-top: 20px;
  padding-bottom: 80px;
}

.blog-first-col-img {
  background-position: center;
  background-size: cover;
  border-radius: 10px;
  height: 500px;
  position: relative;
  display: flex;
  align-items: flex-end;
}

.blog-details-box {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: end;
  position: absolute;
  z-index: 5;
}

.blog-details {
  margin-bottom: 0px !important;
  width: 70%;
}

.blog-background-img {
  width: 100%;
  height: 410px;
  object-fit: cover;
  object-position: 100% 100%;
  position: absolute;
  z-index: 1;

  left: 10px;
  top: 60px;
}

.blog-background-frame {
  width: 100%;
  height: 540px;
  position: relative;
  overflow: hidden;
}

.blog-background-frame::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("../hotelpics/shape-img/subtract_hotel.png")
    no-repeat center center;
  background-size: 100%;
  z-index: 2;
}

.Crafting-Exceptional-Guest-Experiences-date {
  color: var(--light-gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(10px, 2vw, 14px);
  padding-top: 20px;
  padding-left: 30px;
}

.Crafting-Exceptional-Guest-Experiences {
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 2vw, 22px);
  color: var(--black);
  padding-left: 30px;
}

.read-more-button-Crafting {
  display: flex;
  color: var(--purple);
  gap: 10px;
  align-items: center;
  padding-left: 30px;
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 2vw, 16px);
  padding-top: 20px;
}

.arrow-icon-explore {
  padding-top: 2px;
  color: var(--steal-blue);
}

/* insight-page */
 

/* Exploring the Local Gems Around Our Hotel page started here */

.Content-without-backward-compatible-data-section {
  padding-top: 80px;
  padding-bottom: 80px;
}

.Content-without-backward-compatible-data-img {
  width: 100%;
  height: 500px;
  object-fit: cover;
  object-position: center;
  border-radius: 10px 10px 0 0;
}

.Content-without-backward-compatible-data-written-data {
  background: var(--light-purple);
  padding-top: 20px;
  padding-left: 20px;
  padding-bottom: 20px;
  padding-right: 20px;
}

.peacefulqode-box {
  color: var(--light-gray);
  display: flex;
  gap: 10px;
}

.peacefulqode-box .icon{
  font-size: 18px;
}

.peacefulqode-box h6{
font-size: clamp(14px, 1.5vw, 16px);
font-family: var(--Lora-Regular);
text-align: center;
padding-top: 2px;
}

.long-established-fact {
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 2vw, 18px);
  color: var(--gray);
  padding-top: 20px;
}

.Content-without-backward-compatible-data {
  color: var(--black);
  font-family:var(--Lora-Regular);
  font-size: clamp(18px, 3vw, 22px);
  padding-top: 40px;
}

.Michal-Smart {
  color: var(--purple);
  font-family: var(--Lora-Regular);
  font-size: clamp(16px, 2vw, 20px);
  padding-top: 10px;
}

.Michal-Smart-infor {
  border-left:4px solid var(--purple);
  padding-left: 20px;
  background: var(--shade-purple);
  padding-top: 10px;
  padding-bottom: 10px;
  margin-top: 40px;
  margin-bottom: 30px;

}

.Economy-img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  height: 305px;
  margin-top: 20px;
  border-radius: 10px;
  
}

.Lorem-ipsum-dolor-para {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 2vw, 18px);
}

.tick-mark {
 object-fit: cover;
 object-position: center;
width: 32px;
height: 32px;

}

.Lorem-ipsum-dolor-box {
  display: flex;
  gap: 20px;
  padding-top: 30px;
}

.Vivamus-eu-ligula {
  display: flex;
  gap: 20px;
  padding-top: 10px;
}


.Vivamus-eu-ligula-another{
  display: flex;
  gap: 20px;
  padding-top: 10px;
  padding-bottom: 20px;
}
.All-Insights-section-other{
  background: var(--light-purple);
  padding-top: 80px;
  padding-bottom: 80px;
}

.All-Insights-topics{
  color: var(--black);
  text-align: center;
  font-size: clamp(28px, 5vw, 44px);
  font-family: var(--LinLibertine);
  padding-bottom: 40px;

}

.blog-background-frame-explore {
  width: 100%;
  height: 540px;
  position: relative;
  overflow: hidden;
}

.blog-background-frame-explore::before {
  
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("../hotelpics/shape-img/shap-img-1.svg")
    no-repeat center center;
  background-size: 100%;
  z-index: 2;
}

.blog-background-img-explore {
  width: 100%;
  height: 440px;
  object-fit: cover;
  object-position: 100% 100%;
  position: absolute;
  z-index: 1;
top: 50px;
  left: 10px;

}
/* Content-without-backward-compatible-data-section */

/* explore-blog-page-completed */

.swimming-pool-page-second-section {
  background-color:var(--white);
  background-position: center;
  background-size: cover;
  padding-top: 80px;
  padding-bottom: 80px;
}

.children-swimming-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
}

.Dive-into-relaxation {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(1rem, 3vw, 18px);
}

.children-swimming-written {
  padding-top: 30px;
  padding-left: 40px;
}

.Spacious-Pool-box {
  display: flex;
  gap: 20px;
  padding-top: 20px;
}

.tick-mark-icon {
  color: var(--purple);
  font-size: 25px;
}

.Spacious-Pool {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: 18px;
  padding-top: 5px;
}

.Luxurious-Poolside-Amenities-box {
  display: flex;
  gap: 20px;
}



/* swimming-pool-page-second-section */

/* swimming page */

/* Deluxe Rooms-page-started here */

.room-picture-section {
  background: var(--light-steal-color);
  padding-top: 80px;
  padding-bottom: 80px;
}

.room-img-deluxe {
  width: 100%;
  height: 560px;
  object-fit: cover;
  object-position: center;
  border-radius: 5px;
}

.small-img-of-room-deluxe {
  width: 100%;
  height: 180px;
  object-fit: cover;
  object-position: center;
  border-radius: 5px;
}

.small-img-of-room-deluxe-sec {
  width: 100%;
  height: 180px;
  object-fit: cover;
  object-position: center;
  margin-top: 10px;
  border-radius: 5px;
}

.deluxe-room-next-button::after {
  color: var(--black);
  display: flex;
  text-align: center;
  align-items: center;
  font-size: 20px;
}

.deluxe-room-next-button {
  width: 60px;
  height: 50px;
  background: var(--white);
  right: 0;
}

.deluxe-room-prev-button::after {
  color: var(--black);
  display: flex;
  text-align: center;
  align-items: center;
  font-size: 20px;
}

.deluxe-room-prev-button {
  width: 60px;
  height: 50px;
  background: var(--white);
  left: 0;
}

/* room-picture-section */

.About-Accommodation-section {
  background: var(--light-purple);
  padding-top: 60px;
  padding-bottom: 70px;
}

.About-Accommodation {
  color: var(--black);
  font-size: clamp(14px, 2vw, 24px);
  font-family: var(--Lora-Regular);
}

.About-Accommodation-paragraph {
  font-size: clamp(14px, 2vw, 18px);
  color: var(--gray);
  font-family: var(--Lora-Regular);
  padding-top: 20px;
  padding-bottom: 20px;
}

.About-Accommodation-Facilities {
  color: var(--black);
  font-size: clamp(14px, 2vw, 24px);
  font-family: var(--Lora-Regular);
  padding-top: 20px;
  padding-bottom: 10px;
}

.king-size-bed-facilities {
  font-size: clamp(14px, 2vw, 18px);
  color: var(--gray);
  font-family: var(--Lora-Regular);
  padding: 13px;
}

.bed-icon-deluxe {
  object-fit: cover;
  object-position: center;
  width: 30px;
  height: 30px;
  margin-top: 10px;
}



.facilities-bed-size-view {
  display: flex;

  width: 100%;
  height: 60px;
 
  padding-top: 5px;
  padding-left: 40px;

  border: 1px solid var(--light-gray);
  border-radius: 5px;
}

.Reservation-part {
  background: var(--shade-purple);
 padding-top: 40px;
 padding-left: 40px;
 padding-right: 40px;
 padding-bottom: 0px;
  height: 100%;
  box-shadow: 10px 10px rgba(48, 49, 50, 0.1);
  border-radius: 10px;
}

.Reservation-topic {
  font-size: clamp(14px, 6vw, 44px);
  color: var(--black);
  font-family: var(--LinLibertine);
}

.dollar-three-two-zero {
  font-size: clamp(14px, 6vw, 44px);
  color: var(--black);
  font-family: var(--LinLibertine);
}

.per-night-reservation {
  color: var(--light-gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 2vw, 18px);
  padding-top: 15px;
}

.Reservation-book-now-button {
  background-color: var(--purple);
  color: var(--very-light-gray);
  text-align: center;
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 2vw, 16px);
  font-style: normal;
  padding-top: 20px;
  padding-bottom: 20px;
  margin-top: 40px;
  border-radius: 5px;
}

/* Add your custom styles here if needed */
.calender-for-checkin {
 
  display: flex;
  justify-content: space-between;
}

.rservbox {
  display: flex;
  justify-content: space-between;
  border: 2px solid var(--very-light-gray);
  padding: 15px;
  margin: 15px 0;
  border-radius: 5px;
  color: var(--gray);
}

.rservbox .rbox span {
  cursor: pointer;
}

.rservbox .rbox p {
  margin: 0;
}

.rservbox .rbox input {
  visibility: hidden;
  width: 0;
  height: 0;
}

.down-arrow {
  font-size: 10px;
}

/* reservbox */

.number-of-room-booking {
  display: flex;
  justify-content: space-between;
  border: 2px solid var(--very-light-gray) !important;
  text-align: center;
  padding-left: 15px;
  padding-right: 5px;
  padding-top: 5px;
  border-radius: 5px;
  color: var(--gray);
}

.number-of-room {
  margin-top: 7px;
}

.quantity-input {
  display: inline-flex;
  align-items: center;
}

.quantity-input .qty {
  width: 30px;
  height: 30px;
  text-align: center;
  font-size: clamp(14px, 2vw, 16px);
  border: none;
  outline: none;
  color: var(--gray);
}

.quantity-input button {
  background:transparent;
  border: 0;
  padding: 5px 10px;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--light-gray);
}

.quantity-input button:focus {
  outline: none;
}

.qty {
  background: transparent;
}

/* number-of-room-booking */

.Extra-Services {
  font-size: clamp(14px, 2vw, 24px);
  color: var(--black);
  font-family: var(--Lora-Regular);
  padding-top: 30px;
  padding-bottom: 20px;
}

.quantity-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding-right: 10px;
  padding-left: 10px;
}

.well-quantity-input {
  display: flex;
  align-items: center;
}

.minus-plus-person-box {
  display: flex;
  align-items: center;
  color: var(--gray);

  font-size: 22px;
  margin-top: 10px;
}

.minus-plus-person-box #qty {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 2vw, 16px);
  padding-left: 10px;
  width: 50px;
}

.minus-plus-person-box .minus,
.minus-plus-person-box .plus {
  font-size: 25px; /* Increase the size as needed */
  width: 20px; /* Adjust button width */
  height: 20px; /* Adjust button height */
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 4px;
  color: var(--light-gray);
}

.well-quantity-input input {
  width: 30px;
  text-align: center;
  border: 0;
  background: transparent;
}

.well-quantity-input button {
  background-color: transparent;
  border: 2px solid var(--light-gray);
  text-align: center;
  width: 10px;
  height: 10px;
  font-size: 10px;
  cursor: pointer;
  border-radius: 50%;
}

.controls {
  display: flex;
  align-items: center;
}

.control {
  display: flex;
  align-items: center;
  margin-right: 20px;
}

.control input {
  margin-right: 15px;
  transform: scale(1.4);
}

.controls input[type="checkbox"] {
  position: relative;
  cursor: pointer;
  appearance: none; /* Remove default styles */
  -webkit-appearance: none; /* For Safari */
  -moz-appearance: none; /* For Firefox */

  width: 15px;
  height: 15px;
  background-color: transparent !important; /* Green color when checked */
border-radius: 2px;
  border: 1px solid var(--light-gray) !important;
}

.controls input[type="checkbox"]:checked {
  background-color: transparent !important; /* Green color when checked */

  border: 1px solid var(--light-gray) !important;
  border-radius: 2px;
}

.controls input[type="checkbox"]:checked::after {
  content: "\f00c"; /* Checkmark symbol */
  position: absolute;
  top: 1px;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--purple);
  font-size: 10px;
  font-family: "Font Awesome 6 Free";
  font-weight: 600;
}

.Wellness-Spa {
  font-family: var(--Lora-Regular);
  color: var(--gray);
  font-size: clamp(0.875rem, 2vw, 16px);
  margin-top: 10px;
}

.person-number-box {
  display: flex;
  align-items: baseline;
}

.per-person-resv {
  color:var(--light-gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(0.75rem, 2vw, 14px);
  margin-left: -9px;
}

.complete-box-person-number {
  display: flex;
  gap: 20px;
  align-items: baseline;
  padding-right: 10px;
}

.straight-line {
  color: var(--light-gray);
}

.person-number {
  font-family: var(--Lora-Regular);
  font-size: clamp(1rem, 2vw, 22px);
  color: var(--gray);
  padding-right: 10px;
  padding-top: 20px;
}

.CONTINUE-book-now-button {
  background: var(--purple);
  color: var(--very-light-gray);
  font-size: clamp(14px, 2vw, 16px);
  font-family: var(--Lora-Regular);
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  display: block;
  margin-top: 30px;
  border-radius: 10px;
}

/* About-Accommodation-section */

.rooms-and-suites-deluxe-room-section{
  background: var(--light-purple);
  padding-top:60px ;
  padding-bottom: 60px;
}


.deluxe-room-topic-other{
  color: var(--black);
  font-size: clamp(16px, 4vw, 26px);
  font-family: var(--Lora-Medium);
  text-align: center;
  padding-top: 30px;

}

.Our-Exquisite-Rooms-topics-other{
  font-family: var(--LinLibertine);
  color: var(--black);
  font-size: clamp(16px, 5vw, 46px);
  text-align: center;
  padding-bottom: 20px;

}


.room-suite-topics-other{
  font-family: var(--Lora-Regular);
   font-size: clamp(12px, 3vw, 16px);
 text-align: center;
   color:var(--gray);
   position: relative;
   padding-bottom: 10px;
 }
 
 .room-suite-topics-other::after{
   content: "";
   position: absolute;
   width: 50px;
   height: 4px;
   background: var(--purple);
   bottom: 0px;
   left: 50%; /* Centers the line */
   transform: translateX(-50%); /* Ensures the line is centered even if width changes */
   border-radius: 25px;
 } 

 



.my-swipper-outer-room-and-suite-other-page {
  position: relative; /* Ensure the buttons can be positioned relative to this container */
}

   

  .my-swipper-outer-room-and-suite-other-page .swiper-button-next::after,
  .my-swipper-outer-room-and-suite-other-page .swiper-button-prev::after {
    color: var(--black);
    font-size: 30px;

  }
  

  .my-swipper-outer-room-and-suite-other-page .swiper-button-next {
    right: -30px; /* Position next button outside */
    
  }
  
  .my-swipper-outer-room-and-suite-other-page .swiper-button-prev {
    left: -30px; /* Position prev button outside */
  }


  
  .Make-Your-Stay-Memorable-section-deluxe {
    background: var(--white);
    padding-top: 80px;
    padding-bottom: 80px;
    background-position: center;
    background-size: cover;
  }
/* deluxe-page */

/* Make Your Reservation page */
.Reservation-detail-section {
  background: var(--white);
  padding-top: 80px;
  padding-bottom: 80px;
}

.Reservation-detail-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
}

.Reservation-Details {
  color: var(--black);
  font-family: var(--LinLibertine);
  font-size: clamp(1.5rem, 4vw, 45px);
  padding-top: 20px;
}

.padding-fprm-reservation-detail {
  padding-left: 40px;
}

.padding-fprm-reservation-detail-age {
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 10px;
  padding-top: 10px;
}

.Extra-Services {
  font-size: clamp(1rem, 2vw, 22px);
  color: var(--black);
  font-family: var(--Lora-Regular);
  padding-top: 30px;
  padding-bottom: 20px;
}

.room-type {
  color: var(--gray);
  border-radius: 5px;
  border: 2px solid var(--very-light-gray);
  padding-top: 14px;
  padding-bottom: 14px;
}

.room-type-click-down {
  color: var(--gray);
}

/* Complete Your Reservation page */

.billing-section {
  background-color: var(--white);
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.bill {
  background-color: var(--light-purple);
  padding-left: 40px;
  padding-right: 40px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-radius: 5px;
  position: sticky;
  top: 0;
  height: 630px;
  z-index: 100000;
  box-shadow: 5px 5px 10px #dce7f5;
}

.checkin-date-check {
  padding-top: 15px;

  color: var(--light-gray);
  font-size: clamp(14px, 3vw, 18px);
  font-family: var(--lugfa-regular);

  font-weight: 400;
  font-style: normal;
}

.checkin-date {
  color: var(--black);
  font-size: clamp(1rem, 2vw, 22px);
  font-family: var(--Lora-Regular);
}

.billing-of-deluxe-room-total {
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
  padding-bottom: 2px;
}

.billing-of-deluxe-room {
  color: var(--black);
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 3vw, 18px);
}

.cost-of-deluxe-room {
  color: var(--purple);
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 3vw, 18px);
}

.line-of-total {
  border-bottom: 1px solid var(--purple);
  opacity: 0.1;
  width: 100%;
}

.billing-of-total-number-adults {
  padding-top: 10px;
  display: flex;
  justify-content: space-between;
  padding-bottom: 10px;
}

.total-cost-of-service {
  display: flex;
  justify-content: space-between;
}

.total-bill {
  color: var(--black);
  font-family: var(--Lora-Regular);
  font-size: clamp(14px, 3vw, 18px);
}

.total-cost {
  color: var(--black);
  font-size: clamp(14px, 3vw, 18px);
  font-family: var(--Lora-Regular);
}

.form-for-complete-reservation {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 40px;
}

.Fill-Your-Information {
  color: var(---black);
  font-size: clamp(16px, 5vw, 24px);
  font-family: var(--Lora-Regular);
  padding-bottom: 15px;
}

.form-border-zero {
  height: 65px;
background: var(--light-purple);
  border: 0;
  border-radius: 5px;
}

.email-address-width {
  width: 100% !important;
  border-radius: 5px;
  height: 65px;
  border: 0;

  background: var(--light-purple);
}

.Choose-Payment-Method {
  color: var(--black);
  font-size: clamp(16px, 5vw, 24px);
  font-family: var(--Lora-Regular);
  padding-top: 40px;
}

.changein-form-for-padding {
  margin-left: 15px;
  padding-top: 10px;
}

.Office-Payment {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(12px, 5vw, 18px);
  margin-top: 2px;
  padding-left: 10px;
}

.change-in-form-check-input {
  border: 1px solid var(--purple) !important;
  width: 22px;
  height: 22px;
  background-color: transparent;
}

.change-in-form-check-input:checked {
  background: var(--brand-color) !important;
}

.agreed-check {
  color: var(--gray);
  font-family: var(--Lora-Regular);
  font-size: clamp(1rem, 3vw, 21px);
}

.terms-and-conditon {
  color: var(--purple);
  font-family: var(--Lora-Regular);
  font-size: clamp(16px, 2vw, 21px);
}

.for-check-agred-padding {
  padding-left: 30px;
  padding-top: 10px;
}

.border-of-form-check {
  border: 1px solid var(--gray);
  border-radius: 0px !important;
  width: 19px;
  height: 19px;
  background-color:transparent;
  border-radius: 5px;
}

.padding-for-agred-phase {
  display: flex;
  padding-left: 10px;
  margin-top: 2px;
}

.COMPLETE-BOOKING {
  color: var(--very-light-gray);
  font-family: var(--Lora-Regular);
  font-size: clamp1(12px, 2vw, 16px);
  background: var(--purple);
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  margin-top: 50px;
  border-radius: 10px;
}

/* billing-section */

.change-in-form-check-input:checked {
  background: var(--purple) !important; /* Background color when checked */
  border: 4px solid var(--white) !important;
  outline: 1px solid var(--purple) !important;
  /* Optional: You can scale the element when checked */
  transform: scale(0.8); /* This scales the input down to 80% */
  /* Optional: Add padding inside the checked input */
  padding: 5px; /* Optional: rounded corners for the border */
}

.change-in-form-check-input:focus {
  box-shadow: none !important;
}


.testimonial-page-section{
  padding-top: 60px;
  padding-bottom: 60px;
}

/* complete-your-reservation-page */


  @media screen and (max-width: 480px) {
    .for-padding-home-title {
        padding-left: 20px;
      }
      
      
      .banner-swipper-banner{
        height: 450px;
      }

      .Beyond-the-Extraordinary-box{
        margin-top: -100px;
      }
      
  .resitration-section {
    display: none;
  }
  /* resitration-section */
  /* index-page */
  .for-mobile-home {
    display: block;
    margin-top: -20px;
  }
  
 
  
  .resitration-container-for-mobile {
    background: var(--black);
    padding-top: 40px;
    padding-bottom: 110px;
    color: var(--light-gray);
}

.CHECKIN-form {
  padding: 20px;
}

.CHECKIN-form-label {
  font-size: 16px;
  display: block;
  text-align: center;
  font-family: var(--lora-regular);
  color: var(--light-gray);
}

.form-label {
    font-size: 16px;
    font-weight: bold;
}

.form-control {
    font-size: 14px;
    padding: 10px;
}
.form-control-checkin-form {
  height: 50px;
  border-radius: 0;
}


.bord {
  border: 1px solid var(--light-gray);
  text-align: center;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 20px;
  padding-right: 20px;
}

.guest-font {
  font-family: var(--lora-regular);
  font-optical-sizing: auto;
  font-size: 16px;
  color: var(--light-gray);
  font-style: normal;
}

.plus-padding {
  padding-right: 20px;
}

.icon-mbolile-resgitration {
    font-size: 25px;
    color: var(--light-gray);
  }


.icon-mbolile-resgitration:hover {
    color: var(--purple);
}

  /* registration-form */
  .Find-Your-Bliss-Azure-Haven-section{
    height:100%;
  }
  
  .Find-Your-Bliss-Azure-Haven-section h1{
    margin-top: -100px;
  }

  /* Find-Your-Bliss-Azure-Haven-section */
  .rooms-and-suites-section{
    margin: 0;
    border-radius: 0;

  }

  
  .my-swipper-outer-room-and-suite .swiper-button-next {
    right: 0px !important; /* Position next button outside */
    
  }
  
  .my-swipper-outer-room-and-suite .swiper-button-prev {
    left: 0px !important; /* Position prev button outside */
  }

  

  /* rooms-and-suites-section */

  .couple-img-enjoying{
    transform:none; /* Adjust skew angle */
    height: 100%;
  }

  .swimming-pool-img{
    transform:none; /* Adjust skew angle */
    height: 100%;
  }

.hotel-view-swimming-pool{
    transform:none; /* Adjust skew angle */
    height: 100%;
    margin-top: 0;
  }

  .high-quality-room-design img{
    margin-top: -20px;
  }

  .margin-top{
    margin-top: 20px;
  }

  /* Essence-of-Luxury-Living-section */

  .get-off-offer-section {
    height: 450px;
  }

  .background-image-of-service-page {
    height: 450px;
  }
  
.mySwiper-Memories-Unforgettable-Events .swiper-button-next{
  right: 0px !important;
}


.mySwiper-Memories-Unforgettable-Events .swiper-button-prev{
  left: 0px !important;
}





.mySwiper-Testimonials-outer .swiper-button-next{
  right: 0px;
    }
  
    .mySwiper-Testimonials-outer .swiper-button-prev{
      left: 0px;
    }


.Ultimate-Dream-Getaway{
  
    height: 450px;
  }
  
  
  .Quick-links-div{
    margin-top: 40px;
  }

  /* home-page */
.Indulge-in-the-Luxury-2nd-part {
  height: 20%;
}

.Located-at-seaside {
  padding-left: 0;
  padding-top: 10px;
}

  
  .your-top-priority-logo{
    display: none;
  }

  /* Indulge-in-the-Luxury-You-Deserve-section */

  .Our-Purpose-and-Principles-img{
    height: 450px;
  }

  /* Our Purpose and Principles section */

  .Our-Purpose-and-Principles-box{
    padding-left: 0;
  }

  /* .background-image-of-service-page {
    height: 400px !important;
  } */

  .padding_left_right{
    padding: 0;
  }
  /* about-page */
  .A-World-of-Flavors-Awaits-img{
    height: 450px;
  }

  .A-World-of-Flavors-Awaits-part{
    padding: 0;
    padding-top: 20px;
  }
  /* A-World-of-Flavors-Awaits-section  */
  .Restaurant-Menu-section {
    display: none;
  }

  .Restaurant-Menu-section-for-mobile {
    display: block;
    background: var(--light-purple);
    padding-top: 40px;
  }

  .Breakfast-menu-box {
    padding-bottom: 5px;
    background: var(--shade-purple);
 
  }

  .Breakfast-menu-icon {
    color: var(--black);
    font-size: 30px;
    text-align: center;
    padding-left: 20px;
    padding-top: 10px;
  }

  .Breakfast-menu-box:hover {
    background: var(--purple);
  }

  .breakfast-title {
    font-family: var(--Lora-Regular);
    font-size: 14px;
    padding-top: 10px;
    text-align: center;
    color: var(--gray);
  }

  .Breakfast-menu-box:hover .Breakfast{
    color: var(--white);
  }

  .Breakfast-menu-icon {
    filter: grayscale(100%);
  }

  .Breakfast-menu-icon {
    filter: grayscale(100%) brightness(40%);
  }

  .Breakfast-menu-box:hover .Breakfast-menu-icon {
    filter: brightness(0) invert(1); /* Turns the icon white */
  }

  .Appetizers-menu-box {
    padding-bottom: 5px;
    background: var(--shade-purple);
  }

  .Appetizers-menu-icon {
    color: var(--gray);

    text-align: center;
    padding-left: 25px;
    padding-top: 10px;
  }

  .Appetizers-menu-box:hover {
    background: var(--purple);
  }

  .Appetizers-menu-box:hover .Breakfast{
    color: var(--white);
  }

  .Breakfast-menu-box:hover .Breakfast {
    color: var(--white);
  }

  .Appetizers-menu-icon {
    filter: grayscale(100%);
  }

  .Appetizers-menu-icon {
    filter: grayscale(100%) brightness(40%);
  }

  .Appetizers-menu-box:hover .Appetizers-menu-icon {
    filter: brightness(0) invert(1); /* Turns the icon white */
  }



.Breakfast-menu-box.active {
  background-color: var(--purple);
}

.Breakfast-menu-box.active .breakfast-title{
  color: var(--white);
}


.Breakfast-menu-box.active .Breakfast-menu-icon{
  filter: brightness(0) invert(1); /* Turns the icon white */
}



.Appetizers-menu-box.active {
  background-color: var(--purple);
}

.Appetizers-menu-box.active .Appetizers-menu-icon{
  color: var(--white);
}


.Appetizers-menu-box.active .Breakfast-menu-icon{
  filter: brightness(0) invert(1); /* Turns the icon white */
}



  /* resturant-page */

  .TOTAL-ACCOMMODATIONS-box-whole-part{
    padding-left: 0;
  }
  /* hall-page */

  
.photo-gallery-section{
  display: none;
}

.photo-gallery-section-mobile{
  display: block;
background: var(--peach-shade);
  padding-bottom: 80px;
  
}



.all-photogallery-word-mobile{
  font-family: var(--Lora-Regular);
  font-size: 14px;
 
}

.Interior-photogallery-click-button-mobile{
  display: inline-block;
  text-align: center;

  width: 80px;
  height: 40px;
  padding-top: 10px;

  color: var(--gray);
  border: 2px solid var(--very-light-gray);
  border-radius: 5px;
}

.all-photogallery-word-mobile-repre{
  font-family: var(--Lora-Regular);
  font-size: 14px;
}

.Interior-photogallery-click-button-mobile:hover{
  background: var(--purple);
  color: var(--white);
}

.Interior-photogallery-click-button-mobile.active {
  background-color: var(--purple); /* Highlight color for active category */
  color: var(--white);
}
/* .photo-gallery-page */
.Get-In-Touch-topics-form-part{
  padding-left: 0;
}

/* contact-page */

.blog-background-img {
  height: 340px;
  background-size: cover;
  background-position: center;
  margin-top: 40px;
}

.blog-details{

 margin-bottom: 30px !important;
}

.blog-background-img-explore{
height: 360px;
margin-top: 50px;
}

/* blog-page */
.children-swimming-written{
  padding-left:0;
}

/* swimming-pool-page */
.my-swipper-outer-room-and-suite-other-page .swiper-button-next {
  right: 0px; /* Position next button outside */
  
}

.my-swipper-outer-room-and-suite-other-page .swiper-button-prev {
  left: 0px; /* Position prev button outside */
}

.Reservation-part{
padding-left: 0;
padding-right: 0;
}

.per-night-reservation{
  padding-top: 5px;
}
/* deluxe-page */

.padding-fprm-reservation-detail{
  padding-left: 0;
}

.form-for-complete-reservation{
  padding-left: 0;
}

  }
@media (max-width: 1280px) {
    .for-padding-about-title {
        padding-left: 20px;
      }

      .mySwiper-Memories-Unforgettable-Events .swiper-button-next{
        right: 435px;
      }
      
      
      .mySwiper-Memories-Unforgettable-Events .swiper-button-prev{
        left: 435px;
      }


.clients-one-testimional-img{
  width: 50%;
}

.blog-background-img {
height: 340px;
margin-top: 40px;
}
      

    }