/* Css For Balley */

/************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset
3. Global
4. Main Header
5. Main Slider 
6. Intro Section
7. About Section
9. Features Section
8. Gallery Section
10. Highlights Section
11. Room Dimension
12. Appartment Section
14. Our Agent
15. Testimonial Section
16. News Section
19. Main Footer
20. Footer Bottom
21. Balley Details
22. Apartment Style Two
23. Gallery Style Two
24. Agent Style Two
25. Social Area
26. Google Map
27. Page Title
28. Service Page
29. Tour Page
30. Video Tour
31. Faq Page
32. Faq Sidebar
33. Faq Content
34. Error Section
35. About Page
36. Who We Are
37. Fact Counter
38. Gallery Standard
39. Gallery Masonary
40. Blog Grid
41. Blog Standard
42. Blog Standard Content
43. Blog Sidebar Content
44. Blog Details
45. Blog Details Content
46. Contact Page
47. Google Map
48. Contact Section


**********************************************/


/* use font link */



@import url('https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i');


/* use style sheet */



@import url(../css/owl.css);
@import url(../css/bootstrap.css);

@import url(../css/animate.css);




/*** 

====================================================================
  Reset
====================================================================

 ***/
* {
  margin:0px;
  padding:0px;
  border:none;
  outline:none;
}


/*** 

====================================================================
  Global Settings
====================================================================

 ***/


body {
  font-size:16px;
  color:#888888;
  line-height:24px;
  font-weight:400;
  background:#ffffff;
  font-family: 'Lato', sans-serif;
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center top;
  -webkit-font-smoothing: antialiased;
}

  @media (min-width:1200px) {
  .container {
    max-width: 1170px;
    padding: 0px;
  }
}

.container-fluid{
  padding: 0px;
}
.auto-container{
  position:static;
  max-width:1200px;
  padding:0px 15px;
  margin:0 auto;
}

.small-container{
  max-width:680px;
  margin:0 auto;
}

.boxed_wrapper{
  position: relative;
  overflow-x: hidden;
  margin: 0 auto;
  width: 100%;
  min-width: 300px;
}


a{
  text-decoration:none;
  position: relative;
  font-size: 16px;
  font-family: 'Lato',sans-serif;
  line-height: 24px;
  font-weight: 400;
  cursor:pointer;
  color:#888888;
  transition: all 500ms ease;
}

a:hover{
  text-decoration:none;
  outline:none;
  color: #71b100;
  transition: all 500ms ease;
}

input,button,select,textarea{
  font-family: 'Lato', sans-serif;
  font-weight: 400;color: white !important;
}
select option{
  color: #000000;
}

ul,li{
  list-style:none;
  padding:0px;
  margin:0px; 
}

input{
  transition: all 500ms ease;background-color: transparent !important;
}
button:focus,
input:focus,
textarea:focus{
  outline: none;
  box-shadow: none;
  transition: all 500ms ease;
}

p{
  position: relative;
  font-size: 16px;
  font-family: 'Lato', sans-serif;
  line-height: 24px;
  font-weight: 400;
  color: #888888;
  margin-bottom: 10px;
  font-style: normal;
  transition: all 500ms ease;
}

h1,h2,h3,h4,h5,h6 {
  position:relative;
  font-family: 'Montserrat', Sans-serif;
  font-weight: 400;
  margin-bottom: 0px;
  /* color: #222222; */
  transition: all 500ms ease;
}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {
  position:relative;
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  margin-bottom: 0px;
  color: #222222;
  transition: all 500ms ease;
}

h1{
  font-size: 60px;
  line-height: 75px;
  font-weight: 700;
}

h2{
  font-size: 30px;
  line-height: 40px;
  font-weight: 600;
}
h3{
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
}
h4{
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
}
h6{
  font-size: 16px;
  line-height: 26px;
  font-weight: 500;
}


h2 a{
  font-size: 30px;
  line-height: 40px;
  font-weight: 600;
}

h3 a{
  font-size: 24px;
  line-height: 33px;
  font-weight: 500;
}
h4 a{
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
}

h3 a:hover,
h4 a:hover{
  color: #71b100;
}

.centred{
  text-align: center;
}
.sec-pad{
  padding: 94px 0px 100px 0px;
}


h2.sec-title{
  position: relative;
  margin-bottom: 6px;
  line-height: 37px;
  text-transform: capitalize; color: rgb(0, 0, 0);
}
.title-text{
  margin-bottom: 11px;
}
figure{
  margin: 0px;
}

/** room-dimension **/


.room-dimension .tab-title li{
  position: relative;
  display: inline-block;
  margin: 0px 10px;
  color: #222222;
  cursor: pointer;
}
.room-dimension .tab-title li.active{
  color: #71b100;
}
.room-dimension .tab-title{
  margin-bottom: 57px;
}
.single-tab-content h4{
  color: #71b100;
  margin-bottom: 7px;
}
.single-tab-content .text{
  color: #222222;
  margin-bottom: 28px;
}
.single-tab-content .list li{
  position: relative;
  display: inline-block;
  padding: 0px 0px 0px 25px;
  float: left;
  width: 33%;
  margin: 0px 1px 16px 0px;
}
.single-tab-content .list li:before{
  position: absolute;
  content: "\f00c";
  font-family: 'FontAwesome';
  font-size: 16px;
  color: #71b100;
  left: 0px;
  top: 0px;
}

.room-dimension .tab-details-content .content{
  position: relative;
  padding: 88px 0px 77px 0px;
}
.room-dimension .title-text{
  margin-bottom: 29px;
}

/* three */

.three{ 

  width: 100%;

}.three1{
  display: flex;
  flex-wrap: wrap;

  justify-content: space-evenly;
  
} 
.three-right{
  /* background-color: blue; */
 padding-top: 80px;width:max-content;
}
.three-left iframe {
  width: 100%;
  height: auto;
  /* background-color: #000; */
  min-height: 400px;
padding-top: 20px;
  border: 0;
}

/* Step 4: Make accordion fully responsive */
.acc-kontainer {
  width: 100%;
}

.acc-kontainer label {
  font-size: 1rem;
}

.acc-kontainer input:checked ~ .acc-body {
  font-size: 1rem;
  padding: 15px;
}


#three-head{
  color:#fff;
  text-align:center;
}
/*--------Accordion-------*/
.acc-kontainer {
  width: 100%;
  margin: auto;
}
.acc-kontainer .acc-body {
  width: 98%;
  width: calc(100% - 20px);
  margin: 0 auto;
  height: 0;
  color: rgba(0, 0, 0, 0);;
  background-color: #71b100;
  line-height: 18px;
  padding: 0 20px;
  box-sizing: border-box;
  transition: 0.5s;
}

.acc-kontainer label {
  cursor: pointer;
  /* background-color: rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1); */
    background-color: #70b10086;
  border-bottom: 1px solid  #70b10086;
  display: block;
  padding: 15px;
  width: 100%;
  color: #000000;
  font-weight: 400;
  box-sizing: border-box;
  z-index: 100;
}

.acc-kontainer input{
  display: none;
}
.acc-kontainer label:before {
  font-family: 'FontAwesome';
  content: '\f067';
  font-weight: bolder;
  float: right;
}

.acc-kontainer input:checked+label {
  background-color: #71b100;
}

.acc-kontainer input:checked+label:before {
  font-family: 'FontAwesome';
  content: '\f00d';
  transition: 0.5s;
}

.acc-kontainer input:checked~.acc-body {
  height: auto;
  color: #000000;
  font-size: 16px;
  padding: 20px;
  transition: 0.5s;
}
/* contact */

#three-head {
  text-align: center;
  margin-bottom: 30px;
  font-size: 36px;
  color: white;
}

.signupSection-con {
  background: url(https://source.unsplash.com/TV2gg2kZD1o/1600x800) no-repeat center center/cover;
  width: 90%;
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  box-shadow: 3px 10px 20px 5px rgba(0, 0, 0, .5);
  border-radius: 10px;
 
  animation: fadeInUp 1s ease-in-out;
}


/** button **/

.theme-btn {
  position: relative;
  display: inline-block;
  font-size: 16px;
  font-family: 'Lato', sans-serif;
  padding: 4px 24px 6px 24px;
  background: #71b100;
  border: 2px solid #71b100;
  color: #ffffff;
  transition: all 0.5s ease 0s;
  cursor: pointer;
  text-align: center;
  z-index: 1;
}
.theme-btn:hover{
  color: #71b100;
  background: transparent;
}

.scroll-top {
  width: 45px;
  height: 45px;
  line-height: 45px;
  position: fixed;
  bottom: 50px;
  right: 50px;
  font-size: 16px;
  border-radius: 50%;
  z-index: 99;
  display: none;
  color: #ffffff;
  text-align: center;
  cursor: pointer;
  background: #71b100;
  transition: all 500ms ease;
  -webkit-animation: pulse 1s infinite;
  -o-animation: pulse 1s infinite;
  animation: pulse 1s infinite;
}
.scroll-top:hover{
  background: #222222;
}
.scroll-top:after {
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 1;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
  background: -webkit-radial-gradient(center ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
}
.scroll-top span{
  color: #fff;
}

.about-video {
  width: 100%;
  max-width: 800px; /* optional */
  margin: 0 auto;
}

.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* for 16:9 aspect ratio */
  height: 100%;
  overflow: hidden;
  border-radius: 10px; /* optional */
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(255, 255, 255, 0.8);
  border: none;
  border-radius: 50%;
  font-size: 2rem;
  cursor: pointer;
  padding: 10px 20px;
  transition: background 0.3s ease;
}

.play-btn:hover {
  background: rgba(255, 255, 255, 1);
}



/*** 

====================================================================
                        Home-Page-One
====================================================================

***/


/** main-header **/

.main-header{
  position:relative;
  left:0px;
  top:0px;
  z-index:999;
  width:100%;
  background: transparent;
  margin-bottom: -146px;
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}
.main-header .menu-area{
  position: relative;
  background: rgba(0, 0, 0, 0.60);
  border-bottom: 3px solid #71b100;
  margin-top: 63px;
}
.top-logo{
  position: relative;
  display: inline-block;
  background: #ffffff;
  padding: 20px 20px 20px 20px;
 border-radius: 50%;
  
  margin-bottom: 1px;
}
.sticky-header{
  position:fixed;
  opacity:0;
  visibility:hidden;
  left:0px;
  top:0px;
  width:100%;
  background:#71b100;
  z-index:0;
  box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.40);
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}

.fixed-header .sticky-header{
  z-index:999;
  opacity:1;
  visibility:visible;
  -ms-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  -op-animation-name: fadeInDown;
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -ms-animation-duration: 500ms;
  -moz-animation-duration: 500ms;
  -op-animation-duration: 500ms;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -ms-animation-timing-function: linear;
  -moz-animation-timing-function: linear;
  -op-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -ms-animation-iteration-count: 1;
  -moz-animation-iteration-count: 1;
  -op-animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
.main-header .logo-box{
  position: relative;
  display: inline-block;
  background: #71b100;
  padding: 44px 68px 32px 75px;
  margin: 0px 0px 0px 0px;
}
.main-header .logo-box a{
  position: relative;display: inline-block;
}

/* Zoomin image */
.img-container {
  position: relative;
  display: inline-block;
}
.zoomable {
  cursor: pointer;
  transition: transform 0.3s ease;
  -webkit-transition: -webkit-transform 0.3s ease;
}
/* .zoomable {


  cursor: pointer;
  transition: transform 0.3s ease;
} */

.zoom-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  cursor: grab;
}

.zoom-overlay img {
  max-width: 100%;
  
  transition: transform 0.3s ease;
}
/* ---------------- Base Style ---------------- */
.top-nav {
  background-color: #71b100;
  width: 100%;
  color: white;
  padding: 5px 20px;
  box-sizing: border-box;
}

.top-nav .location-social {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 30px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.top-nav .location-social li a {
  display: flex;
  align-items: center;
  color: #fff;
  font-size: 15px;
  text-decoration: none;
  transition: 0.3s;
}

.top-nav .location-social li a i {
  margin-right: 8px;
  font-size: 16px;
}

.top-nav .location-social li a:hover {
  color: #000;
}

/* ---------------- Responsive ---------------- */

/* Tablets (≤ 992px) */
@media (max-width: 992px) {
  .top-nav .location-social {
    justify-content: center;
    gap: 20px;
  }

  .top-nav .location-social li a {
    font-size: 14px;
  }
}

/* Mobiles (≤ 768px) */
@media (max-width: 768px) {
  .top-nav {
    text-align: center;
    height: auto;
    padding: 8px 10px;
  }

  .top-nav .location-social {
    flex-direction: column;
    justify-content: center;
    gap: 8px;
  }

  .top-nav .location-social li a {
    font-size: 14px;
  }

  .top-nav .location-social li a i {
    font-size: 15px;
  }
}

/* Small Mobiles (≤ 480px) */
@media (max-width: 480px) {
  .top-nav {
    padding: 10px 5px;
  }

  .top-nav .location-social {
    flex-direction: column;
    gap: 6px;
  }

  .top-nav .location-social li a {
    font-size: 13px;
  }

  .top-nav .location-social li a i {
    font-size: 14px;
  }
}

/* ------------------------------
   MAIN SLIDER (Desktop Default)
-------------------------------*/
/* Main Slider Section */
.main-slider {
  background: linear-gradient(rgba(0, 0, 0, 0.285), rgba(0, 0, 0, 0.091)),
              url(../images/layout-Features.webp) center center / cover no-repeat;
  width: 100%;
  min-height: 100vh; /* Full screen height for any device */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff !important;
  padding: 20px;
  animation: bgFadeIn 1.5s ease-out forwards;
}

.home-content {
  background-color: #00000040;
  width: fit-content;
  margin: 15px auto;
  padding: 10px 18px;
  border-radius: 15px;
  color: #fff;
}

#home-head {
  color: white;
  font-size: 36px;
  line-height: 1.3;
  margin-bottom: 10px;
}

/* Contact Form */
.contact-form {
  background-color: rgba(0, 0, 0, 0.55);
  padding: 30px;
  border-radius: 15px;
  width: 450px;   /* desktop default */
  max-width: 100%; /* auto shrink on smaller screens */
  margin: 20px auto;
  box-sizing: border-box;
}
.form-group {
  margin-top: 3px;
}

.form-group input,
.form-group textarea,
.form-group select {
  width: 100%;
  background-color: transparent;
  border: none;
  border-bottom: 2px solid #ccc;
  color: #fff !important;
  font-size: 15px;
  box-sizing: border-box;
  padding: 8px 5px;
}

.form-group textarea {
  resize: none;
  height: 80px;
}

label {
  display: block;
  text-align: left;
  margin-bottom: 3px;
  font-size: 14px;
  color: #eee;
}

/* Button */
.form-footer {
  margin-top: 25px;
}

.form-footer button {
  background-color: #71b100;
  color: white;
  padding: 12px 20px;
  border-radius: 5px;
  font-size: 16px;
  border: none;
  cursor: pointer;
  transition: 0.3s;
  width: 100%;
}

.form-footer button:hover {
  background-color: #5a8c00;
}
/* contact page */
.form-footer-con {
  margin-top: 25px;display: flex;
  flex-direction: row;gap: 20px;
}

.form-footer-con button {
  background-color: #71b100;
  color: white;
  padding: 12px 20px;
  border-radius: 5px;
  font-size: 16px;
  border: none;
  cursor: pointer;
  transition: 0.3s;
  width: 100%;
  margin-bottom: 20px;
}

.form-footer-con button:hover {
  background-color: #5a8c00;
}
.contact-form .title{
   font-size: 26px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  color: #ffffff;
  text-transform: uppercase;
  margin-bottom: 20px;text-align: center;
}
.call-btn a{
  color: white !important; font-size: 14px;
}
form button {
  background-color: #71b100;
  color: white;
  padding: 12px 20px;
  border-radius: 5px;
  font-size: 16px;
  border: none;
  cursor: pointer;
  transition: 0.3s;
  width: 100%;
}
/*  about- Video */

.about-video {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 70vh;
  padding: 20px;
}

.video-container {
  width: 70%;
  height: 500px;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(236, 236, 236, 0.1);
}

.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */
  height: 0;
  overflow: hidden;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ---------------- Responsive for Contact Page ---------------- */



/* Tablets (≤1024px) */
@media (max-width: 1024px) {
  .contact-section {
    padding: 50px 15px;
  }

  .contact-form {
    width: 100%;
    margin: 200px auto;
  }

  .form-footer-con {
    flex-direction: column;
    gap: 15px;
  }

  .form-footer-con button {
    width: 100%;
    font-size: 15px;
  }

  .contact-form .title {
    font-size: 24px;
  }
}

/* Mobile Devices (≤768px) */
@media (max-width: 768px) {
  .contact-section {
    padding: 40px 10px;
  }

  .contact-form {
    width: 100%;margin: 100px auto;
  }.video-container {
  width: 90%;
  height: 260px;
}


  .contact-form .title {
    font-size: 22px;
    margin-bottom: 15px;
  }

  .form-group label {
    font-size: 14px;
  }

  .form-group input {
    width: 100%;
    padding: 10px;
    font-size: 14px;
  }

  .form-footer-con {
    flex-direction: column;
    gap: 12px;
  }

  .form-footer-con button {
    font-size: 15px;
    padding: 12px 15px;
    width: 100%;
  }

  .call-btn a {
    display: inline-block;
    font-size: 14px;
  }
}

/* Small Mobile Devices (≤480px) */
@media (max-width: 480px) {
  .contact-section {
    padding: 20px 20px;
  }

  .contact-form .title {
    font-size: 20px;
  }

  .form-group label {
    font-size: 13px;
  }

  .form-group input {
    font-size: 13px;
    padding: 8px;
  }

  .form-footer-con button {
    font-size: 14px;
    padding: 10px;
  }

  .call-btn a {
    font-size: 13px;
  }
  .contact-form {
    width: 100%;margin: 10px auto;
  }
}

/* ---------------- RESPONSIVE BREAKPOINTS ---------------- */

/* Tablets (≤ 992px) */
@media (max-width: 992px) {
  #home-head {
    font-size: 28px;
  }

  .main-slider .title {
    font-size: 22px;
  }

  .contact-form {
   
    padding: 25px;
  margin: 160px auto;
    width: 90%;
  
  }
}

/* Mobiles (≤ 768px) */
@media (max-width: 768px) {
  #home-head {
    font-size: 24px;
  }

  h2 {
    font-size: 18px;
  }

  .contact-form {
    width: 90%;
    padding: 20px;
  }

  .form-footer button {
    font-size: 15px;
    padding: 10px;display: flex;
    flex-direction: column;
  }
}

/* Small Mobiles (≤ 480px) */
@media (max-width: 480px) {
  .main-slider {
    padding: 15px;
  }

  #home-head {
    font-size: 20px;
  }

  h2 {
    font-size: 16px;
  }

  .contact-form {
    width: 100%;
    padding: 15px;
  }

  .form-group input,
  .form-group textarea,
  .form-group select {
    font-size: 14px;
    padding: 6px;
  }

  .form-footer button {
    font-size: 14px;
    padding: 8px;
  }
}

/* ------------------------------
   RESPONSIVE STYLES
-------------------------------*/

/* Tablets - 1024px */
@media (max-width: 1024px) {
  .main-slider {
    height: 600px;
  }
  .contact-form {
    width: 70%;
    padding: 40px;
  }
  .main-slider .title {
    font-size: 26px;
  }
}

/* Medium devices - 768px */
@media (max-width: 768px) {
  .main-slider {
    height: auto;
    padding: 40px 20px;
  }
  .contact-form {
    width: 85%;
    padding: 30px;
  }
  .main-slider .title {
    font-size: 22px;
    line-height: 26px;
  }
  .form-group input,
  .form-group select,
  .form-group textarea {
    font-size: 14px;
  }
  .form-footer button {
    width: 100%;
  }
}

/* Small devices - 480px */
@media (max-width: 480px) {
  .main-slider {
    height: auto;
    padding: 20px;
  }
  .contact-form {
    width: 100%;
    padding: 20px;
    border-radius: 12px;
  }
  .main-slider .title {
    font-size: 18px;
  }
  .form-group input,
  .form-group select,
  .form-group textarea {
    font-size: 13px;
    padding: 6px 4px;
  }
  .form-footer button {
    font-size: 14px;
    padding: 10px;
  }
}

/** intro-section **/
.intro-section{
  padding: 50px 0px 11px 0px;
}
.intro-section .single-item{
  position: relative;
  display: inline-block;
  float: left;
  width: 20%;
  margin-bottom: 40px;
}
.intro-section .intro-content{
  position: relative;
  margin-right: -75px;
}
.intro-section .single-item .content-box{
  position: relative;
  padding: 21px 10px 24px 10px;
  width: 170px;
  border: 1px solid #f7f7f7;
  text-align: center;
  transition: all 500ms ease;
}
.intro-section .single-item .content-box:hover{
  background: #f7f7f7;
}
.intro-section .single-item .number{
  position: relative;
  font-size: 24px;
  line-height: 30px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  color: #222;
  margin-bottom: 23px;
}
.intro-section .single-item .icon-box{
  position: relative;
  margin-bottom: 15px;
}
.intro-section .single-item .icon-box i:before{
  font-size: 36px;
  color: #71b100;
  margin: 0px;
}
/** about-section **/

.about-section{
  padding: 20px 0px 100px 0px;
 
}
.about-section .about-content h2{
  margin-bottom: 17px;color: #000000;
}
.about-section .about-content p{
  margin-bottom: 21px;
}
.about-section .about-image{
  position: relative;
  margin-top: 30px;
}
.about-section .about-image .img-box{
  position: relative;
  border: 5px solid #ebebeb;
}
.about-section .about-image .img-box img{
  width: 100%;
}


/** features-section **/

.features-section{
  position: relative;
}
.features-section .img-box{
  position: relative;
  margin-right: 50px;
}
.features-section .img-box img{
 max-width: none;
 float: right;
}
.features-section .features-content{
  position: relative;
  margin-left: 35px;
  padding: 126px 0px 108px 0px;
}
.features-section .features-content h2{
  margin-bottom: 7px;color: #000000;
}
.features-section .features-content .text{
  margin-bottom: 22px;
}
.features-section .features-content .list li{
  position: relative;
  display: inline-block;
  float: left;
  padding: 0px 0px 0px 25px;
  width: 33%;
  margin-bottom: 16px;
}
.features-section .features-content .list li:before{
  position: absolute;
  content: "\f00c";
  font-family: 'FontAwesome';
  font-size: 16px;
  color: #71b100;
  left: 0px;
  top: 0px;
}


/** gallery-section **/

.gallery-section{
  padding: 93px 0px 85px 0px;
}
.gallery-section h2.sec-title{
  margin-bottom: 1px;
}
.default-portfolio-item{
  display: inline-block;
  padding: 0px 10px;
}
.gallery-section .overlay-box {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  border: 30px solid transparent;
  color: #ffffff;
  text-align: center;
  opacity: 0;
  transition: all 700ms ease;
  -webkit-transition: all 700ms ease;
  -ms-transition: all 700ms ease;
  -o-transition: all 700ms ease;
  -moz-transition: all 700ms ease;
}

.gallery-section .single-item:hover .overlay-box {
  opacity: 1;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  -moz-transform: translateY(0px);
  transform: translateY(0px);
}

.gallery-section .overlay-inner {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  display: table;
  padding: 15px;
  vertical-align: middle;
  background: rgba(113, 177, 0, 0.70);
}
.gallery-section .overlay-content {
  position: relative;
  display: table-cell;
  vertical-align: middle;
}
.gallery-section .overlay-content h4 a{
  display: inline-block;
  color: #ffffff;
}
.gallery-section .single-item{
  margin-bottom: 15px;
}
.gallery-section .single-item{
  position: relative;
  display: block;
  overflow: hidden;
}
.gallery-section .single-item .img-box{
  position: relative;
  overflow: hidden;
  border: 5px solid #f0f0f0;
}
.gallery-section .single-item img{
  width: 100%;
}
.gallery-section .filter-tabs{
  margin-bottom: 44px;
}
.gallery-section .filter-tabs li{
  position: relative;
  display: inline-block;
  margin: 0px 13px;
  cursor: pointer;
  transition: all 500ms ease;
}
.gallery-section .filter-tabs li.active{
  color: #71b100;
}


/** highlights-section **/

.highlights-section{
  position: relative;
}
.highlights-section .img-box img{
  max-width: none;
  float: left;
}.highlights-section .img-box {
  max-width: none;
  float: left;border: 5px solid black;
}
.highlights-section .highlights-content{
  position: relative;
  padding: 97px 0px 76px 0px;
}
.highlights-section .highlights-content h3{
  margin-bottom: 7px;
}
.highlights-section .highlights-content .text{
  margin-bottom: 17px;
}
.highlights-section .highlights-content .single-item h4 a{
  display: inline-block;
  color: #71b100;
  margin-bottom: 8px;
}
.highlights-section .highlights-content .single-item h4 a:hover{
  color: #222222;
}
.highlights-section .highlights-content .single-item .text{
  margin-bottom: 13px;
}
.highlights-section .highlights-content .single-item{
  position: relative;
  margin-bottom: 14px;
  display: inline-block;
  transition: all 500ms ease;
}

/** room-dimension **/


.room-dimension .tab-title li{
  position: relative;
  display: inline-block;
  margin: 0px 10px;
  color: #222222;
  cursor: pointer;
}
.room-dimension .tab-title li.active{
  color: #71b100;
}
.room-dimension .tab-title{
  margin-bottom: 27px;
}
.single-tab-content h4{
  color: #71b100;
  margin-bottom: 7px;
}
.single-tab-content .text{
  color: #222222;
  margin-bottom: 28px;
}
.single-tab-content .list li{
  position: relative;
  display: inline-block;
  padding: 0px 0px 0px 25px;
  float: left;
  width: 33%;
  margin: 0px 1px 16px 0px;
}
.single-tab-content .list li:before{
  position: absolute;
  content: "\f00c";
  font-family: 'FontAwesome';
  font-size: 16px;
  color: #71b100;
  left: 0px;
  top: 0px;
}
.room-dimension .img-box{
  position: relative;
  margin-right: 16px;
}
.room-dimension .img-box img{
  width: 100%;
}
.room-dimension .tab-details-content .content{
  position: relative;
  padding: 88px 0px 77px 0px;
}
.room-dimension .title-text{
  margin-bottom: 29px;color: rgb(29, 29, 29);
}

/** apartment-section **/

/* Apartment Section */
.apartment-section {
  position: relative;
  width: 100%;
  padding: 60px 0;
  background: linear-gradient(rgba(238, 238, 238, 0.7), rgba(177, 177, 177, 0.085)),
              url(../images/layout-Features.webp) center center / cover no-repeat;
  background-size: cover;
  background-position: center;
}

.apartment-section .title-text {
  margin-bottom: 40px;
  color: #000;
  font-size: 1.1rem;
}

.apartment-section .single-item {
  position: relative;
  display: block;
  background: rgba(0, 0, 0, 0.8);
  padding: 30px 25px;
  color: #fff;
  margin-bottom: 30px;
  border-radius: 10px;
  transition: all 0.4s ease;
}

.apartment-section .single-item:hover {
  background: #000;
}

.apartment-section .single-item h4 a {
  display: inline-block;
  color: #71b100;
  margin-bottom: 10px;
  font-size: 1.2rem;
}

.apartment-section .single-item h4 a:hover {
  color: #fff;
}

.apartment-section .single-item .icon-box {
  text-align: right;
  margin-bottom: 10px;
}

.apartment-section .single-item .icon-box i:before {
  font-size: 40px;
  color: #fff;
  transition: all 0.4s ease;
}

.apartment-section .single-item:hover .icon-box i:before {
  color: #71b100;
}

/* ----------------- Responsive ----------------- */
@media (max-width: 992px) {
  .apartment-section {
    padding: 50px 20px;
  }

  .apartment-section .title-text {
    font-size: 1rem;
    margin-bottom: 30px;
  }

  .apartment-section .single-item {
    padding: 25px 20px;
  }

  .apartment-section .single-item h4 a {
    font-size: 1.1rem;
  }

  .apartment-section .single-item .icon-box i:before {
    font-size: 35px;
  }
}

@media (max-width: 768px) {
  .apartment-section {
    padding: 40px 15px;
  }

  .apartment-section h2.sec-title {
    font-size: 1.5rem;
  }

  .apartment-section .single-item {
    padding: 20px;
    text-align: center;
  }

  .apartment-section .single-item .icon-box {
    text-align: center;
    margin-bottom: 15px;
  }
}

@media (max-width: 480px) {
  .apartment-section {
    padding: 30px 10px;
  }

  .apartment-section h2.sec-title {
    font-size: 1.3rem;
  }

  .apartment-section .title-text {
    font-size: 0.9rem;
  }

  .apartment-section .single-item {
    padding: 15px;
  }

  .apartment-section .single-item h4 a {
    font-size: 1rem;
  }

  .apartment-section .single-item .icon-box i:before {
    font-size: 30px;
  }
}

/** main-footer **/
.main-footer{
  position: relative;
  width: 100%;
  color: #ababab;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 73px 0px 0px 0px;
}
.main-footer:before{
  position: absolute;
  content: '';
  background: rgba(0, 0, 0, 0.90);
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px;
}
.main-footer .footer-top{
  position: relative;
  padding-bottom: 60px;
  border-bottom: 1px solid #2b2a28;
}
.main-footer .logo-widget .footer-logo{
  position: relative;
  display: inline-block;
  background: #ffffff;
  padding: 19px 37px 20px 37px;
  margin-top: -60px;
  top: -13px;
  margin-bottom: 1px;
}
.main-footer .logo-widget .footer-logo img{
width: 120px;
}
.main-footer .logo-widget .text{
  margin-bottom: 29px;
}
.main-footer .logo-widget .footer-social{
  
  display: flex;
  margin-bottom: 30px;
}
.main-footer .logo-widget .location-social li{
  position: relative;
  display: inline-block;
  margin-bottom: 30px;
}
.main-footer .logo-widget .footer-social li:last-child{
  margin-right: 0px;
}
.main-footer .logo-widget .footer-social li a{
  display: inline-block;
  font-size: 15px;
  color: #bcbcbc;
}.footer-social li a i{
 font-size: 16px;
 
}
/*  */
.main-footer .logo-widget .location-social li {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  font-size: 14px;
}
.main-footer .logo-widget .location-social li i {
  margin-right: 8px;
}
.main-footer .footer-social {
  display: flex;
  gap: 10px;
  margin-bottom: 30px;
}
.main-footer .footer-social li a {
  display: inline-block;
  font-size: 19px;
  color: #bcbcbc;
  transition: color 0.3s ease;
}
.main-footer .footer-social li a:hover {
  color: #71b100;
}
.main-footer .footer-title {
  position: relative;
  margin-bottom: 30px;margin-left: 17px;
}
/*  */
.main-footer .logo-widget .footer-social li a:hover{
  color: #71b100;
}
.main-footer .footer-title{
  position: relative;
  margin-bottom: 44px;
}
.main-footer .footer-title:before{
  position: absolute;
  content: '';
  background: #71b100;
  width: 36px;
  height: 1px;
  left: 0px;
  bottom: -11px;
}
.main-footer .footer-title h4{
  color: #ffffff;
}
.main-footer .twitter-widget .single-item{
  position: relative;
  padding: 0px 0px 0px 27px;
  margin-bottom: 23px;
  color: #ffffff;
}
.main-footer .twitter-widget .single-item .icon-box{
  position: absolute;
  left: 0px;
  top: 0px;
}
.main-footer .twitter-widget .single-item .icon-box i:before{
  color: #71b100;
  font-size: 15px;
}
.main-footer .twitter-widget .single-item span{
  position: relative;
  display: block;
  color: #ababab;
  margin-top: 2px;
}
.main-footer .footer-post .single-post{
  position: relative;
  padding: 10px 0px 11px 102px;
  margin-bottom: 25px;
}
.main-footer .footer-post .single-post .img-box{
  position: absolute;
  overflow: hidden;
  width: 79px;
  height: 70px;
  left: 0px;
  top: 0px;
}
.main-footer .footer-post .single-post .img-box img{
  width: 100%;
  transition: all 500ms ease;
  transform: scale(1.0);
}
.main-footer .footer-post .single-post:hover .img-box img{
  transform: scale(1.1);
}
.main-footer .footer-post .single-post .link a{
  position: relative;
  display: inline-block;
  font-size: 14px;
  font-family: 'Lato', sans-serif;
  color: #ffffff;
  margin-bottom: 0px;
}
.main-footer .footer-post .single-post .link a:hover{
  color: #71b100;
}
.main-footer .footer-post .single-post .text{
  font-size: 14px;
}
.main-footer .footer-post .footer-title{
  margin-bottom: 50px;
}
.main-footer .footer-bottom a:hover{
  color: #71b100;
}
.copyright{
  color: #624444 !important;
}
.footer-links{
  color: white !important;
}.footer-bottom .container .copyright p{
  color: white;
}
/* 
Offer image -Model
*/

modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  animation: fadeInBg 0.4s ease-in;
}

/* Modal Content */
.modal-content {
  background: #fff;
  margin: 5% auto;
  padding: 10px 15px;
  border-radius: 14px;
  max-width: 850px;
  position: relative;
  animation: slideUp 0.5s ease-out;
  width: 90%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

/* Close button */
.close {
  position: absolute;
  top: 15px;
  right: 20px;
  font-size: 24px;
  color: #333;
  cursor: pointer;
}

/* Animations */
@keyframes slideUp {
  from {
    transform: translateY(30px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fadeInBg {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}


/*** 

====================================================================
                        Contact-Page
====================================================================

***/
.contact-section{
  background-image: url(../images/layout-Features.webp);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;height: 100vh;
}
.contact-section .contact-info .title{
  margin-bottom: 23px;
}

/* Whatapp icon */
/* whatapp icon */

    .whatsapp-btn {
      position: fixed;
      bottom: 30%;
      right: 15px;
      width: 60px;
      height: 60px;
      background: #ffffff;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 4px 15px rgba(0,0,0,0.2);
      cursor: pointer;
      animation: pulse 2s infinite, float 4s ease-in-out infinite;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      z-index: 999;
    }

    .whatsapp-btn img {
      width: 60px;
      height: 60px;
    }

    .whatsapp-btn:hover {
      transform: scale(1.15);
      box-shadow: 0 6px 20px rgba(0,0,0,0.3);
    }

    /* Pulse glow effect */
    @keyframes pulse {
      0% { box-shadow: 0 0 0 0 rgba(32, 195, 92, 0.6); }
      70% { box-shadow: 0 0 0 20px rgba(37, 211, 102, 0); }
      100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
    }

    /* Floating up and down */
    @keyframes float {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-10px); }
    }

    /* thank you */

        .thankyou-full {
      background: linear-gradient(135deg, #71b100, #a1d95a);
      height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
      overflow: hidden;
      color: #fff;
    }

    /* ===== ANIMATED CONTAINER ===== */
    .thankyou-container {
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(10px);
      border: 2px solid rgba(255, 255, 255, 0.2);
      border-radius: 20px;
      text-align: center;
      padding: 50px 30px;
      width: 90%;
      max-width: 450px;
      animation: fadeIn 1s ease-in-out;
      position: relative;
    }

    /* ===== CHECK ICON ===== */
    .thankyou-container .checkmark {
      font-size: 70px;
      background: #fff;
      color: #71b100;
      border-radius: 50%;
      width: 90px;
      height: 90px;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 auto 20px;
      box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
      animation: pop 0.5s ease-in-out forwards;
    }

    /* ===== TEXT ANIMATION ===== */
   .thankyou-container h1 {
      font-size: 32px;
      margin-bottom: 10px;
      animation: slideUp 1s ease forwards;
    }

   .thankyou-container p {
      font-size: 16px;
      color: #f9f9f9;
      line-height: 1.6;
      animation: slideUp 1.5s ease forwards;
    }

    /* ===== BUTTON ===== */
   .thankyou-container .btn-home {
      display: inline-block;
      margin-top: 25px;
      padding: 12px 25px;
      background: #fff;
      color: #71b100;
      font-weight: 600;
      border-radius: 30px;
      text-decoration: none;
      transition: all 0.3s ease;
      animation: fadeIn 2s ease forwards;
    }

   .thankyou-container .btn-home:hover {
      background: #71b100;
      color: #fff;
      box-shadow: 0 0 15px rgba(255, 255, 255, 0.5);
    }

    /* ===== FLOATING ANIMATION ELEMENTS ===== */
    .bubble {
      position: absolute;
      bottom: -50px;
      background: rgba(255, 255, 255, 0.2);
      border-radius: 50%;
      animation: rise 10s infinite ease-in;
    }

    .bubble:nth-child(1) { width: 40px; height: 40px; left: 25%; animation-delay: 0s; }
    .bubble:nth-child(2) { width: 60px; height: 60px; left: 70%; animation-delay: 2s; }
    .bubble:nth-child(3) { width: 20px; height: 20px; left: 50%; animation-delay: 4s; }
    .bubble:nth-child(4) { width: 80px; height: 80px; left: 85%; animation-delay: 1s; }
    .bubble:nth-child(5) { width: 50px; height: 50px; left: 10%; animation-delay: 3s; }

    /* ===== KEYFRAMES ===== */
    @keyframes fadeIn {
      from { opacity: 0; transform: scale(0.95); }
      to { opacity: 1; transform: scale(1); }
    }

    @keyframes pop {
      0% { transform: scale(0); }
      80% { transform: scale(1.2); }
      100% { transform: scale(1); }
    }

    @keyframes slideUp {
      0% { opacity: 0; transform: translateY(40px); }
      100% { opacity: 1; transform: translateY(0); }
    }

    @keyframes rise {
      0% { transform: translateY(0) scale(1); opacity: 0.8; }
      100% { transform: translateY(-800px) scale(1.5); opacity: 0; }
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 600px) {
     .thankyou-container h1 { font-size: 26px; }
     .thankyou-container p { font-size: 14px; }
      .checkmark { font-size: 55px; width: 70px; height: 70px; }
    }

    /* contact */
    /* .header {
  background-color: #71b100;
  color: white;
  padding: 15px 0;
}

.header h1 {
  margin: 0;
  padding-left: 20px;
  font-size: 2rem;
}

.header nav {
  margin-top: 5px;
  padding-left: 20px;
}

.header nav a {
  color: white;
  text-decoration: none;
  margin-right: 15px;
  font-size: 1rem;
}

.header nav a:hover {
  text-decoration: underline;
} */