@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
 @import url('bootstrap.min.css');
 @import url('swiper-bundle.min.css');


 @font-face {
       font-family: 'New Order';
       src: url('../font/NewOrder-Regular.eot');
       src: url('../font/NewOrder-Regular.eot?#iefix') format('embedded-opentype'),
             url('../font/NewOrder-Regular.woff2') format('woff2'),
             url('../font/NewOrder-Regular.woff') format('woff'),
             url('../font/NewOrder-Regular.ttf') format('truetype'),
             url('../font/NewOrder-Regular.svg#NewOrder-Regular') format('svg');
       font-weight: normal;
       font-style: normal;
       font-display: swap;
 }

 @font-face {
       font-family: 'New Order';
       src: url('../font/NewOrder-Semibold.eot');
       src: url('../font/NewOrder-Semibold.eot?#iefix') format('embedded-opentype'),
             url('../font/NewOrder-Semibold.woff2') format('woff2'),
             url('../font/NewOrder-Semibold.woff') format('woff'),
             url('../font/NewOrder-Semibold.ttf') format('truetype'),
             url('../font/NewOrder-Semibold.svg#NewOrder-Semibold') format('svg');
       font-weight: 600;
       font-style: normal;
       font-display: swap;
 }

 @font-face {
       font-family: 'New Order';
       src: url('../font/NewOrder-Bold.eot');
       src: url('../font/NewOrder-Bold.eot?#iefix') format('embedded-opentype'),
             url('../font/NewOrder-Bold.woff2') format('woff2'),
             url('../font/NewOrder-Bold.woff') format('woff'),
             url('../font/NewOrder-Bold.ttf') format('truetype'),
             url('../font/NewOrder-Bold.svg#NewOrder-Bold') format('svg');
       font-weight: bold;
       font-style: normal;
       font-display: swap;
 }

 /* Custom Reset */
 body {
       font-family: "Inter", sans-serif;
 }


 .wrapper {
       overflow: hidden;
       padding: 120px 0 0 0;
 }

 a.active,
 a:focus,
 button:focus,
 button.active {
       outline: none;
 }

 a {
       text-decoration: none;
 }

 a:focus,
 a:hover,
 a:active {
       outline: 0;
       box-shadow: none;
 }

 a:focus,
 a:hover {
       text-decoration: none;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
       margin: 0;
       padding: 0;
       font-family: 'New Order';
 }

 a {
       text-decoration: none;
       transition: all 0.5s ease-in-out;
 }

 a:hover {
       text-decoration: none;
 }

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

 ul li {
       list-style: none;
 }

 p {
       margin: 0;
       padding: 0;
 }

 input:focus,
 select:focus,
 textarea:focus {
       outline: none;
 }

 img {
       border-style: none;
       display: inline-block;
       max-width: 100%;
       height: auto;
 }

 /* ==== HEADER ==== */
 header {
       background-color: #00676B;
       padding: 33px 0;
       position: fixed;
       width: 100%;
       left: 0;
       top: 0;
       z-index: 10;
 }

 .navbar {
       padding: 0;
 }

 .navbar-brand {
       padding: 0;
       margin: 0 0 0 24px;
 }

 .navbar-nav {
       gap: 32px;
 }

 .navbar-nav .nav-item .nav-link {
       padding: 0;
       color: #D2FDFF;
       font-size: 14px;
       font-weight: normal;
       font-family: "Inter", system-ui;
       line-height: 1;
 }

 .navbar-nav .nav-item .nav-link.active {
       color: #FFFFFF;
       font-weight: bold;
 }

 .headr-social ul {
       display: flex;
       align-items: center;
       gap: 12px;
 }

 .social-btn {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 52px;
       font-weight: bold;
       font-size: 14px;
       line-height: 1;
       color: #1D1D1B;
       gap: 8px;
       height: 44px;
 }

 .social-btn span {
       display: none;
 }

 .whatsapp {
       background-color: #25D366;
 }

 .phone {
       background-color: #00BDC5;
 }

 .contac-btn {
       color: #1D1D1B;
       font-weight: bold;
       font-size: 14px;
       line-height: 1;
       display: flex;
       align-items: center;
       justify-content: center;
       height: 44px;
       background-color: #D4A95E;
       width: 123px;
 }

 .appointment-btn {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       background-color: #D4A95E;
       height: 64px;
       color: #1D1D1B;
       font-weight: bold;
       line-height: 1;
       font-size: 14px;
       font-family: "Inter", system-ui;
       gap: 17px;
       padding: 0 27.5px;
 }

 /****** MOBILE HEADER *******/
 .menu-close {
       display: none;
 }

 /***** BANNER SEC ******/
 .banner-sec {
       padding: 24px 0;
 }

 .banner-inner {
       background: url(../images/banner-bg.png) no-repeat;
       background-position: center center;
       background-size: cover;
       padding: 72px 64px 0 64px;
       height: 324px;
 }

 .banner-inner span {
       color: #53535B;
       font-size: 16px;
       font-weight: 600;
       font-family: 'New Order';
       line-height: 1;
       text-transform: uppercase;
       display: block;
       margin: 0 0 24px 0;
 }

 .banner-inner h1 {
       color: #1D1D1B;
       font-size: 40px;
       line-height: 1;
       text-transform: uppercase;
       font-weight: bold;
       letter-spacing: 1.6px;
 }

 .banner-form {
       padding: 40px 64px;
       background: #FFF;
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
       max-width: 815px;
       width: 100%;
       margin: -115px auto 0;
 }

 .banner-form form label {
       color: #121212;
       font-weight: normal;
       font-size: 16px;
       line-height: 1;
       display: block;
       margin: 0 0 22px 0;
 }

 .form-inner {
       display: flex;
       align-items: center;
       gap: 8px;
 }

 .banner-form form .relative {
       position: relative;
       flex: 1;
 }

 .banner-form form .form-control {
       border: 1px solid #B3B3BB;
       height: 56px;
       border-radius: 0;
       box-shadow: none;
       color: #81818D;
       font-weight: normal;
       font-size: 14px;
       padding-left: 16px;
       line-height: normal;
 }

 .search-icon {
       display: flex;
       align-items: center;
       justify-content: center;
       position: absolute;
       top: 50%;
       transform: translate(0, -50%);
       right: 17px;
 }

 .look-btn {
       color: #1D1D1B;
       font-weight: bold;
       font-size: 14px;
       line-height: 1;
       font-family: "Inter", system-ui;
       display: flex;
       align-items: center;
       background-color: #D4A95E;
       height: 56px;
       width: 96px;
       justify-content: center;
 }

 .look-btn:hover {
       background-color: #00676B;
       color: #fff;
 }

 /***** TITLE *****/
 .title h2 {
       font-weight: bold;
       font-size: 40px;
       line-height: 1;
       color: #1D1D1B;
       text-transform: uppercase;
       border-bottom: 1px solid #CDCDD1;
       padding-bottom: 20px;
 }

 .title-small h2 {
       font-size: 32px;
 }

 .title p {
       color: #53535B;
       font-weight: normal;
       font-size: 14px;
       line-height: 24px;
       margin-top: 15px;
 }

 .explore-offer-sec {
       padding: 74px 0 64px;
 }

 .explore-offer-inner h4 {
       color: #121212;
       font-weight: bold;
       font-size: 20px;
       line-height: 1;
       text-transform: uppercase;
       text-align: center;
       margin: 34px 0 30px 0;
 }

 .explore-box {
       background-color: #FAF5ED;
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 64px;
       padding: 34px 15px;
 }

 .explore-box .text-box {
       text-align: center;
 }

 .explore-box .text-box h3 {
       color: #1D1D1B;
       font-weight: bold;
       font-size: 32px;
       line-height: 1;
       letter-spacing: 1.28px;
       text-transform: uppercase;
       margin-bottom: 16px;
 }

 .explore-box .text-box p {
       color: #53535B;
       font-size: 14px;
       font-weight: 400;
       line-height: 20px;
 }

 /**** OUR LOTS SEC *****/
 .our-lots-sec {
       padding: 66px 0 32px;
 }

 .our-lots-innr {
       margin: 16px 0 0 0;
 }

 .lots-box {
       background: #FFF;
       box-shadow: 0px 0px 32px 0px rgba(17, 17, 17, 0.12);
       padding: 26px 16px 16px 16px;
       margin: 16px 0;
 }

 .lots-box h4 {
       color: #1D1D1B;
       font-size: 24px;
       font-weight: bold;
       line-height: 1;
       letter-spacing: 0.96px;
       text-transform: uppercase;
 }

 .lots-box span {
       color: #53535B;
       font-size: 16px;
       font-weight: 400;
       line-height: 1;
       margin: 10px 0 14px 0;
       display: block;
 }

 .lots-box ul {
       display: flex;
       align-items: center;
       gap: 16px;
 }

 .lots-box ul li {
       display: flex;
       align-items: center;
       gap: 8px;
       color: #53535B;
       font-size: 16px;
       line-height: 1;
       font-weight: normal;
 }

 .lots-box .image-holder {
       display: flex;
       align-items: center;
       margin: 17px 0 18px;
 }

 .lots-box p {
       color: #53535B;
       font-weight: normal;
       font-size: 14px;
       text-transform: uppercase;
       line-height: 1;
       margin-bottom: 24px;
 }

 .lots-box h5 {
       color: #6B4F1D;
       font-weight: 600;
       font-size: 16px;
       line-height: 1;
       text-transform: uppercase;
       margin-bottom: 18px;
 }

 .more-btn {
       color: #fff;
       font-weight: bold;
       font-size: 14px;
       line-height: 1;
       display: flex;
       align-items: center;
       justify-content: center;
       background-color: #00676B;
       height: 56px;
       width: 100%;
 }

 .more-btn:hover {
       background-color: #D4A95E;
 }

 .see-all {
       margin: 16px 0 0 0;
 }

 .see-btn {
       height: 60px;
       max-width: 300px;
       display: flex;
       margin: 0 auto;
 }

 .see-btn:hover {
       background-color: #00676B;
       color: #fff;
 }

 .see-btn img {
       transition: all 0.5s ease-in-out;
 }

 .see-btn:hover img {
       filter: brightness(1000%);
       transition: all 0.5s ease-in-out;
 }

 /******* ABOUT SEC ******/
 .about-sec {
       padding: 90px 0;
 }

 .about-sec .title h2 {
       margin-bottom: 0;
       font-size: 32px;
 }

 .about-inner {
       margin: 24px 0 0 0;
       display: flex;
       align-items: center;
 }

 .about-box {
       background: #FFF;
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
       padding: 48px 48px;
       width: 636px;
       margin-left: -108px;
 }

 .about-box .text-box {
       margin-bottom: 32px;
 }

 .about-box .text-box h4 {
       color: #1D1D1B;
       font-weight: 700;
       letter-spacing: 0.96px;
       text-transform: uppercase;
       line-height: 1;
       margin-bottom: 10px;
       font-size: 24px;
 }

 .about-box .text-box p {
       color: #53535B;
       font-size: 16px;
       font-weight: 400;
       line-height: 24px;
 }

 .about-box .media {
       display: grid;
       grid-template-columns: 6fr 6fr;
       row-gap: 32px;
       column-gap: 8px;
 }

 .about-box .text-inner h4 {
       color: #00676B;
       font-size: 20px;
       letter-spacing: 0.8px;
       text-transform: uppercase;
       font-weight: 700;
       line-height: 1;
       padding-bottom: 6px;
       position: relative;
       margin-bottom: 10px;
 }

 .about-box .text-inner h4::after {
       position: absolute;
       content: "";
       left: 0;
       bottom: 0;
       background-color: #CDCDD1;
       height: 1px;
       width: 32px;

 }

 .about-box .text-inner p {
       color: #53535B;
       font-size: 16px;
       font-weight: 400;
       line-height: 24px;
 }

 /****** MAP *****/
 .map-sec {
       padding: 74px 0;
       position: relative;
 }

 .map-sec::after {
       position: absolute;
       content: "";
       left: 0;
       top: 0;
       background-color: #1D1D1B;
       height: 309px;
       width: 100%;
       z-index: -1;
 }

 .map-sec .title h2 {
       color: #fff;
 }

 .map-sec .title p {
       color: #B3B3BB;
 }

 .map-sec .image-holder {
       margin: 34px 0 0 0;
 }

 .map-sec .image-holder img {
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
 }

 /******* CTA SEC *******/
 .cta-sec {
       padding: 78px 0 64px;
 }

 .cta-inner {
       display: flex;
       align-items: center;
 }

 .cta-inner .image-holder {
       max-width: 804px;
       width: 100%;
 }

 .cta-box {
       background: #FFF;
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
       padding: 48px;
       width: 600px;
       margin-left: -108px;
 }

 .cta-box .text-box {
       margin-bottom: 36px;
 }

 .cta-box .text-box h4 {
       color: #1D1D1B;
       font-size: 24px;
       font-weight: bold;
       line-height: 1;
       letter-spacing: 0.96px;
       text-transform: uppercase;
       margin-bottom: 10px;
 }

 .cta-box .text-box p {
       color: #53535B;
       font-size: 16px;
       font-weight: 400;
       line-height: 24px;
 }

 .cta-box form .form-group {
       margin-bottom: 30px;
 }

 .cta-box form .form-group label {
       color: rgb(29, 29, 27, 0.64);
       font-weight: normal;
       font-size: 16px;
       line-height: 1;
       display: block;
       margin: 0 0 10px 0;
 }

 .cta-box form .form-group .form-control {
       border: 1px solid rgb(17, 17, 17, 0.24);
       border-radius: 0;
       height: 44px;
       color: #1D1D1B;
       font-weight: normal;
       font-size: 16px;
       padding-left: 14px;
       box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);

 }

 .cta-box form .form-group .form-control::placeholder {
       color: rgb(29, 29, 27, 0.32);
 }

 .cta-box form .form-group textarea.form-control {
       height: 130px;
 }

 .cta-box form .form-group .appointment-btn {
       border: none;
       width: 100%;
       height: 56px;
 }

 .cta-box form .form-group .appointment-btn:hover {
       color: #fff;
       background-color: #00676B;
 }

 /******* FOOTER ******/
 footer {
       background-color: #00676B;
       padding: 85px 0 0 0;
       border-top: 1px solid #000;
 }

 .footer-logo,
 .footer-logo a {
       display: flex;
       align-items: center;
       justify-content: center;
 }

 .footer-nav {
       padding: 48px 0 80px;
 }

 .footer-nav ul {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 40px;
 }

 .footer-nav ul li a {
       color: #FFFFFF;
       font-weight: normal;
       font-size: 16px;
       line-height: 1;
 }

 .copyright {
       display: flex;
       align-items: center;
       justify-content: space-between;
       border-top: 1px solid rgb(210, 253, 255, 0.24);
       padding: 33px 0;
 }

 .copyright p {
       color: #fff;
       font-weight: normal;
       font-size: 16px;
       line-height: 1;
 }

 .copyright ul {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 50px;
 }

 .copyright ul li a {
       display: flex;
       align-items: center;
 }

 .copyright ol {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 16px;
 }

 .copyright ol li a {
       display: flex;
       align-items: center;
       color: #fff;
       font-size: 16px;
       font-weight: normal;
       line-height: 1;
 }

 .copyright ol li a:hover,
 .footer-nav ul li a:hover {
       color: #D4A95E;
 }

 /***** COMPANY SEC ********/
 .company-sec {
       padding: 63px 0;
 }

 .company-sec .title {
       margin-bottom: 24px;
 }

 .company-inner {
       margin-bottom: 64px;
 }

 .company-inner:last-child {
       margin: 0
 }

 .company-inner .text-box {
       background: #FFF;
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
       padding: 54px 48px 48px 48px;
 }

 .company-inner .text-box h4 {
       color: #1D1D1B;
       font-size: 24px;
       font-weight: 700;
       letter-spacing: 0.96px;
       text-transform: uppercase;
       line-height: 1;
       border-bottom: 1px solid #CDCDD1;
       padding-bottom: 15px;
 }

 .company-inner .text-box p {
       color: #53535B;
       font-size: 16px;
       font-weight: 400;
       line-height: 24px;
       margin-top: 20px;
 }

 /***** LOTS PAGE ******/
 .lots-filter {
       margin: 34px 0 0 0;
 }

 .lots-filter form {
       display: flex;
       align-items: center;
       gap: 8px;
 }

 .lots-filter .form-group {
       position: relative;
       width: 148px;

 }

 .lots-filter .form-group .form-control {
       background-color: #FFFFFF;
       border: 1px solid #B3B3BB;
       border-radius: 0;
       box-shadow: none;
       font-weight: normal;
       font-size: 14px;
       height: 56px;
       line-height: 1;
       box-shadow: none;
       color: #53535B;
       padding-left: 16px;
 }

 .arrow-btn {
       position: absolute;
       top: 50%;
       transform: translate(0, -50%);
       right: 20px;
 }

 .filter-inner {
       flex: 1;
       width: 100%;
 }

 .filter-inner .form-group {
       flex: 1;
       width: 100%;
       margin-right: 8px;
 }

 .filter-inner {
       display: flex;
       align-items: center;
 }

 /***** PAGINATION *******/
 .pagination {
       border-top: 1px solid #CDCDD1;
       justify-content: center;
       margin-top: 16px;
 }

 .pagination ul {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 2px;
       padding: 16px 0;
 }

 .pag-link {
       color: #424343;
       font-weight: normal;
       font-size: 16px;
       line-height: 1;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 40px;
       height: 40px;
       border-radius: 8px;
 }

 .pag-link.active {
       background-color: #F1E2C9;
       color: #6B4F1D;
 }

 .pag-arrwo {
       display: flex;
       align-items: center;
       margin: 0 26px;
 }

 /****** LOTS DETAIL ********/
 .lots-detail-sec {
       padding: 63px 0;
 }

 .lots-detail-inner {
       margin: 30px 0 0 0;
 }

 .subdivision-detail {
       background: #FFF;
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
       padding: 24px 16px;
 }

 .subdivision-detail .text-box {
       margin-bottom: 36px;
 }

 .subdivision-detail .text-box h4 {
       color: #1D1D1B;
       font-weight: bold;
       font-size: 20px;
       line-height: 1;
       letter-spacing: 0.8px;
       text-transform: uppercase;
       margin-bottom: 12px;
 }

 .subdivision-detail .text-box p {
       color: #53535B;
       font-size: 14px;
       font-weight: 400;
       line-height: 20px;
 }

 .subdivision-detail .text-inner {
       margin-bottom: 34px;
 }

 .subdivision-detail .text-inner h4 {
       color: #00676B;
       font-size: 20px;
       font-weight: 700;
       letter-spacing: 0.8px;
       text-transform: uppercase;
       line-height: 1;
       position: relative;
       padding-bottom: 8px;
       margin-bottom: 10px;
 }

 .subdivision-detail .text-inner h4::after {
       position: absolute;
       content: "";
       left: 0;
       bottom: 0;
       background-color: #CDCDD1;
       height: 1px;
       width: 32px;
 }

 .subdivision-detail .text-inner p {
       color: #53535B;
       font-size: 14px;
       font-weight: 400;
       line-height: 20px;
 }

 .subdivision-detail .appointment-btn {
       font-size: 14px;
       height: 56px;
       width: 100%;
 }

 .subdivision-detail .appointment-btn:hover {
       background-color: #00676B;
       color: #fff;
 }

 .subdivision-detail .appointment-btn:hover img {
       filter: brightness(1000%);
       transition: all 0.5s ease-in-out;
 }

 .mySwiper {
       margin: 23px 0 0 0;
 }

 .mySwiper .swiper-slide,
 .houseSwiper2 .swiper-slide {
       border: 4px solid transparent;
       display: flex;
       align-items: center;
 }

 .swiper-slide.swiper-slide-thumb-active {
       border: 4px solid #00BDC5;
 }

 .lots-map-sec {
       padding: 44px 0;
 }

 .lots-map-sec .image-holder {
       margin: 40px 0 0 0;
 }

 .lots-map-sec .image-holder img {
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
 }

 .lots-map-inner {
       margin-top: 22px;
 }

 .lots-map-inner ul {
       display: flex;
       align-items: center;
       gap: 32px;
 }

 .lots-map-inner ul li {
       font-weight: bold;
       font-size: 16px;
       line-height: 1;
       color: #3C3C42;
       gap: 12px;
       display: flex;
       align-items: center;
 }

 .lots-map-inner ul li span {
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 50%;
       width: 24px;
       height: 24px;
 }

 .red-bg {
       background-color: #F96464;
 }

 .orange-bg {
       background-color: #FFB45E;
 }

 .green-bg {
       background-color: #52E93E;
 }

 /***** NEIGHBORHOOD *****/
 .neighborhoods-banner-sec {
       padding: 24px 0;
 }

 .neighborhoods-banner-sec .image-holder {
       position: relative;
 }

 .neighborhoods-banner-sec .image-holder .text-box {
       position: absolute;
       left: 0;
       width: 100%;
       bottom: 0;
       padding: 80px 64px;
 }

 .neighborhoods-banner-sec .image-holder .text-box span {
       color: #E6E6E8;
       font-weight: 600;
       font-size: 16px;
       letter-spacing: 0.64px;
       text-transform: uppercase;
       line-height: 1;
       font-family: 'New Order';
 }

 .neighborhoods-banner-sec .image-holder .text-box h3 {
       font-size: 40px;
       color: #fff;
       letter-spacing: 1.6px;
       text-transform: uppercase;
       line-height: 1;
       font-weight: bold;
       margin: 12px 0 20px;
 }

 .neighborhoods-banner-sec .appointment-btn {
       background-color: #00676B;
       color: #fff;
       height: 60px;
       max-width: 300px;
       width: 100%;
 }

 .neighborhoods-banner-sec .appointment-btn:hover {
       background-color: #D4A95E;
       color: #1D1D1B;
 }

 .neighborhoods-banner-sec .appointment-btn:hover img {
       filter: brightness(0);
       transition: all 0.5s ease-in-out;
 }

 .neighborhoods-banner-sec .appointment-btn img {
       filter: brightness(1000%);
       transition: all 0.5s ease-in-out;
 }

 .carousel-indicators {
       margin: 0;
       padding: 16px;
       gap: 8px;
 }

 .carousel-indicators [data-bs-target] {
       border: none;
       background-color: rgba(255, 255, 255, 0.32);
       border-radius: 100px;
       height: 4px;
       width: 32px;
       margin: 0;
       opacity: 1;
       transition: all 0.5s ease-in-out;
 }

 .carousel-indicators .active {
       width: 140px;
       transition: all 0.5s ease-in-out;
       background-color: #D4A95E;
 }

 .lots-map-sec.house-plan-sec {
       padding: 64px 0 30px;
 }

 .house-plan-sec .lots-detail-right {
       margin: 22px -10px 0;
 }

 .house-plan-sec .houseSwiper2 {
       padding: 10px 10px 16px;
 }

 .house-plan-sec .houseSwiper {
       padding: 10px 10px 16px;
 }


 .houseSwiper .image-holder img {
       box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.20), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
 }

 /******* CONTACT US *******/
 .contact-sec {
       padding: 84px 0 52px;
 }

 .contact-title span {
       color: #00676B;
       font-size: 16px;
       font-weight: 600;
       letter-spacing: 0.64px;
       text-transform: uppercase;
       line-height: 1;
       font-family: 'New Order';
 }

 .contact-title h3 {
       font-size: 40px;
       font-weight: 700;
       letter-spacing: 1.6px;
       text-transform: uppercase;
       line-height: 1;
       margin: 24px 0 36px 0;
 }

 .contact-title p {
       font-size: 16px;
       font-weight: 400;
       line-height: 24px;
       line-height: 1;
 }

 .contact-inner {
       margin: 68px 0 0 0;
 }

 .contact-box {
       background-color: #FAF5ED;
       padding: 24px;
 }

 .contact-box span {
       background-color: #00676B;
       width: 48px;
       height: 48px;
       display: flex;
       align-items: center;
       justify-content: center;
 }

 .contact-box h4 {
       color: #1D1D1B;
       font-weight: bold;
       font-size: 16px;
       line-height: 1;
       margin: 70px 0 12px 0;
 }

 .contact-box p {
       color: #53535B;
       font-weight: normal;
       font-size: 16px;
       margin-bottom: 26px;
       line-height: 24px;
 }

 .contact-box a {
       color: #00676B;
       font-weight: bold;
       font-size: 14px;
       line-height: 1;
       font-family: 'New Order';
       display: block;
 }

 .contact-box a:hover {
       color: #D4A95E;
 }

 /******* LOGIN ******/
 .login-sec {
       background-color: #F2F2F2;
       height: calc(100vh - 120px);
       display: grid;
       grid-template-columns: 6fr 6fr;
 }

 .login-left {
       height: 100%;
       padding: 0px 20px;
 }

 .login-top {
       height: calc(100vh - 216px);
       display: flex;
       align-items: center;
       justify-content: center;
 }

 .login-box {
       background: #FFF;
       box-shadow: 0px 0px 24px 0px rgba(17, 17, 17, 0.08);
       padding: 36px 24px 24px;
       max-width: 500px;
       width: 100%;
       margin: 0 auto;
 }

 .login-box .text-box {
       text-align: center;
       margin-bottom: 36px;
 }

 .login-box .text-box a {
       display: flex;
       align-items: center;
       justify-content: center;
 }

 .login-box .text-box h3 {
       color: #101828;
       font-weight: bold;
       font-size: 24px;
       line-height: 1;
       letter-spacing: 0.96px;
       text-transform: uppercase;
       margin: 42px 0 16px 0;
 }

 .login-box .text-box p {
       font-size: 16px;
       font-weight: 400;
       line-height: 24px;
       color: #667085;
 }

 .login-form form .form-group {
       margin-bottom: 24px;
 }

 .login-form form .form-group label {
       color: #3C3C42;
       font-weight: normal;
       font-size: 14px;
       line-height: 1;
       display: block;
       margin: 0 0 8px 0;
 }

 .login-form form .form-group .form-control {
       color: #53535B;
       font-size: 16px;
       font-weight: normal;
       padding-left: 14px;
       line-height: 1;
       border: 1px solid #CDCDD1;
       border-radius: 0;
       box-shadow: none;
       height: 44px;
       box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
       width: 100%;
 }

 .login-form form .form-group .relative {
       position: relative;
 }

 .eyes-btn {
       position: absolute;
       top: 50%;
       transform: translate(0, -50%);
       right: 14px;
 }

 .forgot-password {
       color: #00676B;
       font-size: 14px;
       font-weight: bold;
       line-height: 1;
       display: flex;
       align-items: center;
       justify-content: flex-end;
       font-family: 'New Order';
       padding: 8px 0 4px;
 }

 .forgot-password:hover {
       color: #D4A95E;
 }

 .login-form form .form-group .appointment-btn {
       border: none;
       width: 100%;
       height: 52px;
 }

 .login-form form .form-group .appointment-btn:hover {
       background-color: #00676B;
       color: #fff;
 }

 .login-bottom {
       padding: 41px 30px;
 }

 .login-bottom p {
       color: #475467;
       font-family: 'New Order';
       font-weight: bold;
       font-size: 14px;
       line-height: 1;
       text-align: center;
 }

 .login-sec .image-holder img {
       height: 100%;
       object-fit: cover;
       object-position: center center;
 }

 /****** ACCOUNT STATUS ******/
 .header-second {
       padding-left: 20px;
       padding-right: 20px;
 }

 .header-account {
       max-width: 1340px;
       width: 100%;
       margin: 0 auto;
       display: flex;
       align-items: center;
       justify-content: space-between;
 }

 .header-account-left {
       display: flex;
       align-items: center;
 }

 .header-account-left a {
       display: flex;
       align-items: center;
       margin-right: 36px;
       position: relative;
       z-index: 1000;
 }

 .header-account-left h4 {
       color: #fff;
       font-weight: bold;
       font-size: 24px;
       line-height: 1;
       text-transform: uppercase;
       padding: 0 16px;
       position: relative;
 }

 .header-account-left h4::after {
       position: absolute;
       content: "";
       left: 0;
       top: 50%;
       transform: translate(0, -50%);
       width: 1px;
       height: 80px;
       background-color: #fff;
 }

 .header-account-right .media {
       display: flex;
       align-items: center;
       justify-content: flex-end;
       gap: 12px;
 }

 .header-account-right .media .text-box {
       text-align: right;
 }

 .header-account-right .media .text-box h4 {
       color: #fff;
       font-weight: 600;
       font-size: 16px;
       line-height: 1;
       text-transform: uppercase;
       margin-bottom: 6px;
 }

 .header-account-right .media .text-box a {
       color: #D2FDFF;
       font-weight: normal;
       font-size: 14px;
       line-height: 1;
       text-decoration: underline;
       display: flex;
       justify-content: flex-end;
       align-items: center;
 }

 .header-account-right .media .image-holder {
       display: flex;
       align-items: center;
       justify-content: center;
       background-color: rgb(0, 189, 197, 0.24);
       width: 40px;
       height: 40px;
       border-radius: 50%;
 }

 .account-status-page .contact-box a {
       text-decoration: underline;
 }

 .account-status-page .footer-logo {
       margin-bottom: 66px;
 }

 /******* CONTRACT LIST *******/
 .contract-inner{
      margin: 70px 0 0 0;
 }
 .contract-detail {
       border: 1px solid #A6A6A6;
       border-radius: 2px;
       box-shadow: 0px 0px 48px 0px rgba(17, 17, 17, 0.08);
 }

 .contract-detail .lots-filter {
       margin: 0;
       background-color: #D4A95E;
       padding: 16px;
       border-radius: 2px 2px 0 0;
 }

 .contract-detail .lots-filter form {
       gap: 24px;
 }

 .contract-detail .filter-inner .form-group {
       margin-right: 0;
 }

 .contract-detail .lots-filter .form-group .form-control {
       height: 36px;
       border-radius: 2px;
       padding-left: 16px;
       box-shadow: none;
       border: none;
       color: #B3B3BB;
 }

 .contract-detail .lots-filter .form-group .form-control::placeholder {
       color: #B3B3BB;
 }

 .contract-detail .lots-filter .form-group {
       width: 300px;
 }

 table {
       width: 100%;
 }

 thead tr th {
       color: #1D1D1B;
       letter-spacing: 0.56px;
       text-transform: uppercase;
       line-height: 1;
       font-size: 14px;
       font-weight: 600;
       font-family: 'New Order';
       text-align: center;
       background-color: #D4A95E;
       padding: 15px 5px;
 }
 tbody tr td {
      color: #1F1B24; 
      text-transform: uppercase;
      line-height: 1;
      font-size: 16px;
      font-weight: 400;
      text-align: center;
      background-color: #fff;
      padding: 28px 5px;
      border-bottom: 1px solid #D3D1D1;
}
tbody tr td a{
      text-decoration-line: underline;
      color: #60B4E8;
      display: flex;
      align-items: center;
      justify-content: center;
}
tbody tr:last-child td{
      border: none;
 }
 tbody tr:last-child td:first-child{
      border-radius: 0 0 0 2px;
 }
 tbody tr:last-child td:last-child{
      border-radius: 0 0 2px 0;
 }