@charset "UTF-8";

:root {
    --tu-basetext: #212529;
    --tu-blue: #1a3248;
    --tu-darkblue1: #13181a;
    --tu-darkblue2: #162123;
    --tu-darkblue3: #212529;
    --tu-yellow: #f0b310;
    --tu-gray1: #4c4c4c;
    --tu-gray2: #929090;
    --tu-dimgray: #808080;
    --tu-lightgray: #666666;
    --tu-lightergray: #cccccc;
    --tu-earth: #f2ede6;
    --fullheaderheight: 0px;
    --vh: 0px;
    --carouseloffset : 0px;
    --window-height: 0px;
}

body {background-color:var(--tu-darkblue1); }
body.overlay { overflow:hidden; }
a {
    color:var(--tu-yellow);
}
input::placeholder, textarea::placeholder {
    color:var(--tu-lightergray) !important;
}
.errmsg { color:red; font-size:.875rem; }
.hide { display:none; }
small { color:var(--tu-lightergray); }

/* SELF HOSTING
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url(../fonts/MaterialIcons-Regular.ttf) format('truetype');
} */
/* 
.material-icons {
 font-family: 'Material Icons';
 font-weight: normal;
 font-style: normal;
 font-size: inherit;
 display: inline-block;
 line-height: 1;
 text-transform: none;
 letter-spacing: normal;
 word-wrap: normal;
 white-space: nowrap;
 direction: ltr;

 -webkit-font-smoothing: antialiased;
 text-rendering: optimizeLegibility;
-moz-osx-font-smoothing: grayscale;
 font-feature-settings: 'liga';
}
 */
/* .heightfixds {
    height: 600px;
    overflow-y: scroll;
    padding: 10px;
    overflow-x: hidden;
} */

body {
    font-family: Tahoma, "Noto Sans TC";
}

::placeholder {
    color: #dee2e6 !important;
}


/* BOOTSTRAP OVERRIDE */
.modal-backdrop {
    backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    background-color:rgba(0,0,0,.5);
}

.modal-backdrop.show {
    opacity:1;
}

.modal-title {
    display: flex;
    align-items: center;
}

.modal-title > i {
    margin-right:.25em;
}




.btn-primary {
    color:var(--tu-darkblue3);
    background-color:var(--tu-yellow);
    border-color:var(--tu-yellow);
}

.btn-primary:hover, .btn-primary:active, .btn-primary:checked, .btn-primary:focus {
    color:var(--tu-yellow);
    background-color:var(--tu-blue);
    border-color:var(--tu-blue);
}

.dropdown-item {
    cursor:pointer;
}

.dropdown-item.active, .dropdown-item:active {
    /* color:var(--tu-yellow); */
    background-color:var(--tu-blue);
}


/* BUTTON */
.action button.btn {
    background-color: var(--tu-yellow);
    color: #13181a;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 38px;
    font-size: 18px;
}

.action button.btn:hover, .action button.btn:active, .action button.btn:focus {
    background-color: var(--tu-yellow);
}

.action button.btn a {
    display:inline-flex;
    align-items: center;
    color:var(--tu-darkblue1);
    width:100%;
    justify-content:center;
}

a {
    text-decoration: none;
}

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

span.material-icons {
    font-size: inherit;
    vertical-align: middle;
}

/* NAVBAR */
.navbar {
    background-color: #1a3248;
    color: #ffffff;
    min-height: 84px;
    flex-direction: column;
    padding:0;
    position:absolute;
}

.navbar-nav.language {
    width: 80px;
}

.navbar-nav.language .fa { margin-right:.25em; }

.navbar-nav.language .dropdown-menu-end {
    right:0;
}

.navbar-nav .nav-item .nav-link {
    color: #ffffff;
    font-size: 14px;
    white-space: nowrap;
}

.navbar-toggler {
    color: var(--tu-yellow);
    padding: 0;
}

.navbar-toggler:focus {
    box-shadow: none;
}

.navbar-toggler.collapsed {
    color: #ffffff;
}

.navbar-nav .nav-item.active .nav-link,
.navbar-nav .nav-item:hover .nav-link,
.navbar-toggler:hover {
    color: var(--tu-yellow);
}

a.back-link {
    color: #ffffff;
    display: flex;
    align-items: center;
    color: #ffffff;
    width: max-content;
    font-size: 14px;
}

a.back-link:hover {
    color: var(--tu-yellow);
}

.topcontrol {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .825em;
    /* position: sticky;
    position: -webkit-sticky; */
    position:relative;
    /* top: 84px; */
    z-index: 10;
    width: 100%;
    transition:all 300ms; -webkit-transition:all 300ms; -ms-transition:all 300ms;
}

.topcontrol a {
    color:#ffffff;
}

.topcontrol a:hover {
    color:var(--tu-yellow);
}

.topcontrol .right {
    display:inline-flex;
}

.topcontrol .jumplink {
    display: inline-flex;
    align-items: center;
}

.topcontrol .jumplink + .jumplink {
    margin-left:2em;
}


.hideheader .navbar {
    position:fixed;
    transform:translateY(-100%);
}

.hideheader.headertransition .navbar {
    transition:all 300ms; -webkit-transition:all 300ms; -ms-transition:all 300ms;
}

.hideheader.show .navbar {
    transform:translateY(0%);
}

/* .fixedheader .navbar {
    position:fixed;
    transform:translateY(-100%);
} */

.hideheader .topcontrol {
    /* position:absolute; */
    /* transform:translateY(-100%); */
}



/* CONTENT */
.content {
    /* margin-top: 84px; */
    margin-top:var(--fullheaderheight);
}

.content > * {
    -webkit-transform:translate3d(0,0,0);
}

/* SWIPPER GALLERY CAROUSEL */
#carousel {
    position: sticky;
    position: -webkit-sticky;
    top: calc((var(--carouseloffset) * -1) - 25vh);
}

#carousel > * {
    -webkit-transform:translate3d(0,0,0);
}

.swiper {
    position: relative;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.swiper-slide {
    background-size: cover;
    background-position: center;
}

.sw-gallery-carousel {
    /* height: 600px; */
    /* height:calc(100vh - 290px); */
    height:56.25vw;
    width: 100%;
    position: relative;
}

.sw-gallery-carousel .video {
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.sw-gallery-carousel .iconoverlay_video::before { font-size:6em; }
.sw-gallery-carousel .iconoverlay_video:hover::before { font-size:7em; }

.swiper.sw-gallery-carousel .swiper-button-next::after,
.swiper.sw-gallery-carousel .swiper-button-prev::after {
    content: none;
}

.swiper.sw-gallery-carousel .swiper-button-next,
.swiper.sw-gallery-carousel .swiper-button-prev {
    font-size: 4em;
}

.gal-btn-share-wrapper{
    position:relative;
    /* position: sticky;
    position: -webkit-sticky;
    top: var(--fullheaderheight); */
    z-index: 2;
}

.gal-btn-share {
    position: absolute;
    top: 1.5em;
    right: 1.5em;
    background-color: #ffffff;
    border-radius: 100%;
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 11;
}

.gal-btn-share .i-icon {
    font-size: 18px;
}

.gal-caro-box {
    position: absolute;
    bottom: 100%;
    background: rgb(0, 0, 0);
    background: linear-gradient(0deg,
            rgba(0, 0, 0, 0.7749474789915967) 0%,
            rgba(0, 0, 0, 0) 100%);
    width: 100%;
    color: #ffffff;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 3em 2em 2em;
    z-index: 2;
    pointer-events: none;
    left:0;
}

.gal-caro-box .gal-caro-box__name {
    font-size: 2em;
    text-align: left;
    font-size: 36px;
    line-height:1.3em;
}

.gal-caro-box .gal-caro-box__info {
    text-align: right;
}

.sw-gallery-carousel .swiper-slide video {
    cursor:pointer;
    object-fit: cover;
}

.sw-gallery-carousel .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* object-fit: contain; */
    cursor:grab;
}

.sw-gallery-carousel-thumbs-box {
    padding: 1em 5em;
    background-color: #162123;
    z-index: 2;
    position: relative;
    /* position: sticky;
    position: -webkit-sticky;
    bottom: 0; */
}

.sw-gallery-carousel-thumbs-box p {
    text-align: center;
}

.sw-gallery-carousel-thumbs {
    background-color: #162123;
    height: 20%;
    box-sizing: border-box;
    /* padding: 2em 6em !important; */
}

.sw-gallery-carousel-thumbs p {
    margin: .25em 0 0;
}

.sw-gallery-carousel-thumbs-box .swiper-button-next.nav-thumbs::after,
.sw-gallery-carousel-thumbs-box .swiper-button-prev.nav-thumbs::after {
    content: none;
}

.sw-gallery-carousel-thumbs-box .swiper-button-next.nav-thumbs,
.sw-gallery-carousel-thumbs-box .swiper-button-prev.nav-thumbs {
    top: calc(50% - 20px);
    font-size: 3em;
}

.sw-gallery-carousel-thumbs-box .swiper-button-next.nav-thumbs {
    /* right: 3%; */
    right: 1.75rem;
}

.sw-gallery-carousel-thumbs-box .swiper-button-prev.nav-thumbs {
    /* left: 3%; */
    left: 1.75rem;
}

.sw-gallery-carousel-thumbs .swiper-slide {
    /* width: 25%; */
    width: 177px;
    height: 100%;
    color: #ffffff;
    cursor:grab;
}

.iconoverlay_video {
    position: relative;
    cursor: pointer;
}

.iconoverlay_video.active::before {
    /* z-index: 0; */
    opacity:0;
    /* content:''; */
}

.iconoverlay_video::before {
    font-family: 'Material Icons';
    content: '';
    position:absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size:2em;
    color:rgba(255,255,255,.5);
    transition-property: font-size, color, content;
    transition-duration: 300ms;
    pointer-events:none;
    z-index: 10;
}

.iconoverlay_video:hover::before {
    font-size:2.2em;
    color:rgba(255,255,255,1);
}

.sw-gallery-carousel-thumbs .swiper-slide img {
    box-sizing: border-box;
    border: 4px solid transparent;
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
}

.sw-gallery-carousel-thumbs .swiper-slide-thumb-active {
    opacity: 1;
}

.sw-gallery-carousel-thumbs .swiper-slide-thumb-active img {
    box-sizing: border-box;
    border: 4px solid #ab9271;
}

/* SECTION DETAIL OF PROPERTY */
#detailOfProperty {
    background-color:white;
    position:relative;
}

.detail-of-property__image {
    position: relative;
    background-color: #f2e8da;
    /* height: 35vw; */
    /* display: flex; */
    /* justify-content: center; */
    padding-top:150px;
    text-align: center;
}

.detail-of-property__image img {
    z-index: 2;
    /* position: absolute; */
    position: relative;
    /* top: 6vw; */
    border-radius: 0.5em;
    /* width: 55vw; */
    /* max-width: 100%; */
    width:100%; max-width:937px;
    margin-bottom:-90px;
}

.detail-of-property__info {
    position: relative;
    /* height: 40vw;
    min-height: 500px; */
    display: flex;
    justify-content: center;
}

.detail-of-property__info img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%) sepia(1%) hue-rotate(360deg) saturate(777%) opacity(24%) contrast(104%);
    -webkit-filter: grayscale(100%) sepia(1%) hue-rotate(360deg) saturate(777%) opacity(24%) contrast(104%);
    -moz-filter: grayscale(100%) sepia(1%) hue-rotate(360deg) saturate(777%) opacity(24%) contrast(104%);
    pointer-events: none;
}

.detail-of-property__info div.card {
    /* position: absolute; */
    position: relative;
    margin-top: 150px;
    margin-bottom: 150px;
    background-color: transparent;
    border: none;
    /* width: 55vw; */
    width: 100%;
    max-width:937px;
}

.detail-of-property__info div.card .card-header {
    background-color: transparent;
    border: none;
    padding: 0 0 3em;
    font-size: 18px;
}

.detail-of-property__info div.card .card-body {
    background-color: #c5b196;
    border-radius: 0.5em;
    padding: 20px 15px;
    justify-content: space-between;
}

.detail-of-property__info div.card .card-body .side {
    padding: .5em .5em .5em 1em;
    border-right: 1px solid #a6957e;
    width:auto;
    flex:1;
    /* flex:auto; */
}

.detail-of-property__info div.card .card-body .side span {
    font-size: 42px;
    font-weight: 700;
}

.detail-of-property__info div.card .card-body .side p {
    margin: 0;
    line-height: 1.3em;
    /* font-size: .7em; */
}

.detail-of-property__info div.card .card-body .side:last-child {
    border-right: none;
}

.detail-of-property__info div.card .card-footer {
    margin: 1em auto 0;
    background-color: transparent;
    border: none;
    width: 75%;
}

/* FEATURE */
#feature {
    position:relative;
}

.feature {
    background-color: #ffffff;
    padding: 5em 0;
}

.feature .row {
    /* background-color: red; */
    width: 80%;
    margin: auto;
    padding: 2em 0;
}

.feature hr {
    /* background-color: red; */
    width: 80%;
    margin: 2em auto;
}

.feature .row .box i {
    font-size: 3em;
}

.feature .row .box span {
    color: #666666;
    font-size: 18px;
}

.contact h3 {
    font-size: 36px;
    color: #5e5548;
    font-weight: 600;
}

/* GOOGLE MAPS */
#googleMaps {
    position:relative;
}

.google-maps {
    position: relative;
    width: 100%;
    height: 600px;
}

.google-maps iframe {
    width: 100%;
    height: 100%;
}

/* CONTACT */
#contact {
    position: relative;
}

.contact {
    background-color: #f2e8da;
    padding: 3em 0;
}

.contact .card.form {
    /* width: 80%; */
    width: 100%;
    max-width: 937px;
    margin: auto;
    background-color: #ffffff;
    padding: 3em 1em 2em;
    border-radius: 0.5em;
    border: none;
    position: relative;
}

.card-loading {
    display:none;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px);
    justify-content: center;
    align-items: center;
}

.card-loading .fas {
    font-size:3em; margin-right:.5rem;
}

.card-loading p {
    margin-bottom:0;
}

.addloading > * { opacity:.3; }
.addloading .card-loading { display:flex; opacity:1; }


.contact .card.form .card-header {
    background-color: #ffffff;
    border: none;
    text-align: center;
}

.contact .card.form .card-header p {
    font-size: 18px;
}

.contact .card.form .card-body {
    background-color: #ffffff;
    border: none;
}

.contact .card.form .card-body .grecaptcha-badge {
    position:relative !important;
    visibility: visible !important;
}

.contact .card.form .card-footer {
    background-color: #ffffff;
    border: none;
}

.contact .card.form .card-footer p {
    font-size: .9em;
}

.contact .card.form .card-footer .box {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.5em;
    position: relative;
}

.contact .card.form .card-footer .box.active .icon-socmed { opacity:.3; }

.contact .card.form .card-footer .box .icon-socmed {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100px;
    color: #666666;
    text-decoration: none;
    /* margin-bottom: 1em; */
}

.contact .card.form .card-footer .box .icon-socmed img {
    width: 50px;
}

.hoverimgsd {
    /* width: 80px !important; */
    width: 110px !important;
}

.contact .card.form .card-footer .box .icon-socmed p {
    margin: 0;
    font-size: 16px;
}

.contact .card.form .card-footer .box-socmed .box-wechat {
    background-color:rgba(255,255,255,.7);
}

#swipperGalleryBottom h3.mb-5.text-white.text-center {
    font-size: 36px;
}

/* SWIPPER GALLERY BOTTOM */
.swiper.swiper.sw-gallery-bottom {
    width: 100%;
    height: 100%;
}

#swipperGalleryBottom {
    background-color: #162123;
    padding: 5em 0;
    position:relative;
}

.propertycard {
    background-color: #c5b196;
    border: 0;
    border-radius: 0.5em;
    width:385px;
    height:auto;
    overflow:hidden;
}

/* .propertycard .card-body {
  padding: 0.5em;
} */

.propertycard .card-footer.row {
    /* margin: 0 1em; */
    /* padding: 0.5em 0 1.8em; */
    background-color: transparent;
    justify-content: space-between;
}

/* .propertycard .card-footer.row > *{
    width:auto;
} */

.propertycard .gal-bot-name {
    margin: 0;
    font-size: 22px;
    font-weight:bold;
    line-height:1.3em;
    /* text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; */
}

.propertycard.oneline .gal-bot-name {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.propertycard .gal-bot-price {
    font-size: 18px;
}

.propertycard .gal-bot-desc,
.propertycard .card-footer p {
    margin: 0;
    /* font-size: 0.8em; */
    /* display: flex;
    align-items: center; */
}

.sw-gallery-bottom .propertycard .card-footer p span {
    /* font-size: 20px; */
    font-size: 1.25em;
}

/* .propertycard .card-footer p i {
    font-size: 1.3em;
} */

.swiper.sw-gallery-bottom .swiper-button-next::after,
.swiper.sw-gallery-bottom .swiper-button-prev::after {
    content: none;
}

.swiper.sw-gallery-bottom .swiper-button-next,
.swiper.sw-gallery-bottom .swiper-button-prev {
    font-size: 4em;
}

.swiper.swiper.sw-gallery-bottom .swiper-button-next {
    top: calc(50% - 20px);
}

.swiper.swiper.sw-gallery-bottom .swiper-button-prev {
    top: calc(50% - 20px);
}

.swiper.swiper.sw-gallery-bottom .swiper-pagination-bullet {
    background: #454d4f;
    width: 1rem;
    height: 1rem;
    border-radius: 0.5rem;
    opacity: 1;
    margin: 0 10px;
}

.swiper.swiper.sw-gallery-bottom .swiper-pagination-bullet-active {
    background-color: var(--tu-yellow);
    width: 1rem;
    height: 1rem;
    border-radius: 0.5rem;
}


/* MODAL */

#modal_share .modal-dialog { max-width:860px; width:calc(100% - 2em); }
#modal_calc_stampduty .modal-dialog { max-width:700px; width:calc(100% - 2em); }

.modals .propertycard .card-footer.row { flex-wrap: wrap; }
.modals .propertycard .card-footer.row > * { margin-bottom:4px; }
.modals .propertycard .card-footer.row > *:last-child { margin-bottom:0; }

.modals .modal-body { padding-left:1.5rem; padding-right:1.5rem; }

.modal_share_container {
    display:flex;
    width:100%;
    /* padding:.25em 1em; */
}

.share_form {
    flex:1;
    margin-right:2em;
}

.share_form .field_wrapper {
    position:relative;
}

.share_form .field_control {
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%); -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%);
}

.share_form .field_control a {
    cursor:pointer;
}

.share_form .field_control a:hover {
    color:var(--tu-blue);
}

.share_form .field_control .material-icons {
    font-size:2em;
}

.calc_table {
    width:100%;
}

.calc_table td {
    width:100%;
}

.calc_table > tbody > tr > th {
    vertical-align: top;
}

.calc_table label {
    width:100%;
}

.calc_table input[type=radio] {
    margin-right:.5em;
}

.calc_list {
    display: flex;
    flex-direction: column;
    margin:1em 0;
}

.calc_table .calc_list { margin:.25em 0; }

.calc_row {
    display: flex;
    margin:.25em 0;
    align-items: center;
}

.calc_cell_key {
    flex:1;
    margin-right:2em;
}

.calc_table th .calc_cell_key {
    margin-right:0;
}

.calc_cell_value {
    /* flex: 0 0 50%; */
    display: flex;
    position:relative;
    flex:0 1 300px;
    /* padding-left:1em; */
    align-items: center;
}

.calc_cell_value.flexstart {
    align-self: flex-start;
}

.calc_cell_value .symbol {
    /* position:absolute; */
    /* right:calc(100% + .5em); */
    /* left:0; */
    position:relative;
    margin-right:.25em;
}

.calc_cell_value input {
    width:100%;
}

/* .calc_cell_value input[type='text'] {
    max-width:300px;
} */

.modal_calc_results {
    margin-top:2em;
}


/* FOOTER */
.footer {
    background-color: #13181a;
    padding: 4em 2em 2em;
    color: var(--tu-gray2);
    position: relative;
}

.footer .content-logo {
    width: 70%;
    margin: auto;
}

.footer .box-socmed {
    display: flex;
    position: relative;
}

.footer .box-socmed .icon-socmed {
    text-align: center;
    color: var(--tu-gray2);
    text-decoration: none;
    width: 70px;
}

.box-socmed .box-wechat {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #13181acf;
    cursor: pointer;
}

.footer .box-socmed .box-wechat img {
    max-width: 100%;
    height: 100%;
    object-fit: contain;
}

.footer .content-logo img {
    max-width: 50px;
    object-fit: contain;
}

.footer .content-logo p {
    margin-bottom: 0;
    font-size: 0.75em;
}

.footer .content-logo a {
    color:var(--tu-gray2);
}

.footer .content-logo a:hover {
    color:var(--tu-yellow);
}

.footer .content-logo .img-scan {
    width: calc(50% - (136px / 2));
}

.footer .content-logo .img-scan img {
    width: 50%;
    max-width: 200px;
    min-width: 150px;
    object-fit: contain;
}

.footer .content-logo .box {
    width: calc(50% + (136px / 2));
}

.footer .content-logo .box img {
    object-fit: contain;
    min-width: 100px;
    max-width: 135px;
    width: 100%;
    margin-top: -4em;
}

.footer .content-socmed {
    margin-top: -0.5em;
}

.footer .content-socmed a {
    outline: none;
}

.footer .content-socmed a i {
    font-size: 2em;
    color: var(--tu-gray2);
}

.footer .content-info {
    margin-top: 2em;
    width: 80%;
    margin: 2em auto 0.5em;
}

.footer .content-info p {
    margin-bottom: 0;
    font-size: 0.75em;
}

.footer .content-info {
    margin-bottom: 0;
    font-size: 0.75em;
}

.footer .content-info p:last-child {
    text-align: right;
}

.top-bottom {
    background: #000;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    text-align: center;
    padding-top: 8px;
    color: #666666 !important;
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translate(-50%, 0px);
}

.top-bottom a {
    color: #666666;
}

/**********  about page css *****/
.aboutbannerbottom {
    padding: 111px 0px 190px;
    background: var(--tu-earth);
}

.aboutbannerbottom h3 {
    font-weight: 600;
    /* margin-bottom: 40px; */
}

.aboutbannerbottom a {
    text-decoration: underline;
}

/* ---- Compatibility style for old contents START ---- */

.aboutbannerbottom .col-md-12 > div > div > div > h1, .aboutbannerbottom .col-md-12 > div > h2 { line-height:0; }
.aboutbannerbottom .col-md-12 > p > span, .aboutbannerbottom .col-md-12 > div > div > div > h1 > span, .aboutbannerbottom .col-md-12 > div > h2 > span { margin-bottom:1em; font-size:1rem !important; line-height:1.5; display:inline-block; /* width:100%; */ }
.aboutbannerbottom .col-md-12 > p img { width:100%; height:unset; /* margin-bottom:1em; */ }
.aboutbannerbottom .col-md-12 > p > span strong, .aboutbannerbottom .col-md-12 > div > div > div > h1 > span strong, .aboutbannerbottom .col-md-12 > div > h2 > span strong { font-size:1.375rem; }

/* ---- Compatibility style for old contents END ---- */


.aboutbannerbottom > .container > .row > .col-md-12 > table { width:100% !important; }

.aboutbannerbottom .tab-dropdown {
    background-color: transparent;
}

.aboutbannerbottom .tab-dropdown .dropdown-toggle {
    display:none;
}

.aboutbannerbottom .nav-tabs {
    border-bottom:0;
    position: relative;
    z-index: 10;
    background-color: transparent;
    border:0;
    padding-bottom:0;
}

.aboutbannerbottom .nav-tabs .nav-link {
    background-color:rgba(179,179,179,.5);
    background-clip:padding-box;
    color:var(--tu-gray1);
    transition:none;
    /* padding:1em; */
}

.aboutbannerbottom .nav-tabs .nav-link.active, .aboutbannerbottom .nav-tabs .nav-link:hover {
    background-color:white;
    border-color:rgba(0,0,0,.2);
    border-bottom:0;
    color:var(--tu-gray1);
}

.aboutbannerbottom .tab-content .modal-content {
    border-top-left-radius: 0;
    margin-top:-1px;
    padding-top:1em;
}

.aboutbannerbottom .tab-pane {
    transition:none;
}

.aboutbannerbottom .responsive_table {
    overflow-x: auto;
}

.aboutbannerbottom .responsive_table > table {
    width:100% !important;
}

.aboutbannerbottom #tab_stampdutyrates.tab-pane form table { width:100%; margin-bottom:1em; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table table { margin:10px 0; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table table td { padding-right:0; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table table tr:hover { background:#dddddd; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table table tr.havecontents:hover { background:white; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table th { vertical-align:top; padding:5px 15px 5px 5px; text-align:left; border-width:1px; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table th.radio { width:20px; padding-right:5px; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table td { vertical-align:top; padding:5px 15px 5px 5px; border-width:1px; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form h3 { margin-bottom:1rem; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form * + h3 { margin-top:36px; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form hr + h3 { margin-top:12px; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form a { text-decoration:underline; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table p { margin:0; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form fieldset { border:none; text-align:right; float:right; position:relative; white-space:nowrap; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form input[type='text'] { margin:0 3px; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form table td, .aboutbannerbottom #tab_stampdutyrates.tab-pane form table th { border-color:#787878; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form .odd, .aboutbannerbottom #tab_stampdutyrates.tab-pane form .odd td, .aboutbannerbottom #tab_stampdutyrates.tab-pane form .odd th { background-color:#919191; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form .odd td, .aboutbannerbottom #tab_stampdutyrates.tab-pane form .odd th { color:white; }
.aboutbannerbottom #tab_stampdutyrates.tab-pane form .odd td p, .aboutbannerbottom #tab_stampdutyrates.tab-pane form .odd th p { color:white; }


.commonbanner h2 {
    font-size: 40px;
}

.commonbanner p {
    margin-bottom: 0;
}

.commonbanner {
    position: relative;
    width: 100%;
    padding: 325px 0px 40px;
    margin-top: 84px;
    color: #fff;
    border-bottom: 10px solid var(--tu-yellow);
}

.sections {
    position: relative;
    width: 100%;
}

.commonbanner .container {
    z-index: 99;
    position: relative;
}

.aboutbanner {
    background: url(../img/about-banner.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.commonbanner:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, #000, #000);
    content: "";
    opacity: .3;
}

/**********  about page css end *****/

/**********  contact page css start*****/
.contactmap .media-body {
    font-size: 14px;
}

.contactmap ul li h5 {
    font-size: 16px;
    margin-bottom: 5px;
    font-weight: 600;
}

.contactmap ul li a {
    color: #000;
}

.contactbanner {
    background: url(../img/cantact-banner.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.contactmap {
    padding: 90px 0px;
    position: relative;
    background: var(--tu-earth);
}

.contactmap h3 {
    font-size: 28px;
    font-weight: 600;
}

.contactmap .media img {
    width: 36px;
    border: 1px solid #000;
    padding: 7px;
    border-radius: 50%;
    margin-right: 15px;
}

.contactmap ul.info li {
    list-style: none;
    padding-right: 50px;
    float: left;
}

.contactmap ul.info {
    padding: 0;
    width: 100%;
    float: left;
    margin-bottom: 40px;
}

.contactmap iframe {
    border: 0;
    margin-bottom: 50px;
}

.contactmap .media {
    display: flex;
    align-items: flex-start;
}

::placeholder {
    color: #212529 !important;
    opacity: 1;
    /* Firefox */
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #212529 !important;
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #212529 !important;
}

.contactmap form input {
    border: none;
    border-bottom: 1px solid #212529;
    border-radius: 0px;
    padding: 10px;
    color: #212529;
    outline: none;
    box-shadow: none !important;
    background: transparent;
}

.contactmap textarea {
    resize: vertical;
    width: 100%;
    height: 120px;
    padding: 10px 20px;
    border: 1px solid #212529;
    /* margin-bottom: 20px; */
    margin-top: 20px;
    background: transparent;
}

.contactmap .btn, .aboutbannerbottom .btn-pill {
    background: var(--tu-yellow);
    padding: 6px 30px;
    color: #13181a;
    border-radius: 30px;
    border: none;
    margin-left: 10px;
}

.btnmain {
    margin-top:1em;
    float: right;
    text-align: right;
}

.contactbanner {
    background-position: inherit;
}

/**********  contact page css end *****/

/**********  home page css end *****/
.searchlisthome {
    width: 100%;
    max-width: 640px;
    margin: auto;
}

.homebanner {
    background: url(../img/home-banner.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 300px 0px;
    border-bottom: none;
}

.searchlisthome h4 {
    font-size: 24px;
    font-weight: 300;
}

.searchlisthome b {
    font-weight: 600;
}

.searchlisthome .dropdown {
    /* background: #fff; */
    width:100%;
}

.searchlisthome .btn-secondary {
    color: #6c757d !important;
    background-color: #fff !important;
    border-color: #fff !important;
    outline: none !important;
    box-shadow: none !important;
    display:flex;
    justify-content: space-between;
    align-items: center;
    width:100%;
    padding-left:0;
    padding-right:0;
}

.searchlisthome .dropdown-toggle::after {
    position:absolute;
    right:.25em;
}

.searchlisthome .dropdown-toggle .icon {
    font-size:2em;
    color:var(--tu-gray1);
    line-height: 1em;
}

.media {
    display: flex;
    /* align-items: flex-start; */
    align-items: center;
}

.searchlisthome .media h5 {
    font-size: .875em;
    margin: 0;
    opacity: .7;
    color: var(--tu-dimgray);
}

.searchlisthome .media-body {
    font-size: .875em;
    padding-left: .5em;
    text-align: left;
    color:var(--tu-gray1);
}

.searchlisthome .media a.dropdown-item {
    width: 70px;
}

.searchlisthome .media-body a.dropdown-item {
    padding: 0;
}

/* .searchlisthome .dropdown-item.active, .searchlisthome .dropdown-item:active {
    background-color: transparent !important;
}

.searchlisthome .dropdown-item:focus, .searchlisthome .dropdown-item:hover {
    color: #1e2125;
    background-color: transparent !important;
} */

.searchlisthome > .dropdown >  .dropdown-menu {
    width: 100%;
    padding: 10px;
    display: none;
    flex-wrap: wrap;
    justify-content: space-between;
}

.searchlisthome > .dropdown >  .dropdown-menu.show {
    display: flex;
}

.searchlisthome > .dropdown > .dropdown-menu > li {
    display: flex;
    align-items: center;
    border-radius: 5px;
    padding: 0px 5px;
    /* width: 31%; */
    margin: 4px 0;
    /* float: left; */
    border: 1px solid #ddd;
    flex:0 0 calc(33.333% - 4px);
}

.searchlisthome > .dropdown >  .dropdown-menu > li select {
    border: none;
    background: #fff;
    outline: none;
    box-shadow: none;
}

.searchlisthome .dropdown-item {
    cursor:pointer;
}

.searchhomebtn {
    width: 100%;
    float: left;
    text-align: right;
    margin-top: .5em;
}

.yellowbg {
    background: var(--tu-yellow);
    padding: 6px 30px;
    color: #13181a;
    border-radius: 30px;
    border: none;
    margin-left: 10px;
}

.lightgreen {
    background: #748566;
    padding: 30px 0px;
    position: relative;
}

.grrnbgbox {
    width: 100%;
    float: left;
    position: relative;
}

.grrnbgbox img {
    height: 205px;
    object-fit: cover;
}

.grrnbgbox h4 {
    position: absolute;
    top: 50%;
    left: 15%;
    transform: translate(0px, -50%);
    color: #fff;
}

.realstatehome {
    background: url(../img/bghome-l.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 120px 0px;
    border-bottom: none;
}

.realstatehome > * > .row {
    align-items:center;
}

.realstatebox p {
    font-size: 18px;
    margin: 0;
    color: #5e5548;
}

.realstatebox h1 {
    font-size: 48px;
    color: #5e5548;
}

.realstatewhitebg {
    width: 100%;
    max-width: 85.5%;
    background: rgba(255, 255, 255, .6);
    padding: 40px 30px;
}

.realstatewhitebg p {
    margin: 0px;
}

/**********  home page css end *****/

/************ saleles page css start    *******/
.salelesbanner {
    background: url(../img/saleles-banner.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 325px 0px 40px;
}

.basicdeta {
    display: flex;
    align-items: center;
}

.basicdeta h4 {
    font-size: 28px;
    white-space: nowrap;
    margin-top: 38px !important;
    margin-right: 10px !important;
}

.photopreview {
    width: 296px;
    /* height: 168px; */
    aspect-ratio: 296/168;
    border: 1px solid #777;
    padding: 0px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position:relative;
}

.photopreview img {
    position:absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.photopreviewmain {
    display: flex;
    align-items: center;
}

.salesmain select {
    border: none;
    border-bottom: 1px solid #212529;
    border-radius: 0px;
    padding: 10px 20px;
    color: #212529;
    outline: none;
    box-shadow: none !important;
    background: transparent;
    width: 100%;
}

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

/************ saleles page css end    *******/

/************ Transection page css start    *******/
.transectionafter .dropdown {
    min-height: 40px !important;
}

.transectionafter .media-body {
    padding-right: 30px;
}

.transectionbanner {
    background: url(../img/transection-banner.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 325px 0px 40px;
    /* border-bottom: none; */
}

.transectionsearch {
    display: flex;
    color: #fff;
    width: max-content;
    border-bottom: 1px solid #767676;
    padding-bottom: 5px;
    display: inline-flex;
    align-items: center;
    margin-right: 30px;
    min-height: 42px;
}

.searchreson {
    display: flex;
    font-size: 14px;
    align-items: center;
    line-height: 18px;
}

.searchreson i.fa.fa-search {
    margin-right: 10px;
}

.lightcolor {
    opacity: .7;
    font-weight: 200;
}

.transectionsearch select {
    word-wrap: normal;
    background: transparent;
    border: none;
    color: #fff;
}

.transectionsearch select option {
    color: #000;
}

section.sections.px-4.py-2.bg-dark .yellowbg select {
    word-wrap: normal;
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
}

/* section.sections.px-4.py-2.bg-dark .yellowbg {
    font-size: 13px;
} */
.transectiontable {
    padding: 40px 0px 60px;
    background: var(--tu-earth);
}

.transectiontable ul {
    padding-left: 0;
    list-style: none;
    padding: 10px;
    margin: 0;
    width: 100%;
    float: left;
    display: flex;
    justify-content: space-between;
}

/* .transectiontable ul li {
    display: inline;
    padding: 10px 20px;
} */

.transectiontable ul li {
    display: inline;
    padding: 0 10px 10px 0;
    /* font-size: 14px; */
    width: 12.3%;
    float: left;
}

.transectiontable .sticky {
    position:sticky;
    top:0;
    background-color:var(--tu-earth);
    display:flex;
    align-items: center;
    border-bottom:1px solid #d9d4ce;
    transition:top 300ms; -webkit-transition:top 300ms; -ms-transition:top 300ms;
}

.show .transectiontable .sticky {
    /* top:84px; */
    top:var(--fullheaderheight);
}

.transectiontable .sticky a {
    /* cursor:pointer; */
    cursor:default;
}

.yellowcolor, .transectiontable .sticky .active {
    color: var(--tu-yellow);
}

.mobileshow {
    display: none; padding:0;
}

.transectionpage .dropdown-item span {
    padding: 0px 10px;
}

.borderyello {
    color: var(--tu-yellow);
    border: 1px solid var(--tu-yellow);
    border-radius: 50%;
    height: 30px;
    width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.transectionpage a.dropdown-item {
    display: flex;
    width: 210px;
    position: relative;
}

.transectionpage .tilb {
    position: absolute;
    left: -2px;
    font-size: 10px;
    top: 10px;
}

/************ Transection page css end    *******/
#boxScanWeChat img.img-fluid {
    /* width: 80px; */
    width: 110px;
    height: auto;
}

.overlay_qr {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%);
}

.overlay_qr.active {
    display: block !important;
}

.box button {
    background: transparent;
    border: none;
}

.contact button.icon-socmed {
    background: transparent;
    border: none;
}

input.inputhome {
    border: none;
    outline: none;
    box-shadow: none;
    padding: 5px 10px;
    height:3em;
    width:100%;
}

/* #quicksearch { margin-top:var(--fullheaderheight); } */

.propertyresultgh {
    background-color: var(--tu-darkblue1);
    z-index: 100;
}

.propertyresultgh>.container-fluid>.row {
    margin-left: 0;
    margin-right: 0;
}

.propertyresultgh .desktopshow {
    padding: 0;
}

.propertyresultgh .dropdown-toggle {
    background: transparent !important;
    border: none;
    padding-left: 0;
    /* padding-bottom: 0px !important; */
    line-height: 15px;
    min-width: 145px;
    min-height:45px;
}

.propertyresultgh .dropdown-toggle .icon { font-size:28px; }

.propertyresultgh ul {
    margin: 0;
    /* padding: 0; */
}

.propertyresultgh ul li {
    /* display: inline-block; */
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px 12px;
}

.propertyresultgh .dropdown-range {
    margin:0 1em 0 .5em;
    color: white;
}

.propertyresultgh .dropdown-menu li {
    padding:0;
    width:100%;
}

.propertyresultgh .dropdown-menu li a {
    width:100%;
}

.propertyresultgh .media img {
    width: 22px;
    height: 20px;
    object-fit: contain;
    margin-right: 7px;
}

.propertyresultgh .media h5 {
    font-size: 14px;
    margin: 0;
    opacity: .7;
    color:var(--tu-dimgray);
}

.propertyresultgh .media-body {
    text-align: left;
    font-size: 14px;
}

.propertyresultgh .media-body p {
    margin-bottom: 0;
}

.propertyresultgh .dropdown-toggle::after {
    position: absolute;
    /* right: -10px; */
    right: .5rem;
    top: 20px;
}

.propertyresultgh input, .input_field {
    background: transparent;
    color: #fff;
    border: none;
    /* border-bottom: 1px solid #7c7c7c; */
    font-size: 14px;
    padding: 0px 15px 0 0;
    min-height: 45px;
    border-radius:.25em;
}

.propertyresultgh input::placeholder, .input_field::placeholder {
    color: #fff !important;
    opacity: 1;
    /* Firefox */
}

.propertyresultgh input:-ms-input-placeholder, .input_field:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #fff !important;
}

.propertyresultgh input::-ms-input-placeholder, .input_field::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #fff !important;
}

.input_field { border:1px solid var(--tu-lightgray); }

.propertyresultgh .container-fluid {
    padding: 0;
}

.propertyresbtn {
    white-space: nowrap;
    margin-left: 0;
    display:inline-flex; align-items:center;
}

.propertyresbtn .material-icons { font-size:1.125em; }

.propertyresbtn img {
    width: 14px;
}

.propertyresbtn .gridview, .propertyresbtn .listview { display:none; }
.propertyresbtn.gridview .gridview { display:block; }
.propertyresbtn.listview .listview { display:block; }

.filtersubmitbtn {
    padding-left:1em;
    padding-right:1em;
    margin-left:0;   
}
.filtersubmitbtn span {
    line-height:1.5;
}

.property-resmain {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.property-resmain > ul {
    display: flex;
    width:100%;
    align-items: center;
    padding:0;
}

.property-resmain > ul > li {
    padding: 0;
    margin-right: 1rem;
}

.desktopshow .property-resmain > ul > li {
    border-bottom: 1px solid var(--tu-gray1);
}

.desktopshow .property-resmain > ul > li.clean {
    border-bottom:0;
    margin-left:-.5rem;
    margin-right:0;
}

.property-resmain > ul > li.active h5 {
    color:var(--tu-yellow);
}

.property-resmain > ul > li:first-child {
    padding-left: 0;
}

.property-resmain .dropdown {
    /* border-bottom: 1px solid #7c7c7c; */
    font-size: 14px;
    min-height: 50px;
    /* min-width: 145px; */
}

.property-resmain .filter_toggle { display: none; }

.sortgroup { display:flex; align-items:center; }
.sortgroup .sortgroup_main { flex:1; color:inherit; padding-right:1em; }
.sortgroup .sortgroup_btn { width:1.5em; height:1.5em; cursor:pointer; border:1px solid transparent; border-radius:2em; text-align:center; color:var(--tu-lightgray); font-size:1.25em; display:flex; justify-content: center; align-items: center; }
.sortgroup .sortgroup_btn.active { border-color:var(--tu-yellow); color:var(--tu-yellow); }
.sortgroup.active .sortgroup_btn, .sortgroup:active .sortgroup_btn { color:white; }
.sortgroup.active .sortgroup_btn.active { border-color:white; }

.mobileshow .property-resmain .field_number { flex:1; }
.mobileshow .property-resmain>ul>li { margin-right:0; margin-left:4px; }
.mobileshow .property-resmain>ul>li:first-child { margin-left:0; }

.lightsec-result {
    background: #162123;
    border-top: 1px solid #585858;
    height: calc(100vh - 154px);
}

.lightsec-container {
    height: 100%;
}

.lightsec-row {
    height: 100%;
    margin: 0;
}

.lightsec-items {
    height: 100%;
    overflow-y: auto;
    padding: 0 1.5rem;
    flex: 0 0 800px;
    position:relative;
}

.lightsec-items-grid {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}

.lightsec-items-grid .card {
    flex: 0 0 49%;
    margin-bottom: 1rem;
}

.lightsec-items-grid.listview .propertycard { flex-basis:100%; flex-direction:row; }

/* .propertycard .card-img {  } */
.propertycard .p-resultmobile {
    padding:1em 1em 1.5em;
    display:flex;
    flex-direction:column;
    height:100%;
}
.propertycard .card-body { padding:0; padding-bottom:.5em; }
.propertycard .card-footer.row {
    margin: 0;
    padding-top: 0.5em;
    /* padding-bottom: 1.5em; */
    padding:.5em 0 0;
    background-color:transparent;
}

.propertycard .card-footer p {
    margin: 0;
    display:flex;
    align-items: baseline;
}

.propertycard .card-footer .material-icons {
    align-self:center;
}

.lightsec-map {
    padding: 0;
    flex: 1;
}

.result-fiveleft h4 {
    color: #fff;
    font-size: 24px;
    margin: 0;
}

.result-fiveright .dropdown {
    display:inline-block;
}

.resultcommon {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* margin-bottom: 10px; */
    /* margin-top: 10px; */
    padding: 1.5rem 0;
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 10;
    background-color: var(--tu-darkblue2);
}

.lightsec-result .propertycard {
    border: 2px solid transparent;
    background: #c5b196;
}

.lightsec-result .propertycard:hover, .lightsec-result .propertycard.active {
    border: 2px solid var(--tu-yellow);
    background: #fff;
}

.lightsec-result .card-body p {
    font-size: 22px;
    font-weight: 600;
    margin: 0;
    /* line-height: 28px; */
    line-height: 1.3em;
}

.lightsec-result .card-body .gal-bot-price {
    font-weight:normal;
    font-size:18px;
}

.p-resultmobile {
    width: 100%;
    float: left;
    cursor:pointer;
}

.filtermobileg {
    /* display: none; */
    position: fixed;
    top:84px;
    bottom:0;
    width: 100%;
    color:white;
    pointer-events:none;
    overflow-y: scroll;
    z-index:-1;
}

.filtermobileg.active {
    /* display: block !important; */
    background-color:rgba(0,0,0,0.85);
    pointer-events:all;
    z-index: 99;
    z-index:100;
}

.filtermobileg .filter_container {
    width:100%; height:100%; position:relative; float:right; max-width:800px; padding:1.5em; background-color:black; overflow-y:auto;
    transition:transform 300ms; -webkit-transition:-webkit-transform 300ms; -ms-transition:-ms-transform 300ms;
    transform:translateX(100%); -webkit-transform:translateX(100%); -ms-transform:translateX(100%);
}
.filtermobileg.active .filter_container { transform:translateX(0%); -webkit-transform:translateX(0%); -ms-transform:translateX(0%); }

.filtermobileg .filter_glass { position:absolute; width:100%; top:0; left:0; height:100%; display:none; cursor:pointer; }
.filtermobileg.active .filter_glass { display:block; }

.filtermobileg .filter_lists { padding:0; }
    
.filtermobileg .filter_lists > li { padding:0; list-style-type:none; }
.filtermobileg .filter_lists > li .icon { font-size:28px; }
.filtermobileg .filter_lists > li h5 { color:var(--tu-dimgray); font-size:14px; margin-bottom:0; }
.filtermobileg .filter_lists > li.active h5 { color:var(--tu-yellow); }

.filtermobileg .filter_lists .button { padding-left:0; padding-top:1em; }
.filtermobileg .filter_lists .button .btn { margin-left:0; }
.filtermobileg .filter_lists .button .btn + .btn { margin-top:.5em; }

.filtermobileg .media img {
    margin-right: 5px;
}

.filtermobileg .media-body {
    text-align: left;
}

.filtermobileg .media-body p {
    margin-bottom:0;
    font-size:14px;
}

.filtermobileg .dropdown {
    padding-top:.5em;
    padding-bottom:.5em;
    border-bottom:1px solid var(--tu-lightgray);
}

.filtermobileg .dropdown-toggle::after {
    display: none;
}

.filtermobileg .dropdown_group {
    display:flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.filtermobileg .dropdown .dropdown {
    border-bottom:0;
    width:auto;
}

.filtermobileg .btn-secondary {
    background-color: transparent;
    border-color: transparent;
    width:100%;
    padding-left:0;
    padding-right:0;
}

/* .filtermobileg .dropdown-menu { max-height:300px; overflow-y:scroll; } */

.filtermobileg_hdr { width:100%; display:flex; justify-content:space-between; border-bottom:1px solid var(--tu-lightgray); padding-bottom:1em; }
.filtermobileg_hdr .material-icons { font-size:2em; }
.filtermobileg_hdr .filter_toggle { color:white; cursor:pointer; }
.filtermobileg_hdr .filter_toggle:hover { color:var(--tu-yellow); }

.propertyresultmap {
    height: 100%;
}

#shoplist_map_canvas {
    width:100%;
    height:100%;
}


/* ---- link list ---- */

.sorter { /* height:34px; */ float:left; padding:8px 0; position:relative; }
.sorter ul { /* height:35px; height:34px; */ line-height:34px; float:left; }
.sorter ul li { list-style-type:none; float:left; }

.sorter ul.option { float:left; /* margin-right:12px; */ margin:0; padding:0; }
.sorter ul.option li { padding:0 3px; }
.sorter ul.option li a { float:left; }
.sorter ul.option li.sort_as, .sorter ul.option li.sort_ds { padding:0; }
.sorter ul.option li .icon { float:left; margin-top:10px; margin-right:3px; }
.sorter ul.option li .icon.sort:hover { background-image:url('../img/ui-button-w.png'); }
/* .sorter ul.option li.optionchild { } */
.sorter ul.option li.optionchild h1 { height:34px; line-height:34px; display:inline-block; *display:inline; zoom:1; vertical-align:middle; }
.sorter ul.option li.optionchild > select { line-height:18px; display:inline-block; *display:inline; zoom:1; position:relative; }
.sorter ul.option li.optionchild > a { float:none; display:inline-block; *display:inline; zoom:1; vertical-align:middle; position:relative; position:relative; }
.sorter ul.option li.optionchild > a span { margin-top:0; }
.sorter ul.option li.optionchild #slider_wrapper { display:inline-block; *display:inline; zoom:1; height:34px; width:100px; padding-right:15px; float:none; vertical-align:middle; position:relative; }
.sorter ul.option li.optionchild #sorter_size { width:100%; display:inline-block; *display:inline; zoom:1; margin-left:5px; margin-right:10px; height:5px; vertical-align:middle; line-height:34px; *margin-top:15px; }
.sorter ul.option li.optionchild #sorter_size .ui-slider-handle { width:12px; height:12px; }
.sorter ul.option li.optionchild p { display:inline-block; *display:inline; zoom:1; margin:0; }

.sorter ul.perpage { float:right; margin-right:20px; }
.sorter ul.perpage li { padding:0 3px; }


#linklist { display: flex; flex-direction: column; }
#linklist .sorter { width:100%; background:var(--tu-blue); color:white; }
#linklist .sorter + * { margin-top:30px; }
#linklist .list { padding-left:0; padding-bottom:23px; float:left; clear:both; }
#linklist .list li { background:white; list-style-type:none; }

#linklist .list .data .grids { width:100%; clear:both; float:left; }
#linklist .list .data .grids .name { /* width:200px; */ text-align:left; border-bottom:1px solid #c8d1db; padding:10px 5px; }
#linklist .list .data .grids .tel { /* width:456px; */ text-align:left; border-bottom:1px solid #c8d1db; padding:10px 5px; white-space:nowrap; }
#linklist .list .data .grids thead { position:sticky; top:84px; z-index: 1; }
#linklist .list .data .grids thead th { background-color:var(--tu-earth); }
#linklist .list .data .grids tbody th, #linklist .list .data .grids tbody td { padding:8px 20px 8px 5px; white-space:normal; text-align:left; }
#linklist .list .data .grids tbody th a { float:left; }
#linklist .list .data .grids tbody td { padding-right:20px; white-space:normal; padding-left:2em; cursor: default; }
#linklist .list .data .grids tbody td#td_tel { white-space:nowrap; padding-left:5px; }
#linklist .list .data .grids tbody tr { background-color:white; }
#linklist .list .data .grids tbody tr.hl { background:#efefef; }
#linklist .list .data .grids tbody tr:hover { background:var(--tu-blue); color:var(--tu-yellow); }
#linklist .list .data .grids tbody tr:hover a { color:var(--tu-yellow); }

#linklist .list .data h1 { /* color:#54585C; */ float:left; clear:both; /* font-size:19px; */ font-weight:normal; white-space:nowrap; }
#linklist .list .data h1 + * { margin-top:10px; }
#linklist .list a { color:var(--tu-basetext); position:relative; padding-left:0; display:flex; flex-direction:row; align-items:center; }
#linklist .list a::before { position:absolute; content: ""; margin-right:.5em; font-family:"Material Icons"; left:-1.5em; }
#linklist .list a:hover { color:var(--tu-yellow); }
#linklist .list .icon { float:left !important; display:none; }

#linklist .icon.sort { background-image:url('../img/ui-button-w.png'); }


#tabpage { float:left; width:100%; }
#tabpage .sorter { width:100%; background:#1e3a54; /* margin-left:-33px; margin-top:-33px; */ padding:16px 0 0 0; }
/* #tabpage .sorter { margin-bottom:30px; } */
#tabpage .sorter .option li { background:#c4c4c4; background:#b1b1b1; /* padding:0 15px; */ border-left:1px solid rgba(0,0,0,.2); }
#tabpage .sorter .option li:first-child { border-left:1px solid rgba(0,0,0,.2); }
#tabpage .sorter .option li:hover, #tabpage .sorter .option li.active { background:white; border-left:1px solid rgba(0,0,0,.2); }
#tabpage .sorter .option li:first-child:hover, #tabpage .sorter .option li:first-child.active { border-left:1px solid rgba(0,0,0,.2); }
#tabpage .sorter .option li a { color:#54585c; cursor:pointer; padding:0 1em; }
#tabpage .sorter .option li:hover a, #tabpage .sorter .option li.active a { color:#54585c; }
/* #tabpage .sorter .option.max li { width:275px; } */
/* #tabpage .sorter .option.max .short { width:74px; } */

#tabpage .page { float:left; width:100%; padding:2em; background-color:white; border:1px solid rgba(0,0,0,.2); border-radius: 0.3rem; border-top:0; }
/* #tabpage .page form { width:500px; float:left; } */

#tabpage .page .form_table { margin-bottom:15px; width:100%; }
#tabpage .page .form_table.child { margin:10px 0; width:100%; }
#tabpage .page .form_table.child > * > * > td { padding-right:0; }
#tabpage .page .form_table.child > * > * > * > table { width:100%; }
#tabpage .page .form_table > * > * > th { vertical-align:top; padding:5px 15px 5px 0; text-align:left; }
#tabpage .page .form_table > * > * > th.radio { width:20px; padding-right:5px; }
#tabpage .page .form_table > * > * > td { vertical-align:top; padding:5px 15px 5px 0; }

#tabpage .page form h1 { font-size:16px; padding-bottom:12px; }
#tabpage .page form * + h1 { margin-top:36px; }
#tabpage .page form hr + h1 { margin-top:12px; }
#tabpage .page form a { text-decoration:underline; }
#tabpage .page form > table p { margin:0; }
#tabpage .page form fieldset { border:none; text-align:right; float:right; position:relative; white-space:nowrap; }
#tabpage .page form input[type='text'] { margin:0 3px; }
#tabpage .page form hr { border:0; height:1px; /* background:#dddddd; */ }
#tabpage .page form > table > * > * > td, #tabpage .page form > table > * > * > th { border-color:#787878; }
#tabpage .page form .odd, #tabpage .page form .odd td, #tabpage .page form .odd th { background-color:#919191; }
#tabpage .page form .odd td, #tabpage .page form .odd th { color:white; }
#tabpage .page form .odd td p, #tabpage .page form .odd th p { color:white; }

#tabpage .page form h2 { padding:0 0 10px; }

#tabpage .page form .button { width:100%; text-align:right; }
#tabpage .page form .button input { margin:10px 5px; }

#tabpage #stampdutyrates h1 { font-size:1.75rem; font-weight:bold; }




#tabpage #share > form { width:656px; }
#tabpage #share > form > table { width:656px; }
#tabpage #share > form > table > tbody > tr > th { width:206px; padding:22px; }
#tabpage #share > form > table > tbody > tr > td { background:#1a3248; padding:22px; }

#tabpage #share .property_info { }
#tabpage #share .property_info img { margin:0; }
#tabpage #share .property_info > table { margin:0; text-align:left; margin-top:23px; }
#tabpage #share .property_info > table > * > * > th { white-space:nowrap; padding-top:2px; padding-bottom:2px; }
#tabpage #share .property_info > table > * > * > td { font-weight:normal; padding-top:2px; padding-bottom:2px; }
#tabpage #share .property_info .project_header { border-bottom:1px solid gray; font-size:12px; line-height:14px; margin-top:0; padding:0; margin-top:10px; padding-bottom:5px; }
#tabpage #share .property_info .project_name { font-size:16px; padding-bottom:20px; line-height:26px; margin-top:3px; }

#tabpage #share .share_fields h1 { font-size:22px; font-weight:normal; color:#f0b310; height:34px; line-height:34px; background:url('../img/logo-iframe-share.png') right center no-repeat; }
#tabpage #share .share_fields h2 { color:white; font-size:16px; font-weight:normal; line-height:20px; }
#tabpage #share .share_fields p { color:white; padding:16px 0; margin-bottom:0; }
#tabpage #share .share_fields > table { }
#tabpage #share .share_fields > table  > * > tr:hover { background:#1A3248; }
#tabpage #share .share_fields > table  > * > * > th { color:#f0b310; white-space:nowrap; font-weight:normal; }
#tabpage #share .share_fields > table  > * > * > th:hover { background:#1A3248; }
#tabpage #share .share_fields > table  > * > * > td { width:100%; }
#tabpage #share .share_fields > table  > * > * > td:hover { background:#1A3248; }
#tabpage #share .share_fields > table > tbody > tr > td > input { border:none; margin:0; height:22px; line-height:22px; width:100%; }
#tabpage #share .share_fields > table > tbody > tr > td > textarea { width:100%; height:100px; }

#tabpage #share .share_fields #displaysucc p { color:white; line-height:16px; padding:16px 0; }

#tabpage .errmsg { /* position:absolute; */ display:block; color:red; font-size:12px; white-space:nowrap; padding-left:5px !important; }

.bootstrap-datetimepicker-widget table { white-space:initial; }




@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {}

@media screen and (max-width: 1600px) {
    /* .sw-gallery-carousel {
        height:56.25vw;
    } */

    .propertyresultgh .dropdown-toggle {
        min-width: 120px;
    }

    .lightsec-items { flex:0 0 600px; padding:0 1em; }
}
@media screen and (max-width: 1600px) and (min-width:1101px) {
    /* .propertycard .p-resultmobile { padding:.5em; } */
    .swiper.sw-gallery-bottom .propertycard .p-resultmobile { padding:1em 1em 1.5em; }
    .lightsec-result .card-body p { font-size:1.125em; }
    .propertycard .card-footer p { font-size:.875em; }
    .lightsec-result .card-footer .material-icons { font-size:1em; }
}

@media screen and (max-width: 1400px) {
    .property-resmain>ul>li.price {
        display: none;
    }

    .property-resmain .filter_toggle { display: inline-flex; }
    
    .detail-of-property__image { padding-top:70px; }
    .detail-of-property__info div.card { margin-bottom:70px; }
}

@media screen and (max-width: 1306px) {
    /* .propertyresultgh .media-body {
        font-size: 0;
    } */

    /* .propertyresultgh .media h5 {
        font-size: 0;
    } */

    .resultcommon .yellowbg {
        padding: 6px 10px;
        margin-left: 0;
        /* font-size: 10px; */
    }

    /* .result-fiveleft h4 {
        font-size: 14px;
    } */

    .property-resmain>ul>li.bedroom {
        display: none;
    }
}

@media screen and (max-width: 1200px) {
    .property-resmain>ul>li.garden_area {
        display: none;
    }

    .property-resmain>ul>li.grossfloor_area, .property-resmain>ul>li.grossfloor {
        display: none;
    }

    #tabpage #stampdutyrates h1 { font-size:calc(1.3rem + .6vw); }
}

@media screen and (max-width: 1100px) {
    .lightsec-items-grid .card { border-radius:0; }
    .swiper.sw-gallery-bottom .propertycard .gal-bot-name { font-size:1.125em; line-height:1.3em; }
    .swiper.sw-gallery-bottom .propertycard .card-footer p { font-size:.875em; }
    /* .swiper.sw-gallery-bottom .propertycard .card-footer p span { font-size:1em; } */
    /* .swiper.sw-gallery-bottom .propertycard .card-footer .material-icons {} */

    .displaymode_toggle { display:none; }

    .footer .content-logo { width:100%; }
    .footer .content-info { width:100%; }
}

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

    .propertyresbtn { font-size:.875em; }

    .propertycard .card-body p { font-size:1.125em; }
    .propertycard .card-footer.row { padding-bottom:0; flex-wrap:wrap; justify-content:space-between; }

    .resultcommon { padding-left:1em; padding-right:1em; }
    .resultcommon h4 { font-size:1.125em; }
    .resultcommon a { font-size:.875em; }
    .lightsec-items { flex-basis:400px; padding:0; }
    .lightsec-result .lightsec-items .card-img { flex:0 0 30%; width:auto; min-width:122px; }
    .lightsec-result .propertycard img {
        width:100%;
        height:100%;
        object-fit: cover;
    }
    .lightsec-items .p-resultmobile { padding:.5em; }
    .lightsec-result .card-footer > * { flex:0 0 auto; width:auto; margin-bottom:.25em; }
    .lightsec-result .card-footer p { font-size:.875em; }
    .lightsec-result .card-footer .material-icons { font-size:1em; }
    .lightsec-items-grid .card { flex-basis:100%; flex-direction:row; margin-bottom:.25em; }
}

@media screen and (min-width: 991.02px) {
    .aboutbannerbottom .nav-tabs.show { position:relative !important; transform:none !important; display:flex; }
}

@media screen and (max-width: 991px) {
    /* .propertyresultgh .dropdown-toggle {
    padding: 0 7px;
  } */

    .propertyresultgh ul li {
        padding: 0px 2px;
    }

    .property-resmain>ul>li.property_type {
        display: none;
    }

    .aboutbannerbottom .tab-dropdown {
        margin-bottom:1em;
    }

    .aboutbannerbottom .tab-dropdown .dropdown-toggle {
        display: flex;
        width:100%;
        justify-content:space-between;
        align-items: center;
        background-color:white;
        color:var(--tu-basetext);
        transition:none;
        white-space:normal;
        text-align:left;
    }

    .aboutbannerbottom .tab-dropdown .dropdown-toggle:hover {
        background-color:var(--tu-lightergray);
    }

    .aboutbannerbottom .nav-tabs {
        display:none;
        background-color:white;
        width:100%;
        padding-top:0;
        border:1px solid rgba(0,0,0,.2);
    }

    .aboutbannerbottom .nav-tabs .nav-link {
        width:100%;
        text-align:left;
        background-color:transparent;
        border:0;
        border-radius:0;
    }

    .aboutbannerbottom .nav-tabs .nav-link:hover {
        background-color:var(--tu-blue);
        color:white;
    }

    .aboutbannerbottom .nav-tabs.show {
        display:block;
        border-bottom: 1px solid var(--tu-gray1);
    }
}

@media screen and (max-width: 959px) {
    .grrnbgbox img {
        height: auto;
        object-fit: cover;
    }

    /* Essential */

    /* SECTION LOOKING OF PROPERTY */
    .detail-of-property__image {
        height: 47vw;
    }

    .navbar-nav li a {
        font-size: .9em;
    }

    .detail-of-property__image img {
        /* top: 6vw; */
        width: 70vw;
    }

    /* .detail-of-property__info {
        height: 47vw;
        min-height: 400px;
    } */

    .detail-of-property__info div.card {
        /* margin-top: 4vw; */
        margin-top: 11vw;
        width: 70vw;
    }

    .detail-of-property__info div.card .card-header {
        padding: 2em 0;
    }

    .detail-of-property__info div.card .card-body {
        padding:.5em 1em;
    }

    .detail-of-property__info div.card .card-body .side {
        padding: .25em 0.7em;
        flex:auto;
    }

    .detail-of-property__info div.card .card-body .side span {
        font-size: 1.4em;
    }

    .detail-of-property__info div.card .card-body .side p {
        line-height: 1.3em;
        font-size:.7em;
    }

}

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

    .navbar-nav.language {
        width:100%;
    }

    .searchlisthome h4 {
        text-align:center;
        margin-bottom:1em;
    }

    .searchhomebtn {
        margin-top:.5em;
        display:flex;
        justify-content:space-between;
    }

    .searchhomebtn .yellowbg {
        width:calc(50% - 4px);
        margin-left:0;
    }

    .maphide {
        display: none;
    }

    /* .filtermobileg {
        
    } */

    .property-resmain img {
        margin: 0px 5px;
        width: 12px;
    }

    .footer {
        position: relative;
        float: left;
        width: 100%;
    }

    .commonbanner h2 {
        font-size: 28px;
    }

    .greybg {
        background: #e6e1da;
        padding: 10px;
        border-radius: 3px;
    }

    .fiftywidth {
        float: left;
        width: 50%;
    }

    .transiction-w ul {
        padding: 0 !important;
    }

    .transiction-w li {
        /* width: 33.33% !important; */
        width: auto !important;
        float: left;
    }

    .transiction-w .fiftywidth {
        float:none;
        width:auto;
    }

    .bgwhite {
        background: #fff;
    }

    .transiction-w {
        padding: 10px;
        border-radius: 3px;
        float: left;
        width: 100%;
        position: relative;
        margin-bottom: 20px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .transiction-w h1 {
        font-size: 26px;
        font-weight: 600;
        margin: 0;
    }

    .border-bottoms {
        border-bottom: 1px solid #b7b7b7;
        padding-bottom: 10px;
        margin-bottom: 10px !important;
        float: left;
        width: 100%;
    }

    .transiction-w h2 {
        font-size: 22px;
        font-weight: 600;
        margin: 0;
    }

    .transectionafter ul li {
        display: inline-block;
        padding: 0px 3px !important;
    }

    .transectionafter ul {
        width: 100%;
    }

    .transectionafter ul li {
        width: 50%;
        float: left;
    }

    .transectionafter ul li a, .transectionafter ul li button {
        width: 100%;
        justify-content: center;
    }

    .hide {
        display: none !important;
    }

    .lightsec-result .col-6 p {
        margin: 0;
        font-size: 15px;
    }

    .boxindexv button {
        background: transparent;
        border: none;
        display: flex;
        align-items: center;
        width: 100%;
        padding:0;
    }

    .lightsec-result .card-footer.row {
        flex-direction: unset !important;
    }

    .hidephone {
        display: none;
    }

    .lightsec-result .card-body {
        flex: 1 1 auto;
        /* padding: 0 10px; */
        padding:0;
    }

    .lightsec-result .card-body p {
        /* font-size: 12px; */
        font-weight: 600;
        margin: 0;
        /* line-height: 20px; */
        line-height:1.3em;
    }

    .lightsec-result .propertycard {
        background: #c5b196;
        display: flex;
        flex-shrink: unset !important;
        flex-direction: unset !important;
        align-items: unset;
        margin-bottom: 5px;
    }

    .lightsec-result .propertycard img {
        /* width: 50%; */
        width:100%;
        /* height: 160px; */
        height:100%;
        object-fit: cover;
    }

    .lightsec-result .row {
        display: flex;
        flex-direction: column;
        margin-bottom: 0px !important;
    }

    .lightsec-result .propertycard { margin-bottom:1px; }
    .lightsec-result .propertycard, .lightsec-result .propertycard:hover { border-width:4px; }
    .lightsec-result .lightsec-map { order:0; height:447px; }
    .lightsec-result .lightsec-items { order:1; flex:1; padding:0; }
    .lightsec-result .lightsec-items-grid .card { flex:100%; }

    .lightsec-result .lightsec-items .card-img { flex:0 0 30%; width:auto; min-width:122px; }

    .lightsec-result .p-resultmobile { flex:1; float:none; padding:1em; }
    .lightsec-result .card-body { margin-bottom:1em; }
    .lightsec-result .card-footer, .lightsec-result .card-footer.row { background-color:transparent; padding:1em 0 0; }

    .lightsec-result { height:calc(100vh - 250px); }
    .lightsec-result .lightsec-map { height:30%; }
    .lightsec-result .lightsec-items { height:40%; }

    .lightsec-map { display:none; }
    .lightsec-map.active { display:block; }

    /* .propertyresultmap iframe {
        height: 280px;
    } */

    .lightsec-result .col-md-5 {
        order: 2;
        width: 100%;
    }

    .lightsec-result .col-6 {
        width: 50%;
    }

    .propertyresultgh input, .input_field {
        border-bottom: 1px solid #7c7c7c;
        padding: 0px 5px;
        width:100%;
    }

    .propertyresultgh ul li {
        display: inline-block;
        /* padding: 0px 4px; */
    }

    .property-resmain .yellowbg {
        /* font-size: 12px; */
        margin: 0px !important;
    }
    
    .searchlisthome > .dropdown >  .dropdown-menu {
        width: 100%;
        padding: 10px;
        transform: translate3d(0px, -1px, 0px) !important;
        display: flex;
        position: relative;
        z-index: 99;
        background: #fff;
        /* float: left; */
    }

    .searchlisthome > .dropdown >  .dropdown-menu > li {
        /* width: calc(50% - 4px); */
        /* margin: 1%; */
        flex:0 0 calc(50% - 4px);
        position: relative;
    }

    .searchlisthome > .dropdown >  .dropdown-menu > li select {
        border: none;
        background: #fff;
        outline: none;
        box-shadow: none;
        position: absolute;
        top: 12px;
        right: 0;
    }

    .transectiontable {
        padding: 40px 0px 30px;
        float: left;
        width: 100%;
    }

    .tran-mobilemain .col-md-6 {
        width: 50%;
        float: left;
    }

    .transectionpage img {
        width: 20px;
    }

    .mobileshow .col-md-6 a.btn.yellowbg {
        width: 100%;
        padding: 6px 10px;
    }

    .mobileshow .col-md-6 {
        width: 50%;
        float: left;
    }

    .transectionpage {
        display: inline-block;
    }

    /* section.sections.commonbanner.transectionbanner {
        border-bottom: 10px solid var(--tu-yellow) !important;
    } */

    .tran-mobilemain h1 {
        font-size: 20px;
        font-weight: 600;
        margin: 0;
    }

    .tran-mobile span {
        font-size: 10px;
    }

    .countnm {
        font-weight: 600;
        font-size: 15px !important;
    }

    .tran-mobile {
        width: 33.33%;
        float: left;
    }

    .tran-mobilemain h2 {
        font-size: 18px;
        font-weight: 600;

    }

    .mobileshow {
        display: block;
    }

    .desktopshow {
        display: none;
    }

    .tran-mobilemain {
        padding: 15px;
        border-radius: 5px;
        margin-bottom: 20px;
    }

    .profilebtn .btn {
        padding: 10px 30px !important;
        width: 50%;
        border: 6px solid var(--tu-earth) !important;
    }

    .btnrightside {
        float: right;
        text-align: right;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
        flex-wrap:wrap;
        margin-top:2em;
        padding-top:2em;
        border-top:1px solid var(--tu-gray1);
    }

    .btnrightside > * {
        width:100%;
    }

    .btnrightside .btn {
        border: 5px solid var(--tu-earth) !important;
    }

    .profilebtn {
        display: flex;
        width: 100%;
        margin-top: 20px;
        text-align: center;
        align-items: center;
        justify-content: center;
        flex-wrap:wrap;
    }

    .action button.btn { font-size:1em; }

    .action button.btn i.material-icons.i-icon {
        width: auto !important;
    }

    #detailOfProperty i.material-icons.i-icon {
        width: 100%;
    }

    #swipperGalleryBottom .col-12.col-md-5.px-0 {
        display: none;
    }

    #swipperGalleryBottom h3.mb-5.text-white.text-center { font-size:1.5em; margin-bottom:3em; }

    .swiper.sw-gallery-bottom .propertycard .p-resultmobile {
        padding:.825em .5em;
    }
    .swiper.sw-gallery-bottom .propertycard .card-footer.row > * { width:50%; }


    #modal_share .modal-dialog, #modal_calc_stampduty .modal-dialog {
        max-width:calc(100% - 2em);
        width:auto;
    }

    .modal_share_container {
        flex-direction: column;
    }

    .share_form {
        order:0;
        margin-right:0;
        margin-bottom:1em;
    }

    .modal_share_container .propertycard {
        order:1;
        font-size:14px;
        margin: 0 auto;
    }

    .calc_table input[type=radio] {
        margin-right:0;
    }

    .calc_row {
        flex-direction: column;
        align-items: flex-start;
    }

    .calc_cell_value {
        width:100%;
        flex:unset;
    }

    /* .calc_cell_value input[type='text'] {
        max-width:none;
    } */


    .grrnbgbox {
        margin-bottom: 30px;
    }

    .grrnbgbox h4 {
        font-size:18px;
    }

    .realstatebox {
        margin-bottom:2em;
    }

    .realstatebox h1 { font-size:28px; }
    
    .realstatewhitebg {
        max-width: 100%;
    }

    .lightgreen {
        padding: 30px 0px 0px;
    }

    /* .commonbanner {
        padding: 80px 0px 20px !important;
        background-position: inherit;
    } */

    .photopreview {
        width:100%;
    }

    .photopreviewmain {
        flex-direction: column;
    }

    .contactmap ul.info li {
        list-style: none;
        padding-right: 50px;
        float: left;
        width: 100%;
        float: left;
        margin-bottom: 30px;
    }

    .btnmain {
        float: right;
        text-align: left;
    }

    .btnmain > * {
        width:100%;
        margin-bottom:.5em;
    }

    .contactmap {
        padding: 43px 0px 50px;
    }

    .contactmap .btn, .aboutbannerbottom .btn-pill {
        background: var(--tu-yellow);
        padding: 10px 50px;
        color: #000;
        border-radius: 30px;
        border: none;
        margin-left: 0;
        width:100%;
    }

    .navbar-toggler {
        color: #fff;
    }

    .commonbanner {
        position: relative;
        width: 100%;
        /* padding: 190px 0px 20px; */
        padding: 5rem 0px;
        border-bottom: 10px solid var(--tu-yellow);
        background-position: inherit;
    }

    .aboutbannerbottom {
        padding: 43px 0px 50px;
        background: var(--tu-earth);
    }





    .container-fluid .d-flex {
        width: 100%;
        justify-content: space-between;
    }

    .sw-gallery-carousel {
        /* height: 400px; */
        height:56.25vw;
    }

    .gal-caro-box .gal-caro-box__name {
        display: flex;
        flex-direction: column;
        font-size:1.5em;
    }

    .sw-gallery-carousel-thumbs .swiper-slide {
        width:113px;
    }

    .sw-gallery-carousel-thumbs p {
        font-size:.875em;
        margin-top:.25em;
    }

    .sw-gallery-carousel-thumbs-box {
        padding: .5em 3.5em;
    }

    .sw-gallery-carousel-thumbs-box .swiper-button-prev.nav-thumbs {
        left:1rem;
    }

    .sw-gallery-carousel-thumbs-box .swiper-button-next.nav-thumbs {
        right:1rem;
    }

    /* SECTION LOOKING OF PROPERTY */

    .detail-of-property__image {
        /* background-color: brown; */
        height: auto;
        padding-top: 0;
    }

    .detail-of-property__image img {
        top: 0;
        position: relative;
        border-radius: 0;
        width: 100vw;
        max-width: 100%;
        margin-bottom:0;
        /* height:; */
    }

    /* .detail-of-property__info {
        height: 25vw;
        min-height: 480px;
    } */

    .detail-of-property__info div.card {
        position: relative;
        width: 100vw;
        padding: 1em 1.2em;
        margin: 0;
    }

    .detail-of-property__info div.card .card-header {
        padding: .5em 0 1em 0;
        font-size:unset;
    }

    .detail-of-property__info div.card .card-body {
        flex: unset;
        padding: 0.5em 1em;
    }

    .detail-of-property__info div.card .card-body hr {
        margin: 0.5em 1em;
        width: calc(100% - 2em);
    }

    .detail-of-property__info div.card .card-body .side {
        padding: 0.5em;
        border-right: none;
        flex:1;
    }

    .detail-of-property__info div.card .card-body .side.have-divider {
        border-right: 1px solid #a6957e;
    }

    .detail-of-property__info div.card .card-body .side span {
        font-size: 2em;
    }

    .detail-of-property__info div.card .card-footer .action {
        padding: 0;
    }

    .detail-of-property__info div.card .card-footer .action:nth-child(odd) {
        padding-right: 0.5em;
    }

    .detail-of-property__info div.card .card-footer .action:nth-child(even) {
        padding-left: 0.5em;
    }

    .detail-of-property__info div.card .card-footer {
        margin-top: 0.8em;
        width: 100%;
    }


    /* FEATURE */
    .feature {
        padding: 1em 0;
        margin-top: 0;
    }

    .feature .row {
        /* background-color: red; */
        width: 100%;
        margin: auto;
        padding: 1em 1em;
    }

    .feature hr {
        /* background-color: red; */
        width: 80%;
        margin: 2em auto;
    }

    .feature .row {
        padding: 0 1.2em;
    }

    .feature .row .box {
        padding: 1em 0;
        border-bottom: 1px solid #c5c3c3;
    }

    .feature .row .box div {
        width: 40%;
    }

    .feature .row .box i {
        font-size: 1.5em;
        font-weight: 700;
    }

    /* GOOGLE MAPS */
    .google-maps {
        position: relative;
        width: 100%;
        height: 78vw;
    }

    /* CONTACT */
    .contact .card.form {
        width: calc(100% - 2em);
        margin: auto;
        background-color: #ffffff;
        padding: 2em 0.5em 1em;
        border-radius: 0.5em;
        border: none;
    }

    .contact .card.form .card-header p {
        text-align: justify;
    }

    .contact .card.form .card-footer .box {
        flex-direction: column;
        margin-top: 2em;
    }

    .contact .card.form .card-footer .box .icon-socmed {
        flex-direction: row;
        justify-content: flex-start;
        width: 150px;
        width: 100%;
        margin-bottom:.5em;
    }

    .contact .card.form .card-footer .box .icon-socmed img {
        margin-right: 2em;
    }

    .contact h3 { font-size:1.5em; }

    #tabpage .page { padding:1em; }

    #tabpage .page .form_table > * > tr { display:flex; flex-wrap:wrap; }
    /* #tabpage .page form table:not(.table, .table-condensed) > * > * > * { width:100%; } */

    #tabpage .page .form_table > * > * > td {
        flex:1;
    }

    #tabpage .page .form_table > * > *:not(.havecontents) {
        display:flex;
        flex-wrap:wrap;
        width:100%;
    }

    #tabpage .page .form_table > * > *:not(.havecontents) > * {
        width:100%;
    }

    #tabpage .page .form_table > * > *:not(.havecontents) > * > fieldset {
        width:100%;
    }

    #tabpage .page .form_table > * > *:not(.havecontents) > * > fieldset > input {
        width:100%;
    }

    #tabpage .page .form_table > * > *.havecontents {
        display:block;
    }

    #tabpage .page .form_table.bottom > * > * > * {
        flex:unset;
    }

    #tabpage .page .form_table.innerchild > * > * {
        display:grid;
        grid-template-columns: 18px auto;
        grid-template-rows: repeat(2, auto);
        grid-column-gap: 0px;
        grid-row-gap: 0px;
    }

    #tabpage .page .form_table > * > * > th {
        grid-area: 1 / 1 / 3 / 2;
    }

    #tabpage .page .form_table > * > * > *:nth-child(2) {
        grid-area: 1 / 2 / 2 / 3;
    }

    #tabpage .page .form_table > * > * > *:nth-child(3) {
        grid-area: 2 / 2 / 3 / 3;
    }

    #tabpage .page .form_table > * > * > * fieldset {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }

    #tabpage .page .form_table > * > * > * fieldset input {
        flex: 1;
    }

    #tabpage .page .form_table > * > * > * fieldset .errmsg {
        /* flex: 1; */
        text-align: right;
        width:100%;
    }

    /* FOOTER */
    .footer .content-logo {
        width: 100%;
    }

    .footer .content-logo p {
        margin-bottom: 0;
        /* font-size: 1em; */
        font-size: .875em;
        text-align: center;
    }

    .footer .content-logo .info {
        width: max-content;
        margin: auto;
    }

    .footer .content-logo .info a {
        color:var(--tu-gray2);
    }

    .footer .content-logo .info p {
        text-align: left;
    }

    .footer .content-logo .img-scan,
    .footer .content-logo .box {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .footer .content-logo .img-scan img {
        width: 100%;
        max-width: auto;
        min-width: 150px;
        object-fit: contain;
    }

    .footer .content-logo .box img {
        margin-top: 0;
    }

    .footer .content-socmed {
        margin-top: 1em;
    }

    .footer .content-socmed a i {
        font-size: 2.5em;
    }

    .footer .content-info p {
        text-align: center;
        font-size: 1em;
    }

    .footer .content-info p:last-child {
        text-align: center;
        font-size: 1em;
        margin-top: 2em;
    }
}

@media screen and (max-width: 669px) {
    /* Essential */
    .propertycard { width:300px; }
    .swiper.sw-gallery-bottom .propertycard .material-icons { font-size:1em; }
    .swiper.sw-gallery-bottom .propertycard .card-body { padding-bottom:.25em; }
    .swiper.sw-gallery-bottom .propertycard .card-footer { font-size:1em; }
    
    .modal_share_container .propertycard { width:100%; }
}

@media screen and (max-width: 575px) {
    #modal_share .modal-dialog, #modal_calc_stampduty .modal-dialog {
        width:unset;
        max-width:unset;
    }
}

@media screen and (max-width: 479px) {
    /* Essential */

    .searchlisthome .dropdown-toggle .icon::before { margin-right:0; }
    .searchlisthome > .dropdown > .dropdown-menu > li { flex: 0 0 100%; }

    /* SWIPPER GALLERY CAROUSEL */
    .gal-caro-box {
        padding: 2em 1em 1em;
    }

    .gal-btn-share {
        top: 1em;
        right: 1em;
        height: 25px;
        width: 25px;
    }

    .sw-gallery-carousel-thumbs-box {
        padding: .5em 2em;
    }

    .sw-gallery-carousel-thumbs-box .swiper-button-next.nav-thumbs, .sw-gallery-carousel-thumbs-box .swiper-button-prev.nav-thumbs {
        top:calc(50% - 10px);
    }

    .sw-gallery-carousel-thumbs-box .swiper-button-prev.nav-thumbs {
        left:.1rem;
        font-size:28px;
    }

    .sw-gallery-carousel-thumbs-box .swiper-button-next.nav-thumbs {
        right:.1rem;
        font-size:28px;
    }

    .gal-caro-box .gal-caro-box__name {
        font-size: 1.2em;
        display: flex;
        flex-direction: column;
    }

    .gal-caro-box .gal-caro-box__info {
        font-size: 0.8em;
    }

    .topcontrol {
        padding-left:1.25em !important;
        padding-right:1.25em !important;
    }

    /* SECTION DETAIL OF PROPERTY */
    .detail-of-property__info div.card .card-body .side span {
        font-size: 1.5em;
        font-weight: 700;
    }

    .detail-of-property__info div.card .card-body .side p {
        margin: 0;
        line-height: 1.3em;
        font-size: .8em;
    }

    /* SWIPPER GALLERY BOTTOM */
    #swipperGalleryBottom {
        padding: 4em 0;
    }

    .swiper.sw-gallery-bottom {
        padding: 0 2em;
    }

    .propertycard { width:250px; }

    .swiper.swiper.sw-gallery-bottom .swiper-button-next {
        right: 0;
        top: calc(50% - 20px);
    }

    .swiper.swiper.sw-gallery-bottom .swiper-button-prev {
        left: 0;
        top: calc(50% - 20px);
    }

    .feature .row .box span {
        font-size: .9em;
        text-align:left;
    }

    .contact .card.form .card-header p,
    .contact .card.form .card-footer p {
        font-size: 1rem;
    }

    .footer .content-logo img {
        max-width: 40px;
    }

    .footer .content-logo p {
        margin-top: 5px;
        font-size: .8em;
    }

    .footer .box-socmed .box-wechat img {
        max-width: 300%;
        height: 300%;
    }

    .propertyresultgh { padding-left:1em !important; padding-right:1em !important; }

    .lightsec-result .p-resultmobile { padding:.5em; }
    .lightsec-result .card-body { margin-bottom:.5em; }
    .lightsec-result .card-body p { font-size:1em; }
    .lightsec-result .card-footer, .lightsec-result .card-footer.row { justify-content:space-between; padding-top:.5em; }
    .lightsec-result .card-footer.row > * { flex:0 0 auto; width:auto; }
    .lightsec-result .card-footer p { font-size:.875em; }
    .lightsec-result .card-footer .material-icons { font-size:1em; }
    .lightsec-items { padding-left:1em; padding-right:1em; }

    .property-resmain .yellowbg { padding-left:1em; padding-right:1em; }

    .modals .modal-body { padding-left:1rem; padding-right:1rem; }

    /* .modal_share_container { padding:0; } */

    .sorter ul.option { display:flex; flex-direction:column; width:100%; }
    .sorter ul.option li { flex:1; }
    .sorter ul.option li select { width:100%; padding: 0.5em 0.25em; }
}

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

@media print {}