@charset "utf-8";
/* CSS Document */

:root {
	--color-blue: #19223B;
	--color-white: #FFFFFF;
	--color-gold: #B7A368;
	--color-gray: #EEEEEE;
}

html {
	font-family: 'Roboto', sans-serif;
	font-size: 8px;
	font-weight: 400;
	scroll-behavior: smooth;
	color: #000000;
}

@media (max-width: 375px) {
	html {
		font-size: 7px;
	}
}

body {
	margin: 0;
}

html,
body {
	max-width: 100%;
	overflow-x: hidden;
}

p {
	margin-top: 0;
}

a:link,
a:visited,
a:hover,
a:active {
	text-decoration: none;
}

::placeholder {
	color: #BBBBBB;
	opacity: 1;
	/* Firefox */
}

::-ms-input-placeholder {
	/* Edge 12 -18 */
	color: #BBBBBB;
}

/* Scroll to top */
#toTopBTN {
	position: fixed;
	bottom: 1rem;
	left: 50%;
	transform: translateX(-50%);
	right: auto;
	border: none;
	outline: none;
	cursor: pointer;
	font-size: 1.8rem;
	background: #B7A368;
	z-index: 100;
}

.fontMontserrat {
	font-family: 'Roboto', sans-serif;
}

.fontSourceSerif4 {
	font-family: 'Roboto', sans-serif;
}

h1 {
	all: unset;
}

h2 {
	all: unset;
}

.space5 {
	height: .5rem;
}

.space10 {
	height: 1rem;
}

.space20 {
	height: 2rem;
}

.space30 {
	height: 3rem;
}

.space40 {
	height: 4rem;
}

.space50 {
	height: 5rem;
}

.space60 {
	height: 6rem;
}

.space80 {
	height: 8rem;
}

.space100 {
	height: 10rem;
}

.textThin {
	font-weight: 200;
}

.textLight {
	font-weight: 300;
}

.textRegular {
	font-weight: 400;
}

.textMedium {
	font-weight: 500;
}

.textSemiBold {
	font-weight: 600;
}

.textBold {
	font-weight: 700;
}

.textExtraBold {
	font-weight: 800;
}

.text10 {
	font-size: 1rem;
}

.text11 {
	font-size: 1.1rem;
}

.text12 {
	font-size: 1.2rem;
}

.text14 {
	font-size: 1.4rem;
}

.text16 {
	font-size: 1.6rem;
}

.text18 {
	font-size: 1.8rem;
	line-height: 2.8rem;
}

.text20 {
	font-size: 2rem;
}

.text22 {
	font-size: 2.2rem;
}

.text24 {
	font-size: 2.4rem;
}

.text28 {
	font-size: 2.8rem;
}

.text32 {
	font-size: 3.2rem;
}

.text36 {
	font-size: 3.6rem;
}

.text40 {
	font-size: 4.0rem;
}

.text42 {
	font-size: 4.2rem;
}

.text48 {
	font-size: 4.8rem;
}

.colorWhite {
	color: #FFFFFF;
}

.colorGold {
	color: #B7A368;
}

.colorDarkBlue {
	color: #19223B;
}

.colorDefault {
	color: #000000;
}

.colorGrey1 {
	color: #A2A2A2;
}

.flex {
	display: flex;
	justify-content: space-around;
}

.flex1 {
	display: flex;
	justify-content: space-around;
}

.column {
	flex-direction: column;
}

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

.containerMain {
	/*width: calc(100% - 5rem);*/
	margin: 0 auto;
	position: relative;
}

.containerMain1 {
	width: calc(100% - 5rem);
	margin: 0 auto;
	position: relative;
}

/* Header */
.containerHeader {
	height: 12rem;
}

.containerHeader>.topMenuLinkContainer,
.containerHeader>.flex>.menuLink {
	display: none;
}

.logo {
	width: 17.5rem;
	height: 5.5rem;
}

.menuLink {
	font-weight: 500;
	color: #000000;
	margin: 7.8rem 0 0 0;
	transition: color 0.3s;
}

.menuLink:hover {
	color: #B7A368;
}

.submenuLink {
	font-weight: 500;
	width: fit-content;
	color: #000000;
	transition: color 0.3s;
}

.submenuLink:hover {
	color: #B7A368;
	cursor: pointer;
}

.topMenuLinkContainer {
	position: absolute;
	right: 0;
	top: 2.8rem;
	display: none;
	gap: 2rem;
	padding-right: 2.8rem;
}

.topMenuLink,
.topMenuLinkWA {
	font-weight: 600;
	color: #000000;
	display: none;
	align-items: center;
	transition: color 0.3s;
}

.topMenuLink:hover {
	color: #B7A368;
}

.topMenuLinkWA:hover {
	color: #02E677;
}

/* Hero */
.containerHero {
	width: 100%;
	height: calc(60vh - 12rem);
	position: relative;
	/*background: url(../images/hero_bg01.jpg) center center no-repeat fixed;*/
	background: url(../images/uploads/index_search1.jpg) center center no-repeat fixed;
	background-size: cover;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/*@media(min-width: 768px) {
	.suggestions {
		width: 60rem;
	}
}*/
@media(max-width: 768px) {
	.testimonialsLeft {
		margin-left: 3rem;
		width: 90%;
	}

	.testimonialsRight {
		margin-top: 20px;
		margin-left: 3rem;
		width: 90%;
	}

	.apAgentContainer {
		width: 100% !important;
	}

	.overlay-content .apAgentContainer {
		margin-top: 80px;
		width: 70% !important;
	}

	.overlay-content .apAgentContainerSticky {
		padding: 0 !important;
	}

	.containerLogin {
		width: 100% !important;
	}

	.readMore .actionBTNWhite {
		margin: 2.5rem;
		width: -webkit-fill-available;
	}

	.textboxbottom {
		width: 90% !important;
		margin-left: 0px !important;
	}

	.containerHero {
		background-attachment: local !important;
		/*margin-top: 50px;*/
	}

	.table-500 {
		width: 100% !important;
	}

	.location-invest {
		margin: 0 0 3rem .5rem !important;
	}
}

.containerHero2 {
	width: 100%;
	height: calc(60vh - 12rem);
	position: relative;
	background: url(../images/zasto_agencija/house-model-on-wooden-table-and-financial-adviser-2023-11-27-04-54-43-utc.JPG) center center no-repeat fixed;
	background-size: cover;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.heroBTNBuy {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 20rem;
	height: 6rem;
	border-radius: 8px 0 0 8px;
	background: #B7A368;
	color: #FFFFFF;
	font-size: 2rem;
	line-height: 0;
	font-weight: 400;
	transition: background 0.3s, color 0.3s;
}

.heroBTNBuy:hover,
.heroBTNBuy:active {
	background: #19223B;
	color: #FFFFFF;
}

.heroBTNSell {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 20rem;
	height: 6rem;
	border-radius: 0 8px 8px 0;
	background: #FFFFFF;
	color: #19223B;
	font-size: 2rem;
	line-height: 0;
	font-weight: 400;
	transition: background 0.3s, color 0.3s;
}

.heroBTNSell:hover {
	background: #19223B;
	color: #FFFFFF;
}

.heroBTNSell:active {
	background: #B7A368;
	color: #FFFFFF;
}

.heroInputType {
	width: 14rem;
	height: 8rem;
	background: #FFFFFF;
	border-radius: 8px 0 0 8px;
	border-right: 1px solid #19223B;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #19223B;
	font-size: 2rem;
	line-height: 0;
	font-weight: 400;
}

.heroInputFieldPre {
	width: 6rem;
	height: 8rem;
	padding: 0 0 0 1rem;
	background: #FFFFFF;
	display: flex;
	justify-content: center;
	align-items: center;
}

.heroInputField {
	width: calc(100vw - 38rem);
	height: 8rem;
	background: #FFFFFF;
	border: none;
	outline: none;
	padding: 0 20px;
	font-size: 2rem;
	line-height: 0;
	font-weight: 400;
	color: #19223B;
}

.heroInputBTN {
	width: 9rem;
	height: 8rem;
	background: #B7A368;
	border-radius: 0 8px 8px 0;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: background 0.3s;
}

.heroInputBTN:hover {
	background: #19223B;
}

#subSubPropertyType {
	border-radius: 4px;
}

.heroFlex {
	display: flex;
	flex-direction: row;
}

/* Featured Locations & Properties*/
.dividerLine {
	width: 100%;
	height: 1px;
	background: #CCCCCC;
}

.dividerGradient {
	background: url(../images/divider_gradient.png) repeat-x;
	background-position: bottom 0rem left 0rem;
}

.containerFeatLocation,
.containerFeatProperties,
.containerInformativeGrid,
.containerRegister,
.containerTestimonials {
	display: flex;
	justify-content: space-between;
}

.containerFeatLocation,
.containerFeatProperties {
	/*width: 100%;*/
	width: auto;
	/*padding: 0px 20px;*/
	flex-wrap: wrap;
	gap: 2rem;
}


@media (max-width: 768px) {
	.note {
		margin: 0 3rem !important;
	}

	.containerFeatProperties {
		flex-wrap: nowrap !important;
		justify-content: flex-start !important;
	}

	.containerInformative .text28 {
		text-align: center !important;
	}

	.texts {
		padding-left: 15px;
	}
}

.containerFeatLocationText {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	margin: 7rem 0 0 0;
	text-align: center;
}

.containerFeatLocationBTNs {
	display: flex;
	justify-content: center;
	gap: 1rem;
	width: calc(100% - 5rem);
	flex-wrap: wrap;
}

.featLocationBTN {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 15rem;
	height: 6rem;
	border-radius: 8px;
	border: 2px solid #F0F0F0;
	box-sizing: border-box;
	background: #F0F0F0;
	color: #19223B;
	font-size: 1.8rem;
	line-height: 0;
	transition: border 0.3s;
}

.featLocationBTN:hover,
.featLocationBTN:active {
	border: 2px solid #19223B;
}

.featLocationContainer {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: calc(50% - 1rem);
}

.featLocationContentBig {
	position: relative;
	width: 100%;
	height: 44rem;
	border-radius: 8px;
}

.featLocationContentSmall {
	position: relative;
	width: 100%;
	height: 21rem;
	border-radius: 8px;
}

.featLocationText {
	position: absolute;
	left: 3rem;
	bottom: 3rem;
	font-size: 1.8rem;
	line-height: 0;
	color: #FFFFFF;
}

.featPropertiesContent {
	position: relative;
	width: calc(50% - 1rem);
	border: 1px solid #CCCCCC;
	box-sizing: border-box;
}

.featPropertiesTextContainer {
	padding: 1.5rem 2rem;
}

/* About */
.containerAbout {
	display: flex;
	flex-wrap: wrap;
}

.containerAboutLeft {
	width: 100%;
	height: 40rem;
	background: url(../images/about_01.jpg) top center no-repeat;
	background-size: cover;
}

.containerAboutLeft2 {
	width: 100%;
	height: 40rem;
	background: url(../images/zasto_agencija/businesspeople-having-an-informal-work-meeting-2023-11-27-04-57-43-utc.jpg) top center no-repeat;
	background-size: cover;
}

.containerAboutLeft3 {
	width: 100%;
	height: 40rem;
	background: url(../images/zasto_agencija/female-realtor-shaking-hands-with-couple-intereste-2023-11-27-05-15-17-utc.jpg) top center no-repeat;
	background-size: cover;
}

.containerAboutLeft4 {
	width: 100%;
	height: 40rem;
	background: url(../images/zasto_agencija/top-view-of-calculator-pen-and-ruler-on-blueprint-2023-11-27-05-07-51-utc.jpg) top center no-repeat;
	background-size: cover;
}

.containerAboutLeft5 {
	width: 100%;
	height: 40rem;
	background: url(../images/zasto_agencija/top-view-of-two-female-design-engineer-working-wit-2023-11-27-05-23-59-utc.jpg) top center no-repeat;
	background-size: cover;
}

.containerAboutLeft6 {
	width: 100%;
	height: 40rem;
	background: url(../images/zasto_agencija/woman-receiving-the-keys-of-a-new-house-2023-12-08-21-24-18-utc.jpg) top center no-repeat;
	background-size: cover;
}

.containerAboutRight {
	width: 100%;
	box-sizing: border-box;
	background: #EEEEEE;
	padding: 3rem 5rem 7rem 5rem;
}

@media(max-width: 768px) {

	.background-with-shadow {
		background-attachment: local !important;
	}

	.containerAboutRight.background-with-shadow {
		display: none !important;
	}

	.featLocationText {
		text-align: center;
		left: 2rem;
		right: 2rem;
	}
}



.textDividerAbout {
	width: 10rem;
	height: 2px;
	background: #19223B;
	margin: 3rem 0;
}

.aboutBTN {
	display: inline;
	background: none;
	color: #19223B;
	border: 2px solid #19223B;
	border-radius: 8px;
	box-sizing: border-box;
	padding: 1rem 2rem;
	transition: background 0.3s, color 0.3s;
}

.aboutBTN:hover {
	background: #19223B;
	color: #FFFFFF;
}

.ourServiceBTN {
	display: inline;
	background: none;
	color: #B7A368;
	border: 2px solid #B7A368;
	border-radius: 8px;
	box-sizing: border-box;
	padding: 1rem 2rem;
	transition: background 0.3s, color 0.3s;
	font-size: 2rem;
	width: 80%;
	align-self: center;
}

.ourServiceBTN:hover {
	background: #B7A368;
	color: #FFFFFF;
}

/* 4x4 Grid */
.container4x4 {
	flex-flow: row wrap;
}

.single4x4 {
	width: 240px;
	height: 26rem;
	padding: 2.5rem 3rem;
	position: relative;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 3rem;
}

@media(max-width: 768px) {

	.single4x4 {
		width: auto;
		padding-bottom: 10%;
	}
}

.double4x4 {
	width: 50%;
	height: 21rem;
	padding: 2.5rem 3rem;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

@media(max-width: 768px) {

	.double4x4 {
		width: auto;
	}
}

.single4x4BTNPosition {
	position: absolute;
	left: 3rem;
	bottom: 4rem;
}

.single4x4BTNGold {
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 0;
	padding: .8rem 1.8rem;
	background: #FFFFFF;
	border: 2px solid #B7A368;
	color: #B7A368;
	box-sizing: border-box;
	transition: background 0.3s, color 0.3s;
}

.single4x4BTNGold:hover {
	color: #FFFFFF;
	background: #B7A368;
}

.single4x4BTNDarkBlue {
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 0;
	padding: .8rem 1.8rem;
	background: #FFFFFF;
	border: 2px solid #19223B;
	color: #19223B;
	box-sizing: border-box;
	transition: background 0.3s, color 0.3s;
}

.single4x4BTNDarkBlue:hover {
	color: #FFFFFF;
	background: #19223B;
}

.single4x4BTNWhite {
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 0;
	padding: 1.6rem 1.8rem;
	background: none;
	border: 2px solid #FFFFFF;
	color: #FFFFFF;
	box-sizing: border-box;
	transition: background 0.3s, color 0.3s;
}

.single4x4BTNWhite:hover {
	color: #19223B;
	background: #FFFFFF;
}

.single4x4Divider {
	width: 100%;
	height: 1px;
	background: #CCCCCC;
	margin: .2rem 0;
}

/* Informative Block */
.containerInformative {
	display: flex;
	align-items: center;
	flex-direction: column;
}

.informativeBlock {
	margin-bottom: 15px;
	width: 30.8rem;
	box-sizing: border-box;
	text-align: center;
	display: flex;
	flex-direction: column;
	/*justify-content: center;*/
}

.informativeBTNWhite {
	font-size: 2rem;
	line-height: 0;
	border-radius: 8px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	background: #FFFFFF;
	color: #19223B;
	width: 21rem;
	height: 5rem;
	margin-left: 1rem;
	margin-right: 1rem;
	transition: background 0.3s;
}

.informativeBTNWhite:hover {
	background: #B7A368;
}

.informativeBTNGold {
	font-size: 2rem;
	line-height: 0;
	border-radius: 8px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	background: #B7A368;
	color: #19223B;
	width: 21rem;
	height: 5rem;
	margin-left: 1rem;
	margin-right: 1rem;
	transition: background 0.3s;
}

.informativeBTNGold:hover {
	background: #FFFFFF;
}

/* Register */
.registerLeft {
	width: 75%;
	text-align: justify;
	padding-right: 4rem;
	box-sizing: border-box;
}

.registerRight {
	width: 25%;
	box-sizing: border-box;
}

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

.registerInput {
	width: 100%;
	height: 5rem;
	box-sizing: border-box;
	border: 1px solid #ccc;
	/*border: 2px solid #19223B;
	border-radius: 8px;*/
	border-radius: 5px;
	color: #19223B;
	background: #FFFFFF;
	padding: 0 2rem;
}

.registerInputSmall {
	width: 100%;
	height: 6rem;
	box-sizing: border-box;
	border: 2px solid #19223B;
	border-radius: 8px;
	color: #19223B;
	background: #FFFFFF;
	padding: 0 2rem;
}

.registerBTN {
	font-size: 1.8rem;
	line-height: 0;
	border-radius: 8px;
	/*display: flex;*/
	display: grid;
	align-items: center;
	padding: 0 2rem;
	box-sizing: border-box;
	font-weight: 500;
	background: #B7A368;
	color: #FFFFFF;
	width: 100%;
	height: 5rem;
	transition: background 0.3s
}

.registerBTN:hover {
	background: #19223B;
}

/* Services */

/* Testimonials */
.containerTestimonials {
	gap: 4rem;
}

.testimonialsLeft {
	width: 50%;
	box-sizing: border-box;
}

.testimonialsRight {
	width: 50%;
	box-sizing: border-box;
}

/* Blog */
.containerBlog {
	display: flex;
	justify-content: space-between;
}

.blogBTNGold {
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 0;
	padding: .8rem 1.8rem;
	background: #FFFFFF;
	border: 2px solid #B7A368;
	color: #B7A368;
	box-sizing: border-box;
	transition: background 0.3s, color 0.3s;
}

.blogBTNGold:hover {
	color: #FFFFFF;
	background: #B7A368;
}

.blogBlock {
	width: 30.8rem;
	box-sizing: border-box;
}

@media(max-width: 768px) {

	.blogBlock {
		width: auto;
		padding-bottom: 30px;
	}

	.informativeBlock {
		/*margin-bottom: 20px;*/
	}

	.containerVideo .containerInformativeGrid .informativeBlock {
		/*margin-bottom: 12rem !important;*/
	}

}

/* Kontakti */
.dividerFullPage {
	width: 100%;
	height: 1px;
	background: #757A89;
}

.containerContacts {
	display: flex;
	justify-content: space-between;
	gap: 4rem;
	margin: 8rem 0;
}

.containerContactsSplit {
	width: 50%;
	box-sizing: border-box;
}

.dividerContacts {
	width: 10rem;
	height: 2px;
	background: #B7A368;
	margin: 3rem 0;
}

.containerContactsSplitContacts {
	display: flex;
	justify-content: space-between;
	gap: 4rem;
}

.contactsLogos {
	display: flex;
	justify-content: flex-start;
	gap: 4rem;
	align-items: center;
	margin: 0 0 4rem 0;
}

.contactsLogos>img {
	width: auto;
}

/* Footer */
.containerFooter {
	width: 100%;
	position: relative;
	background: #19223B;
	padding: 8rem 0;
}

.inputNewsletter {
	font-size: 1.6rem;
	background: none;
	border: 1px solid #B7A368;
	height: 4rem;
	width: 35.7rem;
	box-sizing: border-box;
	padding: 0 1.5rem;
	outline: none;
	color: #B7A368;
}

.inputNewsletter::placeholder {
	color: #B7A368;
	opacity: 1;
	/* Firefox */
}

.inputNewsletter::-ms-input-placeholder {
	/* Edge 12 -18 */
	color: #B7A368;
}

.footerTop {
	display: flex;
	justify-content: space-between;
}

.footerTopLeft {
	width: 48%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.footerTopRight {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
}

.footerBTN {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.6rem;
	background: none;
	border: 1px solid #B7A368;
	height: 4rem;
	width: 4rem;
	box-sizing: border-box;
	color: #B7A368;
	transition: border 0.3s, background 0.3s, color 0.3s;
}

.footerBTN:hover {
	border: 1px solid #FFFFFF;
	background: #B7A368;
	color: #FFFFFF;
}

.footerDivider {
	width: 100%;
	height: 1px;
	background: #B7A368;
	margin: 3.8rem 0;
}

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

.footerLinksDivider {
	width: 1px;
	height: 1.8rem;
	background: #FFFFFF;
	margin: 0 1rem;
}

.footerAddressContainer {
	display: flex;
	justify-content: space-between;
	gap: 4rem;
}

.footerAddress {
	width: 25%;
	box-sizing: border-box;
}

/** Map **/

/** Map Menu **/
.mapContainer {
	display: flex;
	flex-direction: row;
	height: min-content;
	justify-content: space-between;
	align-items: center;
	padding: 2rem 0;
	z-index: 2;
	position: sticky;
	background: #19223B;
}

.mapInputContainer {
	display: flex;
	align-items: center;
	padding: 2rem;
}

.mapLinksContainer {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.mapInputLeft {
	position: relative;
	height: 4rem;
	display: flex;
	align-items: center;
	background: #FFFFFF;
	border-radius: 4px;
	padding: 0 1.5rem;
}

.mapInput {
	border: none;
	box-sizing: border-box;
	background: #FFFFFF;
	height: 4rem;
	outline: none;
	width: 40rem;
	padding: 0 1.5rem 0 0;
}


.mapLinksBTN {
	height: 4rem;
	box-sizing: border-box;
	padding: 0 1.5rem;
	background: #FFFFFF;
	color: #19223B;
	border-radius: 4px;
	margin-left: 1rem;
	margin-right: 1rem;
	transition: background 0.3s;
}

.mapLinksBTN:hover {
	background: #B7A368;
}

.toggle-btn {
	display: none;
	background-color: #19223B;
	color: white;
	padding: 10px 20px;
	border: none;
	cursor: pointer;
}

@media (max-width: 1280px) {
	.mapContainer {
		display: flex;
		flex-direction: column;
	}
}

@media (max-width : 1054px) {
	.locationsHolder {
		justify-content: normal !important;
	}

	.mapLinksContainer {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.mapLinksBTN,
	.informativeBTNWhite,
	.informativeBTNGold {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
		width: 45rem !important;
	}

	.toggle-btn {
		display: block;
		background-color: #19223B;
		color: white;
		padding: 10px 20px;
		border: none;
		cursor: pointer;
		margin-bottom: 1rem;
		/* Adjust margin as needed */
	}

	.buttonContainer {
		height: min-content;
		background-color: #19223B;
		display: flex;
		/* Use Flexbox for alignment */
		justify-content: center;
		/* Center items horizontally */
		align-items: center;
		/* Center items vertically */
		overflow: hidden;
		padding: 3px;
	}

	/* STYLE FOR SEARCH BAR MAP FOR MOBILE VERSION */
	/*#searchOptions {
		display: none;
		overflow: hidden;
		max-height: 0;
		transition: max-height 0.5s ease-out;
	}

	#searchOptions.open {
		display: block;
		max-height: 1000px;
		/* Arbitrary large value to allow the content to fully expand */
	/*transition: max-height 0.5s ease-in;
	}*/

}

@media (max-width: 548px) {
	.mapInput {
		width: 35rem;

	}

	.mapLinksBTN,
	.informativeBTNWhite,
	.informativeBTNGold {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
		width: 30.8rem !important;
	}
}




/* Specific styles for header and mapContainer placement */
header+.mapContainer {
	margin-top: 1rem;
}




/** Map Properties **/
.mapPropContainer {
	position: relative;
	width: 100%;
	height: calc(100vh - 21rem);
	/*background: #AAAAAA;*/
}

.mapPropDetailContainer {
	box-sizing: border-box;
	position: absolute;
	right: 2rem;
	top: 2rem;
	/*background: #FFFFFF;*/
	width: 60rem;
	border: 1px solid #CCCCCC;
}

.mapPropSortContainer {
	padding: 2rem;
	box-sizing: border-box;
	border-bottom: 1px solid #CCCCCC;
	background: url(../images/divider_gradient.png) bottom repeat-x;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.mapPropSortBTNContainer {
	display: flex;
	gap: 1rem;
}

.mapPropSortBTN {
	box-sizing: border-box;
	height: 3.2rem;
	color: #19223B;
	background: #FFFFFF;
	display: flex;
	align-items: center;
	border: 1px solid #CCCCCC;
	border-radius: 4px;
	padding: 0 2rem;
	transition: background 0.3s, color 0.3s, border 0.3s;
}

.mapPropSortBTN:hover,
.mapPropSortBTN:active {
	background: #19223B;
	color: #FFFFFF;
	border: 1px solid #19223B;
}

.mapPropSortDropContainer {
	height: 3.2rem;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 1rem;
}

.mapPropPropertyDetailContainer {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	padding: 1rem;
	overflow-y: scroll;
	/*max-height: calc(100vh - 36.2rem);
	height: -webkit-fill-available;*/
}

.mapPropPropertyDetail {
	box-sizing: border-box;
	width: calc(50% - 1rem);
	height: 100%;
	display: flex;
	flex-direction: column;
}

.mapPropPropertyDetail>* {
	flex-grow: 1;
}

.mapPropPropertyDetail1 {
	padding: 1.2rem 2rem;
	background: url(../images/divider_gradient.png) bottom repeat-x;
	border-bottom: 1px solid #CCCCCC;
}

.mapPropPropertyDetail2 {
	display: flex;
	padding: 1.2rem 2rem;
	border-bottom: 1px solid #CCCCCC;
}

.mapPropPropertyDetailAddress {
	display: flex;
	padding: 1.2rem 2rem;
	border-bottom: 1px solid #CCCCCC;
}

.mapPropPropertyDetail3 {
	display: flex;
	padding: 1.8rem 2rem;
	align-items: center;
}

.mapPropPropertyDetail4 {
	display: flex;
	padding: 1.8rem 2rem;
	align-items: center;
}

.mapPropPriceContent {
	flex: 1;
	/* Grow to fill available space */
	display: flex;
	/* Use flexbox */
	align-items: center;
	/* Center items vertically */
}

.mapPropPropertyBTN {
	margin-left: auto;
	/* Push the button to the right */
	box-sizing: border-box;
	height: 3.2rem;
	color: #FFFFFF;
	background: #19223B;
	display: flex;
	align-items: center;
	border-radius: 4px;
	padding: 0 2rem;
	transition: background 0.3s, color 0.3s;
}


.mapPropPropertyBTN:hover {
	background: #B7A368;
	color: #FFFFFF;
}

.mapPinContainer {
	position: relative;
}

.mapPinPrice {
	position: relative;
	background: #FFFFFF;
	box-sizing: border-box;
	border: 1px solid #19223B;
	border-radius: 1.6rem;
	height: 3.2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 2rem;
	color: #19223B;
	font-size: 1.4rem;
	font-weight: 600;
	line-height: 0;
}

.mapPin {
	position: absolute;
	left: calc(50% - 1.2rem);
	bottom: -2.6rem;
}

.mapPinDetailContainer {
	position: absolute;
	left: calc(50% - 10rem);
	bottom: 3.6rem;
	background: #FFFFFF;
	box-sizing: border-box;
	border: 1px solid #19223B;
	width: 20rem;
}

.mapPinDescriptionContainer {
	padding: 1.2rem 2rem;
	font-size: 1.4rem;
	font-weight: 600;
	line-height: normal;
}

.locationicon {
	display: flex;
	padding: 1.2rem 2rem;
	border-bottom: 1px solid #CCCCCC;
}

/* Apartment */

.apContainer {
	width: 135.2rem;
	margin: 0 auto;
	position: relative;
	display: flex;
	flex-direction: row;
}

.apDividerFullPage {
	width: 135.2rem;
	margin: 0 auto;
	height: 1px;
	background: #CCCCCC;
}

.apContainerLeft {
	width: 65%;
}

.apContainerRight {
	box-sizing: border-box;
	width: 35%;
	padding: 3rem 4rem;
	text-align: center;
	background: #EFEFEF;
}

.apRightStats {
	width: 100%;
	display: flex;
	justify-content: center;
}

.apDividerRightStats {
	width: 20rem;
	margin: 0 auto;
	height: 1px;
	background: #CCCCCC;
}

.apBTN,
.apBTNScheduleBTN {
	box-sizing: border-box;
	height: 3.2rem;
	color: #19223B;
	background: #FFFFFF;
	display: flex;
	align-items: center;
	line-height: 0;
	border: 1px solid #19223B;
	border-radius: 4px;
	padding: 0 1.2rem;
	transition: background 0.3s, color 0.3s;
}

.apBTN:hover {
	background: #19223B;
	color: #FFFFFF;
}

.apImageContainer {
	position: relative;
	width: 100%;
	height: 100%;
}

.apImageBTNContainer {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-end;
	gap: 2rem;
	margin: 0 auto;
	height: 100%;
	padding: 0 0 3rem 0;
}

.apImageBTN {
	box-sizing: border-box;
	height: 3.2rem;
	color: #FFFFFF;
	background: rgba(24, 34, 59, .8);
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 0;
	border-radius: 4px;
	padding: 0 1.2rem;
	gap: 1rem;
	transition: background 0.3s;
}

.apImageBTN:hover {
	background: rgba(24, 34, 59, 1);
}

.apDescriptionContainer {
	box-sizing: border-box;
	width: 65%;
	padding: 3.5rem 0;
}

.apAgentContainer {
	box-sizing: border-box;
	width: 35%;
	position: relative;
}

.apAgentContainerSticky {
	box-sizing: border-box;
	padding: 3rem 4rem;
	position: relative;
	width: auto;
	top: 0;
}

.apAgentInfoContainer {
	display: flex;
	width: 100%;
	justify-content: space-between;
}

.apAgentImageContainer {
	box-sizing: border-box;
	border-radius: 4px;
	width: 30%;
	height: auto;
	aspect-ratio: 1/1.25;
}

.apAgentDescriptionContainer {
	box-sizing: border-box;
	width: 64%;
}

.apAgentBTN {
	box-sizing: border-box;
	height: 3.2rem;
	color: #19223B;
	background: #FFFFFF;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 0;
	border: 1px solid #19223B;
	border-radius: 4px;
	width: 30%;
	transition: background 0.3s, color 0.3s, border 0.3s;
}

.apAgentBTN:hover {
	color: #FFFFFF;
	background: #B7A368;
	border: #B7A368;
}

.apAgentScheduleBTN {
	box-sizing: border-box;
	height: 5rem;
	color: #FFFFFF;
	background: #19223B;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 0;
	border-radius: 4px;
	width: 100%;
	transition: background 0.3s, color 0.3s;
}

.apAgentScheduleBTN:hover {
	color: #FFFFFF;
	background: #B7A368;
}

.aboutBTN2 {
	display: inline;
	color: #FFFFFF;
	background: #19223B;
	border: 2px solid #19223B;
	border-radius: 8px;
	box-sizing: border-box;
	padding: 1rem 2rem;
	transition: background 0.3s, color 0.3s;
}

.aboutBTN2:hover {
	color: #FFFFFF;
	background: #B7A368;
	border: 2px solid #B7A368;
}

.apAgentTestimonialContainer {
	box-sizing: border-box;
	padding: 1.2rem 2.2rem;
	display: flex;
	justify-content: space-between;
	gap: 2rem;
	align-items: center;
	border: 1px solid #19223B;
	border-radius: 4px;
}

.apDividerLeftStats {
	width: 100%;
	margin: 1rem 0;
	height: 1px;
	background: #CCCCCC;
}

.apDescriptionRow {
	position: relative;
	display: flex;
	align-items: center;
	height: 3rem;
	width: 100%;
}

@media(max-width: 768px) {

	.apDescriptionRow {
		display: block;
		height: auto;
	}

	#searchOptions {
		display: block;
		max-height: 1000px;
		/* Arbitrary large value to allow the content to fully expand */
		transition: max-height 0.5s ease-in;
	}
}

.apTagsContainer {
	width: 100%;
	display: flex;
	gap: 2rem;
	flex-wrap: wrap;
}

.apTags,
.apTagsBTN {
	padding: 1rem 2rem;
	background: #EEEEEE;
	border-radius: 4px;
	transition: background 0.3s;
}

.apTagsBTN:hover {
	background: #19223B;
	color: #FFFFFF;
}

.apLocalLifeContainer {
	display: flex;
	justify-content: space-between;
	gap: 2rem;
}

.apLocalLifeLeft {
	width: 60%;
	box-sizing: border-box;
}

.apLocalLifeRight {
	width: 40%;
	box-sizing: border-box;
	background: #EEEEEE;
	border-radius: 4px;
	padding: 1.5rem 2rem;
}

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

.apLocalLifeTransportNumber {
	padding: .2rem .6rem;
	background: #DDDDDD;
	box-sizing: border-box;
	border-radius: 4px;
}

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

.apCalculateContainer {
	width: 100%;
	padding: 3rem 4rem 4rem 4rem;
	background: #EEEEEE;
	box-sizing: border-box;
}

.apCalculateInput {
	width: 100%;
	box-sizing: border-box;
	height: 4rem;
	padding: 0 1.5rem;
	background: #FFFFFF;
	border: 1px solid #19223B;
	outline: none;
	border-radius: 4px;
}

.apCalculateOptionBTN {
	padding: .2rem .6rem;
	background: #CCCCCC;
	box-sizing: border-box;
	border-radius: 4px;
	color: #19223B;
	transition: background .3s, color 0.3s
}

.apCalculateOptionBTN:hover {
	background: #19223B;
	color: #FFFFFF;
}

.apCalculateBTNContainer {
	width: 100%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	gap: 2rem;
}

.apCalculateBTN {
	width: 65%;
	justify-self: center;
	box-sizing: border-box;
	padding: 1rem 2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: #19223B;
	color: #FFFFFF;
	transition: background 0.3s, color 0.3s;
}

.apCalculateBTN:hover {
	color: #FFFFFF;
	background: #B7A368;
}

.apCalculateAdviceBTN {
	width: 35%;
	box-sizing: border-box;
	padding: 1rem 2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: #B7A368;
	color: #FFFFFF;
	transition: background 0.3s, color 0.3s;
}

.apCalculateAdviceBTN:hover {
	color: #FFFFFF;
	background: #19223B;
}

.apInterestContainer {
	width: 100%;
	padding: 7rem 3rem 8rem 3rem;
	box-sizing: border-box;
	background: #EEEEEE;
}

.apInterestBoxContainer {
	display: flex;
	justify-content: space-between;
	gap: 3rem;
}

.apInterestBox {
	position: relative;
	width: 20%;
	border: 1px solid #CCCCCC;
	box-sizing: border-box;
	background: #FFFFFF;
}

.apInterestInfoBox {
	position: relative;
	width: 20%;
	border: 1px solid #CCCCCC;
	box-sizing: border-box;
	background: #FFFFFF;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0 3rem;
}


/* energy grades */

.energy-scale {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.energy-level {
	height: 20px;
	margin: 5px 0;
	position: relative;
	background: #ccc;
	text-align: right;
	color: #FFFFFF;
	font-weight: 900;
}

.energy-level[data-grade="A"] {
	width: 70px;
	background: #014E00;
}

.energy-level[data-grade="B"] {
	width: 90px;
	background: #047B01;
}

.energy-level[data-grade="C"] {
	width: 110px;
	background: #81B001;
}

.energy-level[data-grade="D"] {
	width: 130px;
	background: #F7F300;
}

.energy-level[data-grade="E"] {
	width: 150px;
	background: #F79101;
}

.energy-level[data-grade="F"] {
	width: 170px;
	background: #F74D00;
}

.energy-level[data-grade="G"] {
	width: 190px;
	background: #F72400;
}

.energy-level::after {
	content: '';
	position: absolute;
	right: -20px;
	top: 0;
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 20px solid currentColor;
}

.energy-level[data-grade="A"]::after {
	border-left: 20px solid #014E00;
}

.energy-level[data-grade="B"]::after {
	border-left: 20px solid #047B01;
}

.energy-level[data-grade="C"]::after {
	border-left: 20px solid #81B001;
}

.energy-level[data-grade="D"]::after {
	border-left: 20px solid #F7F300;
}

.energy-level[data-grade="E"]::after {
	border-left: 20px solid #F79101;
}

.energy-level[data-grade="F"]::after {
	border-left: 20px solid #F74D00;
}

.energy-level[data-grade="G"]::after {
	border-left: 20px solid #F72400;
}


/* Energy grades - end */

.containerHero::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: 1;
}

.containerHero>* {
	position: relative;
	z-index: 2;
}

.containerFeatPropertiesWrapper {
	position: relative;
}

.slider-navigation-button {
	position: absolute;
	top: 0;
	height: 100%;
	z-index: 10;
	background: transparent;
	border: none;
	cursor: pointer;
	width: 50px;
	font-size: 24px;
	color: #000;
	display: flex;
	align-items: center;
	justify-content: center;

}

.slider-navigation-button::before {
	content: '';
	background-color: #B7A368;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 30px;
	height: 30px;
	transform: translate(-50%, -50%);
	z-index: -1;
}

.slider-navigation-button.left {
	left: 0;
}

.slider-navigation-button.right {
	right: 0;
}

/*.slider-navigation-button:active {
	background-color: rgba(183, 163, 104, 0.3);
}*/



.containerFeatProperties {
	display: flex;
	overflow-x: auto;
	/*width: 100%;*/
	scrollbar-width: none;
}


.locationMainText {
	width: 50%;
	margin: 0px 20px;
}

.locationSearch {
	width: 50%;
	display: grid;
	justify-content: space-around;
	background-color: #19223B;
}

@media(max-width: 768px) {

	.locationMainText {
		width: 90%;
		margin: 20px;
	}

	.locationSearch {
		display: none;
	}

	.containerFeatProperties>.featPropertiesContent {
		flex: 5 0 calc(50% - 12px);
	}

	.containerInformativeGrid {
		flex-wrap: wrap;
		justify-content: space-around;
	}
}

.containerFeatProperties::-webkit-scrollbar {
	display: none;
}

/*.featPropertiesContent {
	flex: 5 0 calc(25% - 12px);
}*/

.text2rows {
	line-height: 1.2em;
	max-height: 2.4em;
	/* 2 lines */
	overflow: hidden;
	display: -webkit-box;
	/*-webkit-line-clamp: 2;*/
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
}

.containerAboutRight .colorGold {
	/*font-size: 34px;*/
	font-style: italic;
}

.containerHero .flex {
	display: unset;
}

.flex2 {
	display: flex;
}

@media(max-width: 768px) {
	.registerLeft {
		width: 100%;
		padding-right: 20px;
		padding-left: 20px;
		text-align: left;
	}

	.containerRegister {
		display: flex;
		flex-wrap: wrap;
	}

	.registerRight {
		width: 100%;
		padding-left: 20px;
		padding-right: 20px;
		padding-top: 50px;
	}

	.containerAboutLeft,
	.containerAboutLeft2,
	.containerAboutLeft3,
	.containerAboutLeft4,
	.conatinerAboutLeft5,
	.containerAboutLeft6 {
		display: none !important;
	}

	.flex {
		flex-direction: column;
	}

	.flex1 {
		flex-direction: row;
	}

	.containerAbout {
		opacity: 1 !important;
	}

	.containerHero .flex {
		text-align: center;
	}

	.containerHero2 .flex {
		text-align: center;
	}
}

.video-background {
	position: relative;
	width: 100vw;
	/* Adjust width as necessary */
	height: 70vh;
	/* Adjust height as necessary */
	overflow: hidden;
}

.video-background video {
	position: absolute;
	top: 40%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: -1;
	transform: translate(-50%, -25%);
}

.video-background .content {
	position: relative;
	z-index: 2;
	/* Ensure content is above the overlay */
	/* Additional styling for your content */
}

ul.fa-ul {
	list-style-type: none;
	/* Remove default list style */
	padding-left: 0;
}

ul.fa-ul li {
	position: relative;
	padding-left: 30px;
	/* Space for icon */
}

ul.fa-ul li::before {
	font-family: "Font Awesome 5 Free";
	/* Font Awesome */
	content: '\f058';
	/* FontAwesome icon code */
	position: absolute;
	left: 0;
	top: 0;
	font-size: 15px;
	/* Icon size */
}

.circle {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 80px;
	/* Diameter of the circle */
	height: 80px;
	/* Diameter of the circle */
	background-color: #B7A368;
	/* Blue background, change as needed */
	color: #19223B;
	/* Text color */
	border-radius: 50%;
	/* This makes the square a circle */
	font-size: 60px;
	/* Adjust based on your design needs */
	font-weight: bold;
	/* Makes the number bold */
}

.background-with-shadow {
	position: relative;
	/* Needed for absolute positioning of pseudo-element */
	background-size: cover;
	/* Cover ensures the image covers the div */
	background-position: center;
	/* Centers the background image */
}

.background-with-shadow::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/* Cover the entire width of the div */
	height: 100%;
	/* Cover the entire height of the div */
	background: linear-gradient(to left,
			rgba(238, 238, 238, 1) 10%,
			/* Starting from top left with 50% opacity black */
			transparent 70%
			/* Gradually fading to transparent */
		);
	pointer-events: none;
	/* This makes the shadow click-through */
}

.background-with-shadow-right {
	position: relative;
	/* Needed for absolute positioning of pseudo-element */
	background-size: cover;
	/* Cover ensures the image covers the div */
	background-position: center;
	/* Centers the background image */
}

@media(max-width: 768px) {

	.background-with-shadow-right {
		display: none;
	}
}

.background-with-shadow-right::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/* Cover the entire width of the div */
	height: 100%;
	/* Cover the entire height of the div */
	background: linear-gradient(to right,
			rgba(238, 238, 238, 1) 10%,
			/* Starting from top left with 50% opacity black */
			transparent 70%
			/* Gradually fading to transparent */
		),
		linear-gradient(to bottom,
			rgba(238, 238, 238, 1) 5%,
			/* Starting from top left with 50% opacity black */
			transparent 40%
			/* Gradually fading to transparent */
		);
	pointer-events: none;
	/* This makes the shadow click-through */
}


/***************************************************************/

.containerCounter {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
}

@media(max-width: 768px) {
	.containerCounter {
		flex-wrap: wrap;
	}
}

.containerCounterItem {
	width: 40vh;
	text-align-last: center;
	margin: 4rem;
}

.containerInfoIcons {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.containerInfoIconsItems {
	text-align-last: center;
	margin: 4rem;
	min-height: 30vh;
}

.containerCenter {
	text-align: center;
}

.descIcon {
	font-size: 8rem;
	padding-bottom: 4rem;
}

.buttonsInRow {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.actionBTNGold {
	font-size: 2rem;
	line-height: 0;
	border-radius: 8px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	background: #B7A368;
	color: #19223B;
	min-width: -webkit-fill-available;
	height: 5rem;
	transition: background 0.3s;
}

.actionBTNGold:hover {
	background: var(--color-blue);
	color: var(--color-white);
}

.actionBTNGoldWhite {
	font-size: 2rem;
	line-height: 0;
	border-radius: 8px;
	display: flex;
	/*padding: 5px;*/
	justify-content: center;
	align-items: center;
	font-weight: 500;
	background: #B7A368;
	color: var(--color-white);
	min-width: -webkit-fill-available;
	height: 5rem;
	transition: background 0.3s;
}

.actionBTNGoldWhite:hover {
	background: var(--color-blue);
	color: var(--color-white);
}

.actionBTNWhite {
	display: inline;
	background: none;
	color: #19223B;
	border: 2px solid #19223B;
	border-radius: 8px;
	box-sizing: border-box;
	padding: 1rem 2rem;
	min-width: -webkit-fill-available;
	transition: background 0.3s, color 0.3s;
}

.actionBTNWhite:hover {
	background: #19223B;
	color: #FFFFFF;
}


.imageContent {
	padding: 10rem 0 10rem 0;
	text-align-last: center;
	height: 40rem;
}

.noWrap {
	text-wrap: nowrap;
}

.containerRegistration {
	padding: 0 0 8rem 0;
	background-color: #EEEEEE;
}

.itemWithNumber {
	display: inline-flex
}

@media screen and (max-width:768px) {
	.itemWithNumber img {
		/*display: none;*/
	}

	.itemWithNumber span {
		display: none;
	}

	.itemWithNumber {
		flex-direction: column;
		align-items: center;
	}
}

.itemWithNumberActionBTN1 {
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 0;
	padding: 2rem 2rem;
	background: var(--color-blue);
	border: 2px solid #B7A368;
	color: var(--color-gold);
	box-sizing: border-box;
	transition: background 0.3s, color 0.3s;
	float: left;
}


.itemWithNumberActionBTN1:hover {
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 0;
	padding: 2rem 2rem;
	background: var(--color-gold);
	border: 2px solid #B7A368;
	color: var(--color-blue);
	box-sizing: border-box;
	transition: background 0.3s, color 0.3s;
	float: left;
}

.icon-span {
	display: inline-block;
	font-size: 2em;
	vertical-align: middle;
	padding: 0 1em 1rem 0;
}

/****************************** MEDIA ********************************/

@media (min-width: 1054px) {
	.mapPropDetailContainer {
		height: calc(100vh - 21rem) !important;
	}
}

@media (max-width: 1054px) {
	#map {
		height: 100% !important;
		border: 0 !important;
		width: 100% !important;
		min-height: 300px;
	}

	.mapPropDetailContainer {
		width: 100% !important;
		position: relative;
		/* Adjust positioning as needed */
		bottom: 0;
		right: 0;
		z-index: 1;
	}

	.parentContainer {
		height: 118rem;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		/* This ensures that the children stretch to fill the container width */
	}

	.mapPropSortContainer {
		display: flex !important;
		flex-direction: row !important;
		height: fit-content !important;
		width: 100% !important;
		align-content: center !important;
	}

	.mapPropPropertyDetailContainer {
		display: flex !important;
		flex-direction: row !important;
		width: 100% !important;
		/*max-height: calc(100vh - 32.2rem);*/
		height: -webkit-fill-available;
	}


	.containerContactsSplit {
		width: 50%;
		box-sizing: border-box;
	}

}

@media (min-width: 549px) and (max-width: 768px) {
	.mapPropPropertyDetailContainer {
		display: flex !important;
		flex-direction: row !important;
		width: 100% !important;
		height: -webkit-fill-available;
	}
}

@media (max-width: 768px) {
	.heroInputType {
		height: 5rem;
		border-radius: 8px;
	}

	.heroInputField {
		width: 29rem !important;
	}
}

@media (max-width: 548px) {
	/*.mapPropSortDropContainer {
		flex-direction: column;
	}*/

	/*.mapPropSortBTNContainer {
		margin-top: 50px;
	}*/

	/*.mapPropSortContainer {
		flex-direction: column !important;
	}*/

	.order {
		width: 9rem !important;
	}

	.order_by {
		width: 15rem !important;
	}
}

@media (min-width: 1281px) {
	.parentContainer {
		height: 91vh !important;
	}
}

@media (min-width: 1361px) {
	.containerFull .containerFeatPropertiesWrapper {
		width: 135.2rem;
		margin: 0 auto;
		position: relative;
	}

	.containerFull .flex1 {
		width: 135.2rem;
		margin: 0 auto;
	}
}

@media (max-width: 1360px) {
	.breadcrumbs {
		margin-top: 100px;
	}

	.featPropertiesContent {
		min-width: 32rem !important;
	}

	.parentContainer {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		/* height: 95vh;
		This ensures that the children stretch to fill the container width */
	}

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

	}

	.heroFlex {
		display: flex;
		flex-direction: row;
		justify-content: center;
	}

	.heroInputFieldPre {
		border-radius: 8px 0 0 8px;
	}

	.heroInputField {
		border-radius: 8px !important;
	}

	.heroInputType {
		border-radius: 8px !important;
		border-right: none !important;
	}

	.containerContactsMobile {
		margin: 0rem 2rem !important;
	}
}

.testimonial-item {
	display: none;
}

.testimonial-item.active {
	display: block;
}