*{


	box-sizing: border-box;

	--bg1: #F5F6FB;
	--bg2: #CAEBFF;

	--white100: #F5F6FB;
	--black100: #1C1C1C;

	--primary: #4557A8;
	--secondary: #F5292A;


	border: none;
	padding: 0;
	margin: 0;


	--thin: 100;
	--light: 300;
	--regular: 400;
	--medium: 600;
	--bold: 700;
	--heavy: 900;


	--hero-image-url: url("../img/hero-image.jpeg");

	--services-box-1: url("../img/services 1.png");
	--services-box-2: url("../img/services 2.png");
	--services-box-3: url("../img/services 3.png");
	--services-box-4: url("../img/services 4.png");

	--choose-box-1: url("../img/choose 1.png");
	--choose-box-2: url("../img/choose 2.png");
	--choose-box-3: url("../img/choose 3.png");
	--choose-box-4: url("../img/choose 4.png");


	--property-box-1: url("../img/property 1.png");
	--property-box-2: url("../img/property 2.png");
	--property-box-3: url("../img/property 3.png");
	--property-box-4: url("../img/property 4.png");
	--property-box-5: url("../img/property 5.png");
	--property-box-6: url("../img/property 6.png");


	--commercial-box-a: url("../img/commercial_1.jpg");
	--commercial-box-b: url("../img/commercial_2.jpg");
	--commercial-box-c: url("../img/commercial_3.jpg");
	--commercial-box-d: url("../img/commercial_4.jpg");

	--res-box-e: url("../img/res1.jpg");
	--res-box-f: url("../img/res2.jpg");
	--res-box-g: url("../img/res3.jpg");
	--res-box-h: url("../img/res4.jpg");


	--listing-box-a: url("../img/listing 1.jpg");
	--listing-box-b: url("../img/listing 2.jpg");
	--listing-box-c: url("../img/listing 3.jpg");
	--listing-box-d: url("../img/listing 4.jpg");
	--listing-box-e: url("../img/listing 5.jpg");
	--listing-box-f: url("../img/listing 6.jpg");
	
	--sales-box-a: url("../img/sales 1.jpg");
	--sales-box-b: url("../img/sales 2.jpg");
	--sales-box-c: url("../img/sales 3.jpg");
	--sales-box-d: url("../img/sales 4.jpg");

	--contact-a: url("../img/c1.jpg");
	--contact-b: url("../img/c2.jpg");
	--contact-c: url("../img/c3.jpg");

	--body-font:   "Poppins", serif !important;
	--title-font:  "DM Serif Display", serif !important;
	--title-font:  "Poppins", serif !important;
	--title2-font:  "DM Serif Display", serif !important;

	--number-font: "Stardos Stencil", serif !important;

	/* base size 16px -> 1 rem
	and typescale ratio: 1.250 */
/*
For Laptop and Bigger Screens */



/*
For Tablets 
--h8: 12px; 
--h7: 14px;
--h6: 18px;
--h5: 22px;
--h4: 28px;
--h3: 35px;
--h2: 44px;
--h1: 55px;

*/




	--px21: 1.3125rem;
	--px26: 1.625rem;
	--px32: 1.524rem;
	--px48: 2.286rem;
	--px56: 2.667rem;
	--px70: 4.006rem;
	--px18: 1.125rem;
	--px36: 1.714rem;

	--px64: 3.048rem;
	--px16: 1rem;
	--px8: 0.381rem;
	--px178: 8.476rem;
	--px294: 14rem;
	--px230: 10.952rem;
	--px4: 0.19rem;

	--px256: 12.19rem;
	--px508: 24.19rem;
	--px1008: 48rem;

	--px435: 20.714rem;
	--px412: 19.619rem;
	--px356: 22.25%;
	--px156: 7.429rem;
	--px108: 5.143rem;
	--px100: 4.762rem;
	--px456: 30%;
	--px560: 26.667rem;
	--px400: 19.048rem;
	--px408: 19.429rem;
	--px40: 1.905rem;
	--px530: 25.238rem;
	--px464: 456px;






}


body {


		background-color: var(--bg1);
		padding: 0;
		margin: 0
		color: var(--black100);

}

#response {


			display: none;
			box-shadow: 0 0 15px 10px var(--primary);
			width: 75vw;
			height: 75vh;
			position: fixed;
			top: 12.5vh;
			left: 12.5vw;



		    padding: 32px 32px;
		    font-size: var(--h4);




		    flex-direction: column;

		    align-items: flex-end;

		    justify-content: space-evenly;



		    background-color: var(--white100);
			


}


#mail-response {

			font-weight: 400;
			font-family: var(--title2-font);
			display: grid;
			justify-content: center;
			align-items: center;
			width: 100%;


}


#close-response {



}

#menupop {


		display: none;

		width: 100%;
		height: 100vh;

		flex-direction: column;
		justify-content: space-between;
		align-items: center;
}

#popup {


		text-decoration: none;
		font-size: var(--h4);
		font-family: var(--title-font);
		color: var(--primary);
}

#popup:hover {

			text-decoration: underline;
			text-decoration-color: var(--secondary);
}

.close-btn-space {

		width: 100%;
		display: grid;
		justify-content: flex-end;
		padding: 16px;
}

#closer {


		cursor: pointer;
}



#loader {


    	background-image: url(../img/loader.gif);
    	background-size: 100% 100%;
    	background-position: center;
    	background-repeat: no-repeat;


		box-shadow: 0 0 4px 4px var(--primary);


    	display: none;
		position: fixed;

		z-index: 1;
		height: 50vh;
		width: 20vw;
		top: 25vh;
		left: 40vw;
}



.font-100{

			font-weight: var(--thin) !important;
		

}


.font-300 {


		font-weight: var(--light) !important;


}


.font-400 {


		font-weight: var(--regular) !important;


}


.font-600 {

		font-weight: var(--medium) !important;
}

.font-700 {

			font-weight: var(--bold) !important;
}


.font-900 {


			font-weight: var(--heavy) !important;
}


.text-align-left {

			text-align: left !important;
}


.text-align-center {

			text-align: center !important;
}

.text-align-none {

			text-align: none !important;
}

.font-family-body {

  		font-family: var(--body-font);


}

.font-family-title {


		font-family: var(--title2-font);
}


.color-bg1 {


		color: var(--bg1) !important;
}

.color-bg2 {


		color: var(--bg2) !important;
}


.color-black {

		color: var(--black100) !important;
}

.color-blue {

		color: var(--primary) !important;
}

.color-red{


		color: var(--secondary) !important;
}




button {

		padding: 12px 16px;
		font-weight: 600;
		color: var(--white100);
		background-color: var(--secondary);
  		font-family: "Poppins", serif !important;
  		border-radius: 4%;
}

li {

		font-size: 1rem;
		font-weight: 600;
		color: var(--primary);
  		font-family: "Poppins", serif !important;

}



li:hover {


		cursor: pointer;
		text-decoration: underline;
		text-decoration-color: var(--secondary);
		text-decoration-thickness: 2px;
		text-decoration-skip-ink: none;

}

a:hover, #links:hover {


		text-decoration: underline;
		text-decoration-color: var(--secondary);
		text-decoration-color: var(--primary);
		text-decoration-thickness: 1px;
		text-decoration-skip-ink: none;

}

#active {

		text-decoration: underline;
		text-decoration-color: var(--secondary);
		text-decoration-thickness: 2px;
		text-decoration-skip-ink: none;
}

ul {


 		list-style: none;
    	margin: 0;
    	padding: 0;


}


ul, nav {

		display: flex;
		column-gap: 16px;
		justify-content: space-between;
		align-items: center;

 		list-style: none;
    	margin: 0;
    	padding: 0;

}


#info-links {


		row-gap: 8px !important;
}


#hamburger {


		display: none;
		cursor: pointer;
}

#mobile-logo {


		display: none;
}

h1 {


	font-size: var(--h1);

	font-weight: 400;
  	font-family: "DM Serif Display", serif !important;

  	color: var(--primary);

  	line-height: 1.2;

}



h2 {

	font-size: var(--h2);
	
	font-weight: 900;
  	font-family: "DM Serif Display", serif !important;
  	color: var(--primary);

}



h3 {

	font-size: var(--h3);
	font-weight: 600;
  	font-family: var(--title-font);
  	color: var(--primary);

}


h4 {

	font-size: var(--h4);
	font-weight: 600;
  	font-family: "Poppins", serif !important;
  	text-align: center;
  	width: 100%;

}

h5 {

	font-size: var(--h5);
  	font-family: "Poppins", serif !important;
  	width: 100%;


}

.bold-black-21 {

	font-size: var(--h7);
	font-weight: 900;
  	font-family: "Poppins", serif !important;
  	text-transform: uppercase;
  	color: var(--black100);

}

h6 {

	font-size: var(--h6);

	font-weight: 400;
  	font-family: "Poppins", serif !important;

}

.h6_bold {

			font-weight: 600 !important;
			text-align: center;

}	



h7 {

	font-size: var(--h7);

	font-weight: 400;
	font-family: var(--body-font);

}

small {


		font-size: var(--h8);
		color: var(--black100);
		font-family: var(--body-font);

		font-weight: 300;
}


h8 {

	font-size: var(--h8);
	font-weight: 300;
	color: var(--white100);
	font-family: var(--body-font);

}


.hideme {


		display: none !important;
}

.footer-info {

	font-size: var(--h8);
	font-weight: 300;
	color: var(--black100);
	font-family: var(--body-font);
	text-align: center;

}



#footer-p-text {


	font-size: var(--h8);
	font-weight: 300;
	color: var(--black100);
	font-family: var(--body-font);

}


#addr-p-text {


	font-size: var(--h7);
	font-weight: 300;
	color: var(--black100);
	font-family: var(--body-font);

}

.footer-line {


					width: 100%;
					height: 1px;
					background-color: rgba(10, 34, 140, 0.56);
}

p {

	font-size: var(--h6);

	font-weight: 400;
  	font-family: "Poppins", serif !important;

}


img#circle {


		border-radius: 100px;
}

.p_large {

	/*
		font-size: var(--px32);
		text-transform: uppercase;
		font-family: var(--body-font);

	*/
		font-weight: 400;
		color: var(--primary) !important;

}

.p_large {


					font-family: var(--title-font) !important;
					font-size: var(--h3);
}


section {


		padding: 64px 48px;
}




header {

		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0.762rem 0px;
		margin: 0;
		width: 100%;
		height: auto;
}

header[class="header-inner"] {


		padding: var(--px16) var(--px64) !important;


}



.hero {


		width: 58%;
		height: auto;
		padding: 3.048rem 0px;

		display: flex;
		flex-direction: column;
		row-gap: 1.524rem;
		justify-content: space-between;
		align-items: flex-start;
}


.hero-inner {


		width: 100%;
		height: auto;
		padding: var(--px64) 0px;
		row-gap: var(--px64);

		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;

	    background-repeat: no-repeat;
	    background-size: 100% 100%;
}




.hero-inner-p {


		width: 56%;
		font-weight: 400;
}


#bg1 {


		background-color: var(--white100) !important;
}

.button-row {

		display: flex;
		width: 100%;
		justify-content: flex-start;
		align-items: center;
}

.button-light {


				color: var(--secondary);
				border: solid 1px var(--secondary);
				background: none !important;
}


.blue-btn {

			background-color: var(--primary);
			color: var(--white100);
			font-weight: 600;
}

.hero-header {


				display: flex;
				flex-direction: column;
				row-gap: 0px;
				justify-content: flex-start;
				align-items: flex-start;
				padding: 0px 48px;
				height: auto;

				background-image: url("../img/hero-image.jpeg");
				background-size: cover;


			  background: linear-gradient(rgb(245,246,251,0.64), rgb(245,246,251,0.64)) , var(--hero-image-url) center center;
			  background-size: cover;

}


.our-numbers {


				margin: 3.048rem 6.095rem;
				background-color: var(--primary);
				border-radius: 1.524rem;
				padding: 32px;

				display: flex;
				flex-wrap: wrap;
				justify-content: space-around;
				align-items: center;

				height: auto;
				width: auto;

				row-gap: 32px;





}

.number-box {


				display: flex;
				flex-direction: column;
				row-gap: 0.762rem;
				justify-content: space-between;
				align-items: center;
				height: auto;
				width: auto;

}


.number-digit {

					font-size: 1.905rem;
					font-size: var(--h4);
					font-family: var(--number-font); 
					font-weight: 900;

					display: grid;
					justify-content: center;
					align-items: center;
					width: 5.143rem;
					height: 5.143rem;
					border-radius: 4.762rem;

					background-color: var(--white100);

					color: var(--primary);



}


.number-text {


					font-size: var(--h6);
					font-family: var(--body-font); 
					color: var(--white100);
					font-weight: 600;
					width: 100%;
					text-align: center;


}


.about-us {


				display: flex;
				width: auto;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: var(--bg2);
}


.section-row-1 {


						display: flex;
						width: auto;
						height: auto;
						justify-content: space-between;
						column-gap: var(--px32);
						align-items: center;

}


.line-one {


					width: var(--px256);
					height: 1px;
					background-color: var(--secondary);
}

.heading {


					display: flex;
					flex-direction: column;
					row-gap: var(--px16);
					justify-content: space-between;
					align-items: center;
}

.heading-side {


					display: flex;
					flex-direction: column;
					row-gap: var(--px32);
					justify-content: center;
					align-items: flex-start;

}

.side-heading {

					width: 45% !important;
}

.heading-title {


					font-family: var(--title-font);
					font-weight: 700;

}


.heading-subtitle {


					font-family: var(--body-font);
					font-size: var(--h6);
					color: var(--secondary);
					font-weight: 900;
					text-transform: uppercase;

}


.about-us-row-2 {


				 width: 100%;
				 height: auto;

				 display: flex;
				 justify-content: space-between;
				 column-gap: 64px;
				 align-items: center;
}

.p-texts {

					display: flex;
					flex-direction: column;
					justify-content: space-between;
					align-items: flex-start;
					height: auto;
					width: 50%;
					row-gap: var(--px32);


}


.img-block-a {

					width: 50%;
					height: 508px;
					background-color: var(--secondary);
					border-radius: var(--px32);
					background-image: url("../img/about-us-img.jpg");
					background-size: cover;
					background-position: center;

}



.services, .box-blocks, .gallery {

				display: flex;
				width: auto;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: var(--bg1);

}

.gallery {

			background-color: var(--bg1);
}

.p-mid-text {


				text-align: center;
				width: 70%;
				height: auto;
				font-weight: 400;
				font-size: var(--h6);
}

.p-box-text {


				text-align: center;
				width: 100%;
				height: auto;
}


.box-row-435 {


				width: 100%;
				height: auto;
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
				column-gap: 16px;


}

.box-row-412 {


				width: 100%;
			    height: auto;
			    display: flex;
			    justify-content: space-between;
			    align-items: flex-start;
			    column-gap: 16px;

}

.box356 {

			   width: 25%;
			   height: 100%;
			   background-color: var(--secondary);

			   display: flex;
			   flex-direction: column;
			   justify-content: flex-start;
			   align-items: center;
			   row-gap: var(--px16);

			   padding: var(--px32);

			   background-color: var(--bg2);

			   border-radius: var(--px16);

}

.last_box {

			background-color: var(--primary);
			color: var(--white100);
}


#box-circle-services-156 {

					display: grid;
					justify-content: center;
					align-items: center;
					width: var(--px156);
					height: var(--px156);
					border-radius: var(--px100);

					background-color: var(--white100);
					margin-bottom: var(--px16);

					background-size: 70% 70%;
					background-repeat: no-repeat;
					background-position: center;

}


#box-circle-choose-156 {

					display: grid;
					justify-content: center;
					align-items: center;
					width: var(--px156);
					height: var(--px156);
					border-radius: var(--px100);

					background-color: none;
					margin-bottom: var(--px16);

					background-size: 70% 70%;
					background-repeat: no-repeat;
					background-position: center;

}

.box-circle-services-156a {


					background-image: var(--services-box-1);

}


.box-circle-services-156b {


					background-image: var(--services-box-2);

}

.box-circle-services-156c {


					background-image: var(--services-box-3);

}

.box-circle-services-156d {


					background-image: var(--services-box-4);
					background-color: var(--white100);

}


.box-circle-choose-156a {


					background-image: var(--choose-box-1);

}


.box-circle-choose-156b {


					background-image: var(--choose-box-2);

}

.box-circle-choose-156c {


					background-image: var(--choose-box-3);

}

.box-circle-choose-156d {


					background-image: var(--choose-box-4);

}

.property-solutions {



				display: flex;
				width: auto;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: var(--bg2);


}


.box456 {

			   width: var(--px456);
			   height: 100%;
			   background-color: var(--secondary);

			   display: flex;
			   flex-direction: column;
			   justify-content: flex-start;
			   align-items: center;
			   row-gap: var(--px16);

			   padding: var(--px32);

			   background-color: var(--bg1);

			   border-radius: var(--px16);

			   border: solid 1px var(--bg2);

}

.up32 {

			/* margin-top: -32px; */
			margin-top: 0;
}


#box-circle-services-156, #box-circle-property-156 {

					display: grid;
					justify-content: center;
					align-items: center;
					width: var(--px156);
					height: var(--px156);
					border-radius: var(--px100);

					background-color: var(--white100);
					margin-bottom: var(--px16);

					background-size: 70% 70%;
					background-repeat: no-repeat;
					background-position: center;

}


.box-circle-property-156a {


					background-image: var(--property-box-1);

}


.box-circle-property-156b {


					background-image: var(--property-box-2);

}

.box-circle-property-156c {


					background-image: var(--property-box-3);

}


.box-circle-property-156d {


					background-image: var(--property-box-4);

}


.box-circle-property-156e {


					background-image: var(--property-box-5);

}

.box-circle-property-156f {


					background-image: var(--property-box-6);

}


section.property-listings {

				
				display: flex;
				width: 100%;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: var(--bg2);



}


.commercial-property {


						display: flex;
						flex-direction: column;
						row-gap: var(--px16);
						align-items: center;
						justify-content: center;
						height: auto;
						width: 100%;

}


.residential-property {


						display: flex;
						flex-direction: column;
						row-gap: var(--px16);
						align-items: center;
						justify-content: center;
						height: auto;
						width: 100%;

}

.box-row-560 {


					width: 100%;
					height: var(--px560);
					display: flex;
					justify-content: space-between;
					align-items: center;
					margin-top: 16px;
}

#box-row-560 {


				width: 45%;
				height: 100%;

				display: flex;
				align-items: flex-end;
				justify-content: center;

				row-gap: var(--px16);

				background-color: var(--secondary);
				background-position: center;
				background-size: cover;
				border-radius: var(--px16);
}

.box400a {


				background-image: var(--commercial-box-a);


}


.box400b {


				background-image: var(--commercial-box-b);


}

.box400c {


				background-image: var(--commercial-box-c);


}

.box400d {


				background-image: var(--commercial-box-d);


}




.box400e {


				background-image: var(--res-box-e);


}


.box400f {


				background-image: var(--res-box-f);


}

.box400g {


				background-image: var(--res-box-g);


}

.box400h {


				background-image: var(--res-box-h);


}


.light-blue-box {


				width: 100%;
				padding: var(--px16);
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: flex-start;
				row-gap: var(--px16);
				background-color: rgba(69, 87, 168, 0.4);
				border-bottom-right-radius: var(--px16);
				border-bottom-left-radius: var(--px16);
				color: var(--bg1);

}

section.property-sales {

/*
						padding: var(--px64);
					    display: flex;
					    width: auto;
					    margin: 0px var(--px156);
					    column-gap: auto;
					    margin-bottom: var(--px64);
					    justify-content: space-between;
					    align-items: center;
					    border-radius: var(--px64);
					    background-color: var(--primary);

*/

					padding: 64px 64px;
				    display: flex;
				    width: 100%;
				    margin: 0;
				    justify-content: center;
				    align-items: center;



}

.inside-property-sales {

						padding: 64px;
					    display: flex;
					    width: 100%;
					    column-gap: auto;
					    margin-bottom: var(--px64);
					    justify-content: space-between;
					    align-items: center;
					    border-radius: var(--px64);
					    background-color: var(--primary);

}

.property-sales-row-2 {



				display: flex;
				width: 50%;
				height: auto;
				justify-content: space-between;
				align-items: flex-start;
}

.left-text-rows {


			width: 100%;
			height: auto;

			display: flex;
			flex-direction: column;
			row-gap: var(--px64);
			align-items: center;
			justify-content: center;


}

.left-fit-h4 {

			width: 100%;
			color: var(--white100);
			font-size: var(--h5) !important;
			font-weight: 400 !important;

			text-align: left;

}

.center-fit-h4 {

			text-align: center;
			width: 100%;			
}

.left-text-row-box {

			display: flex;
			width: 100%;
			height: auto;
			column-gap: var(--px32);
			justify-content: flex-start;
			align-items: center;
			padding: var(--px16);
			border-radius: var(--px32);
			background-color: var(--bg1);

}

.three-benefits {

			color: var(--white100) !important;
}

.benefit-rows {

			display: flex;
			flex-direction: column;
			width: auto;
			height: auto;
			justify-content: space-between;
			row-gap: var(--px32);
			align-items: center;

}

.sales-box-texts {

					display: flex;
					flex-direction: column;
					row-gap: var(--px16);
					align-items: flex-start;
					justify-content: center;
					height: auto;
					width: auto;
}



.right-img-stack {


			width: 100%;
			height: auto;
			display: flex;
			justify-content: space-between;
			align-items: center;


}

#right-img-stack {

			width: 22%;
			height: var(--px408);
			background-color: var(--secondary);
			border-radius: var(--px16);
			background-size: cover;
			background-position: center;

}

.img-sales-a {

			background-image: var(--sales-box-a);
			background-size: cover;
			background-position: center;

}

.img-sales-b {

			background-image: var(--sales-box-b);
			background-size: cover;
			background-position: center;
	
}

.img-sales-c {

			background-image: var(--sales-box-c);
			background-size: cover;
			background-position: center;
	
}

.img-sales-d {

			background-image: var(--sales-box-d);
			background-size: cover;
			background-position: center;
	
}


section.enquiry-box {


				display: flex;
				width: 100%;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: var(--bg2);


			}


.enquiry-form {


				width: 100%;
				padding: 0px var(--px178);
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				column-gap: 4%;
				row-gap: var(--px64);
				align-items: center;
				height: auto;

}

.input-text-box {

				display: flex;
				flex-direction: column;
				width: 48%;
				row-gap: var(--px8);
				height: auto;
				align-items: flex-start;
}

.label {

		color: var(--black100);
		font-weight: 300;
}

input[type=text], input[type=email], input[type=number] {

				width: 100%;
				height: var(--px40);
				background-color: rgba(245, 246, 251, 0.32);
}

.input-textarea-box {

				width: 100%;

				display: flex;
				flex-direction: column;
				row-gap: var(--px8);
				height: auto;
				align-items: flex-start;

}

textarea {


			width: 100%;
			height: var(--px156);
			background-color: rgba(245, 246, 251, 0.32);
			resize: none;
}


section.subscribe {


				margin: var(--px64) var(--px178);
				padding: var(--px64);
				width: auto;
				height: auto;

				display: flex;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: var(--primary);	
				color: var(--white100);	

				border-radius: var(--px64);	

}

#subscribe-title {

				text-align: center;
}

.subscribe-form {


				width: 100%;
				padding: 0px var(--px230);
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				height: auto;

}

#subscribe-field {

				width: 64%;
}

#subscribe {

			color: var(--white100);
			background-color: rgba(180, 180, 180, 0.16);
			width: 100%;

}

.label-subscribe {

			color: var(--white100) !important;
			font-weight: 600;
			width: 100%;
}

.subscribe-btn {

				color: var(--primary);
}


section.contact {

				display: flex;
				width: 100%;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: rgba(10, 34, 140, 0.56);	
}

.contact-row-2 {

				width: 100%;
				height: auto;
				display: flex;
				justify-content: space-between;
				align-items: center;

}

.contact-img-box {

				display: flex;
				flex-direction: column;
				width: 32%;
				height: auto;
				row-gap: var(--px64);
				align-items: center;
				justify-content: space-between;


}

.contact-box {


				width: 100%;
				padding: var(--px16);
				display: flex;
				flex-direction: column;
				row-gap: var(--px32);
				height: auto;
				align-items: center;
				justify-content: space-between;
				border-radius: var(--px32);
				border: solid 1px var(--white100);
				color: var(--white100) !important;



}

#contact-img {


			height: var(--px530);
			width: 100%;
			display: flex;
			align-items: flex-end;
			justify-content: center;

			background-position: center;
			background-size: cover;

			border-radius: var(--px32);
}

#img-text {

			width: 100%;
			height: auto;
			padding: 8px;
			background-color: rgba(245, 246, 251, 0.64);

			font-size: var(--h6);
			font-weight: 700;
		  	font-family: "Poppins", serif !important;
		  	color: var(--primary);
		  	border-bottom-left-radius: var(--px32);
		  	border-bottom-right-radius: var(--px32);
		  	text-align: center;

}

.contact-img-a {


		background-image: var(--contact-a);
		background-position: center;
		background-size: cover;

}


.contact-img-b {

		background-image: var(--contact-b);
		background-position: center;
		background-size: cover;

}

#white-text {


			color: var(--white100) !important;
}


.contact-img-c {

		background-image: var(--contact-c);
		background-position: center;
		background-size: cover;

}

section.testimonials {

				display: flex;
				width: 100%;
				flex-direction: column;
				justify-content: space-between;
				row-gap: var(--px64);
				align-items: center;
				background-color: var(--bg2);

}


.testi-title {


					color: var(--primary);
}


.testimonial-boxes {


					display: flex;
					width: 100%;
					height: auto;
					justify-content: space-between;
					align-items: center;
}


.testimonial-box {


					width: 30%;
					height: auto;
					display: flex;
					flex-direction: column;
					row-gap: var(--px16);
					padding: var(--px32) var(--px16);
					border-radius: var(--px16);

					background-color: var(--bg1);
}


.testi-text {


				font-family: var(--title2-font);
				font-size: var(--h5);
				text-align: center;
				width: 100%;
				height: auto;
				font-weight: 300 !important;
}


.rating {

					display: flex;
					justify-content: center;
					column-gap: var(--px8);
}


#quote {


				font-size: var(--px156);
				font-weight: 600;
				color: var(--primary);
				width: 100%;

				display: flex;
				line-height: 32px;
}

.quotes-left {

					padding-top: var(--px32);
}

.quotes-right {



					justify-content: flex-end;
					padding-top: 32px;
}


.client {

			width: 100%;
			height: auto;

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


.client-details {

					width: auto;
					height: auto;
					display: flex;
					flex-direction: column;
					row-gap: var(--px8);
					align-items: flex-start;
					color: var(--black100) !important;
}


section.footer {


							display: flex;
							flex-direction: column;
							justify-content: space-between;
							row-gap: var(--px32);
							padding-bottom: var(--px16) !important;
							align-items: center;

}

.footer-top {


					display: flex;
					justify-content: space-between;
					align-items: flex-start;
					column-gap: 96px;
					width: 100%;
					flex-wrap: wrap;
					row-gap: 32px;

}

.ft-column {


			display: flex;
			flex-direction: column;
			row-gap: var(--px32);
			justify-content: space-between;
			align-items: flex-start;

			width: auto;
}

.ft-column-large {


			width: 200px !important;
}


.links {

			display: flex;
			flex-direction: column;
			row-gap: var(--px16);
			justify-content: space-between;
			align-items: flex-start;

}

#links {

	color: var(--black100);
	width: auto;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	column-gap: var(--px16);
	text-decoration: none;
	font-size: var(--h7);
	font-weight: 300;
	color: var(--black100);
	font-family: var(--body-font);

}

#pop {


	color: var(--black100);
	text-decoration: none;
}


.addr {


		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		row-gap: var(--px4);
		justify-content: flex-start;
		align-items: flex-start;
}


#property-page {


		background: linear-gradient(rgba(245, 246, 251, 0.7), rgba(245, 246, 251, 0.7)) , url("../img/property-hero.jpg") center;


		background-repeat: no-repeat;
		background-size: 100% 100%;


}

/* services page css */


.our-services {


			padding: var(--px64);
			display: flex;
			flex-direction: column;
			row-gap: var(--px64);
}

#services-page-image {

			height: var(--px464);
			width: 45%;
			background-size: cover;
			background-position: center;
}

.services-page-image1 {


				background-image: url("../img/our-services1.jpg");

}


.services-page-image2 {


				background-image: url("../img/our-services2.jpg");

}
.services-page-image3 {


				background-image: url("../img/our-services3.jpg");

}
.services-page-image4 {


				background-image: url("../img/our-services4.jpg");

}
.services-page-image5 {


				background-image: url("../img/our-services5.jpg");

}





.services-left {


			display: flex;
			flex-direction: column;
			row-gap: var(--px64);

			width: 45%;
}

.services-title {


			font-family: var(--title-font);
			font-weight: 400;
			font-size: var(--h3);

}


.services-page-subtitle {


			font-size: var(--h6);
			font-family: var(--body-font);
			font-weight: 600;

			width: 100%;
			color: var(--black100);

			text-align: left;


}



#services-page {

		background: linear-gradient(rgba(245, 246, 251, 0.7), rgba(245, 246, 251, 0.7)) , url("../img/services-hero.jpg") center;

	


		background-repeat: no-repeat;
		background-size: 100% 100%;	
}


.services-page-text-rows {


			width: 100%;
			height: auto;

			display: flex;
			flex-direction: column;
			row-gap: var(--px32);
			align-items: flex-start;
			justify-content: flex-start;


}

.services-page-row-box {

			display: flex;
			width: 100%;
			height: auto;
			column-gap: var(--px32);
			justify-content: flex-start;
			align-items: center;


}


.service-page-box-texts {

					display: flex;
					flex-direction: column;
					row-gap: var(--px8);
					align-items: flex-start;
					justify-content: center;
					height: auto;
					width: auto;
}


#services-page-row {



				display: flex;
				width: 100%;
				height: auto;
				justify-content: space-between;
				align-items: center;
				border-radius: var(--px16);
				border: solid 1px var(--bg2);
				padding: var(--px32);

}

.services-page-odd {


				flex-direction: row;


}

.services-page-even {


				flex-direction: row-reverse;
}

		li, button {


				font-size: var(--h6);
				font-weight: 700;
		}


.services-highlight {


    display: flex;
    flex-direction: column;
    row-gap: 32px;

}



	.why-us-page {


		background-color: var(--bg2) !important;

	}


	.why-us-page-box {


			background-color: var(--bg1) !important;
	}


/* media  query for laptops+ */

@media (min-width: 1200px) {

		* {

			--h8: 14px; 
			--h7: 16px;
			--h6: 21px;
			--h5: 26.25px;
			--h4: 32.8px;
			--h3: 41px;
			--h2: 51px;
			--h1: 64px;

		}

		li, button {


				font-size: 18px;
				font-weight: 700;
		}

		section {


			padding: 64px 64px;

		}


		.hero-header {

			padding: 0px 64px;
		}


		.box356 {


				height: 472px;
		}

		#box-row-412 {

				height: 420px !important;
		}


		.button-row {

					column-gap: 3.048rem;
					width: 100%;
					justify-content: flex-start;
					align-items: center;

		}





}

/* media query for mobile exclusively */

@media (max-width: 600px) {

		* {


			--h1: 45px;
			--h2: 38px;
			--h3: 31px;
			--h4: 26px;
			--h5: 22px;
			--h6: 18px;
			--h7: 14px;
			--h8: 13px;

		}


			section {


			padding: 32px 16px;

		}

		#mobile-logo {


				display: block;
		}


		#header-logo {

				display: none;
		}


		.hero-header {

			padding: 0px 16px;
		}

		#hamburger {

				width: 48px;
		}


		section.hero {


				width: 100%;
				padding-top: 0px !important;
		}


		.line-one {


				display: none;
		}


		.hero-inner {


		width: 100%;
		height: auto;
		padding: 32px 0px !important;
		row-gap: 32px !important;


		}

		.hero-inner-p {


				padding: 0px 16px !important;
		}




		.box-row-435, .box-row-412 {


				flex-wrap: wrap !important;
		    	row-gap: 32px !important;
		}

		.box356, .box456 {

				width: 100% !important;

		}

		.p-mid-text {


			width: 100% !important;
		}




		.inside-property-sales {


				flex-direction: column;
				row-gap: 32px;
		}


		.side-heading {

				width: 100% !important;
		}


		.property-sales-row-2 {


				width: 100%;
		}

		.benefit-rows {



		}


		.left-text-row-box {


					flex-direction: column !important;
		}


		.sales-box-texts {

					align-items: center;
					text-align: center;
		}


		section.property-sales {


			padding: 32px;

		}


		.inside-property-sales {


			padding: 32px;
		}

		.contact-img-box {


					flex-direction: column !important;

					row-gap: 16px;


					width: 100%;


					justify-content: space-between;

					align-items: center;

		}


		.contact-row-2 {


					flex-wrap: wrap;
					row-gap: 32px;
		}


		#reverse-box {


		}

		.contact-box {

						flex-direction: row;
						justify-content: space-between;
						width: 100%;
		}


		#contact-img {


						width: 100% !important;
						height: 96px !important;
		}

		.input-text-box {


						width: 100%;
		}

		.enquiry-form {


					padding: 0px;
		}

		#services-page-image {


								height: 256px !important;
				}

		.service-page-box-texts {
		    width: auto;
		}

		.our-services {

				padding: 16px;
		}

		.hero-inner-p {

		    width: 100%;
		    font-weight: 400;
		    font-size: var(--h6) !important;
		    padding: 16px;
		}


		.box-row-560 {


				flex-wrap: wrap;
				row-gap: 32px;
				height: auto !important;
		}

		#box-row-560 {


				width: 100%;
				height: 320px;
		}


		#right-img-stack {


							width: 100%;
			}


		.right-img-stack {


					row-gap: 32px;
					flex-wrap: wrap;
		}	


		.button-row {
    
    			width: 100% !important;
    			justify-content: space-between !important;
    			column-gap: none !important;



    	}



}

@media (min-width: 481px) and (max-width: 600px) {





		section {


			padding: 32px 16px;

		}

		section, div {

				flex-wrap: wrap;
		}

		button {


				font-size: var(--h6);
		}


		nav ul li {

				font-size: var(--h6);
				padding: 12px 14px;


		}


			section.hero {


						width: 100%;
						padding: var(--px32) 0px !important;

			}



				p {

					font-size: var(--h6);


				}

				.hero-header {

					padding: 0px 1.524rem;


				}



				section.hero h1 {

					width: 100%;
					font-size: 2.667rem;
					font-size: var(--h1);

					text-align: center;
					/* --px48: 2.286rem */
					/* --px56: 2.667rem */

				}


				header {


				}




				.our-numbers {


						width: auto;
						margin: 32px;
						padding: 32px 16px;
						align-items: flex-start;
						row-gap: 32px;
						color: orange;

				}


				.number-box {

						width: 50%;
				}

		.button-row {

				    width: 100%;
				    justify-content: space-around;
				    align-items: center;

		}

		#line-one {


		}


		.ft-column, #ft-column-large {


				width: 100% !important;
		}


	#social-links {


				display: flex;
				flex-direction: row !important;
				justify-content: space-between;
				align-items: center;
				width: 100%;
	}

	#social-row {


				width: 100%;
	}


			section.subscribe {


    			margin: var(--px64) 32px;

    		}

}


/* media query for hamburger menu */

@media (max-width: 1199px) {


				ul, nav {

						display: none;
						

				}

				#hamburger {


						display: block;
				}

				#nav-btn {


						display: none;
				}

				.line-one {

						width: 64px;
				}

}


/* for tab devices */

@media (max-width: 1199px) and (min-width: 601px) {


			* {
				--h8: 12px; 
				--h7: 14px;
				--h6: 18px;
				--h5: 22px;
				--h4: 28px;
				--h3: 35px;
				--h2: 44px;
				--h1: 55px;

			}


			section {


						padding: 64px 32px;

			}


			.hero-header {

				padding: 0px 48px;
				align-items: center;
			}



			section.hero {


					width: 80%;
			}





}


@media (max-width: 1199px) {


			.subscribe-form {

					padding: 0px;

		}


		#subscribe-field {


				width: 100% !important;

		}

}


/* other media adjustments for header and footer */


@media (min-width: 601px) and (max-width: 800px) {


			section.hero {

						width: 96% !important;
			}
}

@media (min-width: 841px) and (max-width: 1170px) {



	#social-links {


				display: flex;
				flex-direction: row !important;
				justify-content: space-between;
				align-items: center;
				width: 100%;
	}

	#social-row {


				width: 100%;
	}
}




@media (min-width: 600px) and (max-width: 920px) {



	#social-links {


			display: flex;
			flex-direction: column;
			row-gap: var(--px16);
			justify-content: space-between;
			align-items: flex-start;


	}
}


@media (min-width: 601px) and (max-width: 635px) {


			#contact-column {


					width: 100%;
			}

			#contact-split {


						height: 108px;
						flex-wrap: wrap;
						width: 100%;
						align-items: space-between !important;
			}


			.addr {


					row-gap: 8px !important;
			}

	#social-links {


				display: flex;
				flex-direction: row !important;
				justify-content: space-between;
				align-items: center;
				width: 100%;
	}

	#social-row {


				width: 100%;
	}



}

@media (max-width: 600px) and (min-width: 480px) {



				.ft-column-large {


							width: 100%;
							height: 156px;
							flex-wrap: wrap;
							column-gap: 32px;
							justify-content: center;
				}

				.top-footer {

							width: 50%;
				}





				#info-links {


						height: 56px;
						width: 100%;
						column-gap: 32px;
				}



				#contact-split {

						height: 108px;
						flex-wrap: wrap;
						column-gap: 32px;
				}


}

@media (max-width: 480px) {


			#footer-logo {


						width: 100%;
			}


			.ft-column-large {


					align-items: center;
					width: 100% !important;
			}


			.links {

			display: flex;
			flex-direction: row;
			column-gap: var(--px16);
			justify-content: space-between;
			align-items: center;
			flex-wrap: wrap;
			column-gap: 16px;

			}


			.link-social {


					width: 32% !important;

			}

		.our-numbers {


					margin: 64px 32px !important;
					flex-direction: column !important;
		}

		.contact-box {

						flex-direction: column !important;
						justify-content: center !important;
						align-items: center;
						width: 100%;
		}

			section.subscribe {


    			margin: var(--px64) 16px;

    		}


    		li, button {

			    font-size: 12.5px !important;
			    font-weight: 700;
		}

			.text-align-left {
			    text-align: left !important;
			}


			.button-row button {

				padding: 12px 10px !important;
			}

}


@media (max-width: 400px) {


		#hamburger {

				width: 32px !important;
		}

		#mobile-logo {

				width: 140px;
		}


}

@media (max-width: 1199px) {



			h1 {


				text-align: center;
			}


			section.hero p {


					text-align: center;

			}

			.button-row {


			    width: 100%;
			    justify-content: center;

			    column-gap: 64px;


			}
}


@media (min-width: 956px) and (max-width: 1199px) {


				.our-numbers {


					margin: 64px !important;


				}


}

@media (min-width: 481px) and (max-width: 955px) {


					.number-box {


								width: 50% !important;
					}




}

@media (min-width: 857px) {


			#slideup {


						display: none;
			}
}

@media (max-width: 857px) {


			.about-us-row-2 {


						flex-direction: column-reverse !important;
						row-gap: 32px !important;
			}


			.p-texts {

					width: 100% !important;
			}

			.img-block-a {

				    width: 100% !important;
				    height: 320px !important;

			}


			.testimonial-boxes {


			    display: flex;
			    flex-wrap: wrap;
			    row-gap: 32px;


			}


			.testimonial-box {

					width: 100%;
			}


			#contact-img {


					height: 181px;
					width: 45%;
			}







			#img-text {


					height: 100%;
					display: grid;
					align-items: center;
			}


		#services-page-row {



						display: flex;
						flex-direction: column;
						row-gap: 32px;
						width: 100%;


		}

		.services-left, #services-page-image {


						width: 100%;
						align-items: center;
		}


		#services-page-image {


								height: 508px;
				}


			.services-page-row-box {


					justify-content: center;
			}


			.service-page-box-texts {


					width: 68%;
			}

			.services-title {


				text-align: center;

			}


			#img-text {

				border-radius: var(--px32) !important;

			}

		.up32 {


				display: none;
		}




}			

@media (max-width: 856px) and (min-width: 601px) {

		.box-row-435, .box-row-412 {


				flex-wrap: wrap !important;
		    	row-gap: 32px !important;
		}

		.box356 {

				width: 45% !important;

		}


		#slideup {


					display: flex;

		}

		.up32 {


				display: none;
		}

		.box456 {


				width: 45% !important;

		}

		.inside-property-sales {


				flex-direction: column;
				row-gap: 32px;
		}


		.side-heading {

				width: 100% !important;
		}


		.property-sales-row-2 {


				width: 100%;
		}

		.benefit-rows {



		}

		.contact-img-box {


					flex-direction: row;

					width: 100%;

					column-gap: 32px;

					justify-content: space-between;

					align-items: center;

		}


		.contact-row-2 {


					flex-wrap: wrap;
					row-gap: 32px;
		}


		#reverse-box {


					flex-direction: row-reverse !important;
		}

		.enquiry-form {


				padding: 0px !important;
		}

		#services-page-row {



						display: flex;
						flex-direction: column;
						row-gap: 32px;
						width: 100%;


		}

		.services-left, #services-page-image {


						width: 100%;
						align-items: center;
		}


		#services-page-image {


								height: 508px;
				}


			.services-page-row-box {


					justify-content: center;
			}


			.service-page-box-texts {


					width: 68%;
			}

			.services-title {


				text-align: center;

			}


			.our-services {

				padding: 32px;
			}


				.hero-inner-p {


							    width: 100%;
							    font-weight: 400;
							    padding: 0px 32px;
							}	


			#right-img-stack {


							width: 45%;
			}	


			.right-img-stack {

					flex-wrap: wrap;
					row-gap: 32px;
			}

			section.subscribe {


    			margin: var(--px64) 64px;

    		}


}