/*All Property
===============================================================================*/
.PropertyList, .ListTopFeatured, .PropertiesOfTheMonth, .LatestProperties { font-size: 0px; max-width: 1200px; margin: auto }
.Property {
display: inline-block;
vertical-align: top;
position: relative;
margin-left: 2%;
font-size: 14px;
width: 23.5%;
}
.divLinkToPropertyDetail { text-align: center; margin-top: 15px }
.Property:nth-of-type(4n+1) { margin-left: 0px }
.Property:nth-last-of-type(n+5) { margin-bottom: 20px }
.Three .Property { width: 32%; }
.Three .Property:nth-of-type(4n+1) { margin-left: 2% }
.Three .Property:nth-of-type(3n+1) { margin-left: 0px }
.One .Property { width: 100%; }
/*-- List --*/
.List .Property, .mt .List .Property{ width: 100%; margin-left: 0px; padding-top: 20px; margin-top: 20px; border-top: 1px solid #e4e4e4 }
.List .Property:first-child { border-top: 0px; padding-top: 0px; margin-top: 0px }
.List .Property:last-child { padding-bottom: 0px }
.List .PropertyImage { width: 30%; position: relative; float: left; }
.List .PropertyInfo { padding: 0px; float: right; width: 66%; border: 0px }
.List .PropertyInfo .Title { margin: 0px }
.List .PropertyInfo .Title h3 { padding: 0px; height: auto }
.List .PropertyInfo .Title .Ref { position: static; bottom: 100%; width: 100%; background: none; padding-left: 0px; }
.List .PropertyInfo > ul { min-height: auto }
.List .divLinkToPropertyDetail { clear: both; text-align: left; padding-left: 34% }
.ListProperties .MoreDetails, .ListProperties .AllDetails { margin-top: 20px }
/*All Property (Propery Information) --------------------------------------*/
.PropertyInfo { padding: 0px 15px 15px 15px; position: relative; border: 1px solid #e4e4e4; border-radius: 0px 0px 3px 3px; background: #fff; }
.PropertyInfo .Title { position: relative; z-index: 1; margin: 0px -16px }
.PropertyInfo .Title h3 { margin: 0px; line-height: 1.3em; padding: 10px 16px; }
.PropertyInfo .Title .Ref a {
position: absolute;
bottom: 100%;
width: 100%;
padding-left: 28px;
padding-top: 20px
}
.PropertyInfo .Title .DispayListingId { position: absolute; bottom: 100%; left: 50%; width: 50%; padding-right: 16px; text-align: right }
.PropertyInfo .Title .Ref a, .PropertyInfo .Title .DispayListingId a { line-height: 28px }
.PropertyInfo > ul { width: 100%; bottom: 0px; list-style: none; padding-left: 0px; padding-right: 0px; margin: 0px }
.PropertyImage a { position: relative; display: block; padding-top: 63%; overflow: hidden; background: #efefef }
.PropertyImage img { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; margin: auto; overflow: hidden; }
.PropertyImage a.Hor img { max-width: none; max-height: 100%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.PropertyInfo > ul > li { padding:5px 0px; border-top: 1px solid #f2f2f2; overflow: hidden }
.PropertyInfo > ul > li:first-child { border-top: none }
.PropertyInfo > ul .Value { float: right }
.CurrencyConverter { cursor: pointer; padding-right: 0px; transition: all 0.5s }
.CurrencyConverter:hover { text-decoration: underline; background-position: right bottom }
/*All Property (Link) --------------------------------------*/
.AllDetails { font-size: 14px; text-align: center }
/*-- Mobile --*/
.mt .Property { margin-bottom: 20px; font-size: 16px }
.mt .contactAgent { position: static; clear: both }
.mt .PropertyList, .mt .ListProperties { padding: 0px 15px }
.t .Property { width: 32%; }
.t .One .Property { width: 100%; }
.t .Property:nth-of-type(4n+1) { margin-left: 2% }
.t .Property:nth-of-type(3n+1) { margin-left: 0px }
.m .Property { overflow: hidden; width: 100%; margin-left: 0px }
.m .PropertyImage { border-radius: 0px }
.m .PropertyInfo .Title h3 { height: auto }
.m .PropertyInfo { border: 0px }
.m .PropertyInfo > ul { min-height: auto }
.m .divLinkToPropertyDetail { margin-top: 20px; }
/* Building Detail
===============================================================================*/
#buildingDetail { max-width: 1200px; margin: auto }
.mt #buildingDetail { padding-left: 15px; padding-right: 15px }
#buildingDetail .Title h1 { margin-bottom: 10px; }
.m #buildingDetail .Title h1 { line-height: 1; font-size: 32px; padding-bottom: 12px }
#buildingProperty > hr { display: none }
#buildingProperty > h2:first-child { text-align: center }
#buildingDetailLeft { width: 74%; float: left }
#buildingDetailRight { width: 24%; float: right }
.t #buildingDetailLeft { width: 66%; float: left }
.t #buildingDetailRight { width: 32%; float: right }
#buildingDetail .buildingDescription,
#buildingDetail #buildingProperty {padding-top: 20px; border-top: 1px solid #e4e4e4; margin-bottom: 20px; }
/* buildingSearch
---------------------------------------*/
#buildingSearch { position: relative; font-size: 0px; text-align: center; padding: 5px 0px; background-color: #fff; border-radius: 4px; border: 1px solid #e4e4e4; }
#buildingSearch > div { overflow: hidden; border-radius: 4px; }
#buildingSearch > div+div { margin-left: 4px }
.m #buildingSearch > div { margin-bottom: 4px }
#buildingSearch div { display: inline-block; }
#buildingSearch .controls { position: relative; z-index: 1; cursor: pointer; }
#buildingSearch .controls input { position: initial; margin: 0px; display: inline-block }
#buildingSearch .controls input.checkbox:before {
content: attr(oldtitle);
position: absolute;
z-index: 0;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background: #e4e4e4;
line-height: 40px;
padding: 0px 15px;
text-align: center;
cursor: pointer;
}
.mt #buildingSearch .controls input.checkbox:before { content: attr(title) }
#buildingSearch .controls+.controls input.checkbox:before { border-left: 1px solid rgba(0,0,0,0.1) }
#buildingSearch .controls input.checkbox:checked:before { background: #000; color: #fff }
#buildingSearch .controls > label.checkbox {
display: inline-block; padding: 0px 15px; z-index:3; position: relative; cursor: pointer; font-size: 14px; line-height: 40px; margin: 0px;
}
/* Available List
---------------------------------------*/
#availableProperty { font-size: 0px; }
#availableProperty > * { font-size: 14px; }
.mt #availableProperty > * { font-size: 16px; }
#availableProperty .buildingProperty { width: 32%; margin-left: 2%; display: inline-block; vertical-align: top; position: relative; margin-top: 20px }
#availableProperty .buildingProperty:nth-of-type(3n+1) { margin-left: 0px }
#availableProperty .buildingPropertyImage { position: absolute; top: 0px;left: 0px; padding-top: 75%; width: 100%; overflow: hidden;background: #fff;z-index: 1; border-radius: 3px 3px 0px 0px; border: 1px solid #e4e4e4 }
#availableProperty .buildingPropertyImage img { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; margin: auto; overflow: hidden; }
#availableProperty .buildingPropertyDetail { list-style: none; padding: 75% 15px 15px 15px; position: relative; border: 1px solid #e4e4e4; border-radius: 3px; min-height: 440px; background-color: #fff; }
#availableProperty .buildingPropertyDetail li { padding: 5px 0px }
#availableProperty .buildingPropertyDetail li+li { border-top: 1px solid #e4e4e4 }
#availableProperty .buildingPropertyDetail .value, #availableProperty .buildingPropertyDetail .Price > span:last-child { float: right }
#availableProperty .buildingPropertyDetail .value.Title { float: none; display: block; padding: 10px 0px }
.t #availableProperty .buildingProperty { width: 49%; margin-left: 2% }
.t #availableProperty .buildingProperty:nth-of-type(2n+1) { margin-left: 0px }
.m #availableProperty .buildingProperty { width: 100%; margin-left: 0% }
.m #availableProperty .buildingPropertyDetail { min-height: auto }
/*-- Property in page Property Project --*/
.PropertyProjectDetails #availableProperty { margin-left: -12px; margin-right: -12px }
.PropertyProjectDetails #availableProperty .buildingProperty { width: calc((100% - 96px) / 4); margin-left: 12px; margin-right: 12px }
.t .PropertyProjectDetails #availableProperty .buildingProperty { width: calc((100% - 72px) / 3); margin-left: 12px; margin-right: 12px }
.m .PropertyProjectDetails #availableProperty .buildingProperty { width: calc((100% - 24px) / 1); margin-left: 12px; margin-right: 12px }
/* buildingInfo
---------------------------------------*/
#buildingDetail #buildingInfo { background: #fff; margin-top: 20px; border: 1px solid #e4e4e4; border-radius: 4px }
#buildingDetail #buildingInfo h3 { padding: 15px; line-height: 1; margin: 0px }
#buildingDetail #buildingInfo ul { list-style: none; padding: 15px }
#buildingDetail #buildingInfo ul li { padding: 5px 0px }
#buildingDetail #buildingInfo ul li+li { border-top: 1px solid #e4e4e4 }
#buildingDetail #buildingInfo ul li .value { float: right }
#buildingDetail .ShowFeatures { border: 1px solid #e4e4e4; border-radius: 4px; padding: 15px; margin-top: 20px; }
#buildingDetail .FeatureGroup h4 { border-bottom: 1px solid #e4e4e4; padding-bottom: 5px; margin-bottom: 10px; }
#buildingDetail .Feature-ul { padding: 0px; list-style: none; }
#buildingDetail .Feature-li { padding: 5px 0px 5px 25px; background: url(/Content/Archive/406/checked-109431.png) no-repeat top 5px left; }
/* Property Detail
===============================================================================*/
/*.PropertyDetail {position: relative;margin: auto;max-width: 1200px;padding: 0px;margin-top: 0px;background: #fff}
.PropertyDetail .TagCloud { padding-top: 20px; border-top: 1px solid #e4e4e4; padding-bottom: 20px }
.PropertyDetail h3 { margin: 0px }
.PropertyDetail .Column1 h3 { border-bottom: 1px solid #e4e4e4; padding-bottom: 10px; margin: 20px 0px 10px 0px }
.PropertyDetail .Title h2 { margin: 0; padding: 20px 0px }
.mt .PropertyDetail .Title h2 { padding: 20px 15px }
.PropertyDetailUnit {font-size: 0px;float: right; width: calc(28% - 20px); padding: 15px;border-radius: 0px; border: 1px solid #e4e4e4}
.PropertyDetailUnit > div { font-size: 14px; line-height: 40px; display: inline-block; width: 100%; vertical-align: top; margin-left: 0%; padding: 0px }
.PropertyDetailUnit > div:nth-of-type(3n+1) { margin-left: 0px }
.PropertyDetailUnit > div:nth-child(1) { border-top: 0px }
.PropertyDetailUnit > div:nth-of-type(n+2) { border-top: 1px solid #f9f9f9 }
.PropertyDetailUnit > div:before {
content: "";
float: left;
width: 40px;
height: 40px;
background: url(/Content/Archive/406/icon-title-109427.png) no-repeat;
vertical-align: top;
}
.PropertyDetailUnit .TitleRef:before {background-position: 0px 6px;}
.PropertyDetailUnit .TitleLocation:before {background-position: 0px -26px;}
.PropertyDetailUnit .TitleBedroom:before {background-position: 0px -56px;}
.PropertyDetailUnit .TitleBathroom:before {background-position: 0px -86px;}
.PropertyDetailUnit .TitleLiving:before {background-position: 0px -116px;}
.addthis_toolbox { top: 75px !important; right: 0px !important }
*/
/* Column 1 Property Detail Image
---------------------------------------*/
.Column1 {width: 70%;float: left;position: relative;}
/*-- Property Detail Description --*/
.PropertyDetailiFrame { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #e4e4e4 }
.PropertyDescription { background: #fff; padding: 20px 0px; border-top: 1px solid #e4e4e4; }
.PropertyDescription > h3 { border-bottom: 1px solid rgba(0,0,0,0.05); padding-bottom: 10px; margin-bottom: 20px }
/* Column 2 PropertyInfo
---------------------------------------*/
.Column2 {float: right;width: 28%;padding-left: 20px;}
.Column2 .PropertyPriceList {padding: 15px; border: 1px solid #e4e4e4; margin:10px 0}
.Column2 .PropertyPriceList .label { margin-bottom: 4px; display: block; font-weight: bold }
.Column2 .PropertyPriceList .value { font-size: 24px; display: block; font-weight: bold; line-height: 1 }
.Column2 .PropertyPriceList > div { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e4e4e4 }
.Column2 .PropertyPriceList > div:after { display: block; content: ""; clear: both }
.Column2 .PropertyPriceList ul { list-style: none; margin: 0px; padding-left: 0px }
.Column2 .PropertyPriceList ul li { margin: 0px 0px }
.Column2 .PropertyPriceList #SalePrice .label,.Column2 .RentalPricePanel h3 { font-size: 125%; color: #690; margin-bottom: 8px }
.Column2 .RentalPricePanel ul li+li { margin-top: 8px }
.Column2 .RentalPricePanel .label { color: inherit; }
/* Overview
---------------------------------------*/
.Column2 .PropertyInfo {padding: 0px; }
.Column2 .PropertyInfo .Overview h3 > button { display: block; width: 100% }
.Column2 .PropertyInfo .Overview ul { background: none; margin: 0px; padding: 0px }
.Column2 .Overview { padding: 15px; overflow: hidden }
.Column2 .Overview h3 { padding-bottom: 15px; margin: 0px }
.Column2 .Overview .Printbutton { display: block; text-align: center; margin: 4px 0px }
.Column2 .Overview .Printbutton img { display: none }
.Column2 .Overview .Printbutton:before { content: "Print this page" }
.Column2 .Overview li {
padding: 10px 0px;
overflow: hidden;
border-top: 1px solid #e4e4e4;
line-height: normal;
width: 100%;
margin-left: 0%;
display: inline-block;
vertical-align: top;
text-align: right;
font-size: 0px
}
.Column2 .propertyPlaceOfInterest { border: 1px solid #e4e4e4 }
.Column2 .Overview .PlacesOfInterestList { padding: 0px }
.Column2 .Overview li:nth-of-type(2n+3) { margin-left: 0px; padding-left: 0px }
.Column2 .Overview li .label { float: left; font-weight: 300; font-size: 14px; font-weight: 600; line-height: 20px }
.Column2 .Overview li .value { color: #214045; font-size: 14px; font-weight: normal; line-height: 20px }
.Column2 .Overview li:first-child { padding-top: 0px; border: 0px; width: 100%; margin: 0px; padding-left: 0px }
.Column2 .Overview li:not(:nth-of-type(n+4)) .label:after { content: ":" }
.Column2 .contactAgent { border: 1px solid #e4e4e4; margin: 15px 0px; padding: 15px; }
.Column2 .contactAgent .display-label { font-weight: 600 }
.Column2 .contactAgent a { width: 100%; margin-top: 10px }
.Column2 .contactAgent a:first-child:last-child { margin-top: 0px }
.Column2 .contact_dialog_box { display: none }
.Column2 .SendToFriend a { width: 100% }
.PropertyMap { clear: both; padding-top: 15px }
.PriceHistoryPanel { clear: both; float: left; width: 50%; padding: 2%; border-right: 1px solid #e4e4e4 }
#AveragePricePanel { float: right; width: 50%; padding: 2%; font-weight: 600 }
#AveragePricePanel > div { border-bottom: 1px solid #e4e4e4; ; padding: 10px 0px; overflow: hidden }
#AveragePricePanel > div:last-child { border: 0px; padding-bottom: 0px }
#AveragePricePanel .Price_Display_Panel { width: 80%; float: left; overflow: hidden }
#AveragePricePanel .Price_Average_Percent_Panel { width: 20%; float: right; text-align: right }
#AveragePricePanel .Price_Display_Panel h3 { width: 75%; float: left; font-size: 16px }
#AveragePricePanel .Price_Display_Panel .Price_Average { width: 25%; float: left; text-align: right }
/* Property Agent
---------------------------------------*/
.PropertyAgents { margin-bottom: 20px}
.PropertyAgents > .Title { margin-bottom: 12px }
.PropertyAgents .AgentListItem + .AgentListItem { margin-top: 12px}
.PropertyAgents .AgentListItem:after {clear: both; display: block; content: "" }
.PropertyAgents .AgentImage { border-radius: 50%; overflow: hidden; }
.PropertyAgents .AgentImage > div {padding-top: 100%;}
.PropertyAgents .AgentInfo > div + div { margin-top: 4px }
.PropertyAgents .AgentInfo i { width: 28px; height: 28px; line-height: 28px; display: inline-block; text-align: center; font-size: 16px; background: #e7e7e7; border-radius: 50px; }
.PropertyAgents .AgentInfo .label { display: none; }
.PropertyAgents .AgentInfo .AgentName { font-size: 18px; }
/* Show Features
---------------------------------------*/
.Column1 .ShowFeatures { padding: 15px 0px;overflow: hidden;font-size: 0px;width: 100%; }
.Column1 .ShowFeatures > div {
padding-bottom: 15px;
width: 32%;
display: inline-block;
font-size: 14px;
vertical-align: top;
margin-left: 2%;
padding: 5px 0px 5px 25px;
position: relative
}
.Column1 .ShowFeatures > div:before {
content: "";
position: absolute;
width: 13px;
height: 7px;
border-left: 3px solid #000;
border-bottom: 3px solid #000;
left: 5px;
top: 2px;
bottom: 0px;
margin: auto;
transform: rotate(-45deg);
transform-origin: 0% 100%
}
.Column1 .ShowFeatures > div:nth-of-type(3n+1) { margin-left: 0px }
.Column1 .FeatureGroup h4 { padding: 10px 15px; border-top: 1px solid rgba(0,0,0,0.01); background: linear-gradient(#fff, #fafafa) }
.Column1 .ShowFeatures .FeatureGroup:first-child h4 { border-top: 0px }
.Column1 .FeatureGroup li { list-style: none; padding: 4px 4px 4px 14px }
.Column2 .propertyPlaceOfInterest li { font-size: 14px; text-align: left; padding-top: 10px }
.Column2 .propertyPlaceOfInterest li span { font-weight: bold; display: block; }
.PropertyDetail .Agents { margin-top: 20px }
.PropertyDetail .Agents > .Title { margin-bottom: 12px }
.PropertyDetail .AgentListItem+.AgentListItem { margin-top: 12px }
.PropertyDetail .AgentListItem:after { clear: both; display: block; content: "" }
.PropertyDetail .AgentImage { float: left; width: 30%; border-radius: 50%; overflow: hidden }
.PropertyDetail .AgentImage > div { padding-top: 100% }
.PropertyDetail .AgentInfo { float: right; width: 65% }
.PropertyDetail .AgentInfo > div+div { margin-top: 4px }
.PropertyDetail .AgentInfo i { width: 28px; height: 28px; line-height: 28px; display: inline-block; text-align: center; font-size: 16px; background: #e7e7e7; border-radius: 50px; }
.PropertyDetail .AgentInfo .label { display: none }
.PropertyDetail .AgentInfo .AgentName { font-size: 18px }
/* Property image slide
---------------------------------------*/
#property-images #to-fullscreen{position:absolute;top:auto;left:0;bottom:10px;z-index:9;}
#property-images .image-slide-content {height:600px;}
#property-images .image-slide-content img{border-radius:0px !important; max-height:600px;}
#property-images .to-fullscreen-image{border:solid 4px #ccc;transition:0.3s;box-shadow:0 0 10px rgba(0,0,0,0.2);}
#property-images .to-fullscreen-image:hover{border:solid 4px #fff;box-shadow:0 0 10px rgba(0,0,0,0.5);opacity:1}
/* Building
---------------------------------------*/
.PropertyDetail .PropertyBuildingInformation { overflow: hidden; margin-top: 20px; border-bottom: 1px solid #e4e4e4 }
.PropertyDetail .PropertyBuildingInformation h2:first-child { text-align: center }
.PropertyDetail #buildingInfoLeftColumn { float: left; width: 28%; border: 1px solid #e4e4e4; padding: 20px; }
.PropertyDetail #buildingInfoRightColumn { float: right; width: 72% }
.PropertyDetail #buildingInfoLeftColumn > h3:first-child { margin-bottom: 20px }
.PropertyDetail #buildingDetails ul { padding: 0px; list-style: none }
.PropertyDetail #buildingDetails ul li { line-height: 32px; border-bottom: 1px solid #e4e4e4 }
.PropertyDetail #buildingDetails ul li:last-child { border: 0px }
.PropertyDetail #buildingDetails ul li .value { margin-left:4px }
/*-- Mobile --*/
.mt .Column2 .PropertyInfo .Overview ul { padding: 0px }
.mt .PropertyDetailUnit { float: none;width: initial; padding: 0px 15px;border-radius: 0px; margin: 0px 15px}
.mt .PropertyDescription, .mt .ShowFeatures, .mt .TagCloud { padding: 15px }
.mt .Column2 .PropertyPriceList > *+* { font-size: 16px; }
.mt .Column2 .PropertyPriceList .label { font-size: 14px; text-align: left; line-height: 24px }
.t .PropertyDetailUnit > div { width: 50% }
.t .Column1 { width: 67% }
.t .Column2 { width: 33%; padding-right: 15px }
.t .Column2 .Overview li .label,
.t .Column2 .Overview li .value { font-size: 16px }
@media only screen and (orientation: portrait) {
.mt .Column2 .contactAgent { border: 0px; padding: 0px; margin: 0px; text-align: center }
.mt .Column2 .contactAgent a { display: inline-block; width: auto }
.mt .Column2 .propertyPlaceOfInterest h3 { padding: 0px; margin-top: 20px }
.mt .Column2 .propertyPlaceOfInterest li { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e4e4e4; font-size: 16px; }
.t .Column1 { width: 100%; float: none }
.t .Column2 { width: 100%; padding: 0px 15px; float: none }
.t .Column2 .PropertyPriceList { padding: 20px 20px }
.t .Column2 .PropertyPriceList .label { float: left; font-size: 16px; }
.t .Column2 .PropertyPriceList .value { float: right }
.t .Column2 .PropertyPriceList li:after { content: ""; display: block; clear: both }
.t .Column2 .PropertyInfo { border: 0px; padding: 0px; }
.t .Column2 .PropertyInfo .Overview { padding: 20px 0px }
.t .Column2 .PropertyInfo ul { border: 1px solid #e4e4e4; border-radius: 4px }
.t .Column2 .PropertyInfo ul li { padding: 12px 15px; }
.t .Column2 .propertyPlaceOfInterest { margin: 20px 0px; border: 0px; padding: 0px; }
}
.m .Column1 { width: initial; float: none }
.m .PropertyMainImagesWrapper { border: 0px }
.m .ShowFeatures > div { width: 100%; margin: 0 }
.m .Column2 { width: initial; float: none; padding: 0px }
.m .Column2 .PropertyPriceList { min-height: auto; margin: 0px 15px; overflow: hidden; border-bottom: 1px solid #e4e4e4; font-size: 0px }
.m .Column2 .contactAgent { margin: 0px 15px }
.m .Column2 .SendToFriend { margin: 15px }
.m .PriceHistoryPanel { float: none; width: initial; padding: 0px; margin: 0px 15px; border-right: 0px; border-bottom: 1px solid #e4e4e4 }
.m #AveragePricePanel { float: none; width: initial; padding: 0px 15px 15px 15px }
.m .PropertyDetail #buildingInfoLeftColumn { float: none; width: 100%; border: 0px; padding: 15px; }
.m .PropertyDetail #buildingInfoRightColumn { float: none; width: 100% }
.m .Column2 .propertyPlaceOfInterest {border: 0px }
/*FIND YOUR PROPERTY
===============================================================================*/
.PropertySearchBoxContentWrapper { max-width: 1200px; margin: auto; }
.PropertySearchBoxContent .ui-button-icon-primary { display: none }
.PropertySearchBoxContent form > div { float: left; margin-left: 1% }
.PropertySearchBoxContent form > div:after { clear: both; display: block; content: "" }
.PropertySearchBoxContent form > div:first-child { margin-left: 0px }
.PropertySearchBoxContent form input, .PropertySearchBoxContent form select { border-radius: 0px; border-color: #e2e2e2 }
.PropertySearchBoxContent form:after { clear: both; display: block; content: "" }
/* Box Buy rent
---------------------------------------*/
.PropertySearchBoxPurpose { width: 10% }
.PropertySearchBoxPurpose .RadioListItem { float: left; width: 50% }
.PropertySearchBoxPurpose .RadioListItem:first-child label { border-radius: 4px 0px 0px 4px }
.PropertySearchBoxPurpose .RadioListItem:last-child label { border-radius: 0px 4px 4px 0px }
.PropertySearchBoxPurpose .RadioListItem label { width: 100%; border-radius: 0px }
.PropertySearchBoxPurpose .RadioListItem label.ui-state-active { background: #000 }
.PropertySearchBoxPurpose .RadioListItem label.ui-state-active .ui-button-text { color: #fff; }
/* PropertySearchBoxType
---------------------------------------*/
.PropertySearchBoxType { width: 12.5% }
/* Search (rate)
---------------------------------------*/
.PropertySearchBoxSalePrice { width: 20%; }
.PropertySearchBoxSalePrice select { width: 50%; float: left }
.PropertySearchBoxSalePrice select:first-child { border-radius: 4px 0px 0px 4px; border-right: 0px }
.PropertySearchBoxSalePrice select:last-child { border-radius: 0px 4px 4px 0px; border-left: 0px }
/* Search (filter bedrooms)
---------------------------------------*/
.PropertySearchBoxBedrooms { width: 9.5% }
/* Search (Area box)
---------------------------------------*/
.PropertySearchBoxArea { width: 18% }
.chzn-container { width: 100% !important; vertical-align: top }
.chzn-single {height: 40px !important;line-height: 40px !important;background: #fff !important;border-color: #e2e2e2 !important;box-shadow: none !important;font-size: 14px; border-radius: 0px !important} /*<-- style up this*/
.chzn-search input { width: 100% !important; margin: 0px !important; }
.chzn-single div { width: 36px !important }
.chzn-single div b { background: url(/Content/Archive/328/arrow-down-60851.jpg) center center no-repeat !important }
.chzn-drop { width: 100% !important; border-color: #e2e2e2 !important; box-shadow: none !important }
/* Search (box code)
---------------------------------------*/
.PropertySearchBoxCode { width: 14% }
/* Search submit
---------------------------------------*/
.PropertySearchBoxButton { width: 10% }
.PropertySearchBoxButton input {
padding-right: 40px;
width: 100%;
background-image: url(/Content/Archive/406/search-96807.png) !important;
background-repeat: no-repeat !important;
background-position: center right 10px !important;
background-size: 20px !important;
}
/* Search for tablet
--------------------------------------- */
.mt .PropertySearchBoxContent { padding: 15px; background: #f7f7f7; font-size: 0px }
.mt .PropertySearchBoxContent form > .PropertySearchBoxButton input { padding: 0px 20px }
.mt .PropertySearchBoxContent form > .PropertySearchBoxPurpose {
line-height: 38px;
background: #fff;
border-radius:4px;
border: 1px solid #e2e2e2;
overflow: hidden
}
.mt .PropertySearchBoxContent form > .PropertySearchBoxPurpose .RadioListItem { position: relative; z-index: 1; padding: 0px 15px }
.mt .PropertySearchBoxContent form > .PropertySearchBoxPurpose input+label:before {
content: attr(title);
position: absolute;
z-index: 0;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background: #fff;
line-height: 38px;
padding: 0px 15px;
text-align: center
}
.mt .PropertySearchBoxContent form > .PropertySearchBoxPurpose input:checked+label:before { background: #444; color: #fff }
.mt .PropertySearchBoxContent form > .PropertySearchBoxPurpose label {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
}
.t .PropertySearchBoxContent form > div { width: 49% }
.t .PropertySearchBoxContent form > div:nth-of-type(n) { margin-left: 0px; font-size: 16px; float: none; display: inline-block; vertical-align: top }
.t .PropertySearchBoxContent form > div:nth-of-type(2n+2) { margin-left: 2% }
.t .PropertySearchBoxContent form > div:nth-of-type(n+3) { margin-top: 10px }
.t .PropertySearchBoxContent form > .PropertySearchBoxButton { width: 100% }
/* FIND YOUR PROPERTY Mobile
---------------------------------------*/
.m .PropertySearchBoxContent { font-size: 16px }
.m .PropertySearchBoxContent form > div:nth-of-type(n+2) { margin-top: 10px }
.m .PropertySearchBoxContentWrapper {
position: static;
margin: auto;
bottom: 150px;
border-radius: 4px;
background: rgba(255,255,255,1);
color:#152136;
}
.m .PropertySearchBoxContent form > div { float: none; width: 100%; margin: 0px }
/* Side style
---------------------------------------*/
.Side .PropertySearchBoxContent form > div { float: none; width: 100%; margin-left: 0px }
.Side .PropertySearchBoxContent form > div+div { margin-top: 24px }
.Side .PropertySearchBoxContent { padding: 36px; background: #fff }
.mt #RightArea .Side { display: none }
/* Style 2
---------------------------------------*/
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .SectionHeader { position: absolute; bottom: calc(100% + 60px); max-width: 640px; left: 0px; right: 0px;margin: auto; text-align: center; font-size:32px; font-weight:700}
body:not(.mt) .HomePage .SearchPropertyStyle.No2 { height: 125px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContentWrapper { max-width: 640px; background: rgba(255,255,255,0.75); padding: 15px; position: relative;}
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form input, .PropertySearchBoxContent form select { border-radius: 0px !important }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form > div:nth-of-type(n+2) { width: 25%; margin-right: 2.5%; margin-left: 0px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form > div:nth-of-type(n+4) { margin-right: 0px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form > div.PropertySearchBoxSalePrice { width: 45% }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form > div.PropertySearchBoxCode { display: none }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form > div.PropertySearchBoxArea { width: 72.5%; margin-top: 15px; }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form > div.PropertySearchBoxArea .chzn-single { border-radius: 0px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxContent form > div.PropertySearchBoxButton { margin-left: 2.5%; margin-top: 15px; }
/*-- Purpose --*/
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxPurpose { position:absolute; bottom: 100%; width: 260px; left: calc(50% - 130px) }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxPurpose .RadioListItem label.ui-button { background: #ccc; border-radius: 3px 0px 0px 0px; color: #2A2627; text-transform: uppercase }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxPurpose .RadioListItem:last-child label.ui-button { border-radius: 0px 3px 0px 0px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxPurpose .RadioListItem label.ui-state-active { background: rgba(255,255,255,0.75); }
body:not(.mt) .HomePage .SearchPropertyStyle.No2 .PropertySearchBoxPurpose .RadioListItem label.ui-state-active .ui-button-text { color:#000 }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB.Float {margin-bottom:0px; top: auto; height: auto }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContentWrapper { max-width:1000px; background: #fff; padding: 20px 25px; }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div:nth-of-type(n+2) { width: 162px; margin-right: 8px; margin-left: 0px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div.PropertySearchBoxSalePrice { width: 234px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div.PropertySearchBoxBedrooms { width: 118px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div.PropertySearchBoxCode { display: none }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div.PropertySearchBoxArea { width: 296px; margin-top: 0px; }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div.PropertySearchBoxArea .chzn-single { border-radius: 0px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div.PropertySearchBoxButton { margin-top: 0px; width: 108px; margin-right: 0px }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxContent form > div.PropertySearchBoxButton .ui-button { background-image: none !important; text-align: center; padding: 0px; text-transform: uppercase; font-weight: 500 }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxPurpose { width: 424px; left: calc(50% - 212px); }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxPurpose .RadioListItem label.ui-button { height: 50px; line-height: 50px; border-radius: 0px; background: #171516 }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxPurpose .RadioListItem label.ui-button .ui-button-text { font-size: 16px; line-height: 50px; font-weight: 500; color: #fff }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxPurpose .RadioListItem label.ui-state-active { background: #fff }
body:not(.mt) .HomePage .SearchPropertyStyle.No2.SetB .PropertySearchBoxPurpose .RadioListItem label.ui-state-active .ui-button-text { color: #000 }
.HomePage .SearchPropertyStyleNo3.Float { width: 280px; height: 440px; left: auto; right: calc((100% - 1200px) / 2) }
.HomePage .SearchPropertyStyleNo3 .PropertySearchBoxContentWrapper { padding: 20px; background: rgba(255,255,255,0.5) }
.HomePage .SearchPropertyStyleNo3 .PropertySearchBoxContent form > div { float: none; width: auto; margin: 20px 0px 0px 0px }
.HomePage .SearchPropertyStyleNo3 .PropertySearchBoxContent form > div:first-child { margin-top: 0px }
/* Search property top slide
===============================================================================*/
.PropertySearchPanel p { margin: 0px }
.PropertySearchPanel .ui-icon { display: none !important }
.PropertySearchPanel .ui-button { padding-left: 10px; padding-right: 10px; }
.PropertySearchPanelContent > form > div > div { padding-bottom: 0px !important; margin: 0px !important }
#radioListPurpose .ui-button { width: 100% }
.PropertySearchPanelSalePrice, .PropertySearchPanelLivingSpace { padding-left: 20px !important; padding-right: 20px !important }
.SearchSliderBox > p > span:last-child { float: right }
.PropertySearchPanelButton { padding: 10px !important }
.PropertySearchPanelButton .ui-button { width: 100% }
/* search Property top style 1
===============================================================================*/
.SearchPropertyTopStyle1 .PropertySearchPanelContentWrapper { height: 100vh; width: 100%;position:fixed; background:rgba(0,0,0,0.9) !important }
.SearchPropertyTopStyle1 .PropertySearchPanelContent { display: table; height: 100vh; max-width: 420px }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form { display: table-cell; vertical-align: middle }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form > div > div { padding: 0px }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form > div+div { margin-top: 12px; overflow: hidden }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form > div:nth-child(4) { width: 100%; float: left }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form > div:nth-child(4)+div { width: 100%; float: right }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form > div:nth-child(4) select { border-radius: 3px 0px 0px 3px }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form > div:nth-child(4)+div select { border-radius: 0px 3px 3px 0px }
.SearchPropertyTopStyle1 .PropertySearchPanelContent > form > div:nth-child(4)+div+div { clear: both; padding-top: 12px }
.SearchPropertyTopStyle1 .PropertySearchPanelContent label { display: block; color: #fff }
.SearchPropertyTopStyle1 .PropertySearchPanelButton { padding: 0px !important }
.SearchPropertyTopStyle1 .RadioList > div { float: left; width: 48% }
.SearchPropertyTopStyle1 .RadioList > div+div { margin-left: 4% }
.SearchPropertyTopStyle1 .PropertySearchPanelBuy select, .SearchPropertyTopStyle1 .PropertySearchPanelRent select{ float: left; width: 50%; border-radius: 3px 0px 0px 3px }
.SearchPropertyTopStyle1 .PropertySearchPanelBuy select+select, .SearchPropertyTopStyle1 .PropertySearchPanelRent select+select{ border-radius: 0px 3px 3px 0px }
.SearchPropertyTopStyle1 .PropertySearchPanelNavigation{
border:0px !important;
padding-top:0px;
margin:0px!important;
position:absolute;
right:80px;
top: 0px
}
.SearchPropertyTopStyle1 .PropertySearchPanelContentWrapper[style="display: block;"] + .PropertySearchPanelNavigation{
position: fixed !important; top: 0px
}
.SearchPropertyTopStyle1 a.PropertySearchPanelNavigationLink{
background-color:#fff !important;
width:80px !important;
height:80px !important;
line-height:80px !important;
position:fixed;
font-size:0px;
text-transform:uppercase;
color:#111;
padding:0px 0px 0px 20px;
text-align:left;
}
.SearchPropertyTopStyle1 a.PropertySearchPanelNavigationLink:before {
content: "";
position: absolute;
left: 32%;
bottom: 32%;
width: 42%;
height: 42%;
border: 4px solid #000;
border-radius: 50%
}
.SearchPropertyTopStyle1 a.PropertySearchPanelNavigationLink:after {
content: "";
position: absolute;
left: 26%;
bottom: 23.5%;
width: 23%;
height: 5%;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
transform-origin: 0% 50%;
-webkit-transform-origin: 0% 50%;
background: #000
}
.SearchPropertyTopStyle1 .PropertySearchPanelContentWrapper[style="display: block;"] + .PropertySearchPanelNavigation a.PropertySearchPanelNavigationLink:before,
.SearchPropertyTopStyle1 .PropertySearchPanelContentWrapper[style="display: block;"] + .PropertySearchPanelNavigation a.PropertySearchPanelNavigationLink:after {
margin: auto;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
width: 60%;
height: 5%;
transform-origin: 50% 50%;
-webkit-transform-origin: 50% 50%;
border: 0px;
background: #000;
border-radius: 0px
}
.SearchPropertyTopStyle1 .PropertySearchPanelContentWrapper[style="display: block;"] + .PropertySearchPanelNavigation a.PropertySearchPanelNavigationLink:before {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.mt .SearchPropertyTopStyle1 .PropertySearchPanelContent form > .PropertySearchPanelOptionPurpose {
line-height: 38px;
background: #fff;
border-radius:4px;
border: 1px solid #e2e2e2;
overflow: hidden;
}
.mt .SearchPropertyTopStyle1 .PropertySearchPanelContent form > .PropertySearchPanelOptionPurpose .RadioListItem { position: relative; z-index: 1; padding: 0px 15px }
.mt .SearchPropertyTopStyle1 .PropertySearchPanelContent form > .PropertySearchPanelOptionPurpose input+label:before {
content: attr(title);
position: absolute;
z-index: 0;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background: #fff;
line-height: 38px;
padding: 0px 15px;
text-align: center
}
.mt .SearchPropertyTopStyle1 .PropertySearchPanelContent form > .PropertySearchPanelOptionPurpose input:checked+label:before { background: #444; color: #fff }
.mt .SearchPropertyTopStyle1 .PropertySearchPanelContent form > .PropertySearchPanelOptionPurpose label {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
color: #000
}
.m .SearchPropertyTopStyle1 .PropertySearchPanelContentWrapper { padding: 0px 15px }
.m .SearchPropertyTopStyle1 .RadioList > div { height: 40px }
/*LIST YOUR PROPERTY
===============================================================================*/
.AddPropertyPanel { position: relative }
.AddPropertyPanel:after { content: ""; display: block; clear: both }
.AddPropertyStepTitle { padding-bottom: 20px; border-bottom: 1px solid #e4e4e4 }
.AddProperty form { width: 60%; margin: 20px auto; overflow: hidden }
/*-- Submit step --*/
.AddProperty form .SubmitField { width: 100%; clear: both; margin-top: 10px; text-align: right }
.AddProperty form .SubmitField input { margin-top: 20px; }
.AddProperty form .SubmitField:before { content: ""; position: absolute; display: block; width: 100%; border-top: 1px solid rgba(0,0,0,0.05); left: 0px }
/*-- Tool tip --*/
.AddProperty .ui-state-highlight { margin-bottom: 20px; line-height: 40px; font-size: 14px }
.mt .AddProperty .ui-state-highlight { margin-left: 15px; margin-right: 15px; }
.AddProperty .ui-state-highlight span,
.AddProperty .ui-state-error span { float: none !important; display: inline-block; margin: 12px 0px 12px 12px; vertical-align: top }
.AddProperty .ui-state-highlight label,
.AddProperty .ui-state-error label { display: inline; line-height: 40px; vertical-align: top }
/* step 1 Regist or login
-----------------------------------------------------------*/
.AddContact form#form0 { width: 25%; margin: 0px 12.5%; position: relative; float: left; margin-top: 20px }
.AddContact form#form0 .LabelField { font-size: 14px; margin-bottom: 4px; margin-top: 12px }
.AddContact form#form0 .InputField { font-size: 14px }
.AddContact form#form1 { width: 50%; float: left; position: relative; border: 1px solid rgba(0,0,0,0.05); padding: 15px; border-radius: 4px }
.AddContact form#form1 .LabelField { width: 25%; float: left; font-size: 14px }
.AddContact form#form1 .InputField { width: 75%; float: left; margin: 10px 0 }
.AddContact input { font-size: 14px }
/*-- without login --*/
.AddProperty .PropertyAddContactForm .ContactInformation > .control-group { margin-bottom: 12px }
.AddProperty .PropertyAddContactForm .ContactInformation > .control-group label { font-weight: bold }
.AddProperty .ContactInformation { display: flex; flex-wrap: wrap; align-items: center }
.AddProperty .ContactInformation h4,
.AddProperty .ContactInformation .AddPropertyTooltip { width: 100% }
/* step 2 Add detail
-----------------------------------------------------------*/
.AddDetails form { display: flex; flex-wrap: wrap; align-items: center }
.AddDetails form > div { display: inline-block; width: calc(25% - 4px); margin: 10px 0; font-size: 14px; text-align: left; vertical-align: top }
.AddDetails form > div:nth-of-type(2n+0) { display: inline-block; width: 75%; margin: 10px 0; white-space: nowrap }
.AddDetails .LabelField:nth-of-type(n+11) { width: calc(25% - 4px) }
.AddDetails .InputField:nth-of-type(n+12) { width: 25%; margin-right: 50% }
/* step 3 Add pictures
-----------------------------------------------------------*/
.AddPropertyImages .FileList { border-radius: 4px; border: 1px solid rgba(0,0,0,0.05) }
.AddPropertyImages .FileListItem { font-size: 14px; text-align: left; line-height: 40px; padding: 0px 20px; }
.AddPropertyImages .FileListItem:nth-of-type(2n+0) { background: rgba(0,0,0,0.015) }
.AddPropertyImages .FileListItem+.FileListItem { border-top: 1px solid rgba(0,0,0,0.05); }
.AddPropertyImages .FileListItem input[type="file"] { width: 100%; margin: 0px 0px 0px 0%; line-height: 40px; font-size: 14px; text-align: left; vertical-align: top }
.AddPropertyImages .FileListItem input[type="text"] { display: inline-block; width: 70%; margin: 0px 0px 10px 0%; line-height: 40px; font-size: 14px; text-align: left; vertical-align: top }
.AddPropertyImages div.MoreImage { text-align: right; margin-top: 10px }
/* step 4 Add Features
---------------------------------------*/
.AddPropertyFeatures .FeatureGroup+.FeatureGroup { border-top: 1px solid rgba(0,0,0,0.05); margin-top: 20px; padding-top: 20px }
.AddPropertyFeatures .FeatureGroup li { display: inline-block; padding: 0px; width: 32%; vertical-align: top }
.AddPropertyFeatures .FeatureGroup li:nth-of-type(3n+1) { width: 32% }
/* step 5 Add Complete
---------------------------------------*/
.AddComplete .AddPropertyConfirm { text-align: center }
/* Mobile
---------------------------------------*/
.mt .AddPropertyStepTitle { margin-left: 15px; margin-right: 15px }
.mt .AddProperty form { width: 100%; padding: 0px 15px }
.m .AddProperty .ui-state-highlight {margin: 0px 15px 20px 15px;padding: 15px;line-height: normal;}
.m .AddProperty .ContactInformation .ui-state-highlight {margin: 10px 0px;padding: 10px }
.m .AddProperty .ui-state-highlight span { margin: 0px; }
/* step 1 Regist or login
-----------------------------------------------------------*/
.m .AddContact form#form0, .m .AddContact form#form1 { float: none; width: 100%; margin: 0px; border: 0px; }
.m .AddContact form#form1 .LabelField, .m .AddContact form#form1 .InputField { width: 100%; line-height: normal }
.m .AddProperty form .SubmitField:before { display: none }
/* step 2 Add detail
-----------------------------------------------------------*/
.m .AddDetails form > div { display: block; width: 100%; margin: 0px 0px 0px 0%; line-height: normal }
.m .AddDetails form > div:nth-of-type(2n+0) { display: inline-block; width: 100%; margin: 0px 0% 10px 0px; white-space: nowrap }
.m .AddDetails .LabelField:nth-of-type(n+11) { width: 100% }
.m .AddDetails .InputField:nth-of-type(n+12) { width: 100%; margin-right: 0% }
/* PropertyProjectDetails
===============================================================================*/
.PropertyProjectDetails { max-width: 1200px; margin: auto; position: relative }
.PropertyProjectDetailsLeft { width: 72% !important; float: left !important; padding-top: 80px; }
.PropertyProjectDetailsRight { width: 28% !important; float: right !important; padding-left: 20px; padding-top: 80px }
@media only screen and (max-width: 959px) {
.mt .PropertyProjectDetailsLeft,
.mt .PropertyProjectDetailsRight { width: 100% !important; padding-left: 0px; margin-bottom: 40px }
.mt .PropertyProjectDetailsRight .Feature-li { width: 32.5%; display: inline-block; vertical-align: top; }
}
@media only screen and (max-width: 767px) {
.mt .PropertyProjectDetailsRight .FeatureGroup { width: 100% }
}
/* Left
---------------------------------------*/
.PropertyProjectDetailsDescription { padding-top: 20px; border-top: 1px solid #e4e4e4; margin-bottom: 20px }
.map_canvas { height: 450px !important }
.CheckAvailableUnitsLink { margin-bottom: 20px }
.CheckAvailableUnitsLink a { position: relative; padding-right: 40px }
.CheckAvailableUnitsLink a:after {
content: "";
display: block;
position: absolute;
border-right: 4px solid #fff;
border-top: 4px solid #fff;
width: 12px;
height: 12px;
right: 15px;
top: 0%;
bottom: 0%;
margin: auto;
-webkit-transform: rotate(45deg);
transform: rotate(45deg)
}
/* Right
---------------------------------------*/
.PropertyProjectDetailsList { width: 100% }
.PropertyProjectDetailsList td {
padding: 10px 0px;
overflow: hidden;
border-top: 1px solid #e4e4e4;
line-height: normal;
margin-left: 0%;
vertical-align: top
}
.PropertyProjectDetailsList td:first-child { font-weight: 300; font-size: 14px; font-weight: 600; line-height: 20px }
.PropertyProjectDetailsList td:last-child { text-align: right }
.PropertyProjectDetailsName { position: absolute; top: 0px; width: 100%; left: 0px }
.PropertyProjectDetails .ShowFeatures { border: 1px solid #e4e4e4; border-radius: 4px; padding: 15px; margin-top: 20px }
.PropertyProjectDetails .FeatureGroup+.FeatureGroup { margin-top: 20px }
.PropertyProjectDetails .FeatureGroup h4 { border-bottom: 1px solid #e4e4e4; padding-bottom: 5px; margin-bottom: 10px; }
.PropertyProjectDetails .Feature-ul { padding: 0px; list-style: none }
.PropertyProjectDetails .Feature-li { padding: 5px 0px 5px 25px; background: url(/Content/Archive/406/checked-109431.png) no-repeat top 5px left; }
.PropertyProjectDetails .AvailableBuildingItem { border-bottom: 1px solid #e4e4e4; margin-top: 20px; padding-bottom: 20px }
.PropertyProjectDetails .AvailableBuildingItem:after { content: ""; display: block; clear: both }
.PropertyProjectDetails .AvailableBuildingItemLeft { float: left; width: 25%; margin: 0px; padding: 0px }
.PropertyProjectDetails .AvailableBuildingItemRight { float: left; width: 75%; padding-left: 20px }
/* Mobile
---------------------------------------*/
.mt .PropertyProjectDetailsName { position: absolute; top: 0px; width: 100%; left: 0px; padding-left: 15px; padding-right: 15px }
.mt .PropertyProjectDetails { padding-left: 15px; padding-right: 15px; overflow: hidden }
.mt .CheckAvailableUnitsLink a { line-height: 1.4; font-size: 16px; height: auto; padding-top: 8px; padding-bottom: 8px }
.m .PropertyProjectDetailsName { position: relative }
/* Shearch Project
---------------------------------------*/
.SearchProjectPanel > form > * { display: inline-block; width: calc((100% - 208px) / 3); vertical-align: top }
.SearchProjectPanel > form > *+* { margin-left: 12px }
.SearchProjectPanel > form > label { padding-top: 30px; width: 20px; text-align: center }
.SearchProjectPanel > form > .Display { width: 120px }
.SearchProjectPanel > form > .Display > label { margin-bottom: 10px; display: block }
.SearchProjectPanel .form-actions { vertical-align: bottom }
.SearchProjectPanel .form-actions input { width: 100% }
.SearchProjectPanel .RadioListItem:first-child { margin-right:10px }
.SearchProjectPanel .RadioListItem { display:inline-block }
.SearchProjectPanel { padding:20px; border: 1px solid #e4e4e4 }
.PropertyProjectListItem { border:solid 1px #efefef; margin-top:20px; }
div.PropertyProjectListItemImage { line-height: normal !important }
@media only screen and (max-width: 959px) {
.SearchProjectPanel > form > * { width: calc((100% - 202px) / 2); }
.SearchProjectPanel .form-actions { text-align:center; display: block; margin: 12px 0px 0px 0px; width: 100% }
}
@media only screen and (max-width: 767px) {
.SearchProjectPanel { padding:20px 15px; border: 1px solid #e4e4e4 }
.SearchProjectPanel > form > * { display: block; width: 100% !important; margin-left: 0px }
.SearchProjectPanel > form > label { padding: 8px 0px 0px; margin: 0px; text-align: center; display: block; font-weight: bold }
.SearchProjectPanel > form > .Display { margin-top: 12px; }
div.PropertyProjectListItemLeft { float: none !important; width: 100% !important }
.PropertyProjectListItemRight { padding: 0px 15px }
.PropertyProjectListItem { border: 0px; border-bottom: 1px solid #efefef; padding-bottom: 15px; margin: 0px}
}
/* Main Image and ThumbImages
===============================================================================*/
.PropertyProjectDetailsWrapper,
#buildingDetail .BuildingMainImagesWrapper,
.PropertyMainImagesWrapper { margin: 0px !important; padding: 0px; background: #fff; overflow: hidden }
.PropertyProjectDetails .PropertyProjectDetailsMainImage,
#buildingDetail .BuildingMainImages,
.PropertyDetail .PropertyMainImages { border: 0px !important; position: relative; height: 540px !important; }
.PropertyProjectDetails .PropertyProjectDetailsMainImage img,
#buildingDetail .BuildingMainImages img,
.PropertyDetail .PropertyMainImages img {
max-width: 100%;
max-height: 540px !important;
position: absolute;
margin: auto;
top: 0px;
bottom: 0px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.PropertyMainImageCaption {
line-height: normal !important;
top: auto !important;
bottom: 0px;
width: 100% !important;
color: inherit !important;
left: 0px !important;
background: rgba(255,255,255,0.8) !important;
opacity: 1 !important
}
.PropertyMainImageCaption span { padding: 12px 20px !important; text-align: center; color: inherit; font-size: inherit }
.m .PropertyProjectDetails .PropertyProjectDetailsMainImage,
.m .PropertyDetail .PropertyMainImages { border: 0px !important; position: relative; height: auto !important; }
.m .PropertyDetail .PropertyMainImages:before { content: ""; display: block; padding-top: 100% }
.m .PropertyProjectDetails .PropertyProjectDetailsMainImage img,
.m .PropertyDetail .PropertyMainImages img { max-height: 100% !important; }
.m .PropertyMainImageCaption { display: none !important }
/* Property Detail Thumb Images
===============================================================================*/
.es-carousel-wrapper { max-width: 590px; margin: auto; padding: 0px 35px !important; border-radius: 3px !important; margin-bottom: 20px; background: #fff !important; border: 1px solid #e4e4e4; }
.mt .es-carousel-wrapper { max-width: 100%; margin: 0px 15px 20px 15px }
.es-carousel { background: none !important; font-size: 0px; }
/*-- Property Detail Thumb Item --*/
.es-carousel ul li { width: 100px !important }
.es-carousel a { font-size: 0px; height: 92px !important; line-height: 92px !important; border: 0px !important; position: relative; overflow: hidden }
.es-carousel a:before { content: ""; display: block; left: 0px; top: 0px;width: 100%; height: 100%; background: rgba(255,255,255,0.5); position: absolute; z-index: -1 }
.es-carousel a img {
margin: auto !important;
position: absolute;
left: 50%;
right: 0px;
top: 0px;
bottom: 0px;
max-width: none !important;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.es-carousel .ActiveThumb:before { z-index: 2 }
/* Main images arrow
---------------------------------------*/
.Prev,.Next { position: initial !important }
.PrevLink, .NextLink {
position: absolute;
display: block;
height: 50px !important;
top: 0px;
bottom: 0px;
margin: auto;
overflow: hidden;
cursor: pointer;
z-index: 50;
text-indent: -9999px;
transition: all 0.2s;
width: 50px !important;
background: rgba(0,0,0,0.2);
border-radius: 25px;
opacity: 0
} /* image and position here*/
.PrevLink { left: 0px }
.NextLink { right: 0px }
.PropertyMainImagesWrapper:hover .PrevLink,
.PropertyProjectDetailsWrapper:hover .PrevLink { left: 4%; opacity: 1 }
.PropertyMainImagesWrapper:hover .NextLink,
.PropertyProjectDetailsWrapper:hover .NextLink { right: 4%; opacity: 1 }
.mt .PrevLink { opacity: 1; left: 4% }
.mt .NextLink { opacity: 1; right: 4% }
.PrevLink:before, .NextLink:before {
content: "";
display: block;
position: absolute;
border-left: 2px solid #fff;
border-top: 2px solid #fff;
width: 13px;
height: 13px;
left: 0%;
top: 0%;
right: 4%;
bottom: 0%;
margin: auto;
-webkit-transition: all 0.2s;
transition: all 0.2s
}
.PrevLink:before { -webkit-transform: rotateZ(-45deg) translate(18%, 18%); transform: rotateZ(-45deg) translate(18%, 18%); }
.NextLink:before { -webkit-transform: rotateZ(0deg) translate(18%, 18%); transform: rotateZ(135deg) translate(18%, 18%); right: 0px; left: 4% }
.PrevLink:hover:before, .NextLink:hover:before { border-color: #000 }
/* Thumbs Arrows
---------------------------------------*/
.es-nav-prev, .es-nav-next {
position: absolute !important;
height: 48px !important;
width: 25px !important;
top: 50% !important;
margin: -24px 0px 0px 0px !important;
font-size: 0px;
background: none !important;
overflow: hidden;
z-index: 500;
transition: all 0.2s
}
.es-nav-prev { left: 0% !important; opacity: 0 !important }
.es-nav-next { right: 0% !important; opacity: 0 !important }
.mt .es-nav-prev, .mt .es-nav-next { opacity: 1 !important }
.es-carousel-wrapper:hover .es-nav-prev { left: 5px !important; opacity: 1 !important }
.es-carousel-wrapper:hover .es-nav-next { right: 5px !important; opacity: 1 !important }
.es-nav-prev:before, .es-nav-next:before {
content: "";
display: block;
position: absolute;
border-left: 10px solid #ccc;
border-top: 10px solid #ccc;
width: 34px;
height: 34px;
left:0px;
right: 0px;
top: 0%;
bottom: 0%;
margin: auto;
-webkit-transition: all 0.2s;
transition: all 0.2s
}
.es-nav-prev:before { -webkit-transform: rotateZ(-45deg) translate(18%, 18%); transform: rotateZ(-45deg) translate(18%, 18%) }
.es-nav-next:before { -webkit-transform: rotateZ(0deg) translate(18%, 18%); transform: rotateZ(135deg) translate(18%, 18%); left: auto; }
.es-nav-prev:hover:before, .es-nav-next:hover:before { border-color: #000 }
/* Building Available
---------------------------------------*/
#clickOnUnitForDetails { margin-bottom: 20px }
.UnitBrowser { max-width: 1200px; margin: auto }
div.SoldBadge { background: url(/Content/Archive/406/sold-187435.png) no-repeat top 5px left 5px !important }
div.ReserveBadge { background-image: none !important; background: #FA5D4A !important; width: 34px !important; height: 34px !important; border-radius: 50%; }
div.ReserveBadge:before { content: ""; font-size: 12px; position: absolute; border: 3px solid #333; height: 18px; width: 14px; display: block; border-radius: 10px; margin: auto; left: 0px; right: 0px; top: 4px; }
div.ReserveBadge:after { content: ""; display: block; position: absolute; width: 22px; height: 16px; background: #FFD766; bottom: 5px; margin: auto; left: 0px; right: 0px; border: 3px solid #333; border-radius: 3px }
.UnitBrowserDescription { margin: 20px 0px; }
/*-- Mobile --*/
.mt .UnitBrowserDescription { padding-left: 15px; padding-right: 15px }
/* Dialog property detail
===============================================================================*/
.PropertyMainImage { border: 0px !important }
/* ThumbsImages
---------------------------------------*/
.PropertyThumbImages { position: relative }
.PropertyThumbImageWrapper { height: 82px !important; margin-left: 7% }
.PropertyThumbImageContent .PropertyThumbImage { margin: 0px !important; vertical-align: top; border-color: #e4e4e4 }
.PropertyThumbImage+.PropertyThumbImage { margin-left: 4px !important; }
.PropertyThumbImage.activeSlide { border-color: #000; background: none }
.PropertyThumbImage img { height: 70px; max-width: 70px; position: absolute; left: 0px; right: 0px; bottom: 0px; top: 0px; margin: auto !important; }
/*-- Thumbs --*/
.PropertyThumbBrowser.BrowseLeft a,
.PropertyThumbBrowser.BrowseRight a {
position: absolute !important;
height: 48px !important;
width: 25px !important;
top: 50% !important;
margin: -24px 0px 0px 0px !important;
font-size: 0px;
background: none !important;
overflow: hidden;
z-index: 500;
transition: all 0.2s
}
.PropertyThumbBrowser.BrowseLeft a { left: 0% !important; opacity: 0 !important }
.PropertyThumbBrowser.BrowseRight a { right: 0% !important; opacity: 0 !important }
.PropertyThumbImages:hover .PropertyThumbBrowser.BrowseLeft a { left: 1% !important; opacity: 1 !important }
.PropertyThumbImages:hover .PropertyThumbBrowser.BrowseRight a { right: 1% !important; opacity: 1 !important }
.PropertyThumbBrowser.BrowseLeft a:before, .PropertyThumbBrowser.BrowseRight a:before {
content: "";
display: block;
position: absolute;
border-left: 10px solid #000;
border-top: 10px solid #000;
width: 34px;
height: 34px;
left:0px;
right: 0px;
top: 0%;
bottom: 0%;
margin: auto;
-webkit-transition: all 0.2s;
transition: all 0.2s
}
.PropertyThumbBrowser.BrowseLeft a:before { -webkit-transform: rotateZ(-45deg) translate(18%, 18%); transform: rotateZ(-45deg) translate(18%, 18%) }
.PropertyThumbBrowser.BrowseRight a:before { -webkit-transform: rotateZ(0deg) translate(18%, 18%); transform: rotateZ(135deg) translate(18%, 18%); left: auto; }
.PropertyThumbBrowser.BrowseLeft a:hover:before, .PropertyThumbBrowser.BrowseRight a:before { border-color: #000 }
/* Detail
---------------------------------------*/
.PropertyInformationRight { width: 40%; padding-right: 20px }
.PropertyInformationRight h1 { font-size: 32px; margin: 20px 0px 10px 0px }
.PropertyInformationRight h2 { font-size: 24px }
.PropertyInformationHeader > div { line-height: 40px; border-bottom: 1px solid #e4e4e4 }
.PropertyInformationSalesPrice span:last-child, .PropertyInformationDiscountPrice span:last-child, .PropertyInformationCustomPrice span:last-child { float: right }
.PropertyInformationOverview > div { line-height: 32px }
.PropertyMoreDetailsLink { margin-top: 20px }
/* List Style 1
===============================================================================*/
.PropertyStyle1 .Property { background: #fff; padding: 0px; text-align: left; margin-left: 3.5%; width: 31%; margin-bottom: 40px }
.PropertyStyle1 .Property:nth-of-type(3n+1) { margin-left: 0px; }
.PropertyStyle1 .Property .PropertyImage a { border-radius: 0px; padding-top: 75%; }
.PropertyStyle1 .Property .PropertyImage a:before { height: 60% }
.PropertyStyle1 .Property .PropertyInfo { padding: 0px;border: 0px; position: static }
.PropertyStyle1 .Property .PropertyInfo .Title { position: static; margin: 0px; }
.PropertyStyle1 .Property .PropertyInfo .Title h3 { position: absolute; bottom: 80px; z-index: 1; padding: 0px 12px; }
.PropertyStyle1 .Property .PropertyInfo .Title h3 a { color: rgba(255,255,255,1); font-weight: bold; line-height: 1.2; }
.PropertyStyle1 .Property .PropertyInfo .Title .Ref,
.PropertyStyle1 .Property .PropertyInfo .Title .DispayListingId { display: none }
.PropertyStyle1 .Property .PropertyInfo li { position: absolute; border: 0px; z-index: 1; padding: 0px; text-align: left }
.PropertyStyle1 .Property .PropertyInfo li .Value { float: none }
.PropertyStyle1 .Property .divLinkToPropertyDetail { display: none }
.PropertyStyle1 .Property #PriceSell,
.PropertyStyle1 .Property #RentPrice { line-height: 40px; font-size: 16px; color: #fff; position: absolute; bottom: calc(0% + 40px); left: 0%; height:40px; padding: 0px 12px }
.PropertyStyle1 .Property #PriceSell .Ovlist, .PropertyStyle.No1 .Property #RentPrice .Ovlist { display: none }
.PropertyStyle1 .Property #PriceSell+#RentPrice .Ovlist { display: inline-block }
.PropertyStyle1 .Property #PriceSell+#RentPrice { left: calc(33% + 0px); }
.PropertyStyle1 .Property #PropertyTypeId { line-height: 50px; color: #fff; position: absolute; bottom: calc(0% + 0px); left: 0%; height:50px; padding: 0px 12px; width: 32%; }
.PropertyStyle1 .Property #Location { line-height: 40px; color: #fff; position: absolute; bottom: calc(0% + 70px); left: 0%; height:40px; padding: 0px 12px }
.PropertyStyle1 .Property #Bedroom { line-height: 30px; color: #fff; position: absolute; bottom: calc(0% + 10px); left: 33%; width: 33%; height:30px; padding: 0px 12px; border-left: 1px solid rgba(255,255,255,0.2) }
.PropertyStyle1 .Property #LandSize,
.PropertyStyle1 .Property #LivingAreaSize { line-height: 30px; color: #fff; position: absolute; bottom: calc(0% + 10px); left: 66%; height:30px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,0.2) }
.PropertyStyle1 .Property #Area,
.PropertyStyle1 .Property #Location,
.PropertyStyle1 .Property .PropertyInfo #PropertyTypeId .Ovlist,
.PropertyStyle1 .Property #Location .Ovlist,
.PropertyStyle1 .Property .PropertyInfo #Bedroom .Ovlist,
.PropertyStyle1 .Property .PropertyInfo #LandSize .Ovlist,
.PropertyStyle1 .Property .PropertyInfo #LivingAreaSize .Ovlist
{ display: none }
.PropertyStyle1 .Property #Location .Value:before,
.PropertyStyle1 .Property #Bedroom .Value:before,
.PropertyStyle1 .Property #LandSize .Value:before,
.PropertyStyle1 .Property #LivingAreaSize .Value:before {
content: "";
float: left;
margin-top: 0px;
margin-right: 7px;
width: 30px;
height: 30px;
background: url(/Content/Archive/406/icon-property-w-223204.png) no-repeat top -30px left;
background-size: 30px;
vertical-align: top;
}
.PropertyStyle1 .Property #Location .Value:before { margin-top: 5px; background-position: top -30px left }
.PropertyStyle1 .Property #PropertyTypeId .Value:before { background-position: top -60px left }
.PropertyStyle1 .Property #Bedroom .Value:before { margin-top: 0px; background-position: top -60px left }
.PropertyStyle1 .Property #LandSize .Value:before,
.PropertyStyle1 .Property #LivingAreaSize .Value:before { margin-top: 0px; background-position: top -120px left }
.PropertyStyle1 .Property .SoldPropertyRibbonWrapper { top: calc(50% - 27px); }
@media only screen and (orientation: portrait) {
.t .PropertyStyle1 .Property { background: #fff; padding: 0px; text-align: left; margin-left: 4%; width: 48%; margin-bottom: 40px }
.t .PropertyStyle1 .Property:nth-of-type(3n+1) { margin-left: 4%; }
.t .PropertyStyle1 .Property:nth-of-type(2n+1) { margin-left: 0%; }
}
.m .PropertyStyle1 .Property { margin-left: 0%; width: 100%; }
/* List Style 2
===============================================================================*/
.PropertyStyle.No1 .Property { background: #fff; padding: 0px; text-align: left; margin-left: 3.5%; width: 31%; margin-bottom: 40px }
.PropertyStyle.No1 .Property:nth-of-type(3n+1) { margin-left: 0px; }
.PropertyStyle.No1 .Property .PropertyImage a { border-radius: 0px; padding-top: 75%; }
.PropertyStyle.No1 .Property .PropertyImage a:before { height: 60% }
.PropertyStyle.No1 .Property .PropertyInfo { padding: 0px;border: 0px; position: static }
.PropertyStyle.No1 .Property .PropertyInfo .Title { position: static; margin: 0px; }
.PropertyStyle.No1 .Property .PropertyInfo .Title h3 { position: absolute; bottom: 80px; z-index: 1; padding: 0px 12px; }
.PropertyStyle.No1 .Property .PropertyInfo .Title h3 a { color: rgba(255,255,255,1); font-weight: bold; line-height: 1.2; }
.PropertyStyle.No1 .Property .PropertyInfo .Title .Ref,
.PropertyStyle.No1 .Property .PropertyInfo .Title .DispayListingId { display: none }
.PropertyStyle.No1 .Property .PropertyInfo li { position: absolute; border: 0px; z-index: 1; padding: 0px; text-align: left }
.PropertyStyle.No1 .Property .PropertyInfo li .Value { float: none }
.PropertyStyle.No1 .Property .divLinkToPropertyDetail { display: none }
.PropertyStyle.No1 .Property #PriceSell,
.PropertyStyle.No1 .Property #RentPrice { line-height: 40px; font-size: 16px; color: #fff; position: absolute; bottom: calc(0% + 40px); left: 0%; height:40px; padding: 0px 12px }
.PropertyStyle.No1 .Property #PriceSell .Ovlist, .PropertyStyle.No1 .Property #RentPrice .Ovlist { display: none }
.PropertyStyle.No1 .Property #PriceSell+#RentPrice .Ovlist { display: inline-block }
.PropertyStyle.No1 .Property #PriceSell+#RentPrice { left: calc(33% + 0px); }
.PropertyStyle.No1 .Property #PropertyTypeId { line-height: 50px; color: #fff; position: absolute; bottom: calc(0% + 0px); left: 0%; height:50px; padding: 0px 12px; width: 32%; }
.PropertyStyle.No1 .Property #Location { line-height: 40px; color: #fff; position: absolute; bottom: calc(0% + 70px); left: 0%; height:40px; padding: 0px 12px }
.PropertyStyle.No1 .Property #Bedroom { line-height: 30px; color: #fff; position: absolute; bottom: calc(0% + 10px); left: 33%; width: 33%; height:30px; padding: 0px 12px; border-left: 1px solid rgba(255,255,255,0.2) }
.PropertyStyle.No1 .Property #LandSize,
.PropertyStyle.No1 .Property #LivingAreaSize { line-height: 30px; color: #fff; position: absolute; bottom: calc(0% + 10px); left: 66%; height:30px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,0.2) }
.PropertyStyle.No1 .Property #Area,
.PropertyStyle.No1 .Property #Location,
.PropertyStyle.No1 .Property .PropertyInfo #PropertyTypeId .Ovlist,
.PropertyStyle.No1 .Property #Location .Ovlist,
.PropertyStyle.No1 .Property .PropertyInfo #Bedroom .Ovlist,
.PropertyStyle.No1 .Property .PropertyInfo #LandSize .Ovlist,
.PropertyStyle.No1 .Property .PropertyInfo #LivingAreaSize .Ovlist
{ display: none }
.PropertyStyle.No1 .Property #Location .Value:before,
.PropertyStyle.No1 .Property #Bedroom .Value:before,
.PropertyStyle.No1 .Property #LandSize .Value:before ,
.PropertyStyle.No1 .Property #LivingAreaSize .Value:before {
content: "";
float: left;
margin-top: 0px;
margin-right: 7px;
width: 30px;
height: 30px;
background: url(/Content/Archive/406/icon-property-w-223204.png) no-repeat top -30px left;
background-size: 30px;
vertical-align: top;
}
.PropertyStyle.No1 .Property #Location .Value:before { margin-top: 5px; background-position: top -30px left }
.PropertyStyle.No1 .Property #PropertyTypeId .Value:before { background-position: top -60px left }
.PropertyStyle.No1 .Property #Bedroom .Value:before { margin-top: 0px; background-position: top -60px left }
.PropertyStyle.No1 .Property #LandSize .Value:before,
.PropertyStyle.No1 .Property #LivingAreaSize .Value:before { margin-top: 0px; background-position: top -120px left }
@media only screen and (orientation: portrait) {
.t .PropertyStyle.No1 .Property { background: #fff; padding: 0px; text-align: left; margin-left: 4%; width: 48%; margin-bottom: 40px }
.t .PropertyStyle.No1 .Property:nth-of-type(3n+1) { margin-left: 4%; }
.t .PropertyStyle.No1 .Property:nth-of-type(2n+1) { margin-left: 0%; }
}
.m .PropertyStyle.No1 .Property { margin-left: 0%; width: 100%; }
/* List Style 2
===============================================================================*/
.PagePropertyPropertySearchPanel #main.PropertyStyle.No2,
.PagePropertyPropertyType #main.PropertyStyle.No2,
.PagePropertyPropertyTypeForSale #main.PropertyStyle.No2,
.PagePropertyPropertyTypeForRent #main.PropertyStyle.No2 { max-width: 1200px; margin: auto; background: #ccc }
/*#main.PropertyStyle.No2:before { content: ""; position: absolute; left: 0px; width: 100%; height: 100%; background: inherit }*/
.PropertyStyle.No2 #RightArea { display: none }
.PagePropertyPropertySearchPanel .PropertyStyle.No2 #RightArea,
.PagePropertyPropertyTypeForRent .PropertyStyle.No2 #RightArea,
.PagePropertyPropertyTypeForSale .PropertyStyle.No2 #RightArea,
.PagePropertyPropertyType .PropertyStyle.No2 #RightArea { display: block; float: left; width: 23.5% }
.PagePropertyPropertySearchPanel .PropertyStyle.No2 #ContentArea,
.PagePropertyPropertyTypeForRent .PropertyStyle.No2 #ContentArea,
.PagePropertyPropertyTypeForSale .PropertyStyle.No2 #ContentArea,
.PagePropertyPropertyType .PropertyStyle.No2 #ContentArea { float: right; width: 73.5% }
.PropertyStyle.No2 #AsideArea { clear: both }
/*-- List --*/
.PropertyStyle.No2 .Property { background: #fff; padding: 0px; text-align: left; margin: 0px; width: 100%; }
.PropertyStyle.No2 .Property+.Property { margin-top: 24px }
.PropertyStyle.No2 .PropertyImage { width: 50%; position: relative; float: left; }
.PropertyStyle.No2 .PropertyImage a { border-radius: 0px; padding-top: 43%; }
.PropertyStyle.No2 .Property:hover a:before { bottom: 0% }
.PropertyStyle.No2 .Property > .PropertyInfo { float: right; width: 50%; padding: 1.5% 3%; position: static; border: 0px }
.PropertyStyle.No2 .Property > .PropertyInfo .Title { position: static; margin: 0px }
.PropertyStyle.No2 .Property > .PropertyInfo .Title h3 { font-size: 14px; font-family: inherit; font-weight: inherit; padding: 0px; height: auto }
.PropertyStyle.No2 .Property > .PropertyInfo .Title > span { z-index: 1 ; padding-left: 10px; left: 0%; line-height: normal; width: auto }
.PropertyStyle.No2 .Property > .PropertyInfo .Title .Ref { position: absolute; bottom: 9%; }
.PropertyStyle.No2 .Property > .PropertyInfo .Title .DispayListingId { background: none; bottom: calc(9% + 23px); text-align: left; }
.PropertyStyle.No2 .Property > .PropertyInfo .Title .Ref a,
.PropertyStyle.No2 .Property > .PropertyInfo .Title .DispayListingId a { line-height: normal }
.PropertyStyle.No2 .Property > .PropertyInfo > ul { min-height: auto }
.PropertyStyle.No2 .Property li { padding: 0px; border: 0px; overflow: visible }
.PropertyStyle.No2 .Property .Value { float: none }
/*-- List absolute --*/
.PropertyStyle.No2 .Property #Bedroom,
.PropertyStyle.No2 .Property #LandSize,
.PropertyStyle.No2 .Property #LivingAreaSize { line-height: 18px; color: #000; padding: 0px; height:18px; padding: 0px; }
.PropertyStyle.No2 .Property #Location { line-height: 24px;height: 24px }
.PropertyStyle.No2 .Property #Bedroom { position: absolute; bottom: 9%; left: 53%; }
.PropertyStyle.No2 .Property #LandSize,
.PropertyStyle.No2 .Property #LivingAreaSize { position: absolute; bottom: 9%; right: 3%; }
.PropertyStyle.No2 .Property #PriceSell, .PropertyStyle.No2 .Property #RentPrice { line-height: 0px }
/*-- Hide label text --*/
.PropertyStyle.No2 .Property #PropertyTypeId .Ovlist,
.PropertyStyle.No2 .Property #PriceSell .Ovlist,
.PropertyStyle.No2 .Property #RentPrice .Ovlist,
.PropertyStyle.No2 .Property #Location .Ovlist,
.PropertyStyle.No2 .Property #Bedroom .Ovlist,
.PropertyStyle.No2 .Property #LandSize .Ovlist,
.PropertyStyle.No2 .Property #LivingAreaSize .Ovlist { font-size: 0px; }
/*-- Icons --*/
.PropertyStyle.No2 .Property #PropertyTypeId .Ovlist:before,
.PropertyStyle.No2 .Property #PriceSell .Ovlist:before,
.PropertyStyle.No2 .Property #RentPrice .Ovlist:before,
.PropertyStyle.No2 .Property #Bedroom .Ovlist:before,
.PropertyStyle.No2 .Property #LandSize .Ovlist:before,
.PropertyStyle.No2 .Property #LivingAreaSize .Ovlist:before,
.PropertyStyle.No2 .Property #Location .Ovlist:before {
content: "";
float: left;
width: 18px;
height: 18px;
background: url(/Content/Archive/406/icon-title-109427.png) no-repeat;
background-size: 18px;
vertical-align: top;
}
.PropertyStyle.No2 .Property #PriceSell .Ovlist:before,
.PropertyStyle.No2 .Property #RentPrice .Ovlist:before { position: absolute; right: 53%; top: 9%; z-index: 20; color: #fff; font-size: 11px; width: auto; text-transform: uppercase; line-height: 18px; padding: 0px 4px; border-radius: 2px }
.PropertyStyle.No2 .Property #PriceSell+ #RentPrice .Ovlist:before { top: calc(9% + 23px) }
.PropertyStyle.No2 .Property #PriceSell .Ovlist:before { content: "sale"; background: #000 }
.PropertyStyle.No2 .Property #RentPrice .Ovlist:before { content: "Rent"; background: #690 }
.PropertyStyle.No2 .Property #Bedroom .Ovlist:before { background-position: 0px -36px; }
.PropertyStyle.No2 .Property #LandSize .Ovlist:before,
.PropertyStyle.No2 .Property #LivingAreaSize .Ovlist:before { background-position: 0px -72px; }
.PropertyStyle.No2 .Property #Location .Ovlist:before { background-position: 0px -17px; }
/*-- Price --*/
.PropertyStyle.No2 .Property #PriceSell .Value,
.PropertyStyle.No2 .Property #RentPrice .Value { line-height: 20px; font-weight: bold; color: #000; position: absolute; bottom: calc(9% + 23px); left: 53%; height:20px }
.PropertyStyle.No2 .Property #PropertyTypeId
{ line-height: 20px; font-weight: bold; color: #000; position: absolute; bottom: calc(9% + 23px); left: 53%; height:20px }
.PropertyStyle.No2 .Property #PropertyTypeId { position: absolute; bottom: calc(9% + 23px); left: auto; right: 3%; font-weight: normal }
.PropertyStyle.No2 .Property #PriceSell+#RentPrice .Value { bottom: calc(9% + 46px); }
/*-- Hidden --*/
.PropertyStyle.No2 .Property #Area,
.PropertyStyle.No2 .Property .divLinkToPropertyDetail { display: none }
.PropertyStyle.No2 .SoldPropertyRibbonWrapper { left: 10%; right: auto; bottom: 0px; top: 0px; width: 30%; }
/* List Style 3
===============================================================================*/
.PropertyStyle.No3 .Property h3 { font-size: 14px; font-weight: 600; padding-top: 0px; padding-bottom: 5px }
.PropertyStyle.No3 .PropertyInfo .Title { position: static; }
.PropertyStyle.No3 .PropertyInfo .Title .Ref a { left: 0px; bottom: 0px; color: #fff; z-index: 1; padding-left: 12px }
.PropertyStyle.No3 .Property { width: 48.5%; vertical-align: top; box-shadow: 0px 0px 12px rgba(0,0,0,0.2); margin-left: calc(3% - 5px) }
.PropertyStyle.No3 .Property:nth-of-type(n+3) { margin-top: 2% }
.PropertyStyle.No3 .Property:nth-of-type(2n+1) { margin-left: 0px }
.PropertyStyle.No3 .Property .PropertyImage { float: left; width: 50% }
.PropertyStyle.No3 .Property .PropertyInfo { position: static; float: right; width: 50%; border: 0px; padding: 15px 30px 0px; }
.PropertyStyle.No3 .Property .Ovlist { display: none }
.PropertyStyle.No3 .Property .Value { float: none }
.PropertyStyle.No3 .Property li { border: 0px; padding: 2px 0px }
.PropertyStyle.No3 .Property h3 { font-size: 14px; }
.PropertyStyle.No3 .Property .divLinkToPropertyDetail { display: none }
.PropertyStyle.No3 .Property #Area .Value:before,
.PropertyStyle.No3 .Property #LandSize .Value:before,
.PropertyStyle.No3 .Property #Bedroom .Value:before,
.PropertyStyle.No3 .Property #LivingAreaSize .Value:before {
content: "";
display: inline-block;
margin-top: 0px;
margin-right: 7px;
width: 24px;
height: 24px;
background: url(/Content/Archive/525/property-icons-280181.png) no-repeat top 0px center;
vertical-align: top;
}
.PropertyStyle.No3 .Property #Bedroom .Value:before { background-position: top 0px center }
.PropertyStyle.No3 .Property #LandSize .Value:before,
.PropertyStyle.No3 .Property #LivingAreaSize .Value:before { background-position: top -24px center }
.PropertyStyle.No3 .Property #Area .Value:before { background-position: top -48px center }
.PropertyStyle.No3 .Property #PropertyTypeId { display: none }
.PropertyStyle.No3 .Property #Location { display: none }
.PropertyStyle.No3 .Property #PriceSell,
.PropertyStyle.No3 .Property #RentPrice { font-weight: 600; font-size: 20px; padding: 0px; line-height: 32px; }
/*All Property
===============================================================================*/
.PropertyStyle4 .Property {
display: inline-block;
vertical-align: top;
position: relative;
margin-left: 5%;
font-size: 14px;
width: calc((100% - 10%) / 3);
}
.PropertyStyle4 .Property:nth-of-type(4n+1) { margin-left: 5% }
.PropertyStyle4 .Property:nth-of-type(3n+1) { margin-left: 0% }
.PropertyStyle4 .Property:nth-of-type(n+4) { margin-top: 20px }
/* Property info
---------------------------------------*/
.PropertyStyle4 .Property .PropertyInfo { position: relative; padding: 0px; border: 0px; background: #fff; z-index: 1}
.PropertyStyle4 .Property .PropertyInfo .Title { margin: 0px }
.PropertyStyle4 .Property .PropertyInfo .Title h3 { z-index: 1; padding: 10px 0px 10px 0px; font-size:16px; font-weight: 400 }
.PropertyStyle4 .Property .PropertyInfo .Title h3 a { color: #111 }
.PropertyStyle4 .Property .PropertyInfo .Title .Ref,
.PropertyStyle4 .Property .PropertyInfo .Title .DispayListingId,
.PropertyStyle4 .Property .divLinkToPropertyDetail { display: none }
.PropertyStyle4 .Property .PropertyInfo li { border: 0px }
.PropertyStyle4 .Property .PropertyInfo li:nth-of-type(n+2) { display: inline-block; line-height: 30px; padding: 0px; margin-top: 5px }
.PropertyStyle4 .Property .PropertyInfo li .Value { float: none }
.PropertyStyle4 .Property #PriceSell,
.PropertyStyle4 .Property #RentPrice { color: #111; font-weight: 700; font-size: 20px; padding: 0px 12px 4px 0px; line-height: 40px; border-bottom: 1px solid #f5f5f5}
.PropertyStyle4 .Property #PriceSell .Ovlist,
.PropertyStyle4 .Property #RentPrice .Ovlist { display: none }
.PropertyStyle4 .Property #PriceSell+#RentPrice .Ovlist { display: inline-block }
.PropertyStyle4 .Property #PriceSell+#RentPrice { left: calc(33% + 0px); }
.PropertyStyle4 .Property #PropertyTypeId,
.PropertyStyle4 .Property #Bedroom,
.PropertyStyle4 .Property #LandSize,
.PropertyStyle4 .Property #LivingAreaSize { line-height: 40px; float: left; position: absolute; bottom: 100%; margin-top: 0px; color: #fff }
.PropertyStyle4 .Property #PropertyTypeId { left: 15px;}
.PropertyStyle4 .Property #Bedroom { right: 120px }
.PropertyStyle4 .Property #LandSize,
.PropertyStyle4 .Property #LivingAreaSize { right: 15px }
.PropertyStyle4 .Property #Location .Value:before { content: ", " }
.PropertyStyle4 .PropertyInfo #PropertyTypeId .Ovlist,
.PropertyStyle4 .Property #Location .Ovlist,
.PropertyStyle4 .Property #Area .Ovlist,
.PropertyStyle4 .PropertyInfo #Bedroom .Ovlist,
.PropertyStyle4 .PropertyInfo #LandSize .Ovlist,
.PropertyStyle4 .PropertyInfo #LivingAreaSize .Ovlist
{ display: none }
.PropertyStyle4 .Property #Area .Value:before,
.PropertyStyle4 .PropertyInfo #Bedroom .Value:before,
.PropertyStyle4 .PropertyInfo #LandSize .Value:before,
.PropertyStyle4 .PropertyInfo #LivingAreaSize .Value:before {
content: "";
display: inline-block;
margin-right: 7px;
width: 30px;
height: 30px;
background: url(/Content/Archive/472/status-239807.png) no-repeat top -30px center;
background-size: 30px;
vertical-align: top;
}
.PropertyStyle4 .Property #Area .Value:before { width: 12px }
.PropertyStyle4 .Property #Location .Value:before { margin-top: 5px; background-position: top -30px center }
.PropertyStyle4 .Property #Bedroom .Value:before { margin-top: 5px; background-position: top -60px center }
.PropertyStyle4 .Property #LandSize .Value:before,
.PropertyStyle4 .Property #LivingAreaSize .Value:before { margin-top: 5px; background-position: top -120px center }
/* Style 5
===============================================================================*/
.PropertyStyle5 .Property {
display: inline-block;
vertical-align: top;
position: relative;
margin-left: 3%;
font-size: 14px;
width: calc((100% - 6%) / 3);
box-shadow: 0px 0px 12px rgba(0,0,0,0.2)
}
.PropertyStyle5 .Property:nth-of-type(4n+1) { margin-left: 3% }
.PropertyStyle5 .Property:nth-of-type(3n+1) { margin-left: 0% }
.PropertyStyle5 .Property:nth-of-type(n+4) { margin-top: 20px }
/* Property info
---------------------------------------*/
.PropertyStyle5 .Property .PropertyInfo { position: relative; padding: 57px 24px 20px; border: 0px; background: #fff; z-index: 1}
.PropertyStyle5 .Property .PropertyInfo .Title { margin: 0px; border-top: 1px solid #CDCED2 }
.PropertyStyle5 .Property .PropertyInfo .Title h3 { z-index: 1; padding: 10px 0px 10px 0px; font-size:14px; font-family: inherit }
.PropertyStyle5 .Property .PropertyInfo .Title .Ref,
.PropertyStyle5 .Property .PropertyInfo .Title .DispayListingId,
.PropertyStyle5 .Property .divLinkToPropertyDetail { display: none }
.PropertyStyle5 .Property .PropertyInfo li { border: 0px }
.PropertyStyle5 .Property .PropertyInfo li:nth-of-type(n+2) { display: inline-block; padding: 0px; margin-top: 5px }
.PropertyStyle5 .Property .PropertyInfo li .Value { float: none; vertical-align: top }
.PropertyStyle5 .Property #PriceSell,
.PropertyStyle5 .Property #RentPrice { color: #111; font-size: 14px; padding: 0px; }
.PropertyStyle5 .Property #PriceSell .Value, .Property #RentPrice .Value { line-height: 1 }
.PropertyStyle5 .Property #PriceSell .Ovlist, #RentPrice .Ovlist { display: inline-block; margin-right: 8px }
.PropertyStyle5 .Property #PriceSell+#RentPrice { left: calc(33% + 0px); }
.PropertyStyle5 .Property #Location,
.PropertyStyle5 .Property #Bedroom,
.PropertyStyle5 .Property #LandSize,
.PropertyStyle5 .Property #LivingAreaSize { line-height: 19px; float: left; position: absolute; top: 27px; margin-top: 0px; }
.PropertyStyle5 .Property #Area,
.PropertyStyle5 .Property #PropertyTypeId { display: none}
.PropertyStyle5 .Property #Bedroom { left: 24px }
.PropertyStyle5 .Property #LandSize,
.PropertyStyle5 .Property #LivingAreaSize { left: 86px }
.PropertyStyle5 .Property #Location { left: 190px }
.PropertyStyle5 .PropertyInfo #PropertyTypeId .Ovlist,
.PropertyStyle5 .Property #Location .Ovlist,
.PropertyStyle5 .Property #Area .Ovlist,
.PropertyStyle5 .PropertyInfo #Bedroom .Ovlist,
.PropertyStyle5 .PropertyInfo #LandSize .Ovlist,
.PropertyStyle5 .PropertyInfo #LivingAreaSize .Ovlist
{ display: none }
.PropertyStyle5 .Property #Location .Value:before,
.PropertyStyle5 .PropertyInfo #Bedroom .Value:before,
.PropertyStyle5 .PropertyInfo #LandSize .Value:before,
.PropertyStyle5 .PropertyInfo #LivingAreaSize .Value:before {
content: "";
display: inline-block;
margin-right: 7px;
width: 25px;
height: 19px;
background: url(/Content/Archive/406/property-icons-315436.png) no-repeat top 0px center;
background-size: 25px;
vertical-align: bottom;
margin-bottom: 1px
}
.PropertyStyle5 .Property #Area .Value:before { width: 25px }
.PropertyStyle5 .Property #Location .Value:before { background-position: top -38px center }
.PropertyStyle5 .Property #LandSize .Value:before,
.PropertyStyle5 .Property #LivingAreaSize .Value:before { background-position: top -19px center }
.m .PropertyStyle5 .Property { width: 100%; margin-left: 0px }
.m .PropertyStyle5 .Property .PropertyInfo { padding: 87px 15px 20px; }
.m .PropertyStyle5 .Property #Bedroom { left: 15px }
.m .PropertyStyle5 .Property #LandSize,
.m .PropertyStyle5 .Property #LivingAreaSize { left: 15px; top: 58px }
.m .PropertyStyle5 .Property #Location { left: 40%; }
.m .PropertyStyle5 .Property #PriceSell+#RentPrice { display: block }
/* List Style 6
===============================================================================*/
.PropertyStyle6 .Property {
display: inline-block;
vertical-align: top;
position: relative;
margin-left: 5%;
font-size: 14px;
width: calc((100% - 10%) / 3);
}
.PropertyStyle6 .Property:nth-of-type(4n+1) { margin-left: 5% }
.PropertyStyle6 .Property:nth-of-type(3n+1) { margin-left: 0% }
.PropertyStyle6 .Property:nth-of-type(n+4) { margin-top: 20px }
/* Property info
---------------------------------------*/
.PropertyStyle6 .Property .PropertyImage a { background-size: cover; background-position: center center }
.PropertyStyle6 .Property .PropertyImage img { display: none }
.PropertyStyle6 .Property .PropertyInfo { position: relative; padding: 50px 0px 0px; border: 0px; background: #fff; z-index: 1}
.PropertyStyle6 .Property .PropertyInfo > h3,
.PropertyStyle6 .Property .PropertyInfo .Title { margin: 0px; position: static }
.PropertyStyle6 .Property .PropertyInfo > h3,
.PropertyStyle6 .Property .PropertyInfo .Title h3 { z-index: 1; padding: 10px 0px 4px 0px; font-size:15px; font-weight: 700; border-top: 1px solid #e4e4e4 }
.PropertyStyle6 .Property .PropertyInfo .Title h3 a { color: #111 }
.PropertyStyle6 .Property .PropertyInfo .Title .DispayListingId,
.PropertyStyle6 .Property .divLinkToPropertyDetail { display: none }
.PropertyStyle6 .Property .PropertyInfo li { border: 0px }
.PropertyStyle6 .Property .PropertyInfo li .Value { float: none; font-size: 14px }
.PropertyStyle6 .Property #PriceSell,
.PropertyStyle6 .Property #RentPrice,
.PropertyStyle6 .Property .PropertyPrice { color: #111; font-weight: 700; font-size: 20px; padding: 0px 12px 4px 0px}
.PropertyStyle6 .Property #PriceSell .Ovlist,
.PropertyStyle6 .Property #RentPrice .Ovlist { font-size: 14px; font-weight: normal; color: #a0a0a0 }
.PropertyStyle6 .Property #PriceSell+#RentPrice .Ovlist { display: inline-block }
.PropertyStyle6 .Property #PriceSell+#RentPrice { left: calc(33% + 0px); }
.PropertyStyle6 .Property .PropertyArea,
.PropertyStyle6 .Property #Area,
.PropertyStyle6 .Property .PropertyBedroom,
.PropertyStyle6 .Property #Bedroom,
.PropertyStyle6 .Property .PropertyLivingAreaSize,
.PropertyStyle6 .Property #LandSize,
.PropertyStyle6 .Property #LivingAreaSize { line-height: 50px; position: absolute; top: 0px; margin-top: 0px; padding: 0px }
.PropertyStyle6 .Property .PropertyType,
.PropertyStyle6 .Property #PropertyTypeId { line-height: 24px; position: absolute; bottom: calc(100% + 12px); margin-top: 0px; right: 15px; color: #fff; background: rgba(0,0,0,0.8); padding: 0px 12px }
.PropertyStyle6 .Property .PropertyInfo .PropertyCode { position: absolute }
.PropertyStyle6 .Property .PropertyInfo .PropertyCode,
.PropertyStyle6 .Property .PropertyInfo .Title .Ref a { width: auto; padding: 0px 12px; margin-left: 12px; bottom: calc(100% + 12px); background: rgba(0,0,0,0.8); color: #fff; line-height: 24px; font-size: 13px }
.PropertyStyle6 .Property .PropertyBedroom,
.PropertyStyle6 .Property #Bedroom { right: 110px }
.PropertyStyle6 .Property .PropertyLivingAreaSize,
.PropertyStyle6 .Property #LandSize,
.PropertyStyle6 .Property #LivingAreaSize { right: 0px }
.PropertyStyle6 .Property #Location { display: none }
.PropertyStyle6 .Property .PropertyType .Ovlist,
.PropertyStyle6 .PropertyInfo #PropertyTypeId .Ovlist,
.PropertyStyle6 .Property #Area .Ovlist,
.PropertyStyle6 .Property .PropertyArea .Ovlist,
.PropertyStyle6 .Property .PropertyBedroom .Ovlist,
.PropertyStyle6 .PropertyInfo #Bedroom .Ovlist,
.PropertyStyle6 .Property .PropertyLivingAreaSize .Ovlist,
.PropertyStyle6 .PropertyInfo #LandSize .Ovlist,
.PropertyStyle6 .PropertyInfo #LivingAreaSize .Ovlist
{ display: none }
.PropertyStyle6 .Property .PropertyArea:before,
.PropertyStyle6 .Property #Area .Value:before,
.PropertyStyle6 .Property .PropertyBedroom:before,
.PropertyStyle6 .PropertyInfo #Bedroom .Value:before,
.PropertyStyle6 .Property .PropertyLivingAreaSize:before,
.PropertyStyle6 .PropertyInfo #LandSize .Value:before,
.PropertyStyle6 .PropertyInfo #LivingAreaSize .Value:before {
content: "";
display: inline-block;
margin-right: 7px;
width: 21px;
height: 17px;
background: url(/Content/Archive/1/PropertyListIcons6-411077.png) no-repeat top 0px center;
background-size: 21px;
vertical-align: top;
margin-top: 16px;
}
.PropertyStyle6 .Property #Area .Value:before { width: 21px; }
.PropertyStyle6 .Property .PropertyBedroom:before,
.PropertyStyle6 .Property #Bedroom .Value:before { background-position: top -17px center; }
.PropertyStyle6 .Property .PropertyLivingAreaSize:before,
.PropertyStyle6 .Property #LandSize .Value:before,
.PropertyStyle6 .Property #LivingAreaSize .Value:before { background-position: top -34px center }
/* List Style 15
===============================================================================*/
.PropertyStyle.No15 .Ref,
.PropertyStyle.No15 .divLinkToPropertyDetail { display: none }
.PropertyStyle.No15 .Property { width: 30%; margin-left: 5%; margin-bottom: 0px }
.PropertyStyle.No15 .Property:nth-of-type(3n+1) { margin-left: 0px }
.PropertyStyle.No15 .Property:nth-of-type(n+4) { margin-top: 40px }
/*-- image --*/
.PropertyStyle.No15 .Property .PropertyImage { position: absolute; width: 100%; }
.PropertyStyle.No15 .Property .PropertyImage a { padding-top: 100%; border-radius: 0px; background: #000 }
.PropertyStyle.No15 .Property .PropertyImage img { max-width: none; height: 100%; left: 50%; transform: translate(-50%); }
.PropertyStyle.No15 .Property:hover img { opacity: 0.5; transition: all 0.2s }
/*-- info --*/
.PropertyStyle.No15 .Property .PropertyInfo { border: 0px; padding: 0px; position: relative; color: #fff; background: none; z-index: 1 }
.PropertyStyle.No15 .Property .PropertyInfo .Title { margin: 0px;}
.PropertyStyle.No15 .Property .PropertyInfo h3 { text-align: center; font-size: 18px; padding: 0px; font-weight: 500; }
.PropertyStyle.No15 .Property .PropertyInfo h3 a { color: #000; padding-top: calc(100% + 20px); display: block; }
.PropertyStyle.No15 .Property .PropertyInfo > ul {position: absolute;top: 0px; bottom: auto; padding: 20px;}
.PropertyStyle.No15 .Property .PropertyInfo > ul > li { opacity: 0; padding: 8px 0px; border-color: rgba(255,255,255,0.25); font-size: 16px; transition: all 0.2s }
.PropertyStyle.No15 .Property .PropertyInfo > ul > li:nth-child(2) { padding-top: 12%; border: 0px }
.PropertyStyle.No15 .Property:hover .PropertyInfo > ul > li { opacity: 1; }
/*-- Price and Price type --*/
.PropertyStyle.No15 .Property .PropertyInfo > ul > li:first-child { opacity: 1; position: absolute; left: 0px; top: 0px; padding: 100% 0px 0px; width: 100% }
.PropertyStyle.No15 .Property .PropertyInfo > ul > li:first-child .Ovlist {
padding: 8px 50px 8px 20px;
font-size: 14px;
font-weight: 500;
position: absolute;
bottom: 50px;
left: 0px;
color: #fff;
text-transform: uppercase;
background: linear-gradient(45deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.0) 70%)
}
.PropertyStyle.No15 .Property .PropertyInfo > ul > li#RentPrice .Ovlist { color: #A9FF70 }
.PropertyStyle.No15 .Property .PropertyInfo > ul > li#PriceSell .Ovlist { color: #f90 }
.PropertyStyle.No15 .Property .PropertyInfo > ul > li:first-child .Value {
font-weight: 300;
padding: 0px 20px;
display: block;
float: none;
position: absolute;
left: 0%;
bottom: 0px;
width: 100%;
border-radius: 50%;
line-height: 50px;
font-size: 20px;
color: #fff;
}
.PropertyFindResults { float: left; width: 35%; padding: 0px 20px 20px }
.PropertyStyle.No15 .PropertyFindResults:not(.ListView) .Property { width: 47.5%; margin-left: 5%; margin-bottom: 0px }
.PropertyStyle.No15 .PropertyFindResults:not(.ListView) .Property:nth-of-type(2n+1) { margin-left: 0px }
.PropertyStyle.No15 .PropertyFindResults:not(.ListView) .Property:nth-of-type(n+3) { margin-top: 40px }
/* property detail set 3
===============================================================================*/
.PropertyDetailNo3 .Title h2 { padding-bottom: 8px }
.PropertyDetailNo3 .PropertyDetailUnit { float: none; width: 100% }
.PropertyDetailNo3 .PropertyDetailUnit > div { display: inline-block; width: auto; padding-right: 50px }
/* Property Tag Search
===============================================================================*/
.PropertyFind { height: auto !important }
.PropertyFindResults { float: left; width: 35% !important; padding: 20px; height: 100vh; overflow: auto }
.PropertyFindResults.ListView { padding: 20px 0px; overflow: visible; float: none }
.PropertyFindMap { float: right; width: 65%; height: 100vh }
.PropertyFindResults.ListView + .PropertyFindMap { display: none }
.PropertyFindPanel { background: #f7f7f7 }
.PropertyFindPanel > div { max-width: 1200px; margin: auto; padding: 10px 0px; position: relative; z-index: 10 }
.PropertyTagSearch { display: inline-block }
.PropertyTagSearchForm > * { display: inline-block; width: auto }
.PropertyTagSearchPanel { width: 475px }
.PropertyTagSearchForm select { width: 140px }
.PropertyTagAdvance { position: absolute; top: 100%; width: 100%; padding: 20px; background: #ccc }
.PropertyTagAdvance > *:nth-of-type(n) { display: inline-block; vertical-align: top;width: 15% }
.PropertyTagAdvance .LivingSizeSlide { width: 50%; position: relative; padding-left: 14px }
.PropertyTagAdvance .LivingSizeSlide > div:first-child { font-weight: bold; width: 120px; position: absolute; top: 0px; left: 0px; right: 0px; margin: auto }
.PropertyTagAdvance .LivingSizeSlide .SearchSliderBox p { margin: 0px; margin-bottom: 6px }
/**/
.property-details .flexslider .flex-viewport img {
max-width: 960px;
max-height: 540px;
width: auto;
margin: auto
}
.property-details .flexslider li {
position: relative
}
.property-details .flexslider .flex-caption {
position: absolute;
margin: 0;
width: 100%
}
.property-details #f2 li > div {
padding-top: 75%
}