* {
    margin: 0;
    box-sizing: border-box;
    font-family: "Mulish", sans-serif;
}

body {
    overflow-x: hidden;
}

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

.cursor {
    cursor: pointer;
}

.required {
    color: red !important;
}

.text-underline {
    text-decoration: underline !important;
}

a {
    text-decoration: none !important;
}

::-webkit-scrollbar,
*::-webkit-scrollbar-thumb {
    width: .375rem;
    height: .375rem;
    border-radius: .813rem;
    background-clip: padding-box;
}

::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 0 .625rem;
}

::-webkit-scrollbar,
*::-webkit-scrollbar-thumb {
    width: .375rem;
    height: .375rem;
    border-radius: .813rem;
    background-clip: padding-box;
}

*::-webkit-scrollbar-thumb {
    width: .375rem;
    height: .375rem;
    border-radius: .813rem;
    background-clip: padding-box;
}

.btn {
    border-radius: 2px;
    text-align: center;
    font-size: 0.833vw;
    font-weight: 600;
    line-height: normal;
    border: none;
    padding: 0.521vw 1.198vw;
    transition: 0.3s ease-in-out;
}

.btn.btn-primary {
    background-color: #B55438;
    border-color: #B55438;
    color: #ffffff;
}

.btn.btn-primary:hover {
    background-color: #883f2b;
    border-color: #ffffff;
}

.modal-dialog.modal-dialog-centered.modal-sm {
    max-width: 530px;
}

.mainHeader {
    border-bottom: 1px solid #DFE3E8;
    background: #FFF;
    /* padding: 0.521vw 0.417vw; */
    /* min-height: 4.167vw; */
    height: 4.167vw;
}

.mainHeader.mainHeader__explore {
    min-height: 100px;
}

.mainHeader > .container-fluid {
    padding-right: 0 !important;
}

#nav .content .container-prLink {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

#nav .content .container-prLink ul {
    display: flex;
    flex-direction: column;
    width: 100%;
}

#nav .content .container-prLink ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: relative;
    padding: 1.042vw 0;
    border-bottom: 1px dashed rgba(255, 255, 255, .7);
    margin: 0;
    transform: translateY(40px);
    opacity: 0;
    transition: all 1s cubic-bezier(.075, .82, .165, 1);
}

#nav .content .container-prLink ul li:hover {
    transition: .2s;
    padding: 1.563vw 0;
}

#nav .content .container-prLink ul li:hover a {
    color: #B55438;
}

#nav .content .container-prLink ul>li {
    opacity: 1;
    transform: translateY(0);
    float: none;
}

#nav .content .container-prLink ul li a {
    color: #fff;
    font-size: 1.25vw;
    font-weight: 300;
    line-height: 1.2;
    text-decoration: none;
    position: relative;
    padding: 0;
}

.menuNav {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    height: 100vh;
    width: 100vw;
    background-color: transparent;
    transition: all .25s ease;
    z-index: 999;
}

.menuNav.show {
    display: block;
}

.menuNav .content {
    text-align: center;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100vh;
    max-height: 100vh;
    transition: all .25s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menuNav .content.active {
    opacity: 1;
}

.menuNav .content:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%);
    background-color: #fff;
    background: rgba(0, 0, 0, .9);
}

.menuNav .content.active:before {
    animation: slideBgTop 0.7s forwards;
    -webkit-animation: slideBgTop 0.7s forwards;
}

@keyframes slideBgTop {
    0% {
        -webkit-transform: translateY(-100%) translateX(-50%);
        transform: translateY(-100%) translateX(-50%);
        -webkit-animation-timing-function: cubic-bezier(0.815,
                0.09,
                0.885,
                0.14);
    }

    50% {
        -webkit-transform: translateY(-50%) translateX(-50%) skewY(-20deg);
        transform: translateY(-50%) translateX(-50%) skewY(-20deg);
    }

    100% {
        -webkit-animation-timing-function: cubic-bezier(0.815,
                0.09,
                0.885,
                0.14);
        -webkit-transform: translateY(0%) translateX(-50%);
        transform: translateY(0%) translateX(-50%);
    }
}

@-webkit-keyframes slideBgTop {
    0% {
        -webkit-transform: translateY(-100%) translateX(-50%);
        transform: translateY(-100%) translateX(-50%);
        -webkit-animation-timing-function: cubic-bezier(0.815,
                0.09,
                0.885,
                0.14);
    }

    50% {
        -webkit-transform: translateY(-50%) translateX(-50%) skewY(-20deg);
        transform: translateY(-50%) translateX(-50%) skewY(-20deg);
    }

    100% {
        -webkit-animation-timing-function: cubic-bezier(0.815,
                0.09,
                0.885,
                0.14);
        -webkit-transform: translateY(0%) translateX(-50%);
        transform: translateY(0%) translateX(-50%);
    }
}

.close_popup {
    position: relative;
    transition: all .25s ease;
    cursor: pointer;
}

.close_popup img {
    filter: invert(1);
}

.mainMenuButton_inner {
    position: absolute;
    top: 0.521vw;
    right: 1.302vw;
    z-index: 9;
}

.mainMenuButton_inner img.zoomicon {
    width: 1.563vw;
    filter: invert(1);
}

.innerModalArea {
    display: flex;
    border-radius: 1.563vw 1.563vw 0 0;
    border: 1px solid #E2DDDD;
    width: 100%;
    margin: auto;
    background: #FAFAFA;
    padding: 0.521vw 0.521vw;
    position: relative;
}

.innerModalArea .custmSelect {
    padding: 0 1.042vw;
    min-width: 200px;
    width: 18%;
}

.innerModalArea .custmSelect:first-child {
    width: 28%;
}

.innerModalArea .custmSelect h4 {
    margin-bottom: 0;
    font-size: 0.833vw;
    cursor: default;
}

.innerModalArea .custmSelect h4 span {
    font-size: clamp(9px, 0.9vw, 18px);
    color: #333;
    font-weight: 500;
    line-height: normal;
    text-transform: capitalize;
    margin-right: 5px;
}

.mainHeader .mainHeader__main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.mainHeader .mainHeader__main .mainHeader__logo {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    width: 17.5%;
    padding-right: 12px;
}

.mainHeader .mainHeader__main .mainHeader__logo .logoArea {
    display: block;
}

.mainHeader .mainHeader__main .mainHeader__logo .logoArea a {
    display: block;
}

.mainHeader .mainHeader__main .mainHeader__logo .logoArea a img {
    width: 100%;
}

.mainHeader .mainHeader__main .mainHeader__selectionForHousing {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    
    width: 65%;
    height: 100%;
    margin-bottom: -1px;
}

.mainHeader .mainHeader__main .mainHeader__burgerMenu {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    width: 17.5%;
    height: 100%;
}

.mainHeader .mainHeader__main .mainHeader__burgerMenu .menuArea {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 4.167vw;
    height: 100%;
    background-color: #B55438;
}

.mainHeader .mainHeader__main .mainHeader__burgerMenu .menuArea a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;
}

.mainHeader .mainHeader__main .mainHeader__burgerMenu .menuArea a img {
    width: 30%;
}

.W6 {
    width: 65%;
}

.cstmBorder {

    position: relative;
}

.cstmBorder::after {
    content: '';
    position: absolute;
    left: 0;
    height: 1.51vw;
    width: 0.052vw;
    background: #999;
    top: 0;
    bottom: 0;
    margin: auto;
}

.modalHead {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    position: relative;
}

.modal-content {
    border-radius: 0;
}

.cstmStyle .modal-footer {
    border-radius: 0px 0px 2px 2px;
    background: #FFF;
    box-shadow: 0px -4px 19px 0px rgba(0, 0, 0, 0.10);
    padding: 0 1.563vw;
    min-height: 3.125vw;
}

.mainBorder {
    border: 1px solid #bfbfbf;
}

.footerNav {
    position: absolute;
    left: 1.354vw;
}

.footerNav a {
    color: #666;
    font-size: 0.729vw;
    font-weight: 500;
    line-height: normal;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.26vw;
    transition: 0.3s ease-in-out;
}

.footerNav a:hover {
    color: #B55438;
}

.footerNav a:hover img {
    transform: scale(1.2);
    filter: invert(37%) sepia(22%) saturate(1576%) hue-rotate(327deg) brightness(94%) contrast(90%);
}

.cstmStyle .modal-header {
    background: #B55438;
    padding: 1.198vw 1.563vw;
    max-height: 3.646vw;
    min-height: 3.646vw;
    border-radius: 2px 2px 0px 0px;
    justify-content: space-between;
}

.headerModal .modal-dialog {
    max-width: 63.5%;
}

.cstmStyle .modal-header h1 {
    color: #FFF;
    font-size: clamp(18px, 1.146vw, 22px);
    line-height: 1.2;
    font-weight: 600;
}

.allmodal .headerModal .modal-body {
    overflow: hidden;
}

.headerModal .modal-body {
    max-height: 73vh;
    min-height: 54vh;
    overflow: auto;
    padding: 2.344vw 3.646vw;
}

.cstmStyle .modal-footer button {
    min-width: 100px;
    min-height: 40px;
    border-radius: 2px;
    background: #B55438;
    color: #fff;
    box-shadow: none;
    border: none;
}

.cstmStyle .modal-footer button:hover {
    background: #8d2f13;
    color: #fff;
}

.UserBox {
    display: flex;
    align-items: center;
    gap: 4.063vw;
    justify-content: center;
}

.equalP {
    padding-top: 64px;
}

.detailBox {
    border-radius: 24px;
    border: 1px solid #D5DEE9;
    background: #F9F9F9;
    width: 10.729vw;
    height: 10.729vw;
    display: flex;
    align-items: center;
    transition: 0.3s ease-in-out;
    justify-content: center;
    cursor: pointer;
}

.detailBox img {
    transition: 0.3s ease-in-out;
    max-width: 100%;
    height: auto;
}

.detailBox:hover {
    box-shadow: 0px 6px 14px 0px rgba(0, 0, 0, 0.10);
    border: 3px solid #B55438;
}

.detailBoxa.ctive {
    box-shadow: 0px 6px 14px 0px rgba(0, 0, 0, 0.10);
    border: 3px solid #B55438;
}

.detailBox:hover img {
    transform: scale(1.1);
}

.addSelect {
    display: flex;
    flex-direction: column;
}

.sideDropdwn h1 {
    color: #B55438;
    font-size: 1.563vw;
    font-weight: 300;
    margin-bottom: 0.885vw;
    line-height: normal;
}

.addSelect label {
    color: #666;
    font-size: 0.729vw;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 0.26vw;
}

.selectArea,
.sideDropdwn {
    width: 17.813vw;
}

.addSelect .dropdown button {
    border-radius: 5px;
    border: 1px solid #D0D8DF;
    background: #FDFEFF;
    color: #333;
    font-size: 1.042vw;
    font-weight: 500;
    line-height: normal;
    width: 100%;
    text-align: start;
    position: relative;
}

.selectArea .addSelect {
    margin-bottom: 2.344vw;
}

.selectArea .addSelect input.form-control:focus {
    box-shadow: none;
    border-color: #000;
}

.addSelect .dropdown-toggle::after {
    position: absolute;
    right: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 0%;
}

.addSelect ul.dropdown-menu {
    width: 100%;
    border-radius: 5px;
    border: 1px solid #D0D8DF;
    background: #FDFEFF;
    max-height: 44.9vh;
    overflow: auto;
}

.addSelect ul.dropdown-menu#city {
    max-height: 33.8vh;
    height: fit-content;
}

.addSelect ul.dropdown-menu li a {
    padding: 0.521vw 0.781vw;
    font-size: clamp(12px, 0.729vw, 14px);
    color: #333;
    line-height: normal;
}

.addSelect ul.dropdown-menu li:hover a {
    background-color: #B55438;
    color: #fff;
}

.stateWeather p {
    color: #666;
    font-size: 1.563vw;
    font-weight: 300;
    line-height: 1.771vw;
}

span.wetherCondition {
    color: #B55438;
    font-weight: 700;
    display: block;
}

.selectRadio {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.302vw;
    /* padding-top: 2.396vw; */
}

.selectRadio .form-check {
    border-radius: 5px;
    border: 1px solid #DCDCDC;
    background: #F9F9F9;
    min-width: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.833vw;
    min-height: 2.188vw;
    max-height: 2.188vw;
    cursor: pointer;
    padding: 0 10px;
}

.cstmRadio .form-check-input:checked {
    background-color: #B55438;
    border-color: #B55438;
}

.cstmRadio .form-check-input:focus {
    box-shadow: none;
}

.cstmRadio .form-check input {
    margin-bottom: 0.104vw;
    cursor: pointer;
    margin-left: 5px;
    border-color: #666;
    margin-top: 0;
}

.cstmRadio .form-check label {
    cursor: pointer;
    font-size: clamp(14px, 0.833vw, 16px);
}

.modal-section {
    display: none;
}

.modal-section.active {
    display: block;
}

p.detailName {
    margin-bottom: 0;
    color: #B55438;
    text-align: center;
    font-size: 0.938vw;
    font-weight: 600;
    line-height: normal;
    margin-top: 0.833vw;
}

.innerSelection {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: auto;
    border-radius: 0px 0px 30px 30px;
    border-right: 1px solid #E2DDDD;
    border-bottom: 1px solid #E2DDDD;
    border-left: 1px solid #E2DDDD;
    background: #FAFAFA;
    width: auto;
    padding: 0.617vw 0.521vw;

    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
}

.innerSelection .custmSelect {
    padding: 0 1.042vw;
    min-width: 200px;
    width: 18%;
}

.innerSelection .custmSelect h4 {
    margin-bottom: 0;
    font-size: 0.833vw;
    cursor: default;
}

.innerSelection .custmSelect h4 span {
    font-size: clamp(14px, 0.938vw, 18px);
    color: #333;
    font-weight: 500;
    line-height: normal;
    text-transform: capitalize;
    margin-right: 5px;
}

.filterBox {
    border-radius: 10px;
    border: 1px solid #E2DDDD;
    background: #FAFAFA;
    padding: 0.417vw 0.521vw;
    width: 106px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.521vw;
    margin: 0.677vw 0 0.781vw 0;
    transition: 0.3s ease-in-out;
}

.filterBox:hover {
    background: #B55438;
    border-color: #B55438;
}

.filterBox:hover a {
    color: #fff;
}

.filterBox:hover img {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(273deg) brightness(103%) contrast(101%);
}

.filterBox a {
    color: #333;
    font-size: clamp(14px, 0.833vw, 16px);
    font-weight: 500;
    line-height: normal;
}

.loader-img {
    /* width: 13%; */
    display: block;
    margin-inline: auto;
}

.breadcrumArea li a {
    color: #999;
    font-size: clamp(12px, 0.938vw, 18px);
    font-weight: 600;
    line-height: normal;
    cursor: default;
}

.custmSelect label {
    font-size: clamp(8px, 0.733vw, 16px);
    text-transform: uppercase;
    color: #999;
}

a#backToMasterList {
    margin-top: -20px;
}

.breadcrumArea li.breadcrumb-item.active a {
    color: #B55438;
    font-weight: 700;
    font-size: clamp(12px, 0.938vw, 18px);
}

.listArea .mainLable label {
    font-size: clamp(14px, 0.833vw, 16px);
}

.breadcrumArea .breadcrumb-item+.breadcrumb-item::before {
    content: '>';
    /* background: url('assets/images/headericons/modalArrow.svg'); */
}

footer.mainFooter {
    background: #FAFAFA;
    border: 1px solid #E1E6EC;
    max-height: 1.563vw;
    padding: 0.365vw 0;
}

.mainFooter__left p {
    margin-bottom: 0;
    color: #666;
    font-size: 0.625vw;
    line-height: normal;
}

.mainFooter__right a p {
    margin-bottom: 0;
    color: #666;
    font-size: 0.417vw;
    font-weight: 400;
    line-height: normal;
}

.mainFooter__right a p span {
    font-size: 0.625vw;
    font-weight: 700;
}

section.exploreArea {
    min-height: calc(100vh - 5.729vw);
    padding-top: 50px;
}

.flatArea {
    display: flex;
    min-height: calc(100vh - 11.615vw);
    flex-direction: column;
}

.mainFlatBox {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2.083vw;
    flex-wrap: wrap;
    margin-top: 2vw;
}

.mainFlatBox.hide {
    display: none;
}

.flatDesignImg {
    display: none;
}

.flatDesignImg.show {
    display: block;
    min-height: calc(100vh - 18.854vw);
    margin-top: 30px;
}

.flatDetail {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    width: auto;
    text-align: center;
    border-radius: 6px;
    border: 1px solid #E1E6EC;
    background: #FFF;
    box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.15);
    margin-bottom: 30px;
}

.flatDetail > div {
    width: 350px;
    position: relative;
}

.flatDetail > div a.masterPlanInfoButton {
    display: flex;
    align-items: center;
    justify-content: center;

    position: absolute;
    top: 10px;
    right: 10px;
}

.flatDetail > div a.masterPlanInfoButton img {
    width: 17px;
    padding: 0;
}

.flatDetail .flatDetail--img {
    padding: 1.615vw 1.563vw 0;
}

.flatDetail .flatDetail--img img {
    width: 100%;
}

.flatContent button {
    border-radius: 2px;
    background: #B55438;
    color: #FFF;
    text-align: center;
    font-size: 0.833vw;
    font-weight: 600;
    line-height: normal;
    border: none;
    padding: 0.521vw 1.198vw;
    margin: 1.094vw 0 0.521vw;
    transition: 0.3s ease-in-out;
}

.flatContent button:hover {
    background: #a7472c;
}

.flatContent p {
    color: #666;
    text-align: center;
    font-size: clamp(14px, 0.729vw, 16px);
    line-height: normal;
}

.flatContent p span {
    font-size: 0.625vw;
}

.whitescroll {
    padding: 0.26vw 0.521vw;
}

.flatHead {
    margin-top: 50px;
}

.flatHead p {
    color: #999;
    font-size: 0.729vw;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0;
}

img.chartImg {
    width: 100%;
}

.flatHead h4 {
    color: #333;
    font-size: 1.042vw;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0;
}

.cstmWidth .modal-dialog {
    max-width: 63.5%;
}

button.btnClose {
    border: none;
    width: 1.875vw;
    height: 1.875vw;
    background: #DA7F64;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s ease-in-out;
}

.btnClose:hover {
    background: #fff;
}

.btnClose:hover img {
    filter: invert(1);
}

/* .filterBreadcrum {
    display: none;
}

.filterBreadcrum.show {
    display: block;
} */

.innerDesign {
    width: 87%;
    margin: auto;
}

.share {
    /* gap: 0.521vw; */
    /* position: absolute; */
    /* top: 0;
    right: -20px; */
    display: flex;
    z-index: 9;
}

.flatImg {
    height: 100%;
    width: 100%;
    object-fit: contain;
}

.icons {
    width: 50px;
    height: 50px;
    background: #FAFAFA;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: 0.3s ease-in-out;
    border: 1px solid #E2DDDD;
    border-radius: 50%;
}

.icons img {
    /* filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(273deg) brightness(103%) contrast(101%); */
    transition: 0.3s ease-in-out;
}

/* .icons:hover img {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(273deg) brightness(103%) contrast(101%);
} */


/* ==========toggle btn css============== */
.toggle {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
}

.toggle-switch {
    display: inline-block;
    background: #F5F5F5;
    border-radius: 16px;
    width: 1.615vw;
    height: 0.677vw;
    position: relative;
    vertical-align: middle;
    transition: background 0.25s;
    border: 1px solid #E2DDDD;
}

.toggle-switch:before,
.toggle-switch:after {
    content: "";
}

.toggle-switch:before {
    display: block;
    background: #B55438;
    border-radius: 50%;
    width: 0.885vw;
    height: 0.885vw;
    position: absolute;
    top: -3px;
    left: 0;
    transition: left 0.25s;
}


.toggle-checkbox:checked+.toggle-switch:before {
    right: 0;
    left: auto;
}

.toggle-checkbox {
    position: absolute;
    visibility: hidden;
}

.toggle-label {
    margin-left: 0.26vw;
    position: relative;
    color: #333;
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: normal;
}

.switchArea {
    padding: 0.99vw 1.719vw;
    border-bottom: 1px solid #D9D9D9;
}

#filterModal .modal-dialog {
    max-width: 58.1%;
}

#filterModal .modal-dialog .modal-body {
    max-height: 66vh;
    min-height: 44vh;
    overflow: auto;
}

.listArea {
    display: flex;
    gap: 1.042vw;
    margin-top: 1.615vw;
    justify-content: center;

}

.mainDetail.selected .detailBox,
.detailBox:hover {
    box-shadow: 0px 6px 14px 0px rgba(0, 0, 0, 0.10);
    border: 3px solid #B55438;
    gap: 1.042vw;
    background: #eeeeee;
}

.PerformanceList .listArea {
    border-bottom: 1px solid #D9D9D9;
    padding-bottom: 1.615vw;
}

.listArea li button {
    border-radius: 5px;
    border: 1px solid #DCDCDC;
    min-width: 6.771vw;
    padding: 0.365vw 1.302vw;
    min-height: 2.135vw;
    transition: 0.3s ease-in-out;
    background: #F9F9F9;
    color: #333;
    display: flex;
    align-items: center;
    gap: 5px;
}

.listArea li button:hover,
.listArea .mainLable:hover,
.listArea li.active_selection button,
.listArea .mainLable:hover.active_selection {
    background: #B55438;
    color: #fff;
    border: 1px solid #B55438;
}

.active_selection button {
    color: #B55438 !important;
}


.listArea .mainLable {
    border-radius: 5px;
    border: 1px solid #DCDCDC;
    min-width: 6.771vw;
    padding: 0.365vw 1.302vw;
    min-height: 2.135vw;
    transition: 0.3s ease-in-out;
    background: #F9F9F9;
    color: #333;
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.mainLable input {
    cursor: pointer;
    margin: 0;
}

.mainLable label {
    cursor: pointer;
}

.listView {
    display: flex;
    justify-content: space-between;
    margin-top: 1.875vw;
}

.listNav h5 {
    color: #B55438;
    font-size: 0.938vw;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0.781vw;
    margin-left: 5px;
}

.listNav label.form-check-label {
    color: #333;
    font-size: 0.833vw;
    font-weight: 500;
    position: relative;
    line-height: normal;
    cursor: pointer;
}

.listView {
    display: flex;
    justify-content: space-between;
    margin-top: 1.875vw;
    padding: 0.99vw 1.719vw;
}

ul.listNav {
    padding: 0;
}
.listView.cstmRadio.justify-content-center ul.listNav {
    padding-right: 70px;
}
.listNav .form-check {
    margin-bottom: 0.521vw;
    display: flex;
    gap: 5px;
    padding: 0;
}

.tileBox {
    border-radius: 3px;
    width: 13.177vw;
    background: #F0F0F0;
    padding: 0.521vw;
    display: none;
    position: absolute;
    left: -6px;
    z-index: 9;
}

.listNav .form-check-label:hover .tileBox {
    display: block;
}

.tileBox ul li p {
    color: #333;
    font-size: 12px;
    font-weight: 700;
    line-height: normal;
    padding: 0;
}

.tileBox ul li span {
    font-size: 12px;
    font-weight: 500;
}

.threed-views-scroll .box {
    background: #000;
    text-align: center;
    overflow: hidden;
    position: relative;
    height: 18.229vw;
    margin-bottom: 1.563vw;
}

.indiflatContent h6 {
    font-size: 1vw;
}

.threed-views-scroll .box .flatImg {
    width: 100%;
    opacity: 0.5;
    height: auto;
    transform: scale(2);
    transition: all 0.5s;
}

.threed-views-scroll .box-content {
    color: #fff;
    width: 100%;
    opacity: 1;
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    left: 0;
    transition: all 0.4s ease 0s;
}

.threed-views-scroll .box .title {
    font-size: 1.25vw;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    margin: 0 0 0.417vw;
}

.threed-views-scroll .box .post {
    font-size: 0.833vw;
    font-weight: 400;
    letter-spacing: normal;
    text-transform: capitalize;
    display: block;
}

.threed-views-scroll .box:hover .flatImg {
    opacity: 0.2;
    filter: blur(3px);
    transform: scale(1.8);
}

.threed-views-scroll .box .title:after {
    content: '';
    height: 0.365vw;
    width: 6.771vw;
    margin: 0.417vw auto 0;
    border: 2px solid #fff;
    border-left: none;
    border-right: none;
    clear: both;
    display: block;
    opacity: 0;
    transform: scale(0);
    transition: all 0.4s ease 0s;
}

.threed-views-scroll .box:hover .title:after {
    opacity: 0.5;
    transform: scale(1);
}

.threed-views-scroll .box .zoomicon {
    padding: 0;
    margin: 0;
    list-style: none;
    transform: translateX(-50%) scale(0);
    position: absolute;
    bottom: 1.563vw;
    left: 50%;
    transition: all 0.5s linear;
}

.threed-views-scroll .box:hover .zoomicon {
    transform: translateX(-50%) scale(3);
    bottom: 3.463vw;
}

.selectedFliters {
    width: 13.021vw;
    border: 1px solid #E2DDDD;
    background: #FAFAFA;
}

.selectedFliters h2 {
    color: #666;
    font-size: 0.833vw;
    font-weight: 500;
    line-height: normal;
    padding: 0.677vw 0.573vw;
    border-bottom: 1px solid #CCC;
    display: flex;
    justify-content: space-between
}

.selectedUnits {
    padding: 0.677vw 0;
    border-bottom: 1px solid #CCC;
    margin: 0 0.573vw;
}

.selectedUnits:last-child {
    border-bottom: none;
}

.selectedUnits p {
    color: #666;
    font-size: 0.75vw;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0.26vw;
}

.selectedUnits h6 {
    color: #B55438;
    font-size: 0.875vw;
    font-weight: 500;
    line-height: normal;
}

.selectedUnits .tileBox,
.showTitle .tileBox {
    display: flex;
    background: none;
    position: relative;
    width: fit-content;
    padding-top: 0;
    padding-bottom: 0;
}

.showTitle .tileBox {
    flex-direction: column;
    margin-top: 15px;
}

.showTitle .tileBox p {
    padding: 0;
    margin: 0 0 10px;
}

.titleHead h3 {
    font-size: 12px;
    margin-bottom: 5px;
    color: #000;
    font-weight: 700;
    text-align: center;
}

.unitName {
    font-size: 0.833vw;
    background: #b9c5d3;
    border: 1px solid #000;
    padding: 0.156vw;
    text-align: center;
    margin: 0;
    font-weight: 700;
}

.panel {
    margin-bottom: 1.042vw;
    background-color: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.panel-body {
    padding: 0px 0.521vw;
    border: 1px solid #bfbfbf;
    border-top: 0px;
}

.lallpan .panel-body {
    padding: 0px;
    border: 1px solid #bfbfbf;
    border-top: 0px;
}

.lall2btn2 {
    border: 1px solid #da7f64;
    background: #ededed;
    color: #000;
    margin: 0px;
    padding: 0.104vw 1.563vw;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 600;
    border-radius: 0px;
    display: block;
    margin-top: 0.417vw;
    width: 100%;
    padding: 0.104vw;
}

.BgF5 {
    background: #f5b296;
}

.panel-heading h4 {
    background: #c7c7c7;
    font-size: 0.875vw;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    line-height: normal;
    padding: 0.104vw;
    border: 1px solid #a5a5a5;
    border-radius: 0;
    color: #000;
    margin-bottom: 0;
}

.panel-heading img {
    width: 0.625vw;
    float: right;
    margin-top: 0.208vw;
}

.panel-body p {
    padding: 1.042vw 0;
    margin-bottom: 0;
}

.panelBodyContent {
    width: 41%;
}

.panelKitech {
    width: 47%;
    position: relative;
    margin: auto;
}

.contentHead h4 {
    background: #ededed;
    border-radius: 0;
    margin: 0px;
    font-size: 0.875vw;
    font-weight: 600;
    text-align: center;
    line-height: normal;
    padding: 0.104vw;
    border: 1px solid #a5a5a5;
    color: #000;
    margin-bottom: 0;
    border-left: 0;
    text-transform: uppercase;
    border-top: 0;
}

.indiflatContent {
    background: #f9e8e1;
    padding: 0.521vw;
    border-right: 1px solid #bfbfbf;
}

.flatContent h6 {
    font-size: 0.677vw;
    line-height: normal;
    font-weight: 600;
}

.flatContent p {
    padding: 0;
    font-size: 0.625vw;
    text-align: center;
    line-height: normal;
}

p.newmeterzero2 {
    padding: 0;
    font-size: 0.729vw;
    margin: 0;
    float: left;
    margin-top: 0.26vw;
}

p.newmeterso2 {
    font-size: 0.729vw;
    margin: 0;
    float: right;
    margin-top: 0.26vw;
    padding: 0;
}

p.newmetermovingvalue2 {
    position: absolute;
    bottom: 1.198vw;
    font-size: 0.729vw;
    text-align: center;
    margin: 0;
    padding: 0;
}

.kithenBar {
    width: 100%;
}

.panelDefault {
    width: 49%;
}

.brdtop {
    border-top: 1px solid #ccc;
}

.brdleft {
    border-left: 1px solid #ccc;
}

.brdright {
    border-right: 1px solid #ccc;
}

.brdbottom {
    border-bottom: 1px solid #ccc;
}

.brdRightnone {
    border-right: 0 !important;
}

.whitescroll p {
    font-size: 0.875vw;
    color: #000;
    padding: 0;
}

p.imgDetail {
    padding: 0.26vw 0 0.26vw 0;
    text-align: center;
    border-bottom: 1px solid #ccc;
    margin-bottom: 1.563vw;
    font-size: 0.875vw;
}

.flatIndicators {
    padding: 0 2.083vw 0 1.042vw;
    margin-top: 30px;
}

.selectedUnits .tileBox li {
    margin-bottom: 0.26vw;
}

.indiflatContent p {
    padding: 0.365vw 0;
    font-size: 14px;
}

.multiHeatbar .panelKitech {
    width: 86%;
    margin: 1.563vw auto;
}

.multiHeatbar p.newmetermovingvalue2 {
    bottom: 0;
}

h2.barName {
    font-size: 0.625vw;
    line-height: normal;
    padding: 0 0.521vw;
}

.innerLegands p {
    padding: 0;
}

.mytable table tr td,
.mytable table tr th,
.mytable table {
    border-color: #000;
    vertical-align: middle;
    text-align: center;
}

.mytable thead tr th,
.mytable thead tr td {
    background-color: #d9d9d9;
}

.listNav .form-check input {
    margin-bottom: 0;
}

.viewer-box {
    left: -50px !important;
    top: -100px !important;
}

.iconName p {
    font-size: clamp(12px, 0.729vw, 14px);
    margin: 3px 0;
    text-align: center;
}

/* ==========toggle btn css============== */
.mainLable .form-check-input:checked {
    background-color: #8d8d8d;
    border-color: #8d8d8d;
}

.hide_btn {
    display: none !important;
}

.listArea .mainLable.active_selection {
    background: #B55438;
    color: #fff;
    border: 1px solid #B55438;
}

.image-container {
    position: relative
}

#main-image {
    width: 100%;
    height: auto;
    display: block;
}

.magnifier {
    position: absolute;
    width: 450px;
    /* Magnifier size */
    height: 450px;
    overflow: hidden;
    cursor: none;
    display: none;
    /* Initially hidden */
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    background-repeat: no-repeat;
}

.cstmMargin img {
    margin-top: 30px;
}

.cstmScale:hover img {
    transform: scale(1.1);
}

.compareLegend span strong {
    font-size: 12px;
}

.compareLegend p {
    padding: 0;
    margin: 0;
    font-size: 12px;
}

.backBtn {
    font-size: 16px;
    /* background: #b9c5d3; */
    /* border: 1px solid #000; */
    padding: 3px;
    max-width: 140px;
    text-align: center;
    cursor: pointer;
}

.backBtn a {
    color: #000;
}

.b-none {
    border: none;
}

.ui-widget-content {
    z-index: 9999 !important;
}


.selectFlats {
    position: absolute;
    right: 10px;
    bottom: 0;
}

.selectFlats .btn-group {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.btn-group:hover .icons,
.iconName a:hover .icons,
.btn-group.selectedBox .icons,
.iconName a.selectedBox .icons {
    background-color: #B55438;
    border-color: #FFB6A0;
}

.btn-group:hover .icons img,
.iconName a:hover .icons img,
.btn-group.selectedBox .icons img,
.iconName a.selectedBox .icons img {
    filter: brightness(6);
}

.btn-group:hover .areaFlatBtn,
.iconName a:hover span,
.btn-group.selectedBox .areaFlatBtn {
    color: #B55438;
}

.btn-group:hover .areaFlatBtn.dropdown-toggle::after,
.btn-group.selectedBox .areaFlatBtn.dropdown-toggle::after {
    filter: invert(67%) sepia(6%) saturate(7489%) hue-rotate(321deg) brightness(69%) contrast(110%);
}

.areaFlatBtn.dropdown-toggle::after {
    border: none;
    background-image: url(../../assets/images/droparrow.svg);
    width: 10px;
    height: 10px;
    background-repeat: no-repeat;
    background-size: 100%;
    margin-bottom: 2px;
}

.areaFlatBtn {
    padding: 8px 5px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    border: none;
    background: transparent;
    font-size: clamp(10px, 0.733vw, 16px);
    font-weight: 500;
}

.iconName a span {
    font-size: clamp(10px, 0.733vw, 16px);
    color: #000;
    padding: 8px 5px;
    font-weight: 500;
}

ul.dropdown-menu.selectFlatNav.show {
    width: 180px;
    padding-bottom: 0;
    padding-top: 0;
    border-radius: 2px;
    border: 1px solid #E1E1E1;
    background: #FFF;
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.18);
    transform: translate(-35px, 105px) !important;
}

ul.dropdown-menu.selectFlatNav.selectDesignData.show {
    transform: translate(0, 105px) !important;
}

.selectFlatNav li button {
    border: none;
    transition: 0.3s ease-in-out;
    background: transparent;
    color: #333;
    display: flex;
    width: 100%;
    text-align: left;
    font-size: 14px;
    padding: 8px 15px;
    border-bottom: 1px solid #EAEAEA;
}

.selectFlatNav li button:hover {
    color: #B55438;
    background-color: #fff;
}


.form-control::placeholder {
    color: #b4b4b4 !important;
    font-size: 13px;
}

.form-control::-ms-input-placeholder {
    color: #b4b4b4 !important;
    font-size: 13px;
}

/* .compareDetails .panelBodyContent {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
} */

.compareDetails .contentHead {
    margin-bottom: auto;
}

.map_area h5 {
    font-size: 1.042vw;
    font-weight: 300;
    line-height: 1.302vw;
    color: #666;
    text-align: center;
    
}

/* .selectFlatNav.hide {
    display: none !important;
} */
/* =====================================TOOLTIP CSS START HERE ================================ */
/* START TOOLTIP STYLES */
[tooltip] {
    position: relative;
    /* opinion 1 */
}

/* Applies to all tooltips */
[tooltip]::before,
[tooltip]::after {
    text-transform: none;
    /* opinion 2 */
    font-size: .9em;
    /* opinion 3 */
    line-height: 1;
    user-select: none;
    pointer-events: none;
    position: absolute;
    display: none;
    font-weight: 400;
    opacity: 0;
}

[tooltip]::before {
    content: '';
    border: 5px solid transparent;
    /* opinion 4 */
    z-index: 1001;
    /* absurdity 1 */
}

[tooltip]::after {
    content: attr(tooltip);
    overflow: hidden;
    box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
    z-index: 1000;
    width: 100%;
    line-height: normal;
    max-width: max-content;
    min-width: max-content;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.80);
    color: #000;
    font-size: 0.833vw;
    font-weight: 500;
    line-height: 24px;
    max-width: 31.719vw;
    padding: 8px 12px;
    text-align: left;
}

.toolPara[tooltip]::after {
    width: 30vw;
    max-width: max-content;
    min-width: auto;
}

/* Make the tooltips respond to hover */
[tooltip]:hover::before,
[tooltip]:hover::after {
    display: block;
}

/* don't show empty tooltips */
[tooltip='']::before,
[tooltip='']::after {
    display: none !important;
}

/* FLOW: UP */
[tooltip]:not([flow])::before,
[tooltip][flow^="up"]::before {
    bottom: 100%;
    border-bottom-width: 0;
    border-top-color: rgba(255, 255, 255, 0.80);
}

[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::after {
    bottom: calc(100% + 5px);
}

[tooltip]:not([flow])::before,
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::before,
[tooltip][flow^="up"]::after {
    left: 50%;
    transform: translate(-50%, -.5em);
}

/* FLOW: DOWN */
[tooltip][flow^="down"]::before {
    top: 100%;
    border-top-width: 0;
    border-bottom-color: rgba(255, 255, 255, 0.80);
}

[tooltip][flow^="down"]::after {
    top: calc(100% + 5px);
}

[tooltip][flow^="down"]::before,
[tooltip][flow^="down"]::after {
    left: 50%;
    transform: translate(-50%, .5em);
}

/* FLOW: LEFT */
[tooltip][flow^="left"]::before {
    top: 50%;
    border-right-width: 0;
    border-left-color: rgba(255, 255, 255, 0.80);
    left: calc(0em - 5px);
    transform: translate(-.5em, -50%);
}

[tooltip][flow^="left"]::after {
    top: 50%;
    right: calc(100% + 5px);
    transform: translate(-.5em, -50%);
}

/* FLOW: RIGHT */
[tooltip][flow^="right"]::before {
    top: 50%;
    border-left-width: 0;
    border-right-color: rgba(255, 255, 255, 0.80);
    right: calc(0em - 5px);
    transform: translate(.5em, -50%);
}

[tooltip][flow^="right"]::after {
    top: 50%;
    left: calc(100% + 5px);
    transform: translate(.5em, -50%);
}

/* KEYFRAMES */
@keyframes tooltips-vert {
    to {
        opacity: .9;
        transform: translate(-50%, 0);
    }
}

@keyframes tooltips-horz {
    to {
        opacity: .9;
        transform: translate(0, -50%);
    }
}

/* FX All The Things */
[tooltip]:not([flow]):hover::before,
[tooltip]:not([flow]):hover::after,
[tooltip][flow^="up"]:hover::before,
[tooltip][flow^="up"]:hover::after,
[tooltip][flow^="down"]:hover::before,
[tooltip][flow^="down"]:hover::after {
    animation: tooltips-vert 300ms ease-out forwards;
}

[tooltip][flow^="left"]:hover::before,
[tooltip][flow^="left"]:hover::after,
[tooltip][flow^="right"]:hover::before,
[tooltip][flow^="right"]:hover::after {
    animation: tooltips-horz 300ms ease-out forwards;
}

/* =====================================TOOLTIP CSS END HERE ================================ */

.modalClose {
    display: none !important;
}

.sideImg {
    padding: 1.042vw 1.2vw;
}

.sideImg img {
    width: 100%;
    height: 100%;
}

.sqm {
    text-transform: capitalize !important;
}

#errorModal {
    background: rgba(0, 0, 0, 0.4);
}

.addValues label {
    color: #B55438;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
}

.plotSizeInputArea {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.plotSizeInputArea.singleFamilyPlot{
    display: block;
}

.addValues {
    width: 50%;
}

.innerInputs {
    width: 65%;
}

.innerInputs input[type="text"] {
    padding: 12px 100px 12px 20px;
    min-height: 60px;
    border-radius: 5px;
    border: 1px solid #D0D8DF;
    background: #FDFEFF;
    width: 100%;
}

.plotSizeInputAreaImage {
    display: flex
;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 80px 0 0;
}

.innerInputs input[type="text"]:focus-visible {
    outline: none;
}

.buttonArea {
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
    margin: auto;
    height: fit-content;
    display: flex;
    align-items: center;
    gap: 5px;
}

.buttonArea button {
    background: #DEDEDE;
    border: none;
    color: #000;
    width: 35px;
    height: 35px;
    font-size: 26px;
    line-height: 1;
    border-radius: 5px;
}

.buttonArea button:hover {
    background: #c8c8c8;
}

.innerInputs p {
    font-size: 12px;
    color: #333;
    line-height: normal;
    position: absolute;
    margin: 0;
}

.innerInputs p.plotSizeValue {
    top: 50%;
    left: calc(100% + 20px);
    transform: translateY(-50%);

    font-size: 16px;
    line-height: 1.2;
    font-weight: 500;
    color: #666666;
}

#errorModal .modal-dialog {
    max-width: 38%;
}
#visualComfort_histogram{
    width: 100%;
}
#errorModal .modal-dialog .modal-body {
    height: auto;
    min-height: auto;
}

.mb-40 {
    margin-bottom: 30px;
}
.erroricon svg {
    width: 40px;
    height: auto;
}
.errorContent p {
    margin-bottom: 10px;
}
.alertArea{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
.alerMsg p {
    color: red;
    font-size: 14px;
    line-height: 1;
    margin-bottom: 0;
}

.alerMsg {
    position: absolute;
    bottom: 20px;
    left: 32px;
}
.notePara p {
    color: red;
    font-size: 12px;
    padding: 0;
    line-height: normal;
}

#cnfrm_change, #nbtn
{
    display: none;
}

.openClimateFilterButton {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #B55438;
    border: 1px solid #B55438;
    position: absolute;
    top: -5px;
    right: -5px;
    z-index: 1;
}

.openClimateFilterButton img {
    width: 12px;
}

.innerSelection .openClimateFilterButton {
    top: auto;
    bottom: -5px;
}

.climateFilterModal {
    display: flex;
    align-items: center;
    justify-content: center;
}

.climateFilterModal .modal-body {
    padding: 40px;
}

.climateFilterModal .climateFilterModal__main {
    display: flex;
    flex-direction: column;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__searchCityForm {
    display: flex;
    flex-direction: column;

    margin-bottom: 30px;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__searchCityForm .climateFilterModal__searchCityBox {
    display: flex;
    flex-direction: column;

    margin: 0 0 20px;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__searchCityForm .climateFilterModal__searchCityBox .climateFilterModal__searchCityLabel {
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.2;
    font-weight: 500;
    font-family: "Mulish", sans-serif;
    color: #333333;
    margin: 0 0 20px;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__searchCityForm .climateFilterModal__searchCityBox .climateFilterModal__searchCityInput {
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.2;
    font-weight: 500;
    font-family: "Mulish", sans-serif;
    color: #333333;
    /* background: #FDFEFF url('../images/arrowDown.png') no-repeat right 15px center / 12px; */
    background-color: #ffffff;
    border: 1px solid #D0D8DF;
    border-radius: 5px;
    padding: 15px;
    outline: none !important;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__searchCityForm .climateFilterModal__stateWeather {
    display: flex;
    flex-direction: column;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__searchCityForm .climateFilterModal__stateWeather p {
    font-size: clamp(12px, 0.833vw, 16px);
    line-height: 1.2;
    font-weight: 300;
    font-family: "Mulish", sans-serif;
    color: #666666;
    margin: 0;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__searchCityForm .climateFilterModal__stateWeather p span {
    display: inline-block;
    font-weight: 700;
    color: #B55438;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection {
    display: flex;
    flex-direction: column;

    margin: 0 0 50px;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__heading {
    display: flex;
    flex-direction: column;

    margin: 0 0 20px;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__heading h3 {
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.2;
    font-weight: 500;
    font-family: "Mulish", sans-serif;
    color: #333333;
    margin: 0;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes {
    display: flex;
    flex-wrap: wrap;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes .climateFilterModal__box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    text-align: center;
    margin-right: 40px;
    cursor: pointer;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes .climateFilterModal__box .climateFilterModal__image {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 106px;
    height: 106px;
    background-color: #F9F9F9;
    border: 1px solid #D5DEE9;
    border-radius: 15px;
    margin: 0 0 20px;
    position: relative;
    transition: 0.3s ease-in-out;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes .climateFilterModal__box .climateFilterModal__image:hover,
.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes .climateFilterModal__box.selected .climateFilterModal__image {
    box-shadow: 0px 6px 14px 0px rgba(0, 0, 0, 0.10);
    border: 3px solid #B55438;
    gap: 1.042vw;
    background: #eeeeee;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes .climateFilterModal__box .climateFilterModal__image img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1.0);
    max-width: 50%;
    max-height: 50%;
    width: auto;
    height: auto;
    transition: 0.3s ease-in-out;
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes .climateFilterModal__box .climateFilterModal__image:hover img {
    transform: translate(-50%, -50%) scale(1.1);
}

.climateFilterModal .climateFilterModal__main .climateFilterModal__selectSection .climateFilterModal__boxes .climateFilterModal__box .climateFilterModal__detailName {
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.2;
    font-weight: 500;
    font-family: "Mulish", sans-serif;
    color: #B55438;
    margin: 0;
}

.aboutUsSection {
    min-height: calc(100vh - 412px);
}

.aboutUsSection .aboutUsSection__mainBanner {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    position: relative;
    min-height: 498px;
}

.aboutUsSection .aboutUsSection__mainBanner .aboutUsSection__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
}

.aboutUsSection .aboutUsSection__mainBanner .aboutUsSection__img img {
    width: 100%;
}

.aboutUsSection .aboutUsSection__mainBanner .aboutUsSection__heading {
    width: 100%;
}

.aboutUsSection .aboutUsSection__mainBanner .aboutUsSection__heading h2 {
    font-size: clamp(40px, 3.125vw, 60px);
    line-height: 1.2;
    font-weight: 700;
    font-family: "Mulish", sans-serif;
    color: #ffffff;
    margin: 0 0 10px;
}

.aboutUsSection .aboutUsSection__mainBanner .aboutUsSection__heading p {
    font-size: clamp(12px, 0.833vw, 16px);
    line-height: 1.2;
    font-weight: 400;
    font-family: "Mulish", sans-serif;
    color: #ffffff;
    margin: 0;
}

.aboutUsSection .aboutUsSection__mainBanner .aboutUsSection__heading p a {
    display: inline-block;
    color: #ffffff;
}

.aboutUsSection .aboutUsSection__mainBanner .aboutUsSection__heading p span {
    font-weight: 700;
}

.aboutUsSection .aboutUsSection__aboutProgramme {
    background-color: #ffffff;
    padding: 80px 0;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    text-align: center;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top h2 {
    font-size: clamp(30px, 2.083vw, 40px);
    line-height: 1.2;
    font-weight: 700;
    font-family: "Mulish", sans-serif;
    color: #B55438;
    margin: 0 0 20px;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top p {
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.75;
    font-weight: 400;
    font-family: "Mulish", sans-serif;
    color: #000000;
    margin: 0 0 20px;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top p:last-child {
    margin: 0;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top ul {
    margin: 0;
    padding: 0;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top ul li {
    display: block;
    position: relative;
    padding-left: 26px;
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.75;
    font-weight: 400;
    font-family: "Mulish", sans-serif;
    color: #000000;
    margin: 0 0 20px;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top ul li:last-child {
    margin: 0;
}

.aboutUsSection .aboutUsSection__aboutProgramme .aboutUsSection__top ul li::before {
    content: "";
    display: block;
    position: absolute;
    top: 15px;
    left: 0;
    width: 16px;
    height: 2px;
    background-color: #B55438;
}

.aboutUsSection .aboutUsSection__Objectives {
    background-color: #FFF8F6;
    padding: 80px 0;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__top {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    
    margin: 0 0 20px;
    text-align: center;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__top h2 {
    font-size: clamp(30px, 2.083vw, 40px);
    line-height: 1.2;
    font-weight: 700;
    font-family: "Mulish", sans-serif;
    color: #B55438;
    margin: 0 0 20px;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__top p {
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.75;
    font-weight: 400;
    font-family: "Mulish", sans-serif;
    color: #000000;
    margin: 0 0 20px;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__top p:last-child {
    margin: 0;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__left,
.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__right {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    width: 36.5%;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__right {
    text-align: center;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__img {
    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 20px;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__img img {
    width: 100%;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__heading {
    width: 100%;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__heading h2 {
    font-size: clamp(18px, 1.25vw, 24px);
    line-height: 1.2;
    font-weight: 700;
    font-family: "Mulish", sans-serif;
    color: #333333;
    margin: 0 0 10px;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__heading p {
    font-size: clamp(14px, 0.938vw, 18px);
    line-height: 1.75;
    font-weight: 500;
    font-family: "Mulish", sans-serif;
    color: #333333;
    margin: 0;
}

.aboutUsSection .aboutUsSection__Objectives .aboutUsSection__bottom .aboutUsSection__heading p small {
    font-size: clamp(10px, 0.729vw, 14px);
    font-weight: 400;
}

#informationExploreModal .modal-dialog {
    max-width: 1250px;
}

#informationExploreModal .modal-content {
    border-radius: 0;
}

.information-content {
    padding: 0 1rem;
}

.information-content h3 {
    color: #B55438;
    font-family: "Mulish", sans-serif;
    font-size: clamp(18px, 1.771vw, 34px);
    font-style: normal;
    font-weight: 400;
    line-height: clamp(22px, 1.406vw, 27px);
    margin-top: 2.188vw;
    margin-bottom: 20px;
    text-align: center;
}

.information-content p {
    color: #333;
    text-align: center;
    font-family: "Mulish", sans-serif;
    font-size: clamp(12px, .729vw, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: clamp(18px, 1.198vw, 23px);
    padding-inline: 3.125vw;
    margin-bottom: 2.396vw;
}

#informationExploreModal .px-44 {
    padding-inline: 34px;
}

.explore-data-box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.explore-data-img {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 73px;
    height: 73px;
    background-color: #FAFAFA;
    border-radius: 50%;
    border: 1px solid #BCBCBC;
}

.explore-data-box img {
    max-width: 60%;
}

.explore-data-box h6 {
    color: #B55438;
    text-align: center;
    font-family: "Mulish", sans-serif;
    font-size: clamp(12px, .938vw, 18px);
    font-style: normal;
    font-weight: 500;
    line-height: clamp(22px, 1.406vw, 27px);
    margin-bottom: .521vw;
    margin-top: 1.458vw;
}

.explore-data-box p {
    color: #333;
    text-align: center;
    font-family: "Mulish", sans-serif;
    font-size: clamp(11px, .729vw, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: clamp(18px, 1.198vw, 23px);
}

.explore-data-box.sec_box {
    position: relative;
    padding-inline: 1.563vw;
}

.explore-data-box.sec_box:after,
.explore-data-box.sec_box:before {
    content: "";
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 205px;
    background: #d9d9d9;
    position: absolute;
    left: 0;
}

.explore-data-box.sec_box:after {
    right: 0;
    left: auto;
}

#informationExploreModal .modal-footer button.btn {
    margin: 0;
    border-radius: 3px;
    border: none;
    min-width: 5.573vw;
    font-size: clamp(12px, .833vw, 16px);
    font-weight: 500;
    padding: 0.5vw 2vw;
}

#informationExploreModal .modal-footer button.btn.btn-primary {
    background-color: #B55438;
    color: #fff;
}

#informationExploreModal .modal-footer button.btn.btn-default {
    background-color: transparent;
    color: #B55438;
    border: 1px solid #B55438;
}

#informationExploreModal .modal-footer .form-check {
    display: flex;
    align-items: center;
    justify-content: center;

    margin: 15px 0 0;
    padding: 0;
}

#informationExploreModal .modal-footer .form-check .mt-check {
    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 0;
    line-height: 1;
}

#informationExploreModal .form-check .form-check-input:checked[type=checkbox] {
    background-image: url(../../assets/images/checkboxCheckedIcon.svg) !important;
}

#informationExploreModal .modal-footer .form-check .form-check-input {
    margin: 0 5px 0 0;
    width: 15px;
    height: 15px;
    border-color: #aaa;
}

#informationExploreModal .form-check .form-check-input:checked {
    border-color: #B55438;
}

a.bellIconButton {
    display: flex;
    align-items: center;
    justify-content: center;

    position: fixed;
    right: 20px;
    bottom: 50px;
    width: 50px;
    height: 50px;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
}

a.bellIconButton img {
    width: 50%;

    -webkit-animation: ring 4s .7s ease-in-out infinite;
    -webkit-transform-origin: 50% 4px;
    -moz-animation: ring 4s .7s ease-in-out infinite;
    -moz-transform-origin: 50% 4px;
    animation: ring 4s .7s ease-in-out infinite;
    transform-origin: 50% 4px;
}

/* -------------------------------------- Contact us Style Sheet Start ---------------------------------------- */

.contactUsSection.contactUsSection--mainBanner {
    min-height: calc(100vh - 412px);
    padding: 0;
}

.contactUsSection .contactUsSection__mainBanner {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    position: relative;
    min-height: 498px;
}

.contactUsSection .contactUsSection__mainBanner .contactUsSection__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
}

.contactUsSection .contactUsSection__mainBanner .contactUsSection__img img {
    width: 100%;
}

.contactUsSection .contactUsSection__mainBanner .contactUsSection__heading {
    width: 100%;
}

.contactUsSection .contactUsSection__mainBanner .contactUsSection__heading h2 {
    font-size: clamp(40px, 3.125vw, 60px);
    line-height: 1.2;
    font-weight: 700;
    font-family: "Mulish", sans-serif;
    color: #ffffff;
    margin: 0 0 10px;
}

.contactUsSection .contactUsSection__mainBanner .contactUsSection__heading p {
    font-size: clamp(12px, 0.833vw, 16px);
    line-height: 1.2;
    font-weight: 400;
    font-family: "Mulish", sans-serif;
    color: #ffffff;
    margin: 0;
}

.contactUsSection .contactUsSection__mainBanner .contactUsSection__heading p a {
    display: inline-block;
    color: #ffffff;
}

.contactUsSection .contactUsSection__mainBanner .contactUsSection__heading p span {
    font-weight: 700;
}

.contactUsSection {
    display: flex;
    flex-direction: column;

    position: relative;
    padding: 80px 0;
}

.contactUsSection .contactUsSection__main {
    display: flex;
    flex-wrap: wrap;
}

.contactUsSection .contactUsSection__main .contactUsSection__form {
    display: flex;
    flex-direction: column;
    /* width: 53%; */
}

.contactUsSection .contactUsSection__main .contactUsSection__form .contactUsSection__heading {
    display: flex;
    flex-direction: column;

    margin: 0 0 30px;
}

.contactUsSection .contactUsSection__main .contactUsSection__form .contactUsSection__heading h2 {
    font-size: clamp(30px, 2.083vw, 40px);
    line-height: 1.2;
    font-weight: 700;
    font-family: "Mulish", sans-serif;
    color: #B55438;
    margin: 0 0 20px;
}

.contactUsSection .contactUsSection__main .contactUsSection__form .contactUsSection__heading p {
    font-family: "Mulish", sans-serif;
    font-size: clamp(12px, 0.833vw, 16px);
    line-height: 2;
    font-weight: 500;
    color: #000000;
    margin: 0;
}

.contactUsSection .contactUsSection__main .contactUsSection__googleMap {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;

    width: 45%;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    overflow: hidden;
}

.contactUsSection .contactUsSection__main .contactUsSection__googleMap img {
    width: 100%;
}

/* .cu_detailsBox {
    padding-left: 5.729vw;
    width: 47%;
} */

.cu_details {
    background: #FFF8F6;
    height: 100%;
}

.cu_details h2 {
    padding: 1.146vw 2.083vw;
    font-size: clamp(18px, 1.563vw, 30px);
    font-weight: 500;
    color: #B55438;
    border-bottom: 2px solid #B55438;
    font-family: "Mulish", sans-serif;
}

.cu_details ul {
    margin: 0;
    padding: 1.563vw 2.083vw;
    list-style-type: none;
}

.cu_details ul li {
    display: flex;
    margin-bottom: 1.563vw;
    gap: clamp(10px, 0.521vw, 10px);
}

.cu_details ul li span {
    display: block;
    height: fit-content;
    margin-top: 3px;
}

.cu_details ul li span img {
    filter: invert(32%) sepia(59%) saturate(852%) hue-rotate(331deg) brightness(103%) contrast(81%);
}

.cu_details ul li p {
    margin: 0;
    font-size: clamp(14px, 1.042vw, 20px);
    color: #B55438;
}

.cu_details ul li p a {
    color: #B55438;
    text-decoration: underline;
}

.text-decoration-none {
    text-decoration: none;
}

/* -------------------------------------- Contact us Style Sheet End ------------------------------------------ */


@-webkit-keyframes ring {
    0% {
        -webkit-transform: rotateZ(0);
    }

    1% {
        -webkit-transform: rotateZ(30deg);
    }

    3% {
        -webkit-transform: rotateZ(-28deg);
    }

    5% {
        -webkit-transform: rotateZ(34deg);
    }

    7% {
        -webkit-transform: rotateZ(-32deg);
    }

    9% {
        -webkit-transform: rotateZ(30deg);
    }

    11% {
        -webkit-transform: rotateZ(-28deg);
    }

    13% {
        -webkit-transform: rotateZ(26deg);
    }

    15% {
        -webkit-transform: rotateZ(-24deg);
    }

    17% {
        -webkit-transform: rotateZ(22deg);
    }

    19% {
        -webkit-transform: rotateZ(-20deg);
    }

    21% {
        -webkit-transform: rotateZ(18deg);
    }

    23% {
        -webkit-transform: rotateZ(-16deg);
    }

    25% {
        -webkit-transform: rotateZ(14deg);
    }

    27% {
        -webkit-transform: rotateZ(-12deg);
    }

    29% {
        -webkit-transform: rotateZ(10deg);
    }

    31% {
        -webkit-transform: rotateZ(-8deg);
    }

    33% {
        -webkit-transform: rotateZ(6deg);
    }

    35% {
        -webkit-transform: rotateZ(-4deg);
    }

    37% {
        -webkit-transform: rotateZ(2deg);
    }

    39% {
        -webkit-transform: rotateZ(-1deg);
    }

    41% {
        -webkit-transform: rotateZ(1deg);
    }

    43% {
        -webkit-transform: rotateZ(0);
    }

    100% {
        -webkit-transform: rotateZ(0);
    }
}

@-moz-keyframes ring {
    0% {
        -moz-transform: rotate(0);
    }

    1% {
        -moz-transform: rotate(30deg);
    }

    3% {
        -moz-transform: rotate(-28deg);
    }

    5% {
        -moz-transform: rotate(34deg);
    }

    7% {
        -moz-transform: rotate(-32deg);
    }

    9% {
        -moz-transform: rotate(30deg);
    }

    11% {
        -moz-transform: rotate(-28deg);
    }

    13% {
        -moz-transform: rotate(26deg);
    }

    15% {
        -moz-transform: rotate(-24deg);
    }

    17% {
        -moz-transform: rotate(22deg);
    }

    19% {
        -moz-transform: rotate(-20deg);
    }

    21% {
        -moz-transform: rotate(18deg);
    }

    23% {
        -moz-transform: rotate(-16deg);
    }

    25% {
        -moz-transform: rotate(14deg);
    }

    27% {
        -moz-transform: rotate(-12deg);
    }

    29% {
        -moz-transform: rotate(10deg);
    }

    31% {
        -moz-transform: rotate(-8deg);
    }

    33% {
        -moz-transform: rotate(6deg);
    }

    35% {
        -moz-transform: rotate(-4deg);
    }

    37% {
        -moz-transform: rotate(2deg);
    }

    39% {
        -moz-transform: rotate(-1deg);
    }

    41% {
        -moz-transform: rotate(1deg);
    }

    43% {
        -moz-transform: rotate(0);
    }

    100% {
        -moz-transform: rotate(0);
    }
}

@keyframes ring {
    0% {
        transform: rotate(0);
    }

    1% {
        transform: rotate(30deg);
    }

    3% {
        transform: rotate(-28deg);
    }

    5% {
        transform: rotate(34deg);
    }

    7% {
        transform: rotate(-32deg);
    }

    9% {
        transform: rotate(30deg);
    }

    11% {
        transform: rotate(-28deg);
    }

    13% {
        transform: rotate(26deg);
    }

    15% {
        transform: rotate(-24deg);
    }

    17% {
        transform: rotate(22deg);
    }

    19% {
        transform: rotate(-20deg);
    }

    21% {
        transform: rotate(18deg);
    }

    23% {
        transform: rotate(-16deg);
    }

    25% {
        transform: rotate(14deg);
    }

    27% {
        transform: rotate(-12deg);
    }

    29% {
        transform: rotate(10deg);
    }

    31% {
        transform: rotate(-8deg);
    }

    33% {
        transform: rotate(6deg);
    }

    35% {
        transform: rotate(-4deg);
    }

    37% {
        transform: rotate(2deg);
    }

    39% {
        transform: rotate(-1deg);
    }

    41% {
        transform: rotate(1deg);
    }

    43% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(0);
    }
}

@media (max-width: 1600px) {
    .filterBreadcrum {
        zoom: 0.88;
    }
    .innerModalArea {
        padding: 0.317vw 0.521vw;
    }

    .mainFlatBox {
        margin-top: 3vw;
    }

    .toggle-switch {

        width: 35px;
        height: 12px;
    }

    .toggle-switch:before {
        width: 16px;
        height: 16px;
    }

    .detailBox img {
        width: 55%;
    }

    #typologyModal .detailBox.cstmScale img {
        width: 80%;
        max-width: 100%;
    }

    .multiHeatbar {
        margin-top: 60px;
    }

    .mainHeader {
        min-height: 90px;
    }
}

@media (max-width: 1500px){
    .plotSizeInputArea{
        zoom: 0.8;
    }
}

@media (max-width: 1440px) {
    .mainHeader {
        min-height: 80px;
    }
}

@media (max-width: 1366px) {
    #filterModal .modal-dialog .modal-body {
        min-height: 54vh;
    }

    .iconName a span {
        padding: 6px 2px;
    }

    .icons img {
        width: 17px;
    }

    .headerModal .modal-body {
        max-height: 76vh;
    }

    .indiflatContent p {
        font-size: 12px;
    }

    ul.dropdown-menu.selectFlatNav.show {
        transform: translate(-35px, 85px) !important;
    }

    ul.dropdown-menu.selectFlatNav.selectDesignData.show {
        transform: translate(-95px, 85px) !important;
    }

    .areaFlatBtn {
        padding: 6px 3px;
    }

    .flatDesignImg.show {
        min-height: calc(100vh - 19.254vw);
    }

    .listNav h5,
    .listArea .mainLable,
    .listArea li button {
        font-size: 14px;
    }

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

    .detailBox {
        width: 13.029vw;
        height: 13.029vw;
    }

    .selectRadio .form-check {
        min-height: 2.588vw;
        max-height: 2.488vw;
    }

    .equalP {
        padding-top: 44px;
    }

    .filterBox {
        width: 90px;
        height: 38px;
    }

    .icons {
        width: 38px;
        height: 38px;
    }

    .custmSelect h4 {
        font-size: 13px;
    }


    .selectFlatNav li button {
        font-size: 12px;
    }

    .innerModalArea .custmSelect,
    .innerSelection .custmSelect {
        min-width: 170px;
    }

    .contactUsSection .contactUsSection__mainBanner {
        min-height: 350px;
    }
}

@media (max-width: 1300px) {
    .logoArea a img {
        width: 74%;
    }

    .innerSelection,
    .innerModalArea,
    .filterBreadcrum {
        zoom: 0.9;
    }

    .plotSizeInputArea {
        zoom: 0.8;
    }

    .custmSelect h4 {
        font-size: 12px;
    }
}

@media (max-width: 1280px) {
    .mainHeader {
        min-height: 70px;
    }
}

@media (max-width: 1024px) {
    .plotSizeInputArea {
        zoom: 0.6;
    }

    .mainHeader {
        min-height: 60px;
    }

    .mainHeader .mainHeader__main .mainHeader__selectionForHousing {
        width: calc(82.5% - (4.167vw + 12px));
    }

    .innerModalArea .custmSelect,
    .innerSelection .custmSelect {
        min-width: 160px;
    }

    .innerModalArea .custmSelect:first-child {
        width: 25%;
    }

    .mainHeader .mainHeader__main .mainHeader__burgerMenu {
        padding-left: 12px;
        width: calc(4.167vw + 12px);
    }
}

@media (max-width: 768px) {
    .mainHeader {
        min-height: 70px;
    }
    
    .headerModal .modal-dialog {
        max-width: 95%;
    }

    .selectArea,
    .sideDropdwn {
        width: 100%;
    }

    .innerModalArea .custmSelect,
    .innerSelection .custmSelect {
        min-width: 120px;
    }

    .innerModalArea,
    .innerSelection {
        padding: 10px;
    }
}

@media (max-width: 767px) {
    .cstmStyle .modal-header {
        max-height: none;
    }

    .plotSizeInputArea {
        gap: 25px;
    }

    .mainHeader {
        height: 35px;
        min-height: auto;
    }

    .mainHeader .mainHeader__main .mainHeader__logo {
        width: 20%;
    }

    .mainHeader .mainHeader__main .mainHeader__selectionForHousing {
        width: 70%;
    }

    .innerModalArea {
        flex-wrap: wrap;
    }

    .innerModalArea .custmSelect,
    .innerModalArea .custmSelect:first-child {
        width: 50%;
    }

    .innerSelection .custmSelect {
        min-width: 150px;
    }

    .mainHeader .mainHeader__main .mainHeader__burgerMenu {
        width: 10%;
    }

    .mainHeader .mainHeader__main .mainHeader__burgerMenu .menuArea {
        width: 35px;
        height: 35px;
    }

    .mainHeader .mainHeader__main .mainHeader__burgerMenu .menuArea a img {
        width: 40%;
    }

    .cstmBorder::after {
        height: 20px;
        top: 50%;
        transform: translateY(-50%);
    }

    .cstmBorder:nth-child(odd)::after {
        display: none;
    }

    .contactUsSection {
        padding: 40px 0;
    }

    .contactUsSection.contactUsSection--mainBanner {
        min-height: auto;
    }

    .contactUsSection .contactUsSection__mainBanner {
        min-height: 240px;
    }

    .contactUsSection .contactUsSection__mainBanner .contactUsSection__img {
        height: 100%;
    }

    .contactUsSection .contactUsSection__mainBanner .contactUsSection__img img {
        height: 100%;
    }

    .contactUsSection .contactUsSection__main .contactUsSection__form {
        margin: 0 0 40px;
    }

    #nav .content .container-prLink {
        padding: 40px;
    }

    #nav .content .container-prLink ul {
        padding: 0;
        margin: 0;
    }

    #nav .content .container-prLink ul li a {
        font-size: 15px;
    }

    .mainMenuButton_inner {
        top: 20px;
        right: 20px;
    }
}

#breadcrumb_l1{
    cursor: pointer;
}