.filter-block {
margin: 0 0 var(--space-xl) 0;
}
.filter-form {
background-color: var(--white);
padding: 30px;
display: flex;
align-items: stretch;
justify-content: space-between;
gap: 20px;
}
.filter-form .filter-grid {
width: 100%;
display: grid;
grid-template-columns: 1fr;
gap: 10px;
align-items: flex-start;
}
.filter-form .object-type,
.filter-form .category,
.filter-form .location,
.filter-form .price-area {
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-items: flex-start;
justify-content: flex-start;
gap: 15px 30px;
line-height: 48px;
border-radius: var(--border-radius);
padding: 0;
}
.filter-form .category {
flex-direction: row;
}
.filter-form .inputbox {
display: flex;
align-items: center;
gap: 12px;
height: 40px;
min-width: 160px;
}
.filter-form .price-area .inputbox {
flex-direction: row;
}
.filter-form .object-type label,
.filter-form .category label,
.filter-form .location label,
.filter-form .price-area label {
margin: 0;
display: flex;
align-items: center;
gap: 10px;
cursor: pointer;
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
line-height: 24px;
min-width: 120px;
}
.filter-form .object-type input[type="checkbox"],
.filter-form .category input[type="checkbox"],
.filter-form .location input[type="checkbox"] {
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 16px !important;
height: 16px !important;
padding: 0 !important;
background-color: var(--white);
border: 2px solid var(--white);
outline: 1px solid var(--grey-500);
border-radius: 0;
cursor: pointer;
transition: background-color 0.3s ease, border-color 0.3s ease;
}
.filter-form .object-type input[type="checkbox"]:hover,
.filter-form .category input[type="checkbox"]:hover,
.filter-form .location input[type="checkbox"]:hover {
background-color: var(--blue-600);
outline: 1px solid var(--blue-600);
}
.filter-form .object-type input[type="checkbox"]:focus,
.filter-form .category input[type="checkbox"]:focus,
.filter-form .location input[type="checkbox"]:focus {
outline: 2px solid var(--blue-600);
}
.filter-form .object-type input[type="checkbox"]:checked,
.filter-form .category input[type="checkbox"]:checked,
.filter-form .location input[type="checkbox"]:checked {
background-color: var(--blue-600);
border-color: var(--white);
outline: 1px solid var(--blue-600);
}
.filter-form .price-area input[type="number"] {
width: 120px;
padding: 0 10px;
background-color: var(--white);
border: 1px solid var(--grey-200);
border-radius: var(--border-radius-max);
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
line-height: 40px;
}
.filter-form .price-area input[type="number"]:hover,
.filter-form .price-area input[type="number"]:focus {
border: 1px solid var(--grey-500);
border-radius: var(--border-radius-max);
outline: 5px solid var(--blue-200);
}
.filter-checkbox {
display: none;
}
@media (max-width: 992px) {
.filter-toggle {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
user-select: none;
margin: 0;
padding: 10px 30px;
border-bottom: var(--border-size) solid var(--blue-200);
background-color: var(--white);
border-radius: var(--border-radius);
font-size: var(--body2-font-size);
font-weight: var(--bold-weight);
color: var(--grey-700);
}
.filter-checkbox:not(:checked) + .filter-toggle + .filter {
display: none;
}
.filter-checkbox:checked + .filter-toggle + .filter {
margin-top: 0;
padding: 0;
display: block;
}
.filter-toggle i {
font-size: 28px;
margin-left: 5px;
transition: transform 0.3s ease;
}
.filter-checkbox:checked + .filter-toggle i {
transform: rotate(180deg);
}
.filter-form .object-type,
.filter-form .category,
.filter-form .location,
.filter-form .price-area {
flex-direction: row;
}
}
@media (max-width: 767px) {
.filter-form .filter-grid {
gap: 20px;
}
.filter-form .inputbox {
height: 24px;
}
.filter-form .price-area .inputbox {
flex-direction: row;
height: auto;
}
}
@media (max-width: 575px) {
.filter-form .price-area .inputbox {
flex-direction: column;
align-items: flex-start;
}
.filter-form input,
.filter-form label {
font-size: var(--body4-font-size) !important;
}
.filter-form .price-area input[type="number"] {
width: 100px;
}
}
@media (min-width: 993px) {
.filter-form .filter-grid {
grid-template-columns: 1fr 1fr;
gap: 30px;
}
.filter-toggle {
display: none !important;
}
.filter {
display: block !important;
}
}
@media (min-width: 1200px) {
.filter-form .filter-grid {
grid-template-columns: 1fr 2fr 2fr;
gap: 60px;
}
.filter-form.projects .filter-grid {
grid-template-columns: 1fr 1fr;
}
.filter-form.references .filter-grid {
grid-template-columns: 1fr 1fr;
}
.filter-form .price-area {
justify-content: flex-end;
align-items: flex-end;
}
}
@keyframes fadeInCard {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.realestate-list {
margin: 0 auto;
}
#projects-list.realestate-list,
#realestates-list.realestate-list,
#references-list.realestate-list {
margin: 0 0 var(--space-xxl) 0;
}
.realestate-list .realestate-item {
position: relative;
border-radius: var(--border-radius);
-webkit-border-radius: var(--border-radius);
opacity: 0;
animation: fadeInCard 1s ease forwards;
}
.realestate-item {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
min-width: 0;
background-color: var(--white);
} .realestate-item > a {
display: flex;
flex-direction: column;
flex: 1;
text-decoration: none;
} .realestate-item.image-only .title-overlay {
max-width: 80%;
position: absolute;
top: 0;
left: 0;
z-index: 5;
}
.realestate-item .content {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.realestate-list .realestate-item .content {
gap: 30px;
}
#projects-list.realestate-list .realestate-item .content { }
.realestate-list .realestate-item .content-bottom {
display: flex;
flex-direction: column;
}
.realestate-list .realestate-item .content-bottom {
gap: 30px;
}
#projects-list.realestate-list .realestate-item .content-bottom {
gap: 40px;
}
.realestate-list .realestate-item h2.realestate-title {
margin: 0;
font-size: var(--body2-font-size);
font-weight: var(--semibold-weight);
color: var(--blue-600);
letter-spacing: 0;
line-height: 24px;
display: flex;
align-items: flex-start;
justify-content: flex-start;
gap: 20px;
}
#projects-list.realestate-list .realestate-item h2.realestate-title, 
#references-list.realestate-list .realestate-item h2.realestate-title {
margin: 0 0 20px 0 !important;
font-size: var(--body1-font-size);
font-weight: var(--semibold-weight);
color: var(--blue-600);
letter-spacing: 0;
line-height: 24px;
display: flex;
justify-content: space-between;
}  .realestate-list .realestate-item h3 {
margin: 0;
padding: 5px 10px;
background-color: var(--grey-500);
font-size: var(--body4-font-size);
font-weight: var(--regular-weight);
color: var(--white);
text-transform: uppercase;
letter-spacing: 1px;
position: absolute;
top: 10px;
left: 10px;
border-radius: var(--border-radius-max);
z-index: 2;
}
.realestate-list .realestate-item .realestate-facts,
.realestate-list .realestate-item .realestate-location {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
line-height: 24px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
}
#projects-list.realestate-list .realestate-item .realestate-facts,
#references-list.realestate-list .realestate-item .realestate-facts {
align-items: flex-start;
flex-direction: column;
}
.realestate-list .realestate-item .realestate-location .object .icon {
width: 18px;
height: 18px;
}
.realestate-list .realestate-item .object-location {
margin-bottom: 15px;
}
.realestate-list .realestate-item .realestate-location .object,
#projects-list.realestate-list .realestate-item .realestate-location .object {
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: row;
gap: 15px;
} .realestate-list .realestate-item .realestate-facts .object,
#projects-list.realestate-list .realestate-item .realestate-facts .object, 
#references-list.realestate-list .realestate-item .realestate-facts .object {
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: row;
gap: 15px;
}
.realestate-list .realestate-item .realestate-facts .object.object-price {
justify-content: flex-end;
align-items: center;
}
.realestate-list .realestate-item .text {
font-size: var(--body2-font-size);
}
.realestate-list .realestate-item .status,
.status {
padding: 10px 10px;
background-color: var(--blue-400);
font-size: var(--body4-font-size);
font-weight: var(--semibold-weight);
color: var(--white);
text-align: center;
border-radius: var(--border-radius);
display: flex;
align-items: center;
justify-content: center;
max-width: 220px;
position: absolute;
top: 0;
left: 0;
right: auto;
bottom: auto;
z-index: 100;
}
.realestate-title .status {
margin: 0 0 20px 0;
background-color: var(--grey-200);
}
.realestate-image {
position: relative;
}
.realestate-image .status {
position: absolute;
bottom: 0;
right: 0;
left: auto;
top: auto;
z-index: 10;
}
.realestate-list .realestate-item .content {
padding: 30px 30px; 
}
.load-more-btn {
width: 100%;
}
@media screen and (max-width: 992px) {
.realestate-list .realestate-item .content {
padding: 20px 20px; 
}
.realestate-list .realestate-item h2.realestate-title,
#projects-list.realestate-list .realestate-item h2.realestate-title, 
#references-list.realestate-list .realestate-item h2.realestate-title {
font-size: var(--body2-font-size);
line-height: 24px;
}
}
@media screen and (max-width: 575px) {
.realestate-list .realestate-item .content {
gap: 20px;
}
.realestate-list .realestate-item .content-bottom {
gap: 12px;
}
#projects-list.realestate-list .realestate-item .realestate-facts .object, #references-list.realestate-list .realestate-item .realestate-facts .object {
width: 100%;
}
.realestate-list .realestate-item h2.realestate-title,
#projects-list.realestate-list .realestate-item h2.realestate-title, 
#references-list.realestate-list .realestate-item h2.realestate-title {
font-size: var(--body3-font-size);
line-height: 18px;
}
.realestate-list .realestate-item .realestate-location {
margin: 0 0 10px 0;
align-items: start;
}
.realestate-list .realestate-item .realestate-location .location {
}
.realestate-list .realestate-item .realestate-location .status {
margin: 0 0 10px auto;
}
.realestate-list .realestate-item .realestate-facts {
flex-direction: column;
justify-content: flex-start;
}
.realestate-list .realestate-item .object-location, 
.realestate-list .realestate-item .realestate-facts,
.realestate-list .realestate-item .realestate-location {
font-size: var(--body4-font-size);
line-height: 18px;
}
.realestate-list .realestate-item .object {
width: 100%;
flex-direction: row;
align-items: center;
display: flex;
gap: 10px;
}
.realestate-list .realestate-item .realestate-facts .object.object-price {
justify-content: flex-start;
}
.realestate-list .realestate-item .realestate-facts span {
}
.realestate-list .realestate-item .text {
display: none;
}
}
.realestate-section {
padding-top: var(--pad-section-xxl);
padding-bottom: var(--pad-section-xxl);
}
.energy-efficiency-wrapper {
position: relative;
width: 100%;
margin: 20px 0;
}
.energy-efficiency-marker {
width: 0;
height: 0;
margin-left: 0;
margin-bottom: 6px;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 16px solid var(--grey-500);
transition: margin-left 2000ms ease;
} #realestate .realestate-keyfacts {
width: 100%;
margin: 0 0 45px 0;
display: flex;
flex-direction: row;
gap: 15px;
flex-wrap: wrap;
}
#realestate .realestate-keyfacts .realestate-keyfacts-item {
padding: 15px;
background-color: var(--blue-200);
display: flex;
flex-direction: column;
gap: 10px;
flex: 1 1 200px;
min-width: 0;
}
#realestate .realestate-keyfacts .realestate-keyfacts-item .realestate-keyfacts-name {
font-size: var(--body2-font-size);
color: var(--grey-500); 
line-height: 24px;
}
#realestate .realestate-keyfacts .realestate-keyfacts-item .realestate-keyfacts-value {
font-size: 30px;
color: var(--grey-500); 
line-height: 34px;
}
#realestate .realestate-contact-container {
position: sticky;
top: 160px;
padding: 40px;
background-color: var(--blue-200);
}
#realestate .realestate-contact h2 {
margin: 0 0 30px 0;
font-size: 30px;
font-weight: var(--regular-weight);
color: var(--blue-600);
line-height: 34px;
}
#realestate .realestate-contact h4 {
margin: 0;
font-size: 18px;
font-weight: var(--semibold-weight);
color: var(--blue-600);
line-height: 24px;
}
#realestate .realestate-contact p {
margin-bottom: 30px;
}
@media screen and (max-width: 575px) {
#realestate .realestate-contact h2 {
font-size: var(--body1-font-size);
line-height: 24px;
}
#realestate .realestate-contact-container {
padding: 20px;
}
#realestate .realestate-keyfacts .realestate-keyfacts-item {
flex: 1 auto;
}
#realestate .realestate-keyfacts .realestate-keyfacts-item .realestate-keyfacts-name {
font-size: var(--body4-font-size);
line-height: 18px;
}
#realestate .realestate-keyfacts .realestate-keyfacts-item .realestate-keyfacts-value {
font-size: 20px;
line-height: 24px;
}
}
.realestate-address {
padding-top: 30px;
border-top: 2px solid var(--blue-200);
}
.realestate-address-container {
padding-bottom: 30px;
display: flex;
justify-content: space-between;
align-items: flex-start; 
}
.realestate-address address {
font-style: normal;
}
.realestate-content {
padding-bottom: 30px;
}
.realestate-other {
padding-top: 30px;
padding-bottom: 30px;
border-top: 2px solid var(--blue-200);
}
.realestate-energy-pass {
padding-top: 30px;
padding-bottom: 30px;
border-top: 2px solid var(--blue-200);
}
.realestate-equipment {
padding-top: 30px;
padding-bottom: 30px;
border-top: 2px solid var(--blue-200);
}
.realestate-details {
padding-top: 30px;
padding-bottom: 30px;
border-top: 2px solid var(--blue-200);
}
.current-project-slider .project-slide {
position: relative;
} .projects {
--overlap: 120px;
position: relative;
display: grid;
grid-template-columns: 3fr 2fr;
gap: 0;
overflow: visible;
}
.projects.is-reversed {
grid-template-columns: 2fr 3fr;
}
.home .projects {
padding-top: 60px;
}
.card-project {
z-index: 2;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
justify-content: flex-end;
order: 2;
position: relative;
}
.home .card-project::after {
content: "";
position: absolute;
height: 60px;
top: -60px;
bottom: 0;
background: var(--blue-200);
z-index: -1;
left: 0;
right: calc(50% - 50vw);
}
.home .card-project.left::after {
left: calc(50% - 50vw);
right: 0;
}
.card-project__container {
margin-left: calc(-1 * var(--overlap));
width: calc(100% + var(--overlap));
padding-top: var(--pad-section-l);
padding-right: var(--pad-section-xs);
padding-bottom: var(--pad-section-l);
padding-left: var(--pad-section-l);
background-color: var(--white);
}
.card-project__heading {
margin-bottom: var(--space-xl);
}
.card-project__text {
margin-bottom: var(--space-xl);
}
.card-project__buttons {
display: flex;
flex-wrap: wrap;
gap: var(--space-m);
}
.project-image {
order: 1;
}
.projects.is-reversed .card-project {
order: 1;
}
.projects.is-reversed .project-image {
order: 2;
}
.projects.is-reversed .card-project__container {
margin-left: 0;
margin-right: 0;
padding-top: var(--pad-section-l);
padding-right: var(--pad-section-l);
padding-bottom: var(--pad-section-l);
padding-left: var(--pad-section-l);
}
@media (max-width: 1200px) {
.card-project__container {
margin-left: 0;
width: 100%;
padding: var(--pad-section-l);
}
}
@media (max-width: 1024px) {
.projects {
grid-template-columns: 1fr;
padding-top: 0;
}
.home .projects {
padding-top: 0;
}
.card-project__container {
padding: var(--space-l);
}
.home .card-project::after {
display: none;
}
}
@media (max-width: 768px) {
.card-project__heading {
margin-bottom: var(--space-l);
}
}
@media (max-width: 575px) {
.card-project__text {
font-size: var(--body3-font-size);
line-height: 20px; 
}
} .info {
--overlap: 120px;
position: relative;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0;
overflow: visible;
}
.card-info {
z-index: 2;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
justify-content: flex-end;
order: 2;
position: relative;
}
.x .card-info::after {
content: "";
position: absolute;
height: 60px;
top: -60px;
bottom: 0;
background: var(--blue-200);
z-index: -1;
left: 0;
right: calc(50% - 50vw);
}
.card-info__container {
padding-top: var(--pad-section-l);
padding-right: var(--pad-section-xs);
padding-bottom: var(--pad-section-l);
padding-left: var(--pad-section-l);
background-color: var(--white);
}
.card-info__heading {
margin-bottom: var(--space-xl);
}
.card-info__text {
}
.card-info__buttons {
display: flex;
flex-wrap: wrap;
gap: var(--space-m);
}
.info-image {
order: 1;
}
.info-image img {
display: block;
width: calc(100% + 120px);
max-width: none;
}
.info.is-reversed .card-info {
order: 1;
}
.info.is-reversed .info-image {
order: 2;
}
.info.is-reversed .info-image img {
margin-left: calc(-1 * var(--overlap));
}
.info.is-reversed .card-info__container {
margin-left: 0;
margin-right: 0;
padding-top: var(--pad-section-l);
padding-right: var(--pad-section-l);
padding-bottom: var(--pad-section-l);
padding-left: var(--pad-section-l);
}
@media (max-width: 1200px) {
.card-info__container {
margin-left: 0;
width: 100%;
padding: var(--pad-section-l);
}
}
@media (max-width: 1024px) {
.info {
grid-template-columns: 1fr;
padding-top: 0;
}
.card-info__container {
padding: var(--space-l);
}
.info.is-reversed .card-info {
order: 2;
}
.info.is-reversed .info-image {
order: 1;
}
.info.is-reversed .card-info__container {
padding: var(--space-l);
}
}
@media (max-width: 768px) {
.card-info__heading {
margin-bottom: var(--space-l);
}
}
@media (max-width: 575px) {
.card-info__text {
font-size: var(--body3-font-size);
line-height: 20px; 
}
} .current-realestates-slider {
position: relative;
padding-bottom: 70px;
}
.current-realestates-slider .realestate-image img {
aspect-ratio: 3/2;
}
.current-realestates-slider .splide__track {
overflow: hidden;
}
.current-realestates-slider .splide__list {
display: flex !important;
}
.current-realestates-slider .splide__slide {
flex-shrink: 0 !important;
min-width: 0;
}
.current-realestates-slider .realestate-item,
.current-realestates-slider .realestate-item > a,
.current-realestates-slider .content {
min-width: 0;
}
.current-realestates-slider .splide__arrows {
position: absolute;
left: 50%;
bottom: 15px;
width: 100%;
transform: translateX(-50%);
pointer-events: none;
}
.current-realestates-slider .splide__arrow svg {
fill: var(--gold);
}
.current-realestates-slider .splide__arrow--prev {
left: 0;
}
.current-realestates-slider .splide__arrow--next {
right: 0;
}
.current-realestates-slider .splide__pagination {
position: absolute;
left: 50%;
transform: translateX(-50%) translateY(50%);
bottom: 15px;
z-index: 20;
width: auto;
}
.current-project-slider .project-title {
margin: 0;
padding: var(--space-s);
background-color: var(--blue-400);
font-size: var(--body2-font-size);
font-weight: var(--semibold-weight);
color: var(--white);
line-height: 24px;
position: absolute;
top: 30px;
left: 30px;
z-index: 999;
display: block;
}
.current-project-slider .project-link {
}
@media (max-width: 575px) {
.current-realestates-slider, 
.current-project-slider {
padding-bottom: 50px;
}
.current-project-slider .project-title {
top: 15px;
left: 15px;
font-size: 14px;
line-height: 18px; 
}
}
#realestate #title {
padding-top: var(--pad-section-l);
}
#realestate #navigation {
padding-top: var(--pad-section-m);
padding-bottom: var(--pad-section-l);
}
#realestate .splide__arrow--prev, 
.realestate-list .realestate-image .splide__arrow--prev,
.current-project-slider .splide__arrow--prev {
top: auto;
bottom: 6px;
left: 30px;
}
#realestate .splide__arrow--next, 
.realestate-list .realestate-image .splide__arrow--next, 
.current-project-slider .splide__arrow--next {
bottom: 6px;
top: auto;
left: 88px;
}
#realestate .splide__arrow,
.realestate-list .realestate-image .splide__arrow,
.current-project-slider .splide__arrow {
height: 48px;
width: 48px;
font-size: 32px;
min-height: 32px;
min-width: 32px;
background-color: var(--gold);
color: var(--grey-500);
}
#realestate .splide__arrow svg,
.realestate-list .realestate-image .splide__arrow svg,
.current-project-slider .splide__arrow svg {
fill: var(--grey-500);
}
#realestate .splide__arrow:hover,
.realestate-list .realestate-image .splide__arrow:hover,
.current-project-slider .splide__arrow:hover {
background-color: var(--blue-600);
color: var(--white);
}
#realestate .splide__arrow:hover svg,
.realestate-list .realestate-image .splide__arrow:hover svg,
.current-project-slider .splide__arrow:hover svg {
fill: var(--white);
}
#realestate .splide__pagination,
.realestate-list .splide__pagination,
.current-project-slider .splide__pagination {
display: flex;
gap: 0.5rem;
justify-content: center;
margin-top: 1rem;
}
#realestate .splide__pagination__page,
.realestate-list .splide__pagination__page,
.current-project-slider .splide__pagination__page {
width: 15px;
height: 15px;
background-color: var(--white) !important;
border: none;
border-radius: 0;
transition: opacity 0.3s ease, transform 0.3s ease;
}
#realestate .splide__pagination__page.is-active,
.realestate-list .splide__pagination__page.is-active,
.current-project-slider .splide__pagination__page.is-active {
background-color: var(--blue-600) !important;
}
@media (max-width: 575px) {
#realestate .splide__arrow--prev, 
.realestate-list .realestate-image .splide__arrow--prev,
.current-project-slider .splide__arrow--prev {
top: auto;
bottom: -3px;
left: 15px;
}
#realestate .splide__arrow--next, 
.realestate-list .realestate-image .splide__arrow--next, 
.current-project-slider .splide__arrow--next {
bottom: -3px;
top: auto;
left: 61px;
}
#realestate .splide__arrow,
.realestate-list .realestate-image .splide__arrow,
.current-project-slider .splide__arrow {
height: 36px;
width: 36px;
font-size: 24px;
min-height: 24px;
min-width: 24px;
}
#realestate .splide__arrow svg,
.realestate-list .realestate-image .splide__arrow svg,
.current-project-slider .splide__arrow svg {
font-size: 24px;
max-height: 24px;
max-width: 24px;
}
} .project-reference-categories-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 30px;
}
.project-reference-category-slider-wrapper {
min-width: 0;
}
.reference-category-title {
font-size: 30px;
line-height: 34px;
font-weight: var(--semibold-weight);
color: var(--blue-600);
margin: 0 0 14px;
}
.current-project-references-category-slider {
position: relative;
min-width: 0;
}
.current-project-references-category-slider .splide__track {
overflow: hidden;
}
.current-project-references-category-slider .splide__list {
display: flex;
}
.current-project-references-category-slider .splide__slide {
flex-shrink: 0;
min-width: 0;
}
.reference-category-item {
background: var(--white);
}
.reference-category-item .reference-category-image-link {
display: block;
position: relative;
}
.reference-category-item .image img {
display: block;
width: 100%;
height: auto;
}
.reference-category-item .reference-category-meta {
background: var(--white);
min-height: 56px;
display: flex;
align-items: center;
justify-content: center;
padding: 0 90px;
box-sizing: border-box;
}
.reference-category-item .reference-category-location {
text-align: center;
width: 100%;
}
.current-project-references-category-slider .splide__pagination {
position: absolute;
right: 20px;
bottom: 72px;
left: auto;
transform: none;
width: auto;
display: flex;
align-items: center;
gap: 15px;
padding: 0;
margin: 0;
z-index: 20;
}
.current-project-references-category-slider .splide__pagination li {
margin: 0;
padding: 0;
list-style: none;
}
.current-project-references-category-slider .splide__pagination__page {
width: 15px;
height: 15px;
border-radius: 0;
margin: 0;
opacity: 1;
background: var(--white);
border: 0;
transform: none;
}
.current-project-references-category-slider .splide__pagination__page.is-active {
background: var(--blue-600);
transform: none;
}
.project-reference-category-slider-wrapper.has-single-slide .splide__pagination,
.project-reference-category-slider-wrapper.has-single-slide .splide__arrows {
display: none !important;
}
.current-project-references-category-slider .project-reference-category-slider-bottom {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 56px;
z-index: 15;
pointer-events: none;
}
.current-project-references-category-slider .splide__arrows {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 56px;
display: flex;
align-items: center;
justify-content: space-between;
pointer-events: none;
}
.current-project-references-category-slider .splide__arrow {
position: static;
transform: none;
margin: 0 18px;
pointer-events: auto;
background: transparent;
width: auto;
height: auto;
border-radius: 0;
box-shadow: none;
}
.current-project-references-category-slider .splide__arrow svg {
display: block;
}
@media (max-width: 992px) {
.current-project-references-category-slider {
padding-bottom: 0;
}
.current-project-references-category-slider .splide__arrows {
transform: none;
}
}
@media (max-width: 767px) {
.project-reference-categories-grid {
grid-template-columns: 1fr;
}
.reference-category-title {
font-size: 18px;
line-height: 24px;
}
.current-project-references-category-slider .splide__pagination {
right: 15px;
bottom: 71px;
gap: 15px;
}
.current-project-references-category-slider .splide__pagination__page {
width: 15px;
height: 15px;
}
}
@media (max-width: 575px) {
.reference-category-title {
font-size: 16px;
line-height: 18px;
}
} #realestate-details h2 {
margin-bottom: 15px;
font-size: var(--body2-font-size);
font-weight: var(--semibold-weight);
color: var(--blue-600);
line-height: 24px;
} #realestates-list {
display: grid;
grid-template-columns: 1fr;
gap: 30px;
}
@media (min-width: 768px) {
#realestates-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 1200px) {
#realestates-list {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
#references-list {
display: grid;
grid-template-columns: 1fr;
gap: 30px;
}
@media (min-width: 768px) {
#references-list {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1200px) {
#references-list {
grid-template-columns: repeat(3, 1fr);
}
}
#projects-list {
display: grid;
grid-template-columns: 1fr;
gap: 60px;
}
@media (min-width: 768px) {
#projects-list {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1200px) {
#projects-list {
grid-template-columns: repeat(2, 1fr);
}
} .leaflet-right .leaflet-control {
margin-right: 20px !important;
}
.leaflet-top .leaflet-control {
margin-top: 20px !important;
}
.leaflet-control.compact-legend {
display: flex;
flex-wrap: wrap;
background: var(--white);
padding: 10px;
border-radius: 0;
font-size: var(--body4-font-size);
line-height: 1;
gap: 30px;
}
.compact-legend .legend-item {
display: flex;
align-items: center;
cursor: pointer;
user-select: none;
margin: 0;
}
.compact-legend .legend-item input[type="checkbox"] {
width: 0;
height: 0;
opacity: 0;
margin: 0;
}
.compact-legend .legend-item input[type="checkbox"] + .legend-icon {
opacity: 0.6;
transition: opacity 0.2s;
}
.compact-legend .legend-item input[type="checkbox"]:checked + .legend-icon {
opacity: 1;
}
.compact-legend .legend-icon {
width: 30px;
height: 30px;
margin-right: 10px;
flex-shrink: 0;
}
.compact-legend .legend-item span {
color: var(--grey-500);
white-space: nowrap;
}
@media (max-width: 768px) {
.leaflet-control.compact-legend {
gap: 10px;
}
}
@media (max-width: 575px) {
.leaflet-control.compact-legend {
flex-direction: column;
font-size: 12px;
padding: 5px;
gap: 10px;
}
.leaflet-control.compact-legend .legend-icon {
width: 16px;
height: 16px;
}
.leaflet-control.compact-legend .legend-item {
margin: 0;
}
} .custom-gallery-wrapper {
width: 100%;
margin: 0 auto 0 auto;
gap: 5px;
}
.layout-grid {
display: flex;
gap: 5px;
align-items: stretch;
}
.layout-grid .main-image,
.layout-grid .grid-images {
width: 50%;
display: grid;
}
.layout-grid .main-image a,
.layout-grid .grid-item {
flex: 1;
display: block;
}
.layout-grid .main-image img,
.layout-grid .grid-item img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.grid-images {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
gap: 5px;
height: 100%;
}
.layout-simple {
display: flex;
gap: 5px;
}
.layout-simple .half-image {
width: 50%;
}
.half-image img {
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
display: block;
}
.desktop-only {
display: grid;
}
.mobile-only {
display: none;
}
.photo-count {
position: absolute;
bottom: 0;
left: 0;
background-color: var(--blue-400);
color: var(--white);
padding: 10px;
border-radius: 0;
font-size: var(--body2-font-size);
font-weight: var(--semibold-weight);
z-index: 2;
pointer-events: none;
}
@media (max-width: 768px) {
.layout-grid,
.layout-simple {
display: block;
}
.main-image,
.half-image,
.grid-images {
width: 100% !important;
}
.grid-images,
.desktop-only {
display: none !important;
}
.main-image img {
height: auto;
aspect-ratio: 4 / 3;
}
.photo-count {
font-size: var(--body4-font-size);
padding: 6px 10px;
}
}
.main-image,
.half-image {
position: relative;
} .realestate-hero {
padding-top: var(--pad-section-l);
padding-bottom: var(--pad-section-l);
background-color: var(--blue-300);
position: relative;
}
.realestate-hero .crop-3-1::before {
background-image: linear-gradient(rgba(0, 0, 0, 0) 30%, rgba(41, 77, 109, 0.45) 60%, rgba(41, 77, 109, 1) 100%);
position: absolute;
content: "";
width: 100%;
height: 100%;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
pointer-events: none;
}
.realestate-hero .title {
padding-top: var(--pad-section-s);
padding-bottom: var(--pad-section-s);
font-size: var(--body1-font-size);
font-weight: var(--bold-weight);
color: var(--white);
position: relative;
z-index: 2;
} #realestate .realestate-title {
margin: 0 0 30px 0;
color: var(--blue-600);
} .realestate-share {
margin-top: 40px;
}
.realestate-share-title {
margin-bottom: 20px;
color: var(--blue-600);
} .realestate-similar {
}
.realestate-similar h2 {
color: var(--blue-600);
}
.realestate-similar .realestate-list {
margin: 0 0 var(--space-xxl) 0;
display: grid;
grid-template-columns: 1fr;
gap: 30px;
}
.realestate-similar .realestate-list .realestate-item .content {
border-left: 2px solid var(--blue-200);
border-right: 2px solid var(--blue-200);
border-bottom: 2px solid var(--blue-200);
}
@media (min-width: 768px) {
.realestate-similar .realestate-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 1200px) {
.realestate-similar .realestate-list {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}