@font-face {
    font-family: "Gotham-Medium";
    src: url("../fonts/Kabel+Book+BT.ttf");
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-02DC;
}

@font-face {
    font-family: "Gotham Bold";
    src: url("../fonts/Kabel+Book+BT.ttf");
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-02DC;
}

@font-face {
    font-family: "Gotham";
    src: url("../fonts/Kabel+Book+BT.ttf");
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-02DC;
}

@font-face {
    font-family: "Gotham-Book";
    src: url("../fonts/Kabel+Book+BT.ttf");
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-02DC;
}

@font-face {
    font-family: "Gotham-Book";
    src: url("../fonts/Kabel+Book+BT.ttf");
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-02DC;
}

@font-face {
    font-family: Galano;
    src: url("../fonts/GalanoGrotesqueAltSemiBold.otf");
}

@font-face {
    font-family: Galanolight;
    src: url("../fonts/GalanoGrotesqueAltRegular.otf");
}

html,
body {
    padding: 0;
    margin: 0;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    font-family: "Gotham-Book";
    color: #513016;
}

html::-webkit-scrollbar {
    background-color: #513016 !important;
    width: 10px;
}

html::-webkit-scrollbar-thumb {
    background-color: #513016;
    border-radius: 5px;
}

html::-webkit-scrollbar-track {
    background-color: #ffffff;
    -webkit-box-shadow: inset 0 0 6px #5130164d;
}

a,
img,
button,
input[type="submit"] {
    text-decoration: none;
    outline: none;
    border: 0;
}

j {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.container {
    max-width: 1200px;
    margin: 0px auto;
    padding: 0 20px;
}

.clearfix {
    clear: both;
}

.pull-left {
    float: left !important;
}

.pull-right {
    float: right !important;
}

.text-left {
    text-align: left;
}

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

.text-right {
    text-align: right;
}

.text-justify {
    text-align: justify;
    font-family: Galanolight;
}

.img-responsive {
    max-width: 100%;
    height: auto;
}

.img-full {
    width: 100%;
    height: auto;
}

.center-block {
    margin: 0 auto;
}

.col-1 {
    width: 8.333333333333333%;
}

.col-2 {
    width: 16.66666666666667%;
}

.col-3 {
    width: 25%;
}

.col-4 {
    width: 33.33333333333333%;
}

.col-5 {
    width: 41.66666666666667%;
}

.col-6 {
    width: 50%;
}

.col-7 {
    width: 58.33333333333333%;
}

.col-8 {
    width: 66.66666666666667%;
}

.col-9 {
    width: 75%;
}

.col-10 {
    width: 83.33333333333333%;
}

.col-11 {
    width: 91.66666666666667%;
}

.col-12 {
    width: 100%;
}

.col-12-5 {
    width: 20%;
}

.w70 {
    width: 70%;
}

.w30 {
    width: 30%;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col-12-5,
.w30,
.w70 {
    float: left;
}

.wrap {
    display: table;
}

.block {
    display: table-cell;
    vertical-align: middle;
}

.float-none {
    /*float: none !important;*/
}

section {
    float: left;
    width: 100%;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

header {
    position: fixed;
    z-index: 999;
    left: 0;
    top: 0;
    width: 100%;
    /* padding: 25px 0px; */
    background-color: #513016;
    transition: ease all 0.5s;
}

.logo-wrapper {
    position: absolute;
    left: 0;
    top: -14px;
    padding: 0px;
    /* background-color: #ffffff; */
    /*height: 122px;*/
    /*border-bottom: 5px solid #156947;*/
}

.section-padding {
    padding: 110px 0px;
}

.section-extra-padding {
    padding: 170px 0px;
}

.logo-wrapper>a,
.logo-wrapper>a>img {
    display: block;
    /* width: 60px; */
    margin-top: -11px;
    filter: drop-shadow(0px 0px 0px #ffffffa8);
}

.number-wrapper {
    font-family: "ProximaNovaA-Semibold" !important;
    margin-right: 10px;
    font-size: 16px !important;
    line-height: 30px !important;
    width: 170px;
    display: inline-block;
    line-height: 30px !important;
    color: #fff !important;
    text-align: right;
}

.enquire-now-btn {
    background-color: #156947;
    padding: 0px 10px;
    color: #fff;
    line-height: 30px;
    font-size: 14px;
    cursor: pointer;
    -webkit-transition: 1s;
    /* Safari */
    transition: 1s;
    font-family: "ProximaNova-Bold";
}

footer {
    width: 100%;
    line-height: 32px;
    background-color: #513016;
    padding: 10px 0px;
    color: #fff;
    font-size: 15px;
    text-align: center;
}

footer a {
    color: #fff;
    vertical-align: middle;
}

footer a img {
    vertical-align: middle;
}

.enquire-form {
    width: 300px;
    position: absolute;
    background: rgba(81, 48, 22, 1);
    right: 20px;
    top: 30px;
    border: 1px solid #513016;
    padding: 10px;
    display: none;
}

.nav-wrapper {
    clear: right;
}

nav {
    /*margin-top: 10px;*/
}

nav a {
    display: inline-block;
    margin: 0px 0px 0px 15px;
    text-transform: capitalize;
    color: #fff !important;
    font-size: 18px;
    cursor: pointer;
    font-family: "Gotham-Medium";
    padding: 25px 10px;
    text-decoration: none !important;
    transition: 0.3s;
    font-family: Galano;
}

nav a.active {
    color: #ffffff;
    border-bottom: 2px solid #ffffff;
}

nav a:hover {
    color: #ffffff !important;
}

.lh30 {
    line-height: 30px;
}

.slide {
    height: 100%;
    width: 100%;
    background-position: center;
    background-size: cover;
}

.proximity-section {
    /* background: url(../images/BG.webp) center; */
    background-position: center;
    background-size: cover;
}

/*.home-slide1{*/

/*background-image: url(../images/Pittie_Kourtyard_Banner1.webp)*/

/*}*/

/*.home-slide2{*/

/*background-image: url(../images/Pittie_Kourtyard_Banner2.webp)*/

/*}*/

/*.home-slide3{*/

/*background-image: url(../images/Pittie_Kourtyard_Banner3.webp)*/

/*}*/

.section-title {
    font-size: 40px;
    /*margin-bottom: 20px;*/
    font-family: "Gotham Bold";
    color: #156947;
    text-align: center;
    font-family: Galano;
}

.section-subtitle {
    font-size: 25px;
    margin-bottom: 50px;
    font-family: "Gotham-Medium";
    text-align: center;
    font-family: Galanolight;
}

.section-subtitle:after {
    content: "";
    position: absolute;
    left: 24%;
    height: 2px;
    width: 52%;
    background-color: #156947;
    bottom: -22px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fwbold {
    font-family: "ProximaNova-Bold";
}

.section-subtitle-white {
    font-size: 25px;
    margin-bottom: 50px;
    font-family: "ProximaNovaA-Semibold";
}

.section-subtitle-white:after {
    content: "";
    position: absolute;
    left: 0px;
    height: 1px;
    width: 100%;
    background-color: #fff;
    bottom: -22px;
}

.specs-subtitle-white {
    font-size: 18px;
    margin-bottom: 50px;
    font-family: "ProximaNovaA-Semibold";
}

.specs-subtitle-white:after {
    content: "";
    position: absolute;
    left: 0px;
    height: 1px;
    width: 100%;
    background-color: #fff;
    bottom: -22px;
}

.specs-list li {
    list-style-type: none;
}

.specs-list li a {
    color: #ffffff;
    font-size: 18px;
    padding: 10px 0px;
    display: block;
    position: relative;
}

.specs-list li a:before {
    content: "";
    position: absolute;
    left: -17px;
    top: 20px;
    width: 5px;
    height: 5px;
    background: #513016;
    border-radius: 10px;
}

.f28 {
    font-size: 28px;
    color: #fff;
}

.specs-list {
    padding-left: 15px;
    z-index: 99;
    width: 90%;
}

.specs-list:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    background-color: #fff;
    width: 1px;
    height: 100%;
    z-index: -1;
}

.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 5% !important;
    font-size: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(81, 48, 22, 0.6);
    background-color: rgba(81, 48, 22, 0);
    filter: alpha(opacity=50);
    opacity: 0.5;
}

.active-specs {
    background-color: #156947;
    color: #513016 !important;
    margin-left: -15px;
    padding: 10px 15px !important;
    border-radius: 0px 20px 20px 0px;
    /*width: 250px;*/
}

.active-specs:before {
    content: "";
    position: absolute;
    left: -17px;
    top: 20px;
    width: 0px !important;
    height: 0px !important;
    background: #513016;
    border-radius: 10px;
}

.content-wrapper p {
    font-weight: 300;
    text-align: center;
    font-family: Galanolight;
}

.specs-tab {
    display: none;
}

.carousel-control.left,
.carousel-control.right {
    background-image: unset;
}

.specs-tab ul {
    padding-left: 0px;
}

.specs-tab li {
    padding: 5px 20px;
    position: relative;
    list-style-type: none;
    color: #fff;
}

.specs-tab ul li:before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 10px;
    position: absolute;
    left: 0;
    top: 24px;
    background: #fff;
}

.specs-title {
    font-size: 30px;
}

.specs-right {
    padding: 0px 50px;
}

.grey {
    color: #513016;
}

.amenities {
    width: 70%;
    margin: 20px auto;
}

.amenities-img {
    width: 30%;
    margin: 30px auto;
}

#amenities .owl-carousel .owl-stage-outer {
    padding: 30px 0px;
}

.amenities-text {
    width: 70%;
    margin: 0 auto;
    font-size: 17px;
    padding: 14px 10px;
}

section.grey {
    background-color: #ffffff;
}

section p,
section ul,
section ol {
    font-size: 16px;
    line-height: 28px;
}

.hide-in-desktop {
    display: none;
}

.tagline {
    right: 15px;
    top: 290px;
    text-align: left;
    position: absolute;
}

.tagline-left {
    left: 15px;
    top: 260px;
    text-align: left;
    position: absolute;
}

.tagline-top {
    font-size: 60px;
    color: #fff;
    line-height: 54px;
    margin-bottom: 20px;
    font-family: "Exo2-SemiBold";
}

.tagline-bottom {
    font-size: 26px;
    color: #156947;
    font-family: "Exo2-SemiBold";
}

.white {
    color: #fff;
}

.golden {
    color: #513016;
}

.banner-bottom-tagline {
    width: 100%;
    left: 0px;
    text-align: center;
    /*bottom: 0px;*/
    z-index: 99;
    background: #513016;
    padding: 10px 0px;
    font-size: 18px;
    font-family: "Exo2-SemiBold";
}

.banner-bottom-tagline>.col-6:first-child {
    border-right: 1px solid #fff;
}

.banner-bottom-tagline span {
    font-size: 25px;
}

.box {
    width: 50%;
    float: left;
    padding: 10px;
    min-height: 235px;
}

.box-text {
    font-size: 20px;
    padding: 0px 10px;
    font-family: "Gotham-Medium";
}

.box ul {
    font-size: 15px;
    padding-left: 14px;
}

.box1 {
    border-right: 1px solid #156947;
    border-bottom: 1px solid #156947;
}

.box2 {
    border-bottom: 1px solid #156947;
}

.box3 {
    border-right: 1px solid #156947;
}

/* PAGER */

.bx-wrapper .bx-pager {
    position: absolute;
    bottom: 120px;
    width: 100%;
    z-index: 99;
}

.bx-wrapper .bx-pager {
    text-align: center;
    font-size: 0.85em;
    font-family: Arial;
    font-weight: bold;
    color: #513016;
    padding-top: 20px;
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #fff;
    text-indent: -9999px;
    display: block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    outline: 0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
    background: #156947;
}

.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
    display: inline-block;
    vertical-align: bottom;
    /* *zoom: 1;
    *display: inline; */
}

.bx-wrapper .bx-pager-item {
    font-size: 0;
    line-height: 0;
}

.padding {
    padding: 40px 0px;
}

.specification-bg {
    background-image: url(../images/SpecificationsBG.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: initial !important;
}

/* form */

.form-group {
    margin-bottom: 15px;
}

.contactuslabels {
    color: #156947;
}

.form-group input {
    position: relative;
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #513016;
    background-color: #fff;
    background-image: none;
    border: 1px solid #513016;
    /* border-radius: 4px; */
    -webkit-box-shadow: inset 0 1px 1px rgba(81, 48, 22, 0.075);
    box-shadow: inset 0 1px 1px rgba(81, 48, 22, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    font-family: Galanolight;
}

.submit {
    cursor: pointer;
    background: #156947;
    color: #fff;
    padding: 10px;
}

.error {
    color: #513016 !important;
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 14px;
}

label.error {
    /*position: absolute;*/
    /* top: 62px; */
}

.hide-in-mobile {
    display: block;
}

.footer-mobile {
    display: none;
}

.top-padding {
    padding-top: 70px;
}

.banner-bottom-tagline .col-6 {
    padding: 0 10px;
}

.dir li {
    color: #513016;
    list-style: none;
    /* width: 335px; */
    background: #ffffff;
    margin: 18px auto;
}

.aminitieslist li {
    font-size: 17px;
    padding: 15px 10px;
    margin-bottom: 10px;
    line-height: 23px;
    font-weight: 500;
    text-align: left;
    display: flex;
    font-family: Galanolight;
    border: 2px solid #156947;
    justify-content: center;
}

.aminitieslist li::before {
    content: url(../images/leaf1.webp);
    margin-right: 10px;
}

.overview-parallax {
    width: 80%;
    margin: 0 auto;
    background-attachment: fixed;
    /*height: 512px;*/
    background-repeat: round;
}

.overview-parallax img {
    /*margin-top: 233px;*/
}

.left-padding {
    padding-left: 50px;
}

/* style for new sections like contact form*/

.form-p {
    text-align: center;
    margin-bottom: 20px !important;
    color: #513016;
    font-family: Galanolight;
}

.contact1 {
    background-color: #513016;
    padding: 40px;
    height: 100%;
}

#contact {
    background-image: url(../images/gallery/amenities/15.webp);
    background-size: cover;
    background-position: center;
    /* padding: 40px; */
}

.intl-tel-input {
    width: 100%;
}

.form-btn {
    margin: 0px auto;
    display: block;
    background: #156947;
    border: 2px solid #156947;
    color: #fff;
    font-size: 18px;
    padding: 8px 39px 8px;
    transition: ease all 0.5s;
    font-family: Galanolight;
}

.form-btn:hover {
    border-color: #ffffff;
    background: transparent;
    color: #fff;
    transition: ease all 0.5s;
}

.contact-div {
    padding-bottom: 20px;
}

#contctform-phone {
    width: 100%;
}

#price-model {
    z-index: 9999 !important;
    opacity: 1;
}

.her {
    background-color: #513016;
    color: #fff;
    border-bottom: none !important;
}

.tbl>tbody>tr>td {
    border-top: none !important;
    vertical-align: middle;
    position: relative;
    z-index: 99;
    font-family: Galanolight;
}

.her h3 {
    margin: 8px 0px;
    font-family: Galano;
}

.modal-dialog {
    top: 50px;
    background: transparent !important;
}

.modal-header {
    background: #513016;
    color: #fff;
    font-family: Galano;
}

.modal-header .close {
    color: #fff !important;
    opacity: 1 !important;
    margin-top: -25px;
}

input,
select {
    height: 40px;
    width: 100%;
    padding-left: 9px;
    border: none;
    background: #ffffff;
}

.form-group {
    height: 40px;
    margin-bottom: 20px;
}

.input-group-addon {
    background: #513016;
    color: #fff;
    border: 0;
}

#main-popup input,
#main-popup select {
    height: 40px;
    width: 100%;
    padding-left: 9px;
    border: none;
    background: #ffffff;
}

#main-popup .form-group {
    height: 40px;
    margin-bottom: 20px;
}

#main-popup .input-group-addon {
    background: #513016;
    color: #fff;
    border: 0;
}

.price-btn {
    margin: 0px auto;
    display: block !important;
    background-image: none;
    background-color: #513016 !important;
    text-shadow: none;
    color: #fff;
    border-color: #513016;
    border-radius: 5px;
    padding: 10px 20px 10px 20px;
    transition: all 0.5s ease;
    font-weight: 800;
    font-family: Galanolight;
}

.modal-backdrop.fade {
    opacity: 0.5;
    z-index: unset;
}

/*----accordian starts--*/

#accordion .panel {
    border: none;
    box-shadow: none;
    border-radius: 10px;
    margin-bottom: 10px;
    background: transparent;
}

.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    color: inherit;
}

.panel-default>.panel-heading {
    color: #513016;
    background-color: transparent;
    border-color: #513016;
    padding: 0;
}

#accordion .panel-title a {
    display: block;
    padding: 12px 34px;
    font-size: 15px;
    background: #513016;
    font-weight: 600;
    height: 40px;
    color: #fff;
    /* background: #513016; */
    text-transform: uppercase;
    border: none;
    position: relative;
    text-decoration: none;
    /* border-top-left-radius: 20px; */
    /* border-top-right-radius: 20px; */
    transition: all 0.3s ease 0s;
    font-family: Galanolight;
}

#accordion .panel-title a.collapsed:after {
    content: "\f067";
}

#accordion .panel-title a:after,
#accordion .panel-title a.collapsed:after {
    content: "\f068";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    width: 40px;
    height: 40px;
    line-height: 32px;
    /* border-radius: 50%; */
    background-color: #513016;
    text-align: center;
    font-size: 15px;
    color: #fff;
    border: 5px solid #fff;
    position: absolute;
    top: 0px;
    border-radius: -22px;
    right: -18px;
    transition: all 0.3s ease 0s;
}

#accordion .panel-title a:hover:after,
#accordion .panel-title a.collapsed:hover:after {
    transform: rotate(360deg);
}

#accordion .panel-body {
    padding: 0px 25px;
    background: #fff;
    font-size: 14px;
    color: #156947;
    background-color: #513016;
    line-height: 25px;
    border-top: none;
    position: relative;
    /* border-bottom-left-radius: 20px; */
    /* border-bottom-right-radius: 20px; */
}

#accordion .panel-body p {
    background: #ffffff;
    padding: 7px 10px;
    margin: 10px 0px;
    color: #513016;
    font-family: Galanolight;
}

#accordion .panel-title a.collapsed:after {
    content: "\f067";
}

/*----accordian ends--*/

.her1 {
    padding: 15px 10px !important;
}

@media all and (max-width: 1366px) {
    .overview-parallax {
        width: 75%;
    }
    .tagline {
        top: 210px;
    }
    .tagline-left {
        left: 120px;
        top: 150px;
    }
}

@media all and (max-width: 1024px) {
    .logo-wrapper {
        left: 20px;
    }
    .box {
        min-height: 270px;
    }
}

@media all and (max-width: 768px) {
    /* .download-custom {
        position: fixed !important;
        bottom: 92% !important;
        right: 53px !important;
        transition: 0.4s ease-in !important;
        z-index: 999 !important;
        background-color: #156947 !important !important;
        width: fit-content !important;
        font-weight: 600 !important;
        font-size: 12px !important;
        padding: 5px !important !important;
        border: 2px solid #ffffff !important;
        z-index: 9999 !important;
    } */
    .banner-bottom-tagline span {
        font-size: 23px;
    }
    .box {
        width: 100%;
        min-height: auto;
    }
    .box1,
    .box2,
    .box3,
    .box4 {
        border: 0px;
    }
    .overview-parallax {
        height: auto;
        background-image: none;
        width: 100%;
    }
    .overview-parallax img {
        margin-top: 0px;
    }
}

@media all and (max-width: 767px) {
    .aminitieslist li {
        font-size: 13px !important;
    }
    #overview .flex-box {
        display: flex;
        justify-content: center;
        flex-direction: column-reverse;
        align-items: center;
    }
    .head-line {
        width: 210px !important;
        height: 22px !important;
    }
    .footer-mobile {
        display: block;
        position: fixed;
        bottom: 0px;
        left: 0px;
        z-index: 999;
        width: 100%;
        background-color: #513016;
        padding: 5px;
        text-align: center;
        color: #fff;
        font-family: "ProximaNovaA-Semibold";
    }
    #form_success {
        color: #513016 !important;
    }
    .overview-parallax {
        height: auto;
        background-image: none;
        width: 100%;
    }
    .left-padding {
        padding-left: 0px;
    }
    .overview-parallax img {
        margin-top: 0px;
    }
    .hide-in-desktop {
        display: block;
    }
    /*footer {*/
    /*display: none;*/
    /*}*/
    .close-btn {
        display: block;
        right: 10px;
        font-weight: bold;
    }
    .enquire-form {
        display: none;
        position: fixed;
        left: 0;
        bottom: 30px;
        top: 0;
        background-color: rgba(255, 255, 255, 0.92);
        height: 95%;
        z-index: 9999;
        -webkit-transition: all 400ms ease-out;
        transition: all 400ms ease-out;
        -webkit-transition-duration: 500ms;
        transition-duration: 500ms;
        -webkit-overflow-scrolling: touch;
        padding: 5%;
        overflow-y: scroll;
        padding-bottom: 0px;
        width: 100%;
    }
    .banner-bottom-tagline .col-6 {
        width: 100%;
    }
    .banner-bottom-tagline span {
        font-size: 18px;
    }
    .banner-bottom-tagline {
        font-size: 15px;
    }
    .tagline-top {
        font-size: 26px;
        line-height: 32px;
        margin-top: 10px;
    }
    .tagline-bottom {
        font-size: 20px;
        line-height: 24px;
    }
    .tagline {
        top: 170px;
        width: 90%;
    }
    .tagline-left {
        top: 300px;
    }
    .enquire-now-wrapper {
        display: none;
    }
    header {
        padding: 35px 0px;
    }
    .banner-bottom-tagline>.col-6:first-child {
        border-right: 0px solid #fff;
        margin-bottom: 10px;
    }
    .logo-wrapper {
        top: -24px;
        height: auto;
        z-index: 99;
    }
    .logo-wrapper>a,
    .logo-wrapper>a>img {
        display: inline-block;
        /* width: 50px; */
        transition: 0.8s;
        margin-top: -11px;
        width: 100px !important;
        margin-left: -13px;
    }
    .nav-wrapper {
        width: 100%;
        margin-top: 0px;
        position: absolute;
        background-color: #513016;
        top: 35px;
        left: 0;
        display: none;
    }
    nav a {
        display: block;
        text-align: center;
        margin: 0px;
        padding: 12px 0px;
    }
    .burger-menu {
        display: block;
        position: absolute;
        right: 20px;
        top: -8px;
        font-size: 18px;
        color: #fff;
    }
    .col-left,
    .col-right {
        width: 100%;
    }
    .section-title {
        font-size: 30px;
        text-align: center;
    }
    .section-subtitle {
        font-size: 20px;
        margin-bottom: 36px;
        text-align: center;
    }
    .amenities {
        width: 100%;
    }
    .hide-in-mobile {
        display: none;
    }
    .box {
        width: 100%;
        padding: 10px 5px;
        min-height: 0px;
    }
    .box1,
    .box2,
    .box3,
    .box4 {
        border: 0px;
    }
    button.accordion {
        background-color: #513016;
        color: #fff;
        cursor: pointer;
        padding: 0px;
        width: 100%;
        border: none;
        text-align: left;
        outline: none;
        font-size: 17px;
        transition: 0.4s;
        /* padding: 10px; */
    }
    .acc-content {
        display: inline-block;
        padding: 10px;
    }
    button.accordion:after {
        content: "\02795";
        font-size: 13px;
        color: #fff;
        float: left;
        margin-left: 0px;
        /* background-color: #156947; */
        padding: 12px 15px;
    }
    button.accordion.active:after {
        content: "\2796";
    }
    /* div.panel {
        padding: 0 0px;
        background-color: transparent;
        max-height: 0;
        overflow: hidden;
        transition: 0.6s ease-in-out;
        opacity: 0;
    } */
    .accordian-specs {
        margin-top: 20px;
    }
    div.panel.show {
        opacity: 1;
        max-height: 800px;
    }
    div.panel ul {
        padding: 0 30px;
        font-size: 17px;
        line-height: 28px;
    }
    .full-height {
        height: auto !important;
    }
    .mobile-accordian {
        margin-top: 20px;
    }
    .specification-bg {
        background-color: #156947;
        background-image: none;
    }
    .wrap {
        display: block;
    }
    .block {
        display: block;
        vertical-align: middle;
    }
    .box-title .pull-left {
        display: inline-block;
    }
}

#contact-form input,
#contact-form select {
    height: 40px;
    border: none;
    width: 100%;
    padding-left: 8px;
    background: #fff;
}

#contact-form .input-group-addon {
    background: #513016;
    color: #fff;
    border: 0;
}

.form-ico {
    font-size: 19px !important;
}

#contact-form textarea {
    border: none;
    resize: none;
    /*height: 40px;*/
}

#contact-form .form-group {
    height: 40px;
    margin-bottom: 23px;
}

#contact-form .selected-flag {
    background: #513016;
    width: 39px;
    border-radius: 3px 0px 0px 3px;
    height: 40px;
}

#contact-form .flag-container {
    padding: 0px !important;
}

@media only screen and (max-width: 380px) {
    .her h3 {
        font-size: 15px;
    }
}

@media only screen and (max-width: 580px) {
    .tbl-holder {
        overflow: scroll;
    }
    /* .tbl{
        width: 510px !important;
    } */
}

.msgicon {
    height: 100px;
    width: 100px;
    border: 4px solid #fff;
    font-size: 39px;
    background: #513016;
    color: #fff;
    border-radius: 50%;
    padding: 20px;
    text-align: center;
    margin: 0px auto;
    display: block;
}

.oops {
    /*color: #fff;*/
    text-align: center;
    font-size: 50px;
    margin-top: 20px;
    margin-bottom: 20px;
    font-family: Galano;
}

.oops-subtitle {
    /*color: #fff;*/
    font-size: 18px;
    font-family: Galanolight;
}

.go-home {
    color: #156947;
    background: #fff;
    font-size: 19px;
    padding: 10px;
    width: 225px;
    margin: 0px auto;
    margin-top: 30px;
    border-radius: 5px;
    transition: ease 0.5s;
    font-family: Galanolight;
}

.go-home:hover {
    transition: ease 0.5s;
    color: #fff;
    background: #513016;
    border-radius: 25px;
}

.oops-greet {
    color: #156947;
    font-size: 25px;
    font-weight: 600;
    margin-bottom: 15px;
    font-family: Galano;
}

button.btn.btn-danger.interested {
    position: fixed;
    bottom: 15px;
    left: 15px;
    transition: 0.4s ease-in;
    z-index: 999;
    background-color: #156947;
    width: 160px;
    font-weight: 600;
    font-size: 20px;
    padding: 5px;
    border: 2px solid #ffffff;
    font-family: Galano;
}

.download-custom {
    position: fixed;
    bottom: 15px;
    right: 15px;
    transition: 0.4s ease-in;
    z-index: 999;
    background-color: #156947 !important;
    width: fit-content;
    font-weight: 600;
    font-size: 20px;
    padding: 5px !important;
    border: 2px solid #ffffff;
    font-family: Galano;
}

.mobile-bro {
    transition: 0.4s ease-in;
    z-index: 999;
    background-color: #156947 !important;
    font-weight: 600;
    font-size: 15px;
    padding: 5px !important;
    border: 2px solid #ffffff;
    position: absolute;
    right: 38px;
    top: -15px;
    border: none !important;
}

.interested-div {
    display: none;
    position: fixed;
    bottom: 15px;
    right: 15px;
    border: 5px solid #156947;
    /*padding: 2%;*/
    border-radius: 5px;
    background-color: #ffffff;
    z-index: 999;
    transition: 0.4s ease-in;
    padding-top: 40px;
    padding-bottom: 10px;
    width: 300px;
}

.interested-div-close {
    position: absolute;
    right: 0px;
    bottom: auto;
    top: -1%;
    padding: 7px;
    color: #ffffff;
    font-size: 12px;
    line-height: 14px;
    border: 1px none #ffffff;
    background-color: #156947;
    font-weight: bolder;
}

p.popup-title {
    text-align: center;
    font-size: 20px;
    color: black;
}

p.inner-interested {
    position: absolute;
    top: 0vh;
    left: 0vh;
    text-transform: uppercase;
    font-weight: bold;
    background-color: #156947;
    width: 100%;
    padding: 1%;
    text-align: center;
    color: white;
}

#float-form input,
#video-form-1 input,
#broch-form input,
#price-popup input,
#video-form-2 input,
select {
    height: 40px;
    border: none;
    padding-left: 9px;
    width: 100%;
    background: #ffffff;
}

#float-form .input-group-addon,
#video-form-1 .input-group-addon,
#video-form-2 .input-group-addon {
    background: #513016;
    color: #fff;
    border: 0;
}

#float-form .form-ico {
    font-size: 19px !important;
}

#float-form .form-group {
    height: 40px;
    margin-bottom: 23px;
}

#float-form .selected-flag {
    background: #513016;
    width: 39px;
    border-radius: 3px 0px 0px 3px;
    height: 40px;
}

#floor-form input,
#floor-form select {
    height: 40px;
    border: none;
    padding-left: 9px;
    width: 100%;
    background: #ffffff;
}

#floor-form .input-group-addon {
    background: #156947;
    color: #fff;
    border: 0;
}

#floor-form .form-ico {
    font-size: 19px !important;
}

#floor-form .form-group {
    height: 40px;
    margin-bottom: 23px;
}

#floor-form .selected-flag {
    background: #156947;
    width: 39px;
    border-radius: 3px 0px 0px 3px;
    height: 40px;
}

.flot-btn,
flot-btn:focus {
    background: #156947 !important;
    box-shadow: none !important;
    color: #fff !important;
    border: 2px solid #156947 !important;
    margin: 0px auto !important;
    display: block !important;
    padding: 6px 20px !important;
}

.flot-btn:hover {
    background: transparent;
    box-shadow: none;
    border-color: #156947;
    color: #156947;
}

#iam-interested input,
#float-form select {
    height: 40px !important;
    border: none !important;
    padding-left: 9px !important;
    width: 100%;
    background: #fff !important;
}

#iam-interested .input-group-addon {
    background: #513016;
    color: #fff;
    border: 0;
}

#iam-interested .form-ico {
    font-size: 19px !important;
}

#iam-interested .form-group {
    height: 40px;
    margin-bottom: 23px;
}

/*about us*/

.light-grey {
    background: #ffffff;
}

.section {
    padding: 70px 0;
}

.sub-head {
    color: #513016;
    text-transform: uppercase;
    font-size: 28px;
    letter-spacing: 2px;
    margin: 13px;
    font-weight: 600;
    text-align: center;
    /* background: -webkit-linear-gradient(#156947, #156947, #156947); */
    /* -webkit-background-clip: text; */
    /* -webkit-text-fill-color: transparent; */
    font-family: Galano;
}

.head-line img {
    display: block;
    margin: auto;
    width: 175px;
}

.abtwrap {
    margin: 15px auto;
    position: relative;
    cursor: pointer;
    transition: ease all 0.5s;
    width: 85%;
    text-align: center;
    background: #fff;
    padding: 2px 2px;
    /* box-shadow: 1px 1px 4px 3px #513016; */
    margin-bottom: 20px;
    background-image: none;
    background-color: #156947;
}

.border-effect::before {
    left: 0px;
    top: 0;
    transition-duration: 0.4s;
}

.high {
    padding: 10px 0px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* height: 100px; */
    background: #513016;
    background: #513016;
    /* background: linear-gradient(to right, #513016, #513016, #513016); */
    outline-offset: 2px;
    cursor: auto;
    /* box-shadow: 0px 0px 3px 4px #51301636; */
}

.high {
    padding: 8px 0px;
    display: flex;
    align-items: center;
    justify-content: end;
    color: #fff;
    justify-content: center;
}

.high img {
    width: 40px !important;
    font-size: 50px;
    color: #fff;
    padding: 5px;
    position: relative;
    left: 10px;
    filter: brightness(0) invert(1);
}

.high p {
    font-size: 18px;
    /* margin: 0px auto; */
    display: block;
    position: relative;
    /* color: black !important; */
    color: #fff;
    line-height: 23px;
    font-weight: 600;
    color: #ffffff;
    font-family: Galanolight;
    margin-left: 1rem;
    margin-bottom: 0px;
}

.border-effect::after {
    left: 0;
    bottom: 0;
    transition-duration: 0.4s;
}

/*about us*/

/*video*/

.video-position-head {
    position: relative;
}

.video-position {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    cursor: pointer;
}

/*video*/

@media only screen and (min-width: 768px) {
    #banner-form {
        position: absolute;
        width: 254px;
        right: 0%;
        top: 22%;
        z-index: 9999;
    }
}

@media only screen and (max-width: 767px) {
    .sec-bannerform {
        padding: 40px 20px;
        background: #513016;
        display: none;
    }
    #banner-form {}
}

#carousel-example-generic {
    margin-top: 65px;
}

.m-banner {
    display: none !important;
}

@media only screen and (max-width: 700px) {
    .d-banner {
        display: none !important;
    }
    .m-banner {
        display: block !important;
    }
    #carousel-example-generic {
        margin-top: 70px;
    }
}

.rera img {
    width: 115px;
    float: left;
    margin-right: 10px;
}

.rera-h {
    margin: 0;
    font-size: 19px;
    font-weight: 800;
}

.rera-txt {
    margin: 0px;
    line-height: 23px;
}

.copy {
    line-height: 23px;
}

@media (max-width: 991px) and (min-width: 475px) {
    .rera-wrap {
        width: 400px;
        margin: 0px auto;
    }
}

@media only screen and (max-width: 474px) {
    .rera img {
        width: 100px;
        float: none;
    }
    .rera-wrap {
        text-align: center;
    }
}

@media only screen and (max-width: 991px) {
    .copy {
        text-align: center;
    }
}

@media only screen and (min-width: 992px) {
    .copy {
        /*margin-top: 35px;*/
        text-align: center;
    }
    #contact {
        height: 615px;
    }
}

.rera-link {
    margin: 0;
    font-size: 19px;
}

.amenities-main p {
    text-align: center;
    margin-top: 10px;
    margin-bottom: 25px;
    line-height: 19px;
    font-size: 15px;
    font-family: Galanolight;
}

@media only screen and (max-width: 395px) {
    .amenities-main p {
        /*height: 45px;*/
        /*line-height: 19px;*/
        font-size: 14px;
    }
}

.hi-icon img {
    width: 90px;
    filter: invert(1);
    transition: 0.3s;
}

.hi-icon img:hover {
    width: 90px;
    filter: invert(0);
}

.tbl {
    /*border: none;*/
    /*box-shadow: 8px 8px 19px #513016;*/
    background: #fff;
}

.glyphicon-chevron-left:before {
    content: "" !important;
}

.glyphicon-chevron-right:before {
    content: "" !important;
}

.carousel-control img {
    width: 35px;
}

/*------------- gallery ------------------------*/

.latest-post,
.latest-post-inner {
    min-height: 240px;
    max-height: 240px;
    margin-bottom: 30px;
}

.latest-post {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.latest-post-inner {
    padding: 50px 30px;
    position: relative;
    -webkit-transition: 300ms;
    -o-transition: 300ms;
    transition: 300ms;
    border: 2px solid #156947;
}

.latest-post .latest-post-inner span,
.latest-post .latest-post-inner a,
.latest-post .latest-post-inner p,
.latest-post .latest-post-inner i,
.latest-post .latest-post-inner .entry-author {
    color: #fff;
    position: relative;
}

.latest-post .latest-post-inner a:hover {
    color: rgba(255, 255, 255, 0.7);
}

.latest-post .latest-post-inner .latest-post-content {
    position: absolute;
    bottom: 30px;
}

.latest-post .latest-post-inner:before {
    content: "";
    -webkit-transition: 300ms;
    -o-transition: 300ms;
    transition: 300ms;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 50%;
    opacity: 1;
    background: transparent;
}

.latest-post .latest-post-inner .link-icon {
    position: absolute;
    opacity: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    -webkit-transform: translate(-50%, -50%) scale(0);
    color: #fff;
    z-index: 999;
    -webkit-transition: 300ms;
    transition: 300ms;
}

.latest-post .latest-post-inner .link-icon a {
    background-color: #513016;
    display: table;
    height: 50px;
    width: 50px;
    border-radius: 30px;
    text-decoration: none;
    -webkit-transition: 300ms;
    transition: 300ms;
}

.latest-post .latest-post-inner .link-icon a i {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.latest-post .latest-post-inner .link-icon a:hover {
    background-color: rgba(81, 48, 22, 0.7);
    transform: scale(1.2);
    -webkit-transition: 300ms;
    transition: 300ms;
}

.latest-post .latest-post-inner:hover:before {
    opacity: 0;
    -webkit-transition: 300ms;
    transition: 300ms;
}

.latest-post .latest-post-inner:hover .link-icon {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    -webkit-transform: translate(-50%, -50%) scale(1);
    -webkit-transition: 300ms;
    transition: 300ms;
}

.latest-post .latest-post-inner:hover {
    background-color: rgba(21, 105, 71, 0.5);
}

.sl-prev {
    display: block !important;
}

.sl-next {
    display: block !important;
}

.loc-post {
    min-height: 450px !important;
    max-height: 240px;
}

.loc-post-inner {
    min-height: 450px !important;
    max-height: 240px;
}

.amenities-gallery {
    position: relative;
    width: 100%;
    overflow: hidden;
    transition: all 0.5s;
}

.amenities-gallery img {
    width: 100%;
    /* margin: 12px auto; */
    /* width: 383px; */
    object-fit: contain;
    /* height: 600px; */
}

.ami-overlay {
    width: 100%;
    height: 100%;
    background: rgb(35 37 38 / 42%);
    position: absolute;
    top: 0;
    transform: translate(-100%, 0);
    transition: all 1s;
}

.loc {
    width: 100% !important;
    height: 100% !important;
}

.amenities-gallery:hover .ami-overlay {
    transform: translate(0%, 0);
    transition: all 0.5s;
    cursor: url(../images/hovericon.webp), auto !important;
}

/*------------- End of gallery ------------------------*/

.mytab {
    text-align: center;
    border-bottom: none;
    margin-bottom: 45px;
}

.mytab li {
    float: none !important;
    display: inline-block;
}

.mytab>li.active>a,
.mytab>li.active>a:hover,
.mytab>li.active>a:focus {
    color: #fff;
    background-color: #513016;
    border: none !important;
    cursor: pointer;
    border-radius: 5px;
}

.mytab>li>a:hover,
.mytab>li>a:focus {
    border-color: transparent !important;
    background-color: transparent;
    border-radius: 5px;
    color: #513016;
}

.mytab>li>a {
    color: #513016;
    z-index: 99;
    font-family: Galanolight;
    position: relative;
}

#gallery {
    /*background: #ffffff;*/
    padding-bottom: 50px;
    margin-bottom: 5px;
}

.gall-head {
    font-size: 35px;
    color: #156947;
    font-family: "Gotham Bold";
    font-family: Galano;
}

.underline2 {
    background: #513016;
    height: 4px;
    border-radius: 10px;
    width: 120px;
    margin: 0px auto;
    margin-top: -8px;
}

@media only screen and (max-width: 480px) {
    .gall-head {
        font-size: 25px;
    }
}

#sp-footer h2 {
    font-size: 16px;
    margin: 0;
    margin-bottom: 8px;
    font-family: "Gotham-Medium";
    font-family: Galanolight;
}

#sp-footer p {
    line-height: 20px;
    font-family: Galanolight;
}

.sl-wrapper .sl-navigation button {
    z-index: 999999 !important;
}

.fixHeader {
    background-color: #513016;
    transition: ease all 0.5s;
}

.hi-icon-wrap {
    padding: 2em 0 0em !important;
}

#configuration {
    /* padding: 70px 0px; */
    background: url(../images/gallery/exterior/3.webp) center;
    background-attachment: fixed;
    background-size: cover;
}

.conf {
    background-color: #ffffff;
    padding: 100px 0px;
}

/*#overview{*/

/*background: #ffffff;*/

/*}*/

#amenities {
    /*background: url("../images/amenities.webp") center;*/
}

@media all and (max-width: 767px) {
    #sp-footer {
        text-align: center;
    }
    .rera-sec {
        margin-bottom: 42px;
    }
    #sp-footer h2 {
        margin-top: 13px;
    }
}

@media all and (max-width: 328px) {
    .footer-logo li:first-child {
        border: none !important;
    }
}

.fixed-footer-cust {
    background: #156947;
    text-align: center;
    padding: 10px 0px 10px 0px;
    width: 100%;
    position: fixed;
    bottom: 0px;
    z-index: 99;
}

.f-icon {}

.fix-link {
    color: #fff !important;
    font-size: 14px;
}

.div-line {
    border-right: 1px solid #fff;
}

.free-call:hover {
    color: #ffffff;
}

.i-am {
    padding: 0;
    background: transparent;
}

.foo-txt {
    text-align: center;
    color: #fff;
    font-size: 20px;
    margin-top: 20px;
    font-family: Galanolight;
}

.footer-call {
    text-align: center;
    font-size: 20px;
    color: #fff;
    font-family: Galanolight;
}

.footer-call a {
    color: #ffffff;
    text-decoration: none;
}

.thank-logo {
    margin: 0px auto;
    background: #fff;
    padding: 10px;
    border-radius: 5px;
}

#video {
    width: 100%;
    margin: 0px auto;
    display: block;
    margin-top: 20px;
    padding-bottom: 80px;
}

@media all and (max-width: 767px) {
    #video {
        width: 100%;
        height: 100%;
    }
}

#pageloader {
    background: rgba(255, 255, 255, 0.9);
    display: none;
    height: 100%;
    position: fixed;
    width: 100%;
    z-index: 9999999;
    top: 0;
}

#pageloader img {
    left: 50%;
    width: 100px;
    margin-left: -32px;
    margin-top: -32px;
    position: absolute;
    top: 50%;
}

.amenities-head {
    text-align: left;
}

.amenities-head:after {
    bottom: -5px !important;
}

.footer-logo {
    margin-top: 30px;
    padding-left: 0px;
}

.footer-logo li {
    list-style: none;
    display: inline-block;
}

.footer-logo li:first-child {
    /*margin-right: 5px;*/
    /*border-right: 1px solid;*/
    /*padding-right: 10px;*/
}

.rera-sec {
    background: #513016;
    padding: 20px 0px;
}

.rera-sec p {
    color: #fff;
    font-size: 13px;
    text-align: center;
    line-height: 19px;
    margin: 0px;
    font-family: Galanolight;
}

.rera-sec h3 {
    margin-top: 0px;
    color: #fff;
    text-align: center;
    font-size: 15px;
    font-weight: 800;
    font-family: Galanolight;
}

#location {
    background: #ffffff;
}

.g-txt {
    position: absolute;
    text-align: center;
    margin: 0px;
    bottom: 0px;
    background: #513016;
    color: #fff;
    font-size: 7px;
    padding: 0px 5px;
    font-weight: 600;
    letter-spacing: 2px;
    display: none;
}

.panoroma {
    background: url("../images/panoroma.webp") no-repeat left center transparent;
    transition: background-position 15000ms ease-in-out;
    height: 100vh;
}

.box ul li {
    font-size: 14px;
}

.inner-banner {
    background: url("../images/panoroma.webp");
}

.pd0 {
    padding: 0px;
}

.logo-color {
    /* background: #fff; */
}

.loc-icon {
    width: 50px;
}

@media screen and (min-width: 768px) {
    .carousel-indicators {
        bottom: 40px;
    }
}

.form-disc {
    font-size: 9px;
    line-height: 11px;
}

.form-disc a {}

.form-disc-white {
    font-size: 9px;
    line-height: 18px;
    color: #fff;
    background: rgba(81, 48, 22, 0.4);
    padding: 1px;
    text-align: center;
}

.form-disc-white a {
    color: #ffffff;
}

#otp-form input {
    height: 40px;
    border: none;
    padding-left: 9px;
    width: 100%;
    background: #ffffff;
}

#otp-form .input-group-addon {
    background: #156947;
    color: #fff;
    border: 0;
}

#otp-model .modal-header {
    background: #156947;
    color: #fff;
}

.otp-formwrap {
    margin-top: 10em;
}

.otp-formwrap h1 {
    margin: 0px;
    font-size: 25px;
    text-align: center;
    margin-bottom: 10px;
}

.otp-formwrap p {
    text-align: center;
    margin-bottom: 20px;
}

.pro-highlight {
    background: whitesmoke;
    box-shadow: 8px 8px 19px #513016;
    padding: 15px 8px;
    margin-top: 27px;
}

.highlight-p {
    color: #156947;
    font-size: 26px;
    text-align: center;
    margin-bottom: 20px;
    letter-spacing: 3px;
}

.underline {
    background: #156947;
    height: 3px;
    border-radius: 10px;
    width: 120px;
    margin: 0px auto;
    margin-top: -5px;
    margin-bottom: 13px;
}

.proximity-section p.map-title {
    background: url(../images/location.webp) no-repeat;
    color: #513016;
    font-weight: 800;
    padding: 0;
    padding-left: 30px;
    font-size: 16px;
    padding-top: 5px;
    text-transform: uppercase;
}

.proximity-section p {
    color: #fff;
    background: #513016;
    padding: 5px 10px;
    font-weight: 800;
    letter-spacing: 1px;
    text-align: center;
    display: flex;
    width: 100%;
    align-items: center;
}

.proximity-section p span {
    float: right;
    color: #156947;
}

@media screen and (max-width: 768px) {
    .proximity-section p {
        font-size: 12px;
    }
    section {
        float: none;
    }
}

.modal-body p {
    font-family: Galanolight;
}

.click_here a {
    background-color: #156947 !important;
    color: #fff;
    padding: 5px;
    text-decoration: none;
    font-family: Galano;
    z-index: 99;
    position: relative;
}

html,
body {
    overflow-x: hidden;
}

.head-line {
    width: 320px;
    height: 33px;
    /* background: #513016; */
    background-image: url(../images/divider.png);
    margin: 0px auto;
    margin-top: 0px;
    margin-bottom: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    display: block;
}

#configuration .head-line {
    filter: invert(1);
}

.contact1 .head-line {
    filter: invert(1);
}

#overview .overview-img img {
    width: 100%;
}

#overview .flex-box {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* -------button animation start-------- */

.GreyBtn {
    background: #513016;
    color: #fff;
    background: -moz-linear-gradient( left, #513016 0%, #513016 46%, #ffffff 51%, #513016 56%, #513016 100%);
    background: -webkit-linear-gradient( left, #156947 0%, #156947 46%, #fff 51%, #ffffff73 56%, #156947 100%);
    /* background: linear-gradient(180deg, rgba(81, 48, 22, 1) 0%, #513016 100%); */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#513016', endColorstr='#513016', GradientType=1);
    background-size: 600% 600%;
    -webkit-animation: AnimationNameGrey 3s ease infinite;
    animation: AnimationNameGrey 3s ease infinite;
}

@-webkit-keyframes AnimationNameGrey {
    0% {
        background-position: 100%;
    }
    100% {
        background-position: 0%;
    }
}

@keyframes AnimationNameGrey {
    0% {
        background-position: 100%;
    }
    100% {
        background-position: 0%;
    }
}

/* -------button animation end -------- */
/* About Us highlight boxes - stacked headline + subline variant */
.high.high-stack {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 18px 12px;
    min-height: 96px;
}

.high.high-stack h4 {
    font-size: 20px;
    line-height: 26px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #fff;
    margin: 0 0 6px;
    font-family: Galanolight;
}

.high.high-stack p {
    margin-left: 0;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 500;
}

@media (max-width: 767px) {
    .high.high-stack {
        min-height: auto;
    }

    .high.high-stack h4 {
        font-size: 18px;
        line-height: 24px;
    }
}

/* --- Header logo alignment ---------------------------------------------
   The original -14px / -11px offsets were tuned for the previous logo and
   push the current one above the header band, clipping its top edge.
   Center it vertically inside the header instead. */
.logo-wrapper {
    top: 50%;
    transform: translateY(-50%);
}

.logo-wrapper>a,
.logo-wrapper>a>img {
    margin-top: 0;
}

.logo-wrapper>a>img {
    height: auto;
    max-height: 62px;
    width: auto !important;
    max-width: 100%;
}

@media all and (max-width: 991px) {
    .logo-wrapper {
        top: 50%;
        transform: translateY(-50%);
    }

    .logo-wrapper>a,
    .logo-wrapper>a>img {
        margin-top: 0;
        margin-left: 0;
    }

    .logo-wrapper>a>img {
        max-height: 44px;
        width: auto !important;
    }
}

/* Bootstrap 5 dropped the implicit clearfix that Bootstrap 3 put on .container.
   The header lays its logo and nav out with floats, so without it the container
   collapses to zero height and the absolutely-positioned logo has nothing to
   center against. Restore it for the header only. */
header .container::after {
    display: block;
    clear: both;
    content: "";
}

/* About Us highlight boxes - three equal-height, equal-width cards.
   Without this the third card grows taller because its headline wraps
   to two lines. */
.abt-highlights {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

.abt-highlights>[class*="col-"] {
    display: flex;
    float: none;
    flex: 0 0 100%;
    max-width: 100%;
}

@media all and (min-width: 992px) {
    .abt-highlights>[class*="col-"] {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}

.abt-highlights .abtwrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 15px 0 20px;
}

.abt-highlights .high.high-stack {
    flex: 1 1 auto;
    min-height: 118px;
}

@media all and (max-width: 767px) {
    .abt-highlights .high.high-stack {
        min-height: 0;
    }
}

/* The logo artwork is brown and green on transparent, so it sinks into the
   brown header. A light plate keeps it reading exactly as designed. */
.logo-wrapper>a>img {
    background: #fff;
    padding: 8px 14px;
    border-radius: 4px;
}

@media all and (max-width: 991px) {
    .logo-wrapper>a>img {
        padding: 6px 10px;
    }
}

/* Overview highlights: per-item icons instead of the shared leaf bullet. */
.aminitieslist.icon-list li::before {
    content: none;
    margin-right: 0;
}

.aminitieslist.icon-list .ami-ico {
    width: 24px;
    margin-right: 12px;
    font-size: 17px;
    line-height: 23px;
    color: #156947;
    text-align: center;
    flex: 0 0 24px;
}

/* ==========================================================================
   Aesthetic pass - warm logo palette with alternating light/dark sections
   Hues are still only the logo's brown and green; the extra values are
   tints and shades of those two so sections can separate from each other.
   ========================================================================== */
:root {
    --ink: #3E2410;          /* warm deep brown - dark section surfaces */
    --brand: #513016;        /* logo brown - headings, cards */
    --body: #6B4A2F;         /* softer brown - running text */
    --ivory: #FAF5EE;        /* warm off-white - light section surfaces */
    --surface: #FFFFFF;      /* cards and panels */
    --green: #156947;        /* logo green - accents, CTAs */
    --green-soft: #8CC7A9;   /* green tint - accents on dark */
    --hairline: rgba(81, 48, 22, 0.14);
}

/* ---- base type ---- */
body {
    color: var(--body);
    background: var(--surface);
}

.section-title,
.sub-head,
.sppb-title-heading {
    color: #156947;
}

.section-subtitle {
    color: var(--body);
}

/* ---- section rhythm: light / dark / light / dark ---- */
#overview,
#amenities,
#location1 {
    background: var(--ivory);
}

#gallery,
#about {
    background: var(--surface);
}

header.normal-header,
.conf,
#video,
#sp-footer,
.rera-sec {
    background: var(--ink) !important;
}

.contact1 {
    background-color: var(--ink);
}

/* breathing room so the bands read as distinct sections */
.padding {
    padding: 80px 0px;
}

#gallery,
#video,
#location1 {
    padding: 80px 0px;
}

.conf {
    padding: 80px 0px;
}

/* ---- text on the dark bands ---- */
.conf .section-title,
.conf .section-header,
#video .sppb-title-heading,
.contact1 .section-title,
.contact1 .sppb-title-heading {
    color:#156947;
}

#video .head-line,
.rera-sec .head-line {
    filter: invert(1);
}

/* ---- cards and tiles ---- */
.aminitieslist li {
    border: 1px solid var(--green);
    background: var(--surface);
    box-shadow: 0 1px 2px var(--hairline);
}

.dir li {
    background: var(--surface);
    color: var(--brand);
}

.abtwrap {
    background-image: none;
    background-color: var(--green);
}

.abt-highlights .high.high-stack {
    background: var(--brand);
}

/* ---- configuration table sits on the dark band ---- */
.conf .tbl {
    background: var(--surface);
    box-shadow: 0 2px 8px rgba(62, 36, 16, 0.35);
}

.her {
    background-color: var(--brand);
}

.tbl>tbody>tr>td {
    color: var(--body);
}

/* thank-you page body sits on the warm ivory rather than stark white */
#sp-main-body {
    background: var(--ivory);
}

/* ---- form fields: visible underlines --------------------------------------
   The inputs were rendered with `border: none`, so the fields had no visible
   edge at all. Give every form field a clear brand underline, and a stronger
   green one while it has focus. */
#contact-form input,
#contact-form select,
#broch-form input,
#price-popup input,
#float-form input,
#floor-form input,
#floor-form select,
#video-form-1 input,
#video-form-2 input,
#main-popup input,
#main-popup select,
#iam-interested input {
    border-bottom: 2px solid rgba(81, 48, 22, 0.35) !important;
    border-radius: 0;
    transition: border-color 0.25s ease;
}

#contact-form input:focus,
#contact-form select:focus,
#broch-form input:focus,
#price-popup input:focus,
#float-form input:focus,
#floor-form input:focus,
#floor-form select:focus,
#video-form-1 input:focus,
#video-form-2 input:focus,
#main-popup input:focus,
#main-popup select:focus,
#iam-interested input:focus {
    border-bottom-color: #156947 !important;
    outline: none;
}

/* the icon tile and the field should read as one control */
.input-group-addon {
    border-bottom: 2px solid rgba(81, 48, 22, 0.35) !important;
}

/* ---- highlight tiles: solid green ----------------------------------------
   Green fill with white text and icons. The outlined white version read as
   empty boxes against the ivory band; solid green gives the section weight
   and picks the logo's green up across the page. */
.aminitieslist li {
    border: 1px solid var(--green);
    background: var(--green);
    box-shadow: 0 2px 6px rgba(21, 105, 71, 0.22);
}

.dir li {
    background: var(--green);
    color: #ffffff;
}

.aminitieslist.icon-list .ami-ico {
    color: #ffffff;
}

/* ---- footer alignment -----------------------------------------------------
   The RERA registration number is a single unbreakable token wider than its
   column, so it was spilling past the right edge below 992px. Let it wrap,
   balance the two columns to the outer edges, and centre everything once the
   columns stack on mobile. */
#sp-footer {
    padding: 28px 0 24px !important;
}

#sp-footer .row {
    align-items: center;
}

#sp-footer h2,
#sp-footer p,
.rera-sec p {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* RERA and copyright are centred at every width. index.php has a single
   full-width footer column and thank-you.php has two, so anything based on
   :first-child / :last-child right-aligns the lone column on index. */
#sp-footer,
#sp-footer .row>[class*="col-"] {
    text-align: center;
}

@media all and (max-width: 575px) {
    #sp-footer .row>[class*="col-"]+[class*="col-"] {
        margin-top: 18px;
    }
}

/* Footer blocks run full width and centred at every size, so the RERA line
   and the copyright sit on the page centre on both pages. Side by side they
   were also too narrow for the registration number, which broke mid-token. */
#sp-footer .row>[class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center !important;
}

#sp-footer .row>[class*="col-"]+[class*="col-"] {
    margin-top: 6px;
}

/* keep the Terms & Conditions link on one line */
#sp-footer p a {
    white-space: nowrap;
}

/* The header is position:fixed, so thank-you page content starts underneath
   it. The .wrap top margin is a percentage, which shrinks as the viewport
   narrows, so on phones the confirmation tick slid up behind the header and
   its top was clipped. Reserve room for the header instead. */
#sp-main-body {
    padding-top: 100px;
}

@media all and (min-width: 992px) {
    #sp-main-body {
        padding-top: 40px;
    }
}

/* ---- location accordion rows: proper alignment on small screens -----------
   The marker icon sat vertically centred against wrapped text, and the text
   itself was centred. Put the icon on its own fixed column beside left-aligned
   text so multi-line entries line up under each other. */
#accordion .panel-body p {
    display: flex;
    align-items: flex-start;
    text-align: left;
    gap: 8px;
}

#accordion .panel-body p i {
    flex: 0 0 12px;
    margin-top: 6px;
    text-align: center;
}

/* the sticky mobile bar carries the brochure button, so match the other CTA */
.fixed-footer-cust .broch.fix-link {
    background: none;
    border: 0;
    padding: 0;
    width: 100%;
    color: #fff !important;
    text-transform: uppercase;
}

/* "DOWNLOAD BROCHURE" is longer than the "CALL NOW" it replaced, so ease the
   type down on the narrowest phones to keep both bar labels on one line. */
@media all and (max-width: 400px) {
    .fixed-footer-cust .fix-link {
        font-size: 12px;
    }
}

/* On phones the contact panel and the footer are the same brown and run
   together, so mark the boundary with a single hairline. */
@media all and (max-width: 767px) {
    #sp-footer {
        border-top: 1px solid #fff;
    }
}

/* ---- location: map matches the accordion height ---------------------------
   Map.jpg is square, so at half-width it rendered much taller than the
   accordion beside it. Take the image out of the flow (absolute) so the row
   height comes from the accordion alone, then fit the map inside that box.
   object-fit: contain keeps the whole map readable rather than cropping it. */
@media all and (min-width: 992px) {
    #location1 .row {
        display: flex;
        align-items: stretch;
        flex-wrap: wrap;
    }

    #location1 .row>.col-md-6 {
        display: flex;
        flex-direction: column;
        float: none;
    }

    #location1 .loc-wrap {
        width: 100%;
    }

    #location1 .amenities-gallery.floorheigh {
        position: relative;
        flex: 1 1 auto;
        min-height: 0;
        width: 100%;
    }

    #location1 .amenities-gallery.floorheigh img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* ---- gallery tabs shown as a plain grid ----------------------------------
   The Interior and Amenities tabs no longer run as carousels, so lay their
   items out in a static grid matching the carousel's 3 / 2 / 1 rhythm. */
/* The grid applies from 768px up. Below that the Interior tab is handed to
   Owl, so the flex rules must not fight the carousel's own layout. */
@media all and (min-width: 768px) {
    .static-gallery {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 40px;
    }

    .static-gallery .item {
        flex: 0 1 calc(33.333% - 27px);
        max-width: calc(33.333% - 27px);
    }
}

@media all and (min-width: 768px) and (max-width: 999px) {
    .static-gallery .item {
        flex-basis: calc(50% - 20px);
        max-width: calc(50% - 20px);
    }
}