@import url(https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&display=swap);

@import url(https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200..1000;1,200..1000&display=swap);



.navbar-container .navlogo .logo,

body {

  -webkit-transition: .45s;

  -o-transition: .45s

}



.lenis.lenis-stopped,

body.loading {

  overflow: hidden

}



h1,

h2,

h3,

h4,

h5,

h6,

p,

ul {

  margin-bottom: 0 !important

}



.form-loader-wrapper,

.line.light {

  background-color: var(--light)

}



.cormorant-garamond,

.mulish {

  font-weight: 400;

  font-style: normal

}



#footer .rising-logo,

.amenity-item,

.ban-title,

.head-text {

  text-align: center

}



.ban-title,

.offcanvas-link,

.other-description,

.section-subtitle,

.section-title,

.sub-title {

  text-transform: capitalize

}



.accordion-container,

section.secton-thankyou {

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal

}



.accordion-button,

.ban-title,

.cormorant-garamond,

.footer__info-address,

.mulish,

.other-description,

.section-subtitle,

.section-title {

  font-style: normal

}



.interest__list,

.middle-ft ul,

li,

ul {

  list-style: none

}



.cormorant-garamond {

  font-family: "Cormorant Garamond", serif;

  font-optical-sizing: auto

}



.mulish {

  font-family: Mulish, sans-serif;

  font-optical-sizing: auto

}



.gallery .overtext,

.offcanvas-link,

.sub-title {

  font-family: var(--font-cormorant)

}



@font-face {

  font-family: radikal;

  src: url("../assets/fonts/Nootype-RadikalLight.otf")

}



*,

::after,

::before {

  margin: 0;

  padding: 0;

  -webkit-box-sizing: border-box;

  box-sizing: border-box

}



:root {

  --white: #ffffff;

  --black: #000000;

  --primary: #000;

  --mulish: "Mulish", sans-serif;

  --radikal: "radikal";

  --font-cormorant: "Cormorant Garamond", serif;

  --color: #f8da8f;

  --color-3: transparent;

  --radius-full: 100px

}



html {

  scroll-behavior: smooth !important;

  overflow-x: hidden

}



html.lenis,

html.lenis body {

  height: auto

}



.lenis.lenis-smooth {

  scroll-behavior: auto !important

}



.lenis.lenis-smooth [data-lenis-prevent] {

  overscroll-behavior: contain

}



body {

  overflow-x: hidden !important;

  transition: .45s;

  padding-right: 0 !important;

  background: var(--white);

  font-family: var(--mulish)

}



body::-webkit-scrollbar-track {

  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);

  border-radius: 10px;

  background-color: #ffffff00

}



body::-webkit-scrollbar {

  width: 9px;

  background-color: #ffffff00

}



body::-webkit-scrollbar-thumb {

  border-radius: 10px;

  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .2);

  background-color: #cfcfcf

}



body.loading {

  width: 100%;

  height: 100vh;

  -webkit-transition: .5s;

  -o-transition: .5s;

  transition: .5s

}



body.loaded {

  -webkit-animation: 3s ease-out forwards fadeIn;

  animation: 3s ease-out forwards fadeIn;

  -webkit-transition: .5s;

  -o-transition: .5s;

  transition: .5s

}



header,

header.dropped {

  -webkit-transition: .4s;

  -o-transition: .4s;

  width: 100vw;

  top: 0

}



.overviewFormWrap {

  width: 80%;

  box-shadow: rgba(0, 0, 0, .24) 0 3px 8px;

  padding: 20px;

  border-radius: 10px

}



.btn-enquire,

.form-loader-wrapper {

  width: -webkit-max-content;

  width: -moz-max-content

}



.form-loader,

.mobile-fixed-button,

.navbar-container .menu,

.offcanvas-nav:last-child .offcanvas-link::after {

  display: none

}



.form-loader-wrapper {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: .5rem;

  width: max-content;

  border: 2px solid var(--white);

  margin: auto;

  padding: .45rem .75rem .3rem;

  border-radius: 4px

}



.line,

nav.dropped {

  background-color: var(--primary)

}



.form-loader-wrapper .loader-txt {

  color: var(--white);

  font-size: 1rem;

  font-weight: 500

}



.f-loader {

  width: 25px;

  height: 25px;

  border: 3px solid var(--white);

  border-bottom-color: transparent;

  border-radius: 50%;

  display: inline-block;

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  -webkit-animation: .75s linear infinite rotation;

  animation: .75s linear infinite rotation

}



@-webkit-keyframes rotation {

  0% {

    -webkit-transform: rotate(0);

    transform: rotate(0)

  }



  100% {

    -webkit-transform: rotate(360deg);

    transform: rotate(360deg)

  }

}



@keyframes rotation {

  0% {

    -webkit-transform: rotate(0);

    transform: rotate(0)

  }



  100% {

    -webkit-transform: rotate(360deg);

    transform: rotate(360deg)

  }

}



.compensate-for-scrollbar {

  margin-right: 0

}



ul {

  padding-left: 0 !important;

  padding: 0;

  margin: 0

}



li {

  text-decoration: none

}



.form-calltxt a,

a {

  text-decoration: none !important

}



.text-balance {

  text-wrap: balance

}



.text-pretty {

  text-wrap: pretty

}



button:disabled {

  opacity: .4;

  cursor: not-allowed

}



#kenytChatBubble.style1 {

  bottom: 8% !important

}



.line {

  border-radius: 100px;

  bottom: 15px

}



.line.about-line {

  bottom: unset

}



.offcanvas.offcanvas-start,

header {

  background: var(--white)

}



header {

  position: fixed;

  transition: .4s;

  left: 50%;

  transform: translate(-50%, 0);

  z-index: 999

}



header.dropped {

  transition: .4s

}



nav {

  -webkit-transition: .4s;

  -o-transition: .4s;

  transition: .4s;

  padding: .85rem 4rem

}



.navbar-container {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-evenly;

  -webkit-transition: .35s;

  -o-transition: .35s;

  transition: .35s;

  -webkit-box-align: center;

  -ms-flex-align: center;

  gap: 1rem;

  align-items: center

}



.navbar-container .navlogo {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-transition: .35s;

  -o-transition: .35s;

  transition: .35s;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 5rem

}



.logo,

.navbar-container .navbar-links {

  display: -webkit-box;

  display: -ms-flexbox

}



.navbar-container .navlogo .logo {

  transition: .45s;

  -o-object-fit: cover;

  object-fit: cover

}



nav.dropped .navbar-container .navlogo .logo {

  width: 100px;

  -webkit-transition: .45s;

  -o-transition: .45s;

  transition: .45s;

  -o-object-fit: cover;

  object-fit: cover

}



.logo {

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  height: 60px

}



.logo-img.logo-img-1 {

  -webkit-transition: 1s;

  -o-transition: 1s;

  transition: 1s;

  width: 80px;

  max-width: 100%;

  position: relative

}



.logo-img.logo-img-1::after {

  content: "";

  position: absolute;

  width: 1px;

  top: 0;

  right: -41px;

  height: 100%;

  background-color: var(--white)

}



.accordion-body,

.accordion-item,

.btn-primary,

.carousel-inner img,

.customcon2,

.gal-carousel .owl-item:not(.active.center) .gal_image,

.gal_image,

.location,

.mobile-input-div,

.nav-tabs .nav-link.active,

.offcanvas-link,

.relative {

  position: relative

}



.logo-img.logo-img-2 {

  -webkit-transition: 1s;

  -o-transition: 1s;

  transition: 1s;

  width: 55px;

  max-width: 100%

}



.btn-enquire .icon img,

.download-btn .icon img,

.logo img {

  width: 100%;

  height: 100%;

  -o-object-fit: contain;

  object-fit: contain

}



.mob-logo {

  width: 230px;

  -o-object-fit: contain;

  object-fit: contain

}



.navbar-container .navbar-links {

  display: flex;

  gap: 3rem;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center

}



.navbar-container .navbar-links .navbar-link .nav-link {

  color: #000;

  font-size: 19px;

  line-height: normal;

  font-style: normal;

  font-family: var(--radikal);

  font-weight: 400;

  text-wrap: nowrap;

  text-transform: capitalize

}



.offcanvas-body {

  padding: 2rem 1.5rem;

  background-color: var(--white);

  height: 100%;

  overflow-y: auto

}



.offcanvas-navs {

  display: flex;

  flex-direction: column;

  gap: 2rem;

  margin-top: 2rem

}



.offcanvas-link {

  display: block;

  font-size: 1.6rem;

  font-weight: 600;

  color: var(--primary);

  padding-bottom: .5rem;

  transition: .3s

}



.offcanvas-link:hover {

  color: var(--primary)

}



.offcanvas-link::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 1px;

  background-color: var(--primary);

  left: 0;

  bottom: 0

}



.btn-primary {

      color: #000;

    border: none;

    border-radius: 20px;

    outline: 0;

    display: flex;

    justify-content: center;

    background: 0 0;

    align-items: center;

    gap: .5rem;

    padding: .65rem 1.25rem;

    text-wrap: nowrap;

    font-size: 1rem;

    overflow: hidden;

    transition: color .6s, border .6s;

    z-index: 1;

    margin-left: -5px;

    background: linear-gradient(#f0e4a8, #a17a31);

}



.accordion-container,

.btn-fixed {

  display: -webkit-box;

  display: -ms-flexbox

}



.btn-primary::before {

  content: "";

  position: absolute;

  inset: 0;

  z-index: -1;

  transform: translateY(0);

  transition: transform .6s

}



.btn-primary:hover::before,

.btn-submit2:hover::before,

.layout-content .btn-check:hover::before {

  transform: translateY(100%)

}



.btn-primary:hover,

.btn-submit2:hover,

.layout-content .btn-check:hover {

  color: var(--primary);

  border: 1px solid var(--primary)

}



@-webkit-keyframes pulse-effect {

  0% {

    -webkit-transform: scale(.95);

    transform: scale(.95);

    -webkit-box-shadow: 0 0 0 0 #a77d40;

    box-shadow: 0 0 0 0 #a77d40

  }



  70% {

    -webkit-transform: scale(1);

    transform: scale(1);

    -webkit-box-shadow: 0 0 0 20px rgba(0, 0, 0, .144);

    box-shadow: 0 0 0 20px rgba(0, 0, 0, .144)

  }



  100% {

    -webkit-transform: scale(.95);

    transform: scale(.95);

    -webkit-box-shadow: 0 0 0 0 transparent;

    box-shadow: 0 0 0 0 transparent

  }

}



@keyframes pulse-effect {

  0% {

    -webkit-transform: scale(.95);

    transform: scale(.95);

    -webkit-box-shadow: 0 0 0 0 #a77d40;

    box-shadow: 0 0 0 0 #a77d40

  }



  70% {

    -webkit-transform: scale(1);

    transform: scale(1);

    -webkit-box-shadow: 0 0 0 .6rem transparent;

    box-shadow: 0 0 0 .6rem transparent

  }



  100% {

    -webkit-transform: scale(.95);

    transform: scale(.95);

    -webkit-box-shadow: 0 0 0 0 transparent;

    box-shadow: 0 0 0 0 transparent

  }

}



.modal-logo {

  width: 100%;

  max-width: 100%

}



.modal-logo img {

  width: 65%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover

}



.form-control.custom-input {

  border: none;

  border-bottom: 1px solid var(--primary);

  background: 0 0;

  border-radius: 0;

  color: var(--primary)

}



.download-div,

.enquire-div {

  position: fixed;

  bottom: -50px;

  z-index: 99

}



.mobile-input-div .country-code {

  position: absolute;

  top: 7px;

  left: 2px;

  font-weight: 500;

  font-size: .9rem;

  color: var(--primary)

}



.invalid-feedback {

  margin-top: .2rem;

  font-size: .8rem

}



.form-control.custom-input.mobile-input {

  padding-left: 2.55rem

}



.form-control.custom-input:focus {

  -webkit-box-shadow: none;

  box-shadow: none

}



.modal-form .form-check-label {

  color: var(--primary);

  font-weight: 400;

  cursor: pointer;

  font-size: .875rem

}



.btn-submit {

  background: var(--primary);

  color: var(--white);

  border: none;

  border: 1px solid var(--white);

  padding: .5rem 2rem;

  margin: 1rem 0 0

}



.contact-form {

  padding: 1rem 0 .25rem

}



::-webkit-input-placeholder {

  color: var(--primary) !important

}



::-moz-placeholder {

  color: var(--primary) !important

}



:-ms-input-placeholder {

  color: var(--primary) !important

}



::-ms-input-placeholder {

  color: var(--primary) !important

}



::placeholder {

  color: var(--primary) !important

}



.modal-form ::placeholder {

  color: var(--primary) !important;

  opacity: 1

}



.modal-form input::-webkit-input-placeholder {

  color: var(--primary) !important

}



.modal-form input:-moz-placeholder {

  color: var(--primary) !important

}



.modal-form input::-moz-placeholder {

  color: var(--primary) !important

}



.modal-form input:-ms-input-placeholder {

  color: var(--primary) !important

}



.btn-fixed {

  border: none;

  outline: 0;

  border-radius: 100px;

  color: var(--white);

  display: flex;

  font-weight: 600;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: .375rem;

  padding: .55rem 1.15rem

}



.btn-enquire,

.download-btn {

  color: #000;

  padding: .6rem 1.6rem;

  background: linear-gradient(#f0e4a8, #a17a31);

  font-size: 1.15rem;

  font-weight: 500;

  gap: .375rem;

  display: flex;

  cursor: pointer

}



.enquire-div {

  right: -50px;

  -webkit-transform: scale(.8);

  -ms-transform: scale(.8);

  transform: scale(.8);

  -webkit-transition: 1.5s;

  -o-transition: 1.5s;

  transition: 1.5s

}



.download-div,

.enquire-div.show {

  -webkit-transition: 1.5s;

  -o-transition: 1.5s

}



.enquire-div.show {

  bottom: 3vw;

  transition: 1.5s;

  right: 1vw;

  -webkit-transform: scale(1);

  -ms-transform: scale(1);

  transform: scale(1);

  border: none;

  background: 0 0

}



.btn-enquire {

  width: max-content;

  border: 1px solid var(--white);

  border-radius: 10px;

  -webkit-transition: .45s;

  -o-transition: .45s;

  transition: .45s;

  -webkit-animation: 2s infinite pulse-effect;

  animation: 2s infinite pulse-effect

}



.btn-enquire .icon,

.download-btn .icon {

  width: 25px;

  height: 25px

}



.download-div {

  left: -50px;

  -webkit-transform: scale(.8);

  -ms-transform: scale(.8);

  transform: scale(.8);

  transition: 1.5s

}



.download-div.show {

  bottom: 3vw;

  -webkit-transition: 1.5s;

  -o-transition: 1.5s;

  transition: 1.5s;

  left: 1vw;

  -webkit-transform: scale(1);

  -ms-transform: scale(1);

  transform: scale(1);

  border: none;

  background: 0 0

}



.ban-text,

.btn-visit.light {

  transform: translate(-50%, -50%);

  left: 50%

}



.download-btn {

  width: -webkit-max-content;

  width: -moz-max-content;

  width: max-content;

  border-radius: 10px;

  border: none;

  -webkit-transition: .45s;

  -o-transition: .45s;

  transition: .45s;

  -webkit-animation: 2s infinite pulse-effect;

  animation: 2s infinite pulse-effect

}



.mt40 {

  margin-top: 70px

}



.main-banner {

  position: relative;

  overflow: hidden

}



.ban-text {

  position: absolute;

  bottom: 10%;

  width: 100%;

  z-index: 3

}



.ban-title {

  color: #fff;

  font-size: 3rem;

  margin: -2.25rem 0 0;

  font-weight: 400;

  padding: .5rem 0

}



.carousel-item img {

  /*animation: 15s ease-in-out infinite zoomEffect;*/

  transform-origin: center center

}



@keyframes zoomEffect {



  0%,

  100% {

    transform: scale(1)

  }



  50% {

    transform: scale(1.07)

  }

}



.btn-visit.light {

  position: absolute;

  bottom: -99%;

  border: 1px solid var(--white);

  background: var(--primary);

  gap: .45rem;

  padding: .5rem 1.25rem;

  color: #fff;

  border: none;

  display: flex;

  justify-content: center;

  align-items: center

}



.overview-container {

  width: 90%;

  margin: auto 0 auto auto

}



.custom-container {

  width: 85%;

  margin: auto

}



.sec-pad {

  padding: 4rem 0

}



.sub-title {

  color: #000;

  font-size: 3.5rem;

  font-weight: 500;

  margin-bottom: .8rem;

  line-height: 1.2

}



.amenity-label,

.highlight-carousel .text,

.other-description {

  font-size: 1rem;

  font-weight: 400

}



.sub-title.aos-animate .char {

  background: 0 0/2em 3em padding-box text #000;

  z-index: calc(var(--char-total) - var(--char-index));

  position: relative;

  -webkit-animation: 1.3s cubic-bezier(.3, 0, .3, 1) alternate forwards bg-pos;

  animation: 1.3s cubic-bezier(.3, 0, .3, 1) alternate forwards bg-pos;

  -webkit-animation-delay: calc(20ms + (30ms * var(--char-index)));

  animation-delay: calc(20ms + (30ms * var(--char-index)));

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent

}



@-webkit-keyframes bg-pos {

  0% {

    background-position: 0 0

  }



  100%,

  80% {

    background-position: -1em -1.5em

  }

}



@keyframes bg-pos {

  0% {

    background-position: 0 0

  }



  100%,

  80% {

    background-position: -1em -1.5em

  }

}



.about-img,

.loc-img,

.overview-img {

  width: 100%;

  position: relative

}



.overview-img img {

  width: 100%;

  object-fit: cover;

  height: 100%

}



.other-description {

  color: #fff;

  line-height: 2rem

}



.overview-links {

  display: flex;

  justify-content: start;

  align-items: center;

  margin: 1rem auto auto

}



.high-text {

  width: 65%;

  margin: auto;

  padding: 1rem 0

}



.highlight-carousel {

  display: flex;

  justify-content: center;

  gap: 2rem;

  margin-top: 3rem;

  flex-wrap: wrap

}



.highlight-carousel .owl-item .item {

  padding: 20px

}



.highlight-carousel .box {

  display: flex;

  flex-direction: column;

  background: linear-gradient(94deg, #fffcf6 3.13%, rgba(255, 252, 246, 0) 96.87%);

  border-radius: 1rem;

  padding: 2rem;

  align-items: center;

  box-shadow: 0 0 5px 0 rgba(0, 0, 0, .1);

  text-align: center;

  justify-content: center;

  transition: transform .3s;

  overflow: hidden

}



.highlight-carousel .box:hover {

  transform: translateY(-5px)

}



.highlight-carousel .icon {

  background-color: #f06ca9;

  width: 85px;

  height: 85px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center

}



.highlight-carousel .icon img {

  width: 40px;

  height: 40px;

  filter: brightness(0) invert(1)

}



.highlight-carousel .text {

  line-height: 1.6rem;

  color: #000;

  padding-top: 2rem;

  text-align: start

}



.owl-nav button {

  pointer-events: all;

  background: var(--primary) !important;

  width: 40px;

  height: 40px;

  border-radius: 45% !important;

  display: flex !important;

  align-items: center;

  justify-content: center

}



.amenities-carousel .owl-nav,

.gal-carousel .owl-nav,

.highlight-carousel .owl-nav {

  display: flex;

  justify-content: space-between;

  position: absolute;

  top: 50%;

  width: 100%;

  transform: translateY(-50%);

  pointer-events: none

}



.copyright,

.layout-content {

  justify-content: space-between

}



.amenities-carousel .owl-nav .owl-prev,

.gal-carousel .owl-nav .owl-prev,

.highlight-carousel .owl-nav .owl-prev {

  margin-left: -5rem

}



.amenities-carousel .owl-nav .owl-next,

.gal-carousel .owl-nav .owl-next,

.highlight-carousel .owl-nav .owl-next {

  margin-right: -5rem

}



.layout-box {

  position: relative;

  overflow: hidden;

  border-radius: 8px;

  background-color: var(--white);

  box-shadow: 0 2px 8px rgba(0, 0, 0, .05)

}



.layout-box img {

  width: 100%;

  height: auto;

  display: block

}



.layout-content {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  padding: 1.2rem 1.5rem;

  background: linear-gradient(to top, rgba(0, 0, 0, .65), transparent 80%);

  color: var(--white);

  display: flex;

  align-items: end

}



.layout-content .bhk {

  font-size: 1.25rem;

  font-weight: 600;

  margin-bottom: .456em !important

}



.layout-content .area {

  margin: 2px 0 0;

  font-size: .875rem;

  opacity: .9

}



.layout-content .btn-check {

  cursor: pointer;

  background-color: transparent;

  color: var(--white);

  padding: 8px 18px;

  font-size: .875rem;

  border-radius: 20px;

  text-decoration: none;

  position: relative;

  overflow: hidden;

  border: 1px solid transparent;

  transition: color .6s, border .6s;

  z-index: 1

}



.layout-content .btn-check::before {

  content: "";

  position: absolute;

  inset: 0;

  background-color: var(--primary);

  z-index: -1;

  transform: translateY(0);

  transition: transform .6s

}



.project-carousel {

  margin-top: 2rem

}



.btn-check {

  position: unset;

  clip: unset;

  pointer-events: unset

}



.project-carousel .owl-nav {

  display: flex;

  justify-content: center;

  gap: 20px;

  margin-top: 2rem

}



.amenities {

  width: 100%;

  position: relative;

  background: #fff

}



.amenity-item {

  padding: 1rem 0

}



.amenity-icon {

  width: 120px;

  height: 120px;

  border: 2px solid var(--primary);

  border-radius: 50%;

  background: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0 auto 5px;

  transition: .3s

}



.amenity-icon img {

  width: 67px !important;

  height: 67px

}



.about-img img,

.footer-logo img,

.loc-img img {

  width: 100%;

  height: 100%;

  object-fit: cover

}



.amenity-label {

  color: var(--black);

  margin: 0

}



.ame-cirle {

  margin: 1rem 0

}



.gallery {

  position: relative;

  margin-top: -20%

}



.justify-ext {

  justify-content: center;

  gap: 1rem

}



.nav-tabs {

  border-bottom: none !important

}



.nav-tabs .nav-item.show .nav-link,

.nav-tabs .nav-link {

  border-bottom: 0 !important

}



.nav-tabs .nav-item.show .nav-link,

.nav-tabs .nav-link.active {

  color: var(--primary) !important;

  font-size: 1.2rem;

  background-color: transparent

}



.nav-tabs .nav-link {

  border-bottom: none !important;

  font-size: 1.2rem;

  color: var(--black);

  border: none !important

}



.nav-tabs .nav-link.active::after {

  content: "";

  position: absolute;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  width: 50%;

  height: 2px;

  background-color: var(--primary) !important;

  transition: width .3s ease-in-out

}



.gal-carousel .owl-item.active.center .gal_image {

  -webkit-transform: scale(1);

  -ms-transform: scale(1);

  transform: scale(1);

  -webkit-transition: .5s;

  -o-transition: .5s;

  transition: .5s;

  position: relative

}



.gal-carousel .owl-item .gal_image {

  -webkit-transform: scale(.8);

  -ms-transform: scale(.8);

  transform: scale(.8);

  transition: .5s;

  -webkit-transition: .5s;

  -o-transition: .5s;

  position: relative

}



.gallery .overtext {

  position: absolute;

  bottom: 0;

  right: 0;

  background-color: var(--primary);

  color: #fff;

  font-size: 12px;

  padding: 5px;

  text-transform: uppercase

}



.loc-back {

  background: #dddddd2e;

  padding: 3rem 2.8rem;

  border-radius: 3rem

}



.loc-text {

  text-align: start !important

}



.accordion {

  --bs-accordion-bg: transparent !important;

  --bs-accordion-border-color: none !important;

  --bs-accordion-btn-icon-transform: rotate(0deg) !important

}



.accordion-button:not(.collapsed) {

  background-color: unset !important

}



.accordion-button:not(.collapsed)::after {

  background-image: url("../assets/images/loacation/minus.png") !important;

  transform: rotate(0)

}



.accordion-button::after {

  background-image: url("../assets/images/loacation/plus.svg") !important;

  transform: rotate(360deg);

  background-size: contain

}



.accordion-button img {

  position: absolute;

  left: 0

}



.accordion-button:focus {

  z-index: 3;

  border-color: none;

  outline: 0;

  box-shadow: none !important

}



.accordion-container {

  display: flex;

  -ms-flex-direction: column;

  flex-direction: column;

  gap: .85rem

}



.accordion-content,

.accordion-content .acc-name,

section.secton-thankyou {

  display: -webkit-box;

  display: -ms-flexbox

}



.accordion-content {

  display: flex;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 1rem

}



.accordion-content .acc-name {

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: .25rem

}



.accordion-body .distance {

  white-space: nowrap;

  padding-left: 10px

}



.accordion-body span {

  position: absolute;

  right: 22px

}



.accordion-item:last-of-type .accordion-button.collapsed {

  border-bottom-right-radius: 0 !important;

  border-bottom-left-radius: 0 !important

}



.accordion-button {

  font-size: 1.2rem !important;

  padding-left: 2% !important;

  border-bottom: 1px solid !important;

  font-weight: 600;

  line-height: 1.55rem;

  letter-spacing: .02375rem;

  position: relative;

  display: flex;

  align-items: center;

  width: 100%;

  padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);

  color: #242424 !important;

  text-align: left;

  background-color: transparent;

  border: 0;

  border-radius: 0;

  overflow-anchor: none;

  transition: var(--bs-accordion-transition)

}



.loc-cust {

  margin-top: 1%

}



.adv-text {

  font-weight: 500

}



.aboutus {

  background-image: url(../assets/images/Texture_1.webp)

}



.gap-title {

  padding-bottom: 1rem

}



.gap-title2 {

  padding-bottom: 2rem

}



.counter-section,

.newp {

  padding-top: 3rem

}



.about-img img {

  border-radius: .5rem

}



.counter-box {

  position: relative;

  padding-top: 2rem

}



.counter-box .top-line {

  content: "";

  width: 90%;

  height: 1px;

  background-color: #fff;

  position: absolute;

  top: 0;

  left: 0

}



.counter-number {

  font-size: 2.5rem;

  font-weight: 600;

  color: #fff;

  margin: 0

}



.counter-label {

  font-size: 1rem;

  margin-top: .5rem;

  color: #fff

}



.auto-update-form {

  gap: 1rem

}



.register-interest {

  background: #fff;

  position: relative

}



.adjust,

.nav-logo-wrapper {

  display: flex;

  justify-content: center;

  align-items: center

}



.section-title {

  color: #242424;

  font-size: 2.5rem;

  font-weight: 400;

  line-height: normal

}



.section-subtitle {

  color: #000;

  background-color: #fff;

  font-size: 1.25rem;

  max-width: 100%;

  margin: 1rem auto !important;

  padding: 1.5rem 0;

  font-weight: 600;

  line-height: 22.5px

}



.enclave-btn,

.marquee-banner-txt .txt,

.subtitle,

.villa__info-item--uppercase {

  text-transform: uppercase

}



.new-class {

  background: #fffcf6;

  border: 0;

  width: 100%;

  max-width: 100%;

  margin: auto;

  padding: 1rem;

  border-radius: 20px

}



#footer,

.footer-black {

  background-image: url(../assets/images/Texture_1.webp)

}



.nav-item.dropdown .nav-link:active,

.new-class:focus {

  box-shadow: none

}



.btn-submit2 {

  position: relative;

  overflow: hidden;

  z-index: 1;

  padding: .75rem 2.5rem;

  color: #000;

  background-color: transparent;

  border: 1px solid transparent;

  border-radius: 20px;

  font-size: 1.15rem;

  font-weight: 400;

  transition: color .6s, border .6s

}



.btn-submit2::before {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(#f0e4a8, #a17a31);

  z-index: -1;

  transform: translateY(0);

  transition: transform .6s

}



.form-calltxt {

  margin-bottom: 0;

  color: #181d24;

  font-size: 20px;

  text-align: center;

  margin-top: 30px

}



.form-calltxt a {

  color: #181d24 !important;

  font-size: 1.8rem;

  font-weight: 600

}



.copy a,

.footer__info-address a,

a.whatsapp {

  text-decoration: none

}



.footer-desc p,

.text-footer p {

  font-size: .85rem;

  text-wrap: balance;

  text-align: center

}



.footer-black {

  padding: 2rem 0

}



.text-footer a {

  color: #242424

}



.footer-logo {

  width: 180px;

  margin: auto;

  height: auto;

  max-width: 100%

}



.footer-logo img {

  border-radius: 0

}



.text-footer p {

  color: var(--white);

  font-weight: 400;

  padding: 1.3rem 1rem

}



.copyright-desc,

.copyright-desc2,

.footer-desc p {

  padding: .2rem 1rem;

  color: var(--white)

}



.footer-desc p {

  font-weight: 500

}



.copyright-desc {

  margin-top: 1rem

}



.copyright-desc2 {

  font-size: .95rem;

  margin: auto

}



.realatte-logo {

  height: 20px;

  vertical-align: middle;

  margin-left: 5px

}



.copyright {

  display: flex

}



.copyright2 {

  width: 90%;

  display: flex;

  justify-content: space-between;

  margin: auto

}



.custom-hr {

  color: var(--white)

}



.copyright {

  width: 80%;

  margin: auto

}



.custom-placeholder::placeholder {

  color: #fff !important;

  opacity: 1

}



.custom-placeholder:-ms-input-placeholder {

  color: #fff !important

}



.custom-placeholder::-ms-input-placeholder {

  color: #fff !important

}



nav.thank-you {

  background-color: #00000080

}



section.secton-thankyou {

  padding-bottom: 100px !important;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  padding: 0 1.5rem;

  margin: 8rem auto auto;

  -ms-flex-direction: column;

  flex-direction: column;

  max-height: 100%

}



section.secton-thankyou .thankyou-title {

  font-weight: 600;

  margin: .75rem auto 1.15rem !important;

  text-align: center;

  text-wrap: pretty;

  color: var(--light);

  font-size: 3rem

}



section.secton-thankyou .thankyou-subtitle {

  font-size: 1rem;

  font-weight: 600;

  opacity: .75;

  text-align: center;

  text-wrap: pretty;

  color: var(--light)

}



.go_txt {

  font-size: 15px;

  color: #000;

  background-color: #fff !important;

  border-radius: 3.125rem;

  border: 1px solid #000;

  width: fit-content;

  padding: 15px 30px;

  margin: 15px auto 0

}



.modal-content {

  background: #fff;

  border-radius: unset;

  outline: #fff solid 2px;

  outline-offset: 4px

}



.carousel-fade .carousel-item-next.carousel-item-start,

.carousel-fade .carousel-item-prev.carousel-item-end,

.carousel-fade .carousel-item.active {

  z-index: unset !important

}



@media only screen and (max-width:1400px) {

  nav {

    -webkit-transition: .4s;

    -o-transition: .4s;

    transition: .4s;

    padding: .65rem 2rem

  }



  .navbar-container .navbar-links .navbar-link .nav-link {

    font-size: .85rem

  }



  .sub-title {

    font-size: 2.5rem

  }



  .counter-number {

    font-size: 2rem

  }

}



@media only screen and (max-width:1280px) {

  .navbar-container .navbar-links {

    gap: 2rem

  }



  .navbar-container .navbar-links .navbar-link .nav-link {

    font-size: .8rem

  }



  .counter-number,

  .sub-title {

    font-size: 2rem

  }

}



@media only screen and (max-width:1200px) {

  .navbar-container .menu {

    display: block;

    filter: invert(1)

  }



  .navbar-links {

    display: none !important

  }



  .navbar-container {

    justify-content: unset

  }



  .config-text,

  .high-text {

    width: unset

  }



  .highlight-carousel .owl-nav .owl-prev {

    margin-left: -4rem

  }



  .highlight-carousel .owl-nav .owl-next {

    margin-right: -4rem

  }



  .sub-title {

    font-size: 3rem

  }



  .counter-number {

    font-size: 2.5rem

  }

}



@media only screen and (max-width:991px) {

  .believe-nav .custom-nav {

    margin: 1.4rem auto auto;

    gap: 1rem

  }



  .navbar-container {

    justify-content: unset

  }



  .config-text,

  .high-text {

    width: unset

  }



  .overview {

    padding: 4rem 0

  }



  .overview-container {

    width: 95%;

    margin: auto

  }



  .counter-box .top-line {

    width: 100%

  }



  .counter-number,

  .sub-title {

    font-size: 2.5rem

  }

}



@media only screen and (max-width:767px) {



  .overview,

  .sec-pad {

    padding: 2rem 0

  }



  .copyright,

  .copyright2 {

    display: flex;

    text-align: center;

    gap: .2rem

  }



  .counter-box .top-line,

  .overviewFormWrap {

    width: 100%

  }



  #section-overview .row {

    flex-direction: column-reverse

  }



  #section-overview .overview-form .row,

  .copyright {

    flex-direction: column

  }



  #section-overview .newp {

    padding-top: 1rem

  }



  #section-overview .gap-title2 {

    padding-bottom: 1rem

  }



  .sub-title {

    font-size: 2.5rem

  }



  .sec-pad {

    margin-top: -97%

  }



  .config-text,

  .high-text {

    width: unset

  }



  .owl-carousel .owl-dots.disabled,

  .owl-carousel .owl-nav.disabled {

    display: flex !important

  }



  .copyright2 {

    flex-direction: column;

    margin-bottom: 2.5rem

  }



  .navbar-container .navlogo {

    gap: 2rem

  }



  .navbar-container {

    justify-content: space-between

  }



  .amenities-carousel .owl-nav,

  .highlight-carousel .owl-nav {

    top: auto;

    bottom: 0;

    transform: none;

    justify-content: center !important;

    position: relative;

    gap: 20px;

    margin-top: 1rem

  }



  .overview-container {

    width: 95%;

    margin: auto

  }



  .readmore-btn {

    background: 0 0;

    border: none;

    color: var(--white);

    font-weight: 600;

    cursor: pointer;

    padding: 0;

    font-size: .85rem

  }



  .btn-middle,

  .btn-middle-content {

    border-radius: var(--radius-full)

  }



  .readmore-btn:hover {

    text-decoration: underline

  }



  .counter-number {

    font-size: 2rem

  }



  .highlight-carousel {

    margin-top: 0

  }



  .social-links2 {

    padding-bottom: 3.5rem

  }



  .nav-tabs .nav-link {

    font-size: 1rem

  }



  .mobile-fixed-button {

    display: block;

    position: fixed;

    width: 100%;

    bottom: 2%;

    left: 50%;

    z-index: 999;

    padding: 2rem 1rem 1rem;

    -webkit-transform: translate(-50%, 0);

    -ms-transform: translate(-50%, 0);

    transform: translate(-50%, 0);

    fill: rgba(255, 255, 255, 0.84);

    -webkit-filter: drop-shadow(0px 0px 30px rgba(0, 0, 0, 0.05));

    filter: drop-shadow(0px 0px 30px rgba(0, 0, 0, .05))

  }



  .btn-fixed.primary-pink {

    background: linear-gradient(#f0e4a8, #a17a31);

    color: #000

  }



  .mobile-fixed-button::after {

    content: "";

    position: absolute;

    width: 100%;

    height: 100%;

    top: 50%;

    z-index: -1;

    left: 50%;

    background: url(../assets/images/icons/toggle.svg) center center/cover no-repeat;

    -webkit-transform: translate(-50%, -50%);

    -ms-transform: translate(-50%, -50%);

    transform: translate(-50%, -50%)

  }



  .mobile-fixed-content {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    width: 85%;

    margin: auto;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between;

    -webkit-box-align: end;

    -ms-flex-align: end;

    align-items: end

  }



  .btn-middle-content {

    padding: 1rem;

    background-color: transparent;

    position: absolute;

    top: 10px;

    left: 50%;

    -webkit-transform: translate(-50%, -50%);

    -ms-transform: translate(-50%, -50%);

    transform: translate(-50%, -50%)

  }



  .btn-middle {

    width: 100px;

    height: 100px;

    border: none;

    outline: 0;

    background:linear-gradient(#f0e4a8, #a17a31);

  }



  .mobile-fixed-content .btn-fixed {

    width: 35%;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    position: relative;

    top: -7px;

    font-size: 1rem;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    padding: 1rem .85rem

  }



  .btn-middle img {

    width: 50px;

    height: 50px;

    -o-object-fit: cover;

    object-fit: cover;

    /* margin-left: 12px */

  }

}



.bg-why-choose-us,

.slideshow {

  background-size: cover;

  background-repeat: no-repeat

}



#configuration,

.bg-discover,

.bg-sign-up,

.bg-why-choose-us,

.slideshow {

  background-position: center

}



.amenities__item-title,

.villa__name {

  font-weight: 400;

  font-size: 20px

}



@media only screen and (max-width:576px) {



  .config-text,

  .high-text {

    width: unset

  }



  .btn-middle {

    width: 70px;

    height: 70px

  }



  .mobile-fixed-content .btn-fixed {

    top: -7px;

    font-size: .8rem;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    padding: .45rem .55rem;

    width: 36%

  }



  .btn-middle-content {

    top: 16px

  }

}



@media only screen and (max-width:450px) {

  .btn-middle {

    width: 55px;

    height: 55px

  }



  .mobile-fixed-content .btn-fixed {

    width: -webkit-max-content;

    width: -moz-max-content;

    width: max-content;

    top: -7px;

    font-size: .725rem;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    padding: .4rem .5rem

  }



  .mobile-fixed-content {

    width: 88%

  }



  .btn-middle img {

    width: 32px;

    height: 32px;

    -o-object-fit: cover;

    object-fit: cover;

    /* margin-left: 12px */

  }



  .btn-middle-content {

    top: 16px

  }



  .btn-fixed span.icon {

    width: 18px;

    height: 18px

  }



  .btn-fixed span.icon img {

    width: 100%;

    height: 100%;

    -o-object-fit: contain;

    object-fit: contain

  }



  .copyright-desc2,

  .text-footer p {

    font-size: .75rem

  }

}



.gallery-img,

.video-thumb img,

img {

  object-fit: cover

}



@media only screen and (max-width:350px) {



  .copyright-desc2,

  .text-footer p {

    font-size: .75rem

  }



  .mobile-fixed-content .btn-fixed {

    font-size: .725rem

  }



  .btn-fixed span.icon {

    width: 15px;

    height: 15px

  }



  .navbar-container .navlogo .logo {

    width: 90px

  }

}



.amenities-carousel .owl-dots,

.highlight-carousel .owl-dots {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: .25rem;

  margin: 2rem auto 1rem

}



.amenities-carousel .owl-dots button,

.highlight-carousel .owl-dots button {

  width: 15px;

  height: 3px;

  border-radius: 100px;

  -webkit-transition: 1.1s;

  -o-transition: 1.1s;

  transition: 1.1s;

  background-color: #dfdfdf !important

}



.amenities-carousel .owl-dots button.active,

.highlight-carousel .owl-dots button.active {

  -webkit-transition: 1s;

  -o-transition: 1s;

  transition: 1s;

  width: 25px;

  background-color: var(--primary) !important

}



.blur {

  filter: blur(4px)

}



.section {

  margin-block: var(--section-spacing-y)

}



.villa__item:not(:first-child) {

  border-top: 1px solid var(--color-cream);

  padding-top: 60px

}



.villa__item-no--animation :where(.villa__icon, .villa__item-body) {

  transition: none !important

}



.villa__item.villa__item--active .villa__item-top .villa__icon {

  rotate: 90deg;

  translate: 6px 6px

}



.villa__item.villa__item--active .villa__item-body {

  padding-block: 40px 32px

}



.form-group,

.inspired__description,

.interest__header,

.register-interests__header,

.villa__item-info {

  margin-bottom: 40px

}



.villa__item:last-child {

  border-bottom: 1px solid var(--color-cream)

}



.villa__item-top {

  display: flex;

  align-items: flex-start;

  justify-content: space-between;

  column-gap: 60px;

  padding-bottom: 24px;

  cursor: pointer

}



.villa__data,

.villa__info {

  display: flex;

  align-items: flex-start

}



.villa__icon {

  will-change: rotate, translate, scale;

  transition: rotate var(--duration-action), translate var(--duration-action), scale var(--duration-action)

}



.villa__item-body {

  backface-visibility: hidden;

  will-change: height, padding-block;

  overflow: hidden;

  height: 0;

  transition: all var(--duration-action)

}



.villa__data {

  justify-content: space-between;

  max-width: 673px;

  width: 100%;

  column-gap: 20px

}



.villa__info {

  column-gap: 40px

}



.villa__info-item {

  max-width: 146px

}



.villa__slider {

  margin-bottom: 32px

}



.villa__slide-image {

  object-fit: cover;

  width: 100%

}



.villa__slider-button {

  width: 120px;

  height: auto;

  aspect-ratio: 1/1;

  border: 1px solid var(--color-white);

  border-radius: 50%;

  margin-top: 0;

  translate: 0 -50%;

  transition: scale var(--duration)

}



.villa__slider-button.swiper-button-prev {

  left: 32px

}



.villa__slider-button.swiper-button-next {

  right: 32px

}



.cp-logo-mobile,

.dropdown-toggle::after,

.enlarge2,

.rera-detail-banner p:empty,

.villa__slider-button::after {

  display: none

}



.villa__actions {

  max-width: 673px;

  width: 100%;

  margin-left: auto

}



.inspired__inner,

.interest__inner,

.register-interests__inner {

  display: flex;

  align-items: flex-start;

  justify-content: space-between;

  column-gap: 60px

}



.inspired__title {

  margin-bottom: 24px

}



.amenities {

  display: flex;

  flex-direction: column;

  row-gap: 60px

}



.amenities__items {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 20px

}



.amenities__item {

  padding: 40px 16px;

  text-align: center;

  border-radius: 10px;

  background-color: var(--color-gray)

}



.btn-3,

.footer,

.interest__item::before {

  background-color: var(--color-accent)

}



.amenities__item-icon {

  margin: 0 auto 12px

}



.amenities__item-title {

  line-height: 1.2;

  color: var(--color-accent)

}



.interest__list {

  display: flex;

  flex-direction: column;

  row-gap: 24px;

  counter-reset: custom-counter

}



.interest__item {

  display: flex;

  column-gap: 10px;

  font-size: 20px;

  counter-increment: custom-counter

}



.interest__item::before {

  content: counter(custom-counter);

  color: var(--color-white);

  width: 26px;

  height: 26px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

  padding-inline: 3px;

  font-size: 14px

}



.btn-2:hover,

.btn-3:hover {

  background-color: var(--color-main)

}



.interest__image {

  flex-shrink: 0;

  height: auto;

  min-height: 479px

}



.footer__body,

.register-interests__form {

  max-width: 673px;

  width: 100%

}



.footer {

  flex: 0 0 auto;

  padding-block: 60px

}



:is(.footer__inner, .footer__top) {

  display: flex;

  align-items: flex-start;

  justify-content: space-between;

  column-gap: 60px

}



.footer__top {

  margin-bottom: 70px

}



.footer__info {

  max-width: 216px;

  color: var(--color-white)

}



.footer__info-title {

  display: inline-block;

  margin-bottom: 32px

}



.footer__copyright {

  color: var(--color-cream)

}



@media (hover:hover) {

  a:not([class]):hover {

    text-decoration: underline

  }



  :is(.soc1al__link, .pop-up__button-close):hover {

    opacity: .5

  }



  .menu__link:hover::after {

    width: 100%

  }



  :is(.button, .villa__slider-button, .link-whatsapp):hover {

    scale: 1.05

  }



  .villa__item-top:hover .villa__icon {

    scale: 1.1

  }

}



@media (hover:none) {

  a:not([class]):active {

    text-decoration: underline

  }



  :is(.soc1al__link, .pop-up__button-close):active {

    opacity: .5

  }



  .menu__link:active::after {

    width: 100%

  }



  :is(.button, .villa__slider-button, .link-whatsapp):active {

    scale: 1.05

  }



  .villa__item-top:active .villa__icon {

    scale: 1.1

  }

}



@media (max-width:1240px) {

  :is(.info-designed__body, .inspired__image, .interest__image, .register-interests__form, .villa__data, .villa__actions) {

    max-width: 580px

  }



  .amenities__item-title {

    font-size: 18px

  }



  .villa__info {

    column-gap: 20px

  }



  .villa__slide-image {

    height: 340px

  }



  .villa__images {

    display: flex;

    flex-direction: column;

    row-gap: 13px;

    margin-bottom: 40px

  }



  .villa__image {

    display: block;

    width: 100%;

    object-fit: cover;

    transform: translateZ(0);

    backface-visibility: hidden;

    will-change: scale, height

  }



  .villa__slider-button {

    width: 75px

  }

}



.line_animation,

.line_animation2 {

  transform: scaleX(0) translateZ(0);

  bottom: 0;

  left: 0;

  will-change: transform;

  display: block

}



@media (max-width:1024px) {

  :root {

    --section-spacing-y: 90px

  }



  :is(.menu, .header__inner) {

    column-gap: 20px

  }



  :is(.info-designed__body, .inspired__image, .interest__image, .register-interests__form, .villa__data, .villa__actions) {

    max-width: 440px

  }



  .title {

    font-size: 28px

  }



  .pop-up__body {

    max-width: 620px;

    padding: 40px

  }



  .hero__list-value {

    font-size: 24px

  }



  .amenities {

    row-gap: 32px

  }



  .amenities__items {

    grid-template-columns: repeat(3, 1fr)

  }



  .villa__info {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 24px

  }



  .villa__slide-image {

    height: 300px

  }

}



@media (max-width:824px) {



  .info-designed,

  .inspired__inner {

    display: block

  }



  .info-designed__title {

    margin-bottom: 24px

  }



  :is(.info-designed__title, .info-designed__body, .interest__image, .register-interests__form) {

    max-width: none

  }



  .inspired__body {

    margin-bottom: 32px

  }



  :is(.villa__data, .villa__actions) {

    max-width: 330px

  }



  .villa__actions,

  .villa__data {

    max-width: none

  }



  .villa__item-top {

    column-gap: 30px;

    flex-wrap: wrap;

    gap: 32px

  }



  .villa__data {

    display: contents

  }



  .villa__info {

    order: 1;

    width: 100%;

    grid-template-columns: repeat(3, 1fr)

  }

}



@media (min-width:481px) {

  .villa__images {

    display: none

  }

}



@media (max-width:480px) {

  :root {

    --header-height: 111px

  }



  .header .logo>img {

    width: auto;

    height: 46px

  }



  .villa__slider {

    display: none

  }



  .villa__info {

    grid-template-columns: repeat(2, 1fr);

    gap: 24px 60px

  }

}



.bg-why-choose-us {

  height: 767px;

  background-image: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .6)), url('../assets/images/why-choose-us-1.jpg')

}



.head-why-choose-us {

  font-size: 19px;

  color: var(--text-color-2);

  font-family: var(--font-1);

  font-weight: 500

}



.gallery-img {

  display: inline-block;

  border-radius: 8px;

  cursor: pointer

}



.btn-3,

.btn-4 {

  width: fit-content;

  border: none;

  padding: 10px 16px;

  transition: background-color .3s, color .3s;

  font-family: var(--font-1)

}



.btn-2:hover {

  border: 1px solid var(--color-main);

  color: #fff

}



.btn-3 {

  color: #000

}



.btn-3:hover,

.btn-4,

.dropdown-menu:hover a:hover {

  color: #fff

}



.btn-4 {

  background-color: #000

}



.navbar-size,

.page-size {

  width: 1300px

}



.bg-main,

.btn-4:hover,

.dropdown-menu:hover a:hover {

  background-color: var(--color-main)

}



img {

  width: 100%;

  object-position: center

}



ul li {

  font-family: var(--font-1) !important;

  font-weight: 400;

  color: var(--heading-color-2)

}



.c-text-1 {

  color: var(--text-color-1)

}



.c-text-2 {

  color: var(--text-color-2)

}



.c-heading {

  color: var(--heading-color) !important

}



.c-heading-2 {

  color: var(--heading-color-2) !important

}



.c-main,

.link-1:hover {

  color: var(--color-main)

}



.c-darker {

  color: var(--color-darker)

}



.c-lighter {

  color: var(--color-lighter)

}



.c-subtle {

  color: var(--color-subtle)

}



.c-border {

  color: var(--color-border)

}



.c-error {

  color: var(--color-error)

}



.c-warning {

  color: var(--color-warning)

}



.c-info {

  color: var(--color-info)

}



.c-success {

  color: var(--color-success)

}



.c-accent {

  color: var(--color-accent)

}



.c-white,

.innerConfiguration .section-head,

.innerConfiguration .section-head h1,

.nav-item:hover .nav-link {

  color: #fff !important

}



.c-black {

  color: #000

}



.bg-text-1 {

  background-color: var(--text-color-1)

}



.bg-text-2 {

  background-color: var(--text-color-2)

}



.bg-heading {

  background-color: var(--heading-color)

}



.bg-darker {

  background-color: var(--color-darker)

}



.bg-lighter {

  background-color: var(--color-lighter)

}



.bg-subtle {

  background-color: var(--color-subtle)

}



.bg-border {

  background-color: var(--color-border)

}



.bg-error {

  background-color: var(--color-error)

}



.bg-warning {

  background-color: var(--color-warning)

}



.bg-info {

  background-color: var(--color-info)

}



.bg-success {

  background-color: var(--color-success)

}



.bg-accent {

  background-color: var(--color-accent)

}



.bg-white {

  background-color: #fff

}



.bg-discover {

  background-image: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)), url(../img/discover-1.jpg);

  background-size: cover

}



.bg-sign-up {

  background-image: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)), url(../img/sign-up.jpg);

  background-size: cover;

  padding: 32px

}



.get-started-size,

.page-size {

  padding-top: 100px;

  padding-bottom: 100px;

  margin-left: auto;

  margin-right: auto

}



.get-started-size {

  width: 1280px

}



.border-radius {

  border-radius: 5px

}



.slideshow {

  position: relative;

  max-height: 900px;

  height: 100vh;

  animation: 20s infinite slideshow;

  overflow: hidden

}



.slideshow::before {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, .6);

  z-index: 1

}



@keyframes slideshow {



  0%,

  100% {

    background-image: url('../img/hero-1.jpg')

  }



  33% {

    background-image: url('../img/hero-2.jpg')

  }



  66% {

    background-image: url('../img/hero-3.jpg')

  }

}



.navbar-toggler {

  border: none

}



.navbar-toggler .custom-toggler-icon {

  width: 30px;

  height: 30px;

  border: none;

  background: 0 0;

  box-shadow: none;

  outline: 0;

  position: relative;

  display: flex;

  flex-direction: column;

  gap: 5px;

  align-items: end;

  padding: 9px 5px;

  color: #fff !important

}



.navbar-toggler .bar {

  display: block;

  height: 1px;

  border-radius: 2px;

  width: 100%;

  background-color: #c3c3c3;

  border: none

}



#footer .prescon img,

.navbar-toggler .bar-1,

.navbar-toggler .bar-2,

.navbar-toggler .bar-3,

video {

  width: 100%

}



.navbar-toggler:active,

.navbar-toggler:focus {

  outline: 0;

  box-shadow: none

}



.nav-logo {

  width: 50%;

  max-height: 60px

}



.icon-slider li span img,

.navbar-toggler-icon,

.plots .icon-part li span img {

  width: 30px;

  height: 30px

}



.nav-link {

  color: var(--text-color-1);

  font-family: var(--font-1);

  box-shadow: none

}



.custom-toggler {

  border: 1px solid rgba(255, 255, 255, .344);

  padding: 4px 14px;

  font-size: 16px !important

}



.navbar-toggler-icon {

  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2844, 131, 145, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")

}



.navbar-toggler-icon:hover {

  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")

}



.navbar-border {

  border-bottom: 1px solid rgba(255, 255, 255, .2)

}



.offcanvas-header .btn-close-custom {

  position: absolute;

  top: 20px;

  right: 20px;

  z-index: 10;

  background-color: transparent;

  border: 1px solid var(--text-color-2);

  border-radius: 10px;

  font-size: 16px;

  padding: 5px 12px;

  cursor: pointer

}



.btn-close {

  color: var(--color-main) !important;

  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23a0893f'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");

  opacity: 1 !important

}



.btn-close:hover {

  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e")

}



.offcanvas {

  background-color: var(--color-darker) !important

}



.social-icon-32 {

  display: inline-flex;

  justify-content: center;

  align-items: center;

  width: 32px;

  height: 32px;

  border: 1px solid rgba(255, 255, 255, .39);

  border-radius: 50%;

  color: var(--color-subtle);

  background-color: transparent;

  font-size: 14px;

  transition: background-color .3s, color .3s, border .3s;

  cursor: pointer

}



.dropdown-item,

.nav-link {

  color: var(--color-main) !important

}



.social-icon-32:hover {

  color: var(--heading-color);

  background-color: #fff

}



.nav-item.dropdown .nav-link:hover {

  color: var(--color-main);

  box-shadow: none

}



.nav-link {

  font-size: 20px;

  font-family: var(--font-1);

  font-weight: 500

}



.nav-link.active {

  color: #fff !important;

  box-shadow: none

}



.dropdown-item:focus,

.nav-link:focus {

  color: var(--color-main);

  outline: 0;

  box-shadow: none !important

}



.dropdown-toggle {

  box-shadow: none !important

}



.dropdown-icon-size {

  font-size: 10px

}



.dropdown-menu {

  padding-left: 0;

  padding-bottom: 12px;

  padding-right: 0;

  background-color: var(--color-darker);

  min-width: 210px;

  border: none;

  box-shadow: none;

  border-radius: 5px

}



.dropdown-menu a {

  padding-top: 10px;

  padding-bottom: 10px

}



.nav-item.dropdown:hover .dropdown-menu {

  display: block;

  opacity: 1;

  visibility: visible

}



.dropdown-item {

  font-size: 20px;

  font-weight: 500 !important;

  border-radius: 5px

}



.dropdown-item:hover {

  background-color: var(--color-darker) !important;

  color: #fff !important

}



.ff-playfair {

  font-family: var(--font-2);

  font-weight: 500 !important

}



.testimonial-circle {

  width: 50px;

  height: 50px;

  border-radius: 50%;

  margin: 0 auto;

  border: 2px solid #fff

}



.testimonial-circle-2 {

  width: 70px;

  height: 70px;

  border-radius: 50%;

  margin: 0 auto;

  border: 2px solid #fff

}



.hero-form,

.hero-form-select {

  height: fit-content;

  background-color: transparent

}



.testimonial-margin {

  margin-left: -16px

}



.testimonial-subtitle {

  font-size: 13px;

  color: rgba(255, 255, 255, .666);

  font-family: var(--font-1)

}



.hero-form,

.hero-form-select,

.hero-form-select option {

  font-size: 16px;

  font-family: var(--font-1)

}



.hero-form {

  color: #fff;

  border: none;

  border-bottom: 1px solid rgba(255, 255, 255, .6)

}



.hero-form::placeholder {

  color: rgba(255, 255, 255, .6)

}



.hero-form:focus {

  border: none;

  outline: 0;

  color: #fff;

  border-bottom: 1px solid #fff

}



.hero-form-select {

  width: 220px;

  color: #fff;

  border: none;

  border-bottom: 1px solid rgba(255, 255, 255, .6);

  padding: 4px 0;

  cursor: pointer

}



.hero-form-select:focus {

  outline: 0;

  border-bottom: 1px solid #fff

}



.hero-form-select option {

  background-color: #fff;

  color: #000

}



.subtitle {

  font-size: 14px;

  color: var(--heading-color-2);

  font-family: var(--font-1);

  font-weight: 600;

  letter-spacing: .6px

}



.about-card {

  background-color: var(--color-darker);

  padding: 24px;

  width: 100%

}



.services-icon {

  width: 35px;

  height: 100%

}



.link-1 {

  color: var(--color-darker);

  font-size: 16px;

  font-family: var(--font-1);

  transition: color .3s

}



.section-v1-a {

  background: #fff

}



.section-v1-a p {

  color: #111

}



.section-v1-b {

  background-image: url("../assets/images/banner/section1bg.jpg");

  background-position: top;

  background-repeat: no-repeat;

  background-size: cover;

  display: flex;

  justify-content: center;

  background-attachment: fixed

}



.section-v2-b {

  padding: 85px 0 !important;

  margin-top: -195px !important

}



@media screen and (max-width:800px) {

  .section-v2 {

    background-image: url(../assets/images/banner/section2.jpg) !important;

    background-attachment: scroll !important

  }



  .section-v2-b {

    margin-top: -335px;

    padding: 0 0 120px

  }

}



#configuration,

.section-v2 {

  background-attachment: fixed;

  background-size: cover;

  background-repeat: no-repeat

}



.section-v2 {

  background-image: url(../assets/images/banner/section2.jpg);

  background-position: top center;

  height: 700px;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column

}



@media screen and (max-width:768px) {

  .section-v1-b {

    background-position: right center !important;

    background-image: url(../assets/images/banner/section1bg.jpg) !important;

    background-attachment: scroll !important

  }



  .section1img,

  .section3-ap-img {

    width: 100% !important

  }



  .section-v2-b {

    padding: 85px 0 !important;

    margin-top: -195px !important

  }



  .section-v3-b p {

    padding: 40px 10px 20px !important;

    text-align: center

  }

}



.innerConfiguration {

  backdrop-filter: brightness(0.5)

}



#configuration {

  background-image: url(../assets/images/config.webp)

}



.config-card {

  padding: 43px;

  background: #fff;

  margin: 0 30px;

  border-radius: 8px

}



.innerconfigcard h3 {

  padding: 0 20px 10px;

  font-size: 20px;

  color: #000

}



.innerconfigcard button {

  padding: 8px 24px;

  border: 1px solid #fff;

  font-size: 15px;

  border-radius: 5px;

  background: #9e7b41;

  color: #fff

}



.innerconfigcard span {

  color: #2a3b53;

  font-size: 20px

}



.secpadding {

  padding: 70px 0

}





#footer {

  background-size: cover;

  background-repeat: no-repeat;

  padding-top: 105px;

  padding-bottom: 105px

}



#footer .rising-logo img {

  width: 300px

}



#footer .maharera {

  display: flex;

  padding-bottom: 11px

}



#footer .maharera .HiranandaniMahaRERA {

  padding-left: 17px;

  padding-top: 5px

}



#footer .HeadOffice p,

#footer .maharera .HiranandaniMahaRERA p {

  color: var(--White);

  font-size: 16px

}



#footer .HeadOffice h2,

#footer .footerRight a {

  font-weight: var(--font-weight-700);

  font-size: 16px;

  color: var(--White)

}



#footer .HeadOffice p.bor-bottom,

#footer .maharera .HiranandaniMahaRERA p.bor-bottom {

  border-bottom: 1px solid rgba(255, 255, 255, .3);

  padding-bottom: 10px

}



#footer .maharera .HiranandaniMahaRERA p a,

#footer .maharera .HiranandaniMahaRERA p span {

  font-weight: var(--font-weight-700);

  color: var(--White)

}



#footer .HeadOffice {

  padding-left: 0;

  transform: translate(-120px, 0)

}



#footer .HeadOffice h2 {

  margin-bottom: 13px

}



#footer .HeadOffice p img {

  margin-right: 5px;

  display: inline-block;

  transform: translateY(-4px)

}



#footer .HeadOffice p a,

#footer .HeadOffice p span,

#footer .Privacy a,

#footer .copyright p {

  color: var(--White)

}



#footer .footerRight a {

  display: block;

  padding-bottom: 14px

}



#footer .socialLink {

  border-top: 1px solid rgba(255, 255, 255, .3);

  width: 100%;

  padding: 10px 0;

  margin-top: 20px;

  text-align: center;

  display: flex;

  justify-content: space-between

}



.icon-part li,

.icon-thumnail li {

  align-items: center;

  line-height: 18px

}



#footer .socialLink a {

  padding: 0 10px;

  transition: .5s;

  transform: translateY(0);

  display: inline-block

}



#footer .socialLink a:hover {

  opacity: .8;

  transform: translateY(-2px)

}



#footer .copyright {

  color: var(--White);

  font-size: 12px;

  margin-bottom: 20px

}



#footer .Privacy {

  text-align: right;

  color: var(--White)

}



#footer .Disclaimer p {

  padding-left: 20px;

  font-size: 12px !important

}



#footer .prescon {

  width: 100px

}



.bg-grey {

  background: #f4ede6

}



.pd100 {

  padding: 100px

}



.mt-30 {

  margin-top: 28px

}



.icon-slider {

  padding-right: 31px;

  margin-right: 1px

}



.icon-thumnail li {

  margin-bottom: 30px;

  font-size: 13px;

  color: #000;

  display: flex;

  position: relative

}



.ecosystem p:last-child,

.icon-part li:last-child,

.icon-thumnail li:last-child,

.rera-detail-banner p:last-child {

  margin-bottom: 0

}



.line_animation {

  border-bottom: 1px solid #000;

  transform-origin: 0 50%;

  transition: transform 4s cubic-bezier(.23, 1, .32, 1);

  position: absolute;

  right: 0;

  height: 5px;

  border-radius: 0 5px;

  overflow: hidden

}



.line_animation.wow.animated,

.line_animation2.wow.animated,

.line_animation3.wow.animated {

  transform: scaleX(1) translateZ(0)

}



.icon-thumnail li span {

  width: 60px;

  height: 40px;

  padding: 4px;

  display: inline-block;

  border-radius: 0 5px;

  margin: 0 15px 0 0;

  text-align: center;

  position: relative;

  overflow: hidden

}



.icon-part li span:after,

.icon-thumnail li span:after {

  content: "";

  position: absolute;

  bottom: 0;

  padding-right: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border-bottom: 1px solid #000;

  border-right: 1px solid #000;

  border-radius: 0 5px;

  transition: transform 2s cubic-bezier(.23, 1, .32, 1)

}



.icon-part li span:before,

.icon-thumnail li span:before {

  content: "";

  position: absolute;

  top: 0;

  right: 0;

  padding-left: 0;

  width: 100%;

  height: 100%;

  border-top: 1px solid #000;

  border-left: 1px solid #000;

  border-radius: 0 5px;

  transition: transform 2s cubic-bezier(.23, 1, .32, 1)

}



.icon-part li span.wow.animated:before,

.icon-thumnail li span.wow.animated:before {

  animation: 2s ease-in-out forwards bottomright

}



.icon-part li span.wow.animated:after,

.icon-thumnail li span.wow.animated:after {

  animation: 2s ease-in-out forwards topleft

}



.icon-part li:first-child .line_animation3.wow.animated,

.icon-part li:first-child span.wow.animated,

.icon-thumnail li:first-child span.wow.animated,

.line span:first-child .line_animation2.wow.animated {

  transition-delay: .40s

}



.icon-part li:nth-child(2) .line_animation3.wow.animated,

.icon-part li:nth-child(2) span.wow.animated,

.icon-thumnail li:nth-child(2) span.wow.animated {

  transition-delay: .45s

}



.icon-part li:nth-child(3) .line_animation3.wow.animated,

.icon-part li:nth-child(3) span.wow.animated,

.icon-thumnail li:nth-child(3) span.wow.animated {

  transition-delay: .50s

}



.icon-part li:nth-child(4) .line_animation3.wow.animated,

.icon-part li:nth-child(4) span.wow.animated,

.icon-thumnail li:nth-child(4) span.wow.animated {

  transition-delay: .55s

}



.icon-part li:nth-child(5) span.wow.animated,

.icon-thumnail li:nth-child(5) span.wow.animated {

  transition-delay: .60s

}



.icon-part li:nth-child(6) span.wow.animated,

.icon-thumnail li:nth-child(6) span.wow.animated {

  transition-delay: .65s

}



@keyframes topleft {

  0% {

    width: 0;

    height: 0;

    padding-top: 0;

    visibility: visible

  }



  25% {

    width: 100%;

    height: 0;

    padding-top: 0;

    visibility: visible

  }



  50% {

    height: 100%;

    width: 100%;

    visibility: visible

  }



  100%,

  75% {

    visibility: visible

  }

}



@keyframes bottomright {



  0%,

  25%,

  50% {

    width: 0;

    height: 0;

    padding-bottom: 0;

    visibility: hidden

  }



  75% {

    width: 100%;

    height: 0;

    padding-bottom: 0;

    visibility: visible

  }



  100% {

    width: 100%;

    height: 100%;

    opacity: 1;

    visibility: visible

  }

}



.line {

  width: 90%;

  margin-left: 0;

  background: #e2dedc;

  height: 1px;

  margin-top: 8px;

  position: relative

}



.line_animation2,

a.enlarge {

  position: absolute;

  border-bottom: 1px solid #000

}



.line_animation2 {

  z-index: 9;

  transform-origin: 0 50%;

  transition: transform 1s cubic-bezier(.23, 1, .32, 1);

  right: 0;

  height: 5px

}



.ply-btn,

.video-thumb span {

  display: -webkit-box;

  display: -ms-flexbox

}



.relative2 {

  position: relative;

  margin-right: 15px

}



a.enlarge {

  bottom: 50px;

  left: 70px;

  font-size: 14px;

  color: #000

}



.video-thumb {

  position: relative;

  margin-top: 30px

}



.video-thumb img {

  height: auto;

  width: 100%

}



.video-thumb span {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center

}



.ply-btn {

  border: 1px solid #fff;

  padding: 40px;

  border-radius: 50%;

  color: #fff;

  font-size: 24px !important;

  width: 80px;

  height: 80px;

  line-height: 10px;

  display: flex !important;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  cursor: pointer;

  -webkit-transition: .5s ease-in-out;

  transition: .5s ease-in-out

}



.video-thumb:hover .ply-btn {

  background: #fff;

  color: #10100f

}



.ecosystem p,

.loacation-ad .heading {

  margin-bottom: 20px

}



.icon-part li {

  border-radius: 0 6px;

  margin-bottom: 30px;

  font-size: 16px;

  color: #000;

  display: flex;

  position: relative;

  border-bottom: 1px solid #000

}



.line_animation3 {

  z-index: 9;

  border-bottom: 1px solid #000;

  display: block;

  transform: scaleX(0) translateZ(0);

  transform-origin: 0 50%;

  transition: transform 1s cubic-bezier(.23, 1, .32, 1);

  will-change: transform;

  position: absolute;

  bottom: -1px;

  right: 0;

  left: 0;

  height: 5px;

  border-radius: 0 5px

}



.icon-part li span {

  width: 60px;

  height: 45px;

  padding: 4px;

  display: inline-block;

  margin: 0 15px 0 0;

  border-radius: 0 5px;

  text-align: center;

  position: relative;

  overflow: hidden

}



.loacation-ad .icon-part {

  margin-right: 30px

}



.ecosystem img {

  margin: 60px 0

}



.ecosystem .icon-part,

.plots .icon-part {

  margin: 0

}



.plots p {

  margin-bottom: 60px

}



.plots .icon-part li span {

  width: 60px;

  height: 40px

}



.enclave-btn {

  border: 1px solid #000;

  cursor: pointer;

  padding: 12px 30px;

  font-size: 15px;

  font-family: Montserrat-Bold;

  letter-spacing: 3px;

  color: #000;

  border-radius: 0 13px;

  text-align: center;

  margin-top: 50px;

  display: inline-block;

  outline: 0;

  transition: .3s ease-in-out;

  background: 0 0

}



.harera,

.middle-ft {

  border-bottom: 1px solid #727171

}



.enclave-btn:hover {

  background: linear-gradient(45deg, #d8a175, #9a6954);

  color: #fff

}



a:hover.enclave-btn {

  color: #fff

}



.video-dialog {

  max-width: 93%

}



.popup-box .form .form-group {

  margin-bottom: 16px

}



.popup-box h6 {

  font-family: Gotham-Light;

  font-size: 21px;

  margin-bottom: 15px;

  color: #000

}



.form .form-control::-webkit-input-placeholder {

  color: #000

}



.form .form-control::-moz-placeholder {

  color: #000

}



.form .form-control:-ms-input-placeholder {

  color: #000

}



.form .form-control:-moz-placeholder {

  color: #000

}



.customcon2:after {

  content: '\f107';

  display: inline-block;

  font: 15px/1 FontAwesome;

  text-rendering: auto;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  position: absolute;

  top: 50%;

  right: 5px;

  color: #212121;

  transform: translateY(-50%)

}



.ft-nav ul li a:after,

.harera:after {

  content: '';

  background: #000;

  width: 0%;

  left: 0;

  position: absolute

}



.form .enclave-btn {

  margin-top: 20px

}



.map {

  padding-bottom: 100px

}



.map iframe {

  height: 450px;

  width: 100%

}



.footer {

  padding: 50px 0;

  background: #000

}



.ft-logo {

  width: 220px;

  margin: 0

}



.ft-logo2 {

  width: 180px;

  margin-right: 0;

  float: right

}



.middle-ft {

  margin: 0 0 50px;

  padding: 0 0 60px

}



.middle-ft p {

  color: #fff;

  margin: 0;

  font-size: 12.7px;

  opacity: .8

}



.middle-ft h5,

.middle-ft p a {

  color: #fff

}



.pb40 {

  padding-bottom: 20px

}



.harera {

  padding-top: 20px;

  position: relative

}



.harera:after {

  bottom: -1px;

  height: 1px;

  -webkit-transition: .3s ease-in-out;

  transition: .3s ease-in-out

}



.ft-nav ul li a:hover::after,

.harera:hover::after {

  width: 100%;

  left: 0

}



.middle-ft .line_animation2 {

  bottom: -1px

}



.middle-ft ul {

  margin: 0;

  text-align: right

}



.ft-nav ul li {

  display: inline-block;

  margin-left: 40px

}



.ft-nav ul li a {

  font-size: 13px;

  color: #fff;

  margin-bottom: 15px;

  padding-bottom: 5px;

  text-align: right;

  -webkit-transition: .5s ease-in-out;

  transition: .5s ease-in-out;

  opacity: .8;

  font-family: Gotham-Light;

  position: relative

}



.ft-nav ul li a:after {

  bottom: -2px;

  height: 2px;

  -webkit-transition: .3s ease-in-out;

  transition: .3s ease-in-out

}



.ft-nav ul li a a:hover {

  color: #000

}



.disclaimer-dis p {

  margin: 0;

  font-size: 11px;

  color: #6d6c6c;

  line-height: 15px

}



.disclaimer-dis span {

  display: block;

  font-size: 13px;

  margin: 15px 0;

  color: #6d6c6c

}



.copy-right,

.copy-right a {

  color: #e3e2e2

}



.copy-right {

  background: linear-gradient(45deg, #d8a175, #a26f58);

  text-align: center;

  padding: 5px 0;

  width: 100%;

  font-size: 11px

}



.headertop {

  width: 100%;

  height: 80px;

  display: flex;

  align-items: center;

  justify-content: flex-start;

  background: #000

}



.fixed {

  position: fixed;

  top: 0;

  left: 0

}



.dlf-logo {

  width: 220px;

  padding: 0;

  margin: 0

}



.pd-top {

  padding: 100px 0

}



.pd-top table {

  margin-bottom: 3rem

}



.pd-top table tr td,

.pd-top table tr th {

  display: table-cell;

  vertical-align: middle

}



.pd-top table tr th {

  background: #bf8a68;

  color: #fff;

  text-align: center;

  padding: 13px 0

}



.copy {

  color: #fff;

  font-size: 12px;

  line-height: 1.5;

  letter-spacing: 1px

}



.copy a {

  color: #fff

}



@media(min-width:1440px) and (max-width:1920px) {

  .icon-slider {

    padding-right: 32px

  }



  .icon-slider .icon-thumnail ul {

    margin-top: 1px

  }



  .ecosystem .icon-part ul {

    margin-bottom: 0

  }



  .progress-box {

    right: 150px

  }



  .prev {

    right: 325px

  }

}



@media(max-width:991px) {



  .navbar-expand-lg>.container,

  .navbar-expand-lg>.container-fluid {

    padding-right: 15px;

    padding-left: 15px

  }



  .navbar-light .navbar-toggler-icon {

    background: url(../images/toggle.svg) no-repeat !important

  }



  .navbar-toggler-icon.cross {

    background: url(../images/cross.svg) center/60% no-repeat !important

  }



  .navbar-toggler:not(:disabled):not(.disabled) {

    cursor: pointer;

    outline: 0;

    border-color: rgb(255 255 255 / 0%);

    padding: 0

  }



  .banner .circle,

  .top_head,

  nav .bottom_line ul.navbar-nav li a:after {

    display: none

  }



  .logoblack,

  a.enlarge2 {

    display: block

  }



  .navbar-light .navbar-brand {

    margin-top: 0

  }



  nav .bottom_line {

    margin-top: 0;

    padding: 0

  }



  nav {

    background: #fff;

    padding: 13px 15px

  }



  nav .bottom_line ul.navbar-nav li a {

    padding: 10px 0

  }



  ul.navbar-nav {

    height: auto;

    margin-top: 30px

  }



  nav .bottom_line ul.navbar-nav li {

    position: relative;

    margin-left: 0

  }



  .navbar-brand {

    margin: 0

  }



  .pd-top,

  .pd100 {

    padding: 70px 0

  }



  .banner .container .caption {

    max-width: 400px

  }



  .banner .container .caption h4 {

    font-size: 50px

  }



  .banner .container .caption span {

    font-size: 20px

  }



  .banner .container .caption h5 {

    font-size: 27px

  }



  .progress-box {

    right: 60px

  }



  .next {

    right: 45px

  }



  .prev {

    right: 275px

  }



  .heading {

    font-size: 35px;

    margin-bottom: 40px

  }



  .loacation-ad .icon-part {

    margin: 30px 0 0

  }



  .loacation-ad {

    padding-bottom: 70px !important

  }



  .map {

    padding-bottom: 65px

  }



  .map iframe {

    height: 300px

  }



  .ft-logo2 {

    width: 130px

  }



  a.enlarge {

    bottom: 50px;

    left: 30px

  }



  a.enlarge2 {

    position: absolute;

    bottom: 50px;

    left: 15px;

    font-size: 14px;

    color: #000;

    border-bottom: 1px solid #000

  }



  .ecosystem img {

    margin: 60px 0 100px

  }



  .cnt {

    width: 161px

  }



  .cnt2 {

    width: 138px

  }



  .cnt3 {

    width: 164px

  }

}



@media(max-width:560px) {

  .pd-top {

    padding: 50px 0

  }



  .navbar-expand-lg>.container,

  .navbar-expand-lg>.container-fluid {

    padding-right: 0;

    padding-left: 0

  }



  .cnt {

    width: 270px

  }



  .cnt2,

  .cnt3 {

    width: auto;

    margin: 0

  }



  .banner .container .caption {

    z-index: 3;

    position: relative

  }



  .overlay {

    z-index: 2

  }



  .mb-banner1 {

    background: url(../images/Mobile-Banner-1.webp) center center/cover no-repeat !important

  }



  .mb-banner2 {

    background: url(../images/Mobile-Banner-2.webp) center center/cover no-repeat !important

  }



  .mb-banner3 {

    background: url(../images/Mobile-Banner-3.webp) center center/cover no-repeat !important

  }



  .banner .container .caption>div {

    margin: auto

  }



  .line,

  .plots .icon-part li:last-child {

    margin-bottom: 30px

  }



  .banner .container .caption h4 {

    font-size: 35px

  }



  .banner .container .caption span {

    font-size: 18px

  }



  .banner .container .caption h5 {

    font-size: 20px

  }



  .progress {

    z-index: 999;

    width: 222px

  }



  .icon-slider {

    padding: 0 4px 0 1px

  }



  .video-dialog {

    max-width: 90%

  }



  .ecosystem .heading br {

    display: none

  }



  .line {

    width: 100%;

    margin-top: 0

  }



  .ft-logo2 {

    width: 120px

  }



  .ft-nav ul li {

    display: inline-block;

    margin-left: 0;

    margin-right: 10px

  }



  .middle-ft ul {

    text-align: left

  }



  a.enlarge {

    bottom: 0;

    left: 30px

  }



  .pb40 {

    padding-top: 40px

  }

}



@media(max-width:414px) {

  .mb-banner1 {

    background-position: right 50% !important

  }

}



@media(max-width:375px) {

  .progress {

    width: 198px

  }



  .banner .container .caption {

    z-index: 3;

    position: relative

  }

}



.amenities-box {

  background: #fff;

  width: 100%;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center

}



.amenities-box .icon img,

.call-us img,

.whatsapp-btn img {

  width: 100%;

  height: 100%;

  object-fit: contain

}



.amenities-box .icon {

  width: 80px;

  height: 80px;

  display: block;

  border-radius: 100%;

  background: #f4ede6;

  padding: 15px

}



ul.amenities-list {

  display: flex;

  flex-wrap: wrap;

  margin: 0 -10px;

  padding: 0;

  list-style: none

}



ul.amenities-list li {

  flex: 0 0 20%;

  width: 20%;

  margin: 10px 0 20px

}



.amenities-box .txt {

  margin-top: 7px;

  color: #000;

  text-align: center

}



.floor-box {

  background: #fff;

  width: 100%;

  margin: 15px 0;

  overflow: hidden;

  position: relative;

  border-radius: 5px

}



.floor-box .overlay-content {

  background: rgba(00, 00, 00, .5);

  padding: 15px;

  font-size: 16px;

  color: #fff;

  text-align: center;

  margin-bottom: 0;

  position: absolute;

  top: 0;

  width: 100%;

  height: 100%;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  right: -100%;

  transition: .5s

}



.floor-box .overlay-content span {

  display: block;

  font-size: 20px;

  margin-bottom: 0;

  font-weight: 500

}



.floor-box:hover .overlay-content {

  right: 0

}



.floor-box .enclave-btn {

  margin-top: 0;

  border-color: #fff;

  color: #fff

}



.price-boxs {

  background: #f4ede6;

  padding: 25px;

  margin: 15px 0;

  text-align: center;

  border-radius: 15px

}



.price-boxs .price {

  font-size: 25px;

  font-weight: 700

}



.price-boxs .enclave-btn {

  margin-top: 0

}



.gallery-img {

  height: 400px !important

}



.call-us,

.whatsapp-btn {

  width: 50px;

  height: 50px;

  position: fixed;

  bottom: 1rem;

  display: flex;

  cursor: pointer;

  color: #fff !important;

  font-size: 30px;

  border-radius: 100%;

  z-index: 99;

  line-height: 1;

  text-align: center

}



.gallery-img img {

  width: 100%;

  height: 100%;

  object-fit: cover

}



.whatsapp-btn {

  right: 1rem;

  align-items: center;

  justify-content: center

}



.call-us {

  left: 1rem;

  align-items: center;

  justify-content: center;

  background: linear-gradient(45deg, #d8a175, #9a6954);

  padding: 5px;

  animation-name: tada;

  animation-direction: alternate;

  -webkit-animation-iteration-count: infinite;

  animation-iteration-count: infinite;

  -webkit-animation-duration: 1s;

  animation-duration: 1s;

  -webkit-animation-fill-mode: both;

  animation-fill-mode: both

}



.call-us .loading {

  top: -2px;

  right: 9px;

  left: auto

}



.marquee-banner-txt {

  position: absolute;

  top: 82px;

  z-index: 9;

  width: 100%;

  padding: 15px;

  font-size: 16px;

  color: #fff;

  margin: 0 auto;

  text-align: center

}



.marquee-banner-txt .txt {

  background: linear-gradient(45deg, #d8a175, #8b5e4c9e);

  border-radius: 0 5px;

  display: inline-block;

  font-family: Gotham-Light;

  padding: 10px 15px;

  line-height: 1.3;

  font-weight: 600

}



.rera-detail-banner {

  position: absolute;

  right: 0;

  top: 109px;

  z-index: 9;

  background: 0 0;

  border: 2px solid rgba(255, 255, 255, .2);

  backdrop-filter: blur(13px);

  padding: 12px;

  border-radius: 7px 0 0 7px;

  box-shadow: 0 0 10px rgba(0, 0, 0, .1);

  max-width: 300px

}



.rera-detail-banner h3 {

  font-size: 15px;

  color: #fff;

  font-weight: 700

}



.rera-detail-banner a,

.rera-detail-banner p {

  color: #fff;

  font-size: 12px

}



.rera-detail-banner p {

  margin-bottom: 10px;

  line-height: 1.4;

  word-wrap: break-word

}



.rera-detail-banner .rera-id img {

  width: 60px;

  border: 0;

  margin: 0 5px 10px 0

}



@media(max-width:767px) {



  #footer .maharera,

  .cp-logo-mobile {

    display: block

  }



  #footer .socialLink {

    width: 100%

  }



  #footer {

    padding: 40px 0;

    text-align: center;

    height: 684px;

  }



  #footer .HeadOffice {

    margin-top: 0;

    padding-left: 0

  }



  .qr.mx-auto {

    width: 120px

  }



  .headingcomp {

    font-size: 30px

  }



  .headingcompsub {

    font-size: 25px

  }



  .cp-logo {

    display: none

  }



  .navbar-brand img {

    max-width: 120px

  }



  ul.amenities-list li {

    flex: 0 0 50%;

    width: 50%

  }



  .gallery-img {

    height: 200px !important

  }



  .add-part {

    padding-bottom: 20px

  }



  .cp-logo-mobile img {

    max-width: 100px

  }



  .marquee-banner-txt {

    top: 200px;

    font-size: 12px

  }



  .marquee-banner-txt .txt {

    padding: 7px 10px

  }



  .banner .container .caption>div {

    margin: 50px auto 0

  }



  .rera-detail-banner {

    top: 83px;

    max-width: 98%;

    margin: 0 auto;

    left: 0;

    border: 0;

    backdrop-filter: none;

    text-align: center

  }



  .rera-detail-banner a,

  .rera-detail-banner p {

    font-size: 10px

  }



  .rera-detail-banner h3 {

    font-size: 13px

  }

}