/* Property Search Form Styles */ #property-search { padding: 0%; width: 100%; background-color: #f3f3f3; user-select: none; -webkit-user-select: none; -moz-user-select: none; -webkit-touch-callout: none; } #property-search div.search { padding: 30px 0% 36px 0%; background-color: var(--dark-green); margin: 0 0 2rem; } #property-search div.search div.offset { margin: 0% auto; padding: 0 24px; width: 100%; max-width: 1500px; } #property-search div.field-column { display: flex; width: 100%; max-width: 180px; margin-right: 2.5%; align-items: end; } #property-search div.field-column label { width: 100%; } #property-search span.field-label { margin: 0% 0% 8px 1px; font-size: 1em; line-height: 1.5em; display: block; color: #FFFFFF; } #property-search input[type=text] { padding: 7px 12px 6px 12px; width: 100%; font-size: 0.75rem; line-height: 1.5em; color: #333333; background-color: #FFFFFF; border: none; border-radius: 4px; -webkit-appearance: none; } #property-search div.custom-select { width: 100%; font-size: 1em; line-height: 1.5em; display: inline-block; vertical-align: middle; position: relative; color: var(--black); background-color: #FFF; border-radius: 4px; overflow: hidden; transition: background-color 0.3s ease; -webkit-transition: background-color 0.3s ease; -moz-transition: background-color 0.3s ease; } #property-search div.custom-select:after { padding: 6px 13px 4px 8px; top: 0px; right: 0px; content: '\f078'; font-family: 'Font Awesome 5 Pro'; font-size: 0.875em; line-height: 1.5em; position: absolute; } #property-search div.custom-select select { padding: 5px 32px 2px 12px; width: 100%; font-size: 0.75rem; position: relative; background-color: transparent; border: 0px; white-space: nowrap; text-overflow: ellipsis; -webkit-appearance: none; z-index: 10; } #property-search div.custom-select:hover select { cursor: pointer; } #property-search form.properties { width: 100%; display: flex; align-items: end; flex-wrap: wrap; } #property-search form.properties div.buttons { width: 20%; display: flex; margin-left: 2%; align-items: end; } /* #property-search form.properties div.buttons div { margin-left: 8%; } */ #property-search form.properties div.buttons a.button { min-width: 120px; } #property-search form.properties div.buttons .button.open_additonal_search { background-color: transparent; border: none; min-width: 140px; color: var(--light-green); } #property-search form.properties div.buttons .button.open_additonal_search:hover { color: #FFF; } #property-search form.properties div.buttons .button.clear_search_filters { background-color: transparent; border: none; min-width: 40px; padding: 8px 0; font-size: 1.25rem; color: var(--light-green); } #property-search form.properties div.buttons .button.clear_search_filters:hover { color: #FFF; } #property-search form.properties div.search_fields { width: calc(98% - 291px); display: flex; justify-content: left; align-items: end; } #property-search form.properties div.search_fields div.field-column { width: 100%; overflow: hidden; } #property-search div.field-column.must-haves { display: flex; max-width: 1300px; width: 100%; position: relative; transition: all ease 300ms; height: 0; overflow: hidden; } #property-search div.field-column.must-haves .wrapper { max-width: 1300px; display: flex; align-items: start; margin-right: 0; margin-top: 1rem; position: absolute; top: 0; } #property-search div.field-column.must-haves .field-label { margin: 0 8px 8px 0; min-width: 100px; } #property-search div.field-column.price-max .field-label { visibility: hidden; } #property-search div.field-column .wrapper { width: 100%; } #property-search div.field-column.must-haves .options { } #property-search div.field-column.must-haves .options label { padding: 0 0.5rem 0.5rem; margin: 0px 10px 0 0; color: #FFF; font-size: 0.875rem; display: inline-flex; width: auto; } #property-search div.field-column.must-haves .options label input { margin-left: 0.75rem; } #property-search form.properties div.search_fields .field-column:last-of-type { margin-right: 0; } #property-search form.properties div.additional_search_fields { margin: 1rem 0 0; width: 100%; } #property-search form.properties .mobile-additional { transition: height ease 300ms; } #property-search form.properties .mobile-additional .wrapper { width: 100%; } #property-search form.properties .must-haves-active { width: 100%; padding: 0.5rem 0 0; } #property-search form.properties .must-haves-active .option { display: inline-block; padding: 0 0.5rem; color: #FFF; border: 1px solid; border-radius: 8px; font-size: 0.875rem; margin: 10px 10px 0 0; } #property-search form.properties .must-haves-active .option > span { margin-right: 0.25rem; } #property-search form.properties div.search { padding: 0; margin: 0; } #property-search form.properties span.white { min-width: 100px; margin: 0 1rem 0.25rem; color: #FFF; } #property-search form.properties button[type=submit] { padding: 11px 30px; background-color: var(--light-green); color: var(--green); font-size: 1.125rem; border-radius: 6px; } #property-search h1 { margin: 0.8em 0% 0.4em 0%; font-family: 'Poppins', sans-serif; font-size: 1.875em; line-height: 1.2em; font-weight: 400; } #property-search h2 { margin: 0.8em 0% 0.4em 0%; font-family: 'Poppins', sans-serif; font-size: 1.25em; line-height: 1.2em; font-weight: 400; } /* Property Search Filters Styles */ #property-search div.results-orders { padding: 8px 0% 12px 0%; background-color: var(--light-grey); } #property-search div.results-orders div.offset { display: flex; } #property-search div.results-orders p { margin: 0%; font-size: 0.875em; line-height: 1.5em; color: #FFFFFF; } #property-search div.results-orders span.results, #property-search div.results-orders span.location { font-weight: 700; } #property-search div.results-orders div.field-column { display: flex; align-items: center; max-width: 181px; } #property-search div.results-orders div.field-column label { display: flex; justify-content: right; align-items: center; } #property-search div.results-orders span.field-label { margin: 0% 14px 0% 0%; font-size: 0.875em; line-height: 1em; display: inline-block; vertical-align: middle; color: var(--black); } #property-search div.results-orders div.custom-select { background-color: transparent; border: 0px; } #property-search div.results-orders div.custom-select select { padding: 5px 32px 2px 12px; } #property-search div.results-orders div.custom-select select::-ms-expand { display: none; } #property-search div.results-orders input[type=checkbox] { width: 21px; height: 21px; min-width: 21px; display: inline-block; vertical-align: middle; position: relative; background-color: transparent; border: 1px solid var(--black); border-radius: 4px; transition: background-color 0.3s ease; -webkit-transition: background-color 0.3s ease; -moz-transition: background-color 0.3s ease; -webkit-appearance: none; } #property-search div.results-orders input[type=checkbox]:checked:after { top: 2px; left: 3px; content: '\f00c'; font-family: 'Font Awesome 5 Pro'; font-size: 0.875em; position: absolute; color: var(--black); } #property-search div.results-orders div.field-column.map { margin: 0% 22px 0% 0%; } #property-search div.results-orders div.field-column.map label { cursor: pointer; } #property-search div.results-orders div.field-column.map input { cursor: pointer; } #property-search div.results-orders div.field-column.sold { margin: 0% 10px 0% 0%; } #property-search div.results-orders div.field-column.sold label { cursor: pointer; } #property-search div.results-orders div.field-column.sold input { cursor: pointer; } #property-search div.results-orders div.column { width: 40%; text-align: left; } #property-search div.results-orders div.column:last-of-type { padding: 0% 36px 0% 0%; width: 60%; text-align: right; display: flex; justify-content: right; } #property-search div.results-orders h3 { font-size: 1rem; margin: 0; } /* Property Search Form Collapsing Element Styles */ #property-search div.search.expand { padding: 0%; max-height: 24px; position: relative; display: block; visibility: hidden; overflow-y: hidden; transition: all 0.75s ease; -webkit-transition: all 0.75s ease; -moz-transition: all 0.75s ease; } #property-search div.search.expand div.heading, #property-search div.search.expand form.properties { opacity: 0; transition: opacity 0.5s ease; -webkit-transition: opacity 0.5s ease; -moz-transition: opacity 0.5s ease; } #property-search div.search.expand button.expand-section { padding: 3px 0%; min-width: 0px; right: 9px; font-size: 0.75em; display: inline-block; position: absolute; color: #FFFFFF; background-color: transparent; visibility: visible; } #property-search div.search.expand button.collapse-section { padding: 3px 0%; min-width: 0px; right: 9px; font-size: 1em; display: none; position: absolute; color: #FFFFFF; background-color: transparent; visibility: visible; } #property-search div.search.expand div.offset { padding: 0% 92px; max-width: 1280px; } #property-search div.search.expand.open { padding: 34px 0% 49px 0%; max-height: 206px; visibility: visible; } #property-search div.search.expand.open div.heading, #property-search div.search.expand.open form.properties { opacity: 1; } #property-search div.search.expand.open button.expand-section { display: none; } #property-search div.search.expand.open button.collapse-section { display: inline-block; } /* Property Breadcrumb/Action Styles */ #property-search div.property-detail div.column { padding: 4px 0% 0% 25px; } #property-search div.property-detail div.actions { padding: 1px 5px 0% 0%; } #property-search div.property-detail div.actions div.direction-container { display: inline-block; } #property-search div.property-detail div.actions a.button { margin: 0% 0% 0% 14px; padding: 8px 8px 7px 8px; font-size: 0.875em; line-height: 1em; color: #FFFFFF; background-color: transparent; } #property-search div.property-detail div.actions a.back-to-listing { margin: 0% 24px 0% 0%; } #property-search div.property-detail div.actions a.next:after { margin: 0% 0% 0% 10px; content: '\f054'; font-family: 'Font Awesome 5 Pro', sans-serif; display: inline-block; vertical-align: -1px; } #property-search div.property-detail div.actions a.previous:before { margin: 0% 10px 0% 0%; content: '\f053'; font-family: 'Font Awesome 5 Pro', sans-serif; display: inline-block; vertical-align: -1px; } #property-search div.property-detail div.actions a.back-to-listing:before { margin: 0% 14px 0% 0%; content: '\f323'; font-family: 'Font Awesome 5 Pro', sans-serif; display: inline-block; vertical-align: -1px; } #property-search div.property-detail div.actions a.button:hover { background-color: #616161; } /* Save Search Styles */ #property-search div.save_search_container { display: flex; justify-content: flex-end; } #property-search div.save_search_container button { padding: 0.25em 0.5em; min-width: 0px; font-size: 1em; line-height: 1.5em; color: #FFFFFF; background-color: #C97900; border: 0px; border-radius: 4px; transition: background-color 0.3s ease; -webkit-transition: background-color 0.3s ease; -moz-transition: background-color 0.3s ease; -webkit-appearance: none; } div.popup-panel.saveSearchPopup a { text-decoration: underline; } div.popup-panel.saveSearchPopup form[name=save_preference_popup] label { display: inline-block; margin-bottom: 0.25em; } div.popup-panel.saveSearchPopup form[name=save_preference_popup] input { padding: 8px 12px; font-size: 1em; line-height: 1.25em; border: 1px solid #CCCCCC; border-radius: 4px; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; width: 100%; } div.popup-panel.saveSearchPopup form[name=save_preference_popup] button { margin-top: 0.5em; } div.popup-panel.saveSearchPopup form[name=save_preference_popup] .error-message { color: red; font-size: 0.875em; } div.popup-panel.saveSearchPopup form[name=save_preference_popup] .field-error { border-color: red; } #property-search .properties_map { position: relative; background-color: #f3f3f3; } #property-search .properties_map .map_container_search { overflow: hidden; height: 600px; transition: height 300ms ease; max-width: 1350px; margin: auto; } #property-search .properties_map #map_loader { top: 0; display: flex; position: absolute; justify-content: center; align-items: center; height: 100%; width: 100%; z-index: 10000000000; background-color: rgb(255,255,255,0.5); max-width: 1350px; overflow: hidden; } #property-search #map { height: 600px; transition: height 300ms ease; } #property-search #map div.marker-popup .strikethrough { position: relative; font-size: 0.875em; color: #766e6f; margin-right: 0.5rem; display: inline-block; } #property-search #map div.marker-popup .strikethrough::before { position: absolute; content: ""; left: 0; top: 50%; right: 0; border-top: 1px solid; border-color: inherit; -webkit-transform: rotate(-12deg); -moz-transform: rotate(-12deg); -ms-transform: rotate(-12deg); -o-transform: rotate(-12deg); transform: rotate(-12deg); color: #766e6f; } #property-search #map .size.sale span.price { color: #f28f3b; } /* Breadcrumb */ #property-search .breadcrumb { display: flex; justify-content: right; background-color: var(--light-grey); color: var(--light-grey-text); text-align: right; padding: 1rem 0; font-size: 0.875rem; } #property-search .breadcrumb.listing div.offset { max-width: 1500px; } #property-search .breadcrumb a { color: var(--light-grey-text); } #property-search .breadcrumb a:hover { color: var(--light-green); } /* Map Popup Styles */ #property-search .leaflet-popup-content { margin: 0px; min-width: 175px; position: relative; overflow: hidden; } #property-search .leaflet-popup-content .image_container .image_dimensions { border-top-right-radius: 8px; border-top-left-radius: 8px; } #property-search .leaflet-popup-content .image_container { padding-top: 75%; } #property-search .leaflet-popup-content .details { padding: 5px 1px 0; } #property-search .leaflet-popup-content .details h3 { margin: 0 0 0.25rem; } #property-search .leaflet-popup-content .details a.more { width: 100%; padding: 6px 10px; margin: 5px 0 0; } #property-search .leaflet-popup-content .details .hold { margin-left: 0.25rem; color: var(--light-grey-text-alt); font-size: 12px; } #property-search .leaflet-popup-content .details .size { font-size: 14px; } #property-search .leaflet-popup-content .details .offers { font-size: 14px; font-weight: 600; } #property-search .leaflet-popup-content .marker-popup { padding: 5px; } #property-search .leaflet-popup-content .marker-popup .ribbon { position: absolute; z-index: 1; left: 0; top: 0px; background-color: #b12d2d; width: 100%; color: #FFF; text-align: center; height: 27px; line-height: 1.75rem; border-top-left-radius: 10px; border-top-right-radius: 10px; } #property-search .leaflet-container a.leaflet-popup-close-button { top: 4px; right: 4px; color: #FFF; font-size:22px; z-index: 2; } #property-search .leaflet-popup-content-wrapper, .leaflet-popup-tip { color: var(--black); font-family:'Poppins', sans-serif; } #property-search h1 .orange { color: #f28f3b; } #property-search h1 .sale_message { display: block; font-size: 1.25rem; color: #f28f3b; } @media only screen and (min-width: 0px) and (max-width: 1500px) { #property-search form.properties div.buttons { width: 100%; justify-content: center; margin-top: 1rem; order: 1; z-index: 2; } #property-search form.properties div.buttons div { margin-left: 2rem; } #property-search form.properties div.search_fields { width: 100%; } } /* 1200px Resolution Specific Styles */ @media only screen and (min-width: 0px) and (max-width: 1200px) { /* Property Search Form Styles */ #property-search div.search div.offset { padding: 0% 18px; } #property-search div.search.expand div.offset { padding: 0% 18px; } /* 900px Resolution Specific Styles */ } @media only screen and (min-width: 0px) and (max-width: 900px) { /* Property Search Form Styles */ #property-search div.search div.offset { padding: 0% 24px; } #property-search div.search.expand div.offset { padding: 0% 24px; } /* Property Search Filters Styles */ #property-search div.results-orders { padding: 10px 0%; } #property-search div.results-orders div.offset { padding: 0% 24px; } #property-search div.results-orders div.column { padding: 1px 0% 0% 0%; } #property-search div.results-orders div.column:last-of-type { padding: 0% 0% 0% 0%; } /* Property Search Form Collapsing Element Styles */ #property-search div.search.expand.open { padding: 30px 0% 36px 0%; max-height: 186px; } /* 800px Resolution Specific Styles */ } @media only screen and (min-width: 0px) and (max-width: 800px) { /* Property Search Form Styles */ #property-search div.search div.offset { padding: 0% 18px; } #property-search form.properties div.search_fields { flex-wrap: wrap; justify-content: left; } #property-search form.properties div.search_fields .field-column { width: 47.5%; max-width: 800px; margin-right: 0; } #property-search form.properties div.search_fields .mobile-hidden { display: none; } #property-search span.field-label { margin: 4px 0% 8px 1px; } #property-search div.field-column.price-max .field-label { height: 2px; } /* Property Search Filters Styles */ #property-search div.results-orders div.offset { padding: 0% 18px; } /* Property Breadcrumb/Action Styles */ #property-search div.property-detail div.column { width: 100%; } #property-search div.property-detail div.column:first-of-type { display: none; } #property-search div.property-detail div.column:last-of-type { width: 100%; } #property-search div.property-detail div.breadcrumb { display: none; } /* Property Search Form Collapsing Element Mobile Styles */ #property-search div.search.expand { max-height: 34px; } #property-search div.search.expand button.expand-section { padding: 6px 0%; right: 18px; font-size: 0.875em; } #property-search div.search.expand button.expand-section:before { margin: 0% 12px 0% 0%; content: 'Search'; font-family: 'Lato', sans-serif; display: inline-block; vertical-align: 1px; } #property-search div.search.expand button.collapse-section { padding: 6px 0%; right: 18px; font-size: 1em; } /* 600px Resolution Specific Styles */ } @media only screen and (min-width: 0px) and (max-width: 600px) { /* Property Search Form Mobile Styles */ #property-search form.properties div.search_fields .field-column { width: 100%; min-width: 0; margin-right: 0; } /* #property-search span.field-label { margin: 0% 0% 6px 1px; } #property-search form.properties div.location { margin: 0% 0% 16px 0%; padding: 0%; width: 100%; } #property-search form.properties div.region { margin: 0%; padding: 0% 12px 0% 0%; width: 50%; } #property-search form.properties div.type { margin: 0%; padding: 0% 0% 0% 12px; width: 50%; } #property-search form.properties div.price { margin: 16px 0% 0% 0%; padding: 0%; width: 100%; } #property-search form.properties div.search { width: 100%; max-width: 100%; } #property-search form.properties input[type=submit].icon { padding: 7px 0% 5px 0%; font-size: 1.125em; } */ /* Property Search Filters Mobile Styles */ #property-search div.results-orders { padding: 0; } #property-search div.results-orders .offset { flex-wrap: wrap; } #property-search div.results-orders p { font-size: 1em; } #property-search div.results-orders div.column { padding: 0% 0% 16px 0%; width: 100%; text-align: center; } #property-search div.results-orders div.column:last-of-type { padding: 0% 0% 0% 0%; width: 100%; text-align: center; flex-wrap: wrap; justify-content: center; } #property-search div.results-orders div.field-column { width: calc(50% - 15px); } #property-search div.results-orders div.field-column.map { margin: 0%; text-align: left; } #property-search div.results-orders div.field-column.sold { margin: 0% 15px; text-align: right; } #property-search div.results-orders div.field-column.sort { width: 75%; max-width: 175px; text-align: left; margin-top: 0.5rem; } /* Property Search Form Collapsing Element Mobile Styles */ #property-search div.search.expand.open { max-height: 413px; } #property-search form.properties .mobile-additional.mobile-no-height { height: 0; overflow: hidden; } #property-search form.properties .mobile-additional.mobile-no-height .wrapper { opacity: 0; } #property-search div.field-column.must-haves .wrapper { flex-wrap: wrap; } #property-search div.field-column.must-haves .wrapper .options { width: 100%; } /* 400px Resolution Specific Styles */ } @media only screen and (min-width: 0px) and (max-width: 400px) { /* Property Breadcrumb/Action Styles */ #property-search div.property-detail div.actions a.back-to-listing { margin: 0; } #property-search form.properties div.buttons .button.open_additonal_search { min-width: 100px; padding: 10px 5px; } #property-search form.properties div.buttons div { margin-left: 1rem; } }