:root {
		--black: 			#000000;
		--indigo: 			#233047;
		--blue-highlight: 	#098bf3;
		--blue-focus: 		#66afe9;
		--purple-on-white:	#36064a;
		--purple-darkest: 	#240033;
		--purple-dark: 		#431e52;
		--purple-mid: 		#5a3292;
		--purple-lt: 		#e1dce9;
		--pale-purple: 		#956cad;
		--pale-sky: 		#f3f3fb;
		--pink: 			#f0c8ff;
		--text: 			#44403b;
		--muted: 			#777777;
		--grey-dark: 		#333333;
		--grey-heather: 	#a8a6a1;
		--stone: 			#edece9;
		--steam: 			#f4f4f4;
		--offwhite: 		#F8F7F4;
		--bg: 				#ffffff;
		--white: 			#ffffff;
	}

	* {
		margin-top:0px; 
		margin-bottom:0px; 
		padding:0px;
	}
	
	body {
		display:flex; 
		display:-webkit-flex; 
		flex-direction:column; 
		-webkit-flex-direction:column; 
		background-color: var(--offwhite);
		color: var(--text); 
		font-family:Poppins, sans-serif, Roboto, helvetica;
		font-size: 16px;
		margin:0;
		position:relative;
	}
							 
	body, html {
		min-height: 100vh;
		overflow-x:hidden;
		width:100%;
	}
	
	html {
		font-size: unset;
	}
	
	.asset_sprite {
		background-repeat:no-repeat; 
		background-image:url(/_images/_sprites_bg.png); 
		display:block;
	}


/*	.................... PRIMARY CONTENT BLOCKS ..................................................................................................... */

	section {
		float:left;
		width:100%;
	}

	/*section:first-of-type {
		padding:0px;
	}*/
	
	body > section:not(:first-of-type) {
		z-index: 0;
	}

	.banner .carousel-caption,
	.banner h1 + p {
		font-size:2rem;
		position: relative;
	}

	.banner .carousel-caption,
	.banner h1 + p {
		color: var(--white);
		margin:0px auto 3em auto;
	}

	.contain-x {
		display: inline-block;
	}

	.content_panel h3 {
		font-weight:normal;
	}

	section.banner h1,
	section.banner h2 {
		letter-spacing:1px;
	}

	/*section.banner h1 {
		font-weight:300;
	}*/

	.banner,
	section.banner .item,
	section.banner .website_tab .thumb {
		background-repeat:no-repeat !important;
		background-size:cover !important;
	}

	.banner .background {
		background:#999;
		position:absolute;
		display:block;
		filter: blur(2px);
		top: 0;
		left: 0;
		z-index: -1;
	}


	section.banner .item {
		background-position:center !important;
		min-height:500px;
		margin-bottom:30px;
	}
	
	

	.full_content {
		padding-left:0px;
		padding-right:0px;
	}	

	.full_content * {
		float:left;
		text-align:center;
	}
	
	.full_content > * {
		-webkit-flex-direction: column;
		flex-direction: column; 
		
		background-repeat:repeat;
		background-size: cover;
		min-height:350px;
		padding-bottom:15px;
		padding-top:15px;
	}
	
	.full_content h2,
	.full_content h3 {
		font-size:2rem;
		font-weight: bold;
		margin:0 auto auto auto;
		padding-top: 1em;
		width:100%;
	}

	.btn,
	.button {
		background-color:  var(--grey-dark);
		color: var(--white);
		cursor:pointer;
		float:left; 
		font-size:18px;
		font-weight:700;
		letter-spacing:0.5px;
		padding:15px 25px;
		text-decoration: none;
		width:auto;
	}
	
	
	


/* .................... SECONDARY (COMMON) LAYOUT STYLING ............................................................................................. */

	#project-examples {
		/*background-color: var(--white);*/
		padding-top:30px;
	}

	#project-examples > * {
		margin-bottom:30px;
	}

	#project-examples > *,
	#project-examples > * > div {
		color:inherit;
		text-align:center;
	}


/* .................... GENERAL PAGE STRUCTURE ...................................................................................................... */

	body > #intro,
	#banner-main,
	#banner-main > .container,
	#home #service-props,
	#home #service-props a,
	#projects .examples *,
	.flex-group,
	.full_content,
	.full_content > *,
	.asset.button,
	#accreditations {
		display: -webkit-flex;
		display: flex;
	}
							
	.flex-group,
	.full_content {
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	
	.full_content a:hover {
		text-decoration:none;
	}
	
	
	#home #service-props {
		flex-direction:row;
		-webkit-flex-direction:row;
		flex-wrap:wrap;
		-webkit-flex-wrap:wrap;
	}


	body > #intro,
	#banner-main,
	#home #service-props a {
		align-items: center;
		-webkit-align-items: center;
	}

	#home #service-props a {
		justify-content: center;
		-webkit-justify-content: center;
	}


	body > #intro,
	#banner-main {
		flex-direction:column;
		-webkit-flex-direction:column;		
		background-position:center top;
		background-repeat:no-repeat;
		background-size:cover;
		float: left;
		min-height:40vh;
		position:relative;
		width:100%; 
	}
	
	#intro .more,
	#banner-main .asset.button {
		margin:2em auto;
		width:auto;
	}

	#banner-main picture,
	#banner-main picture img {
		position:relative;
	}

	#banner-main h1 {
		padding-top: 2vw;
		font-size:3.7em;
	}
	 
	#banner-main h1,
	#banner-main h1 + p {
        color:  var(--grey-dark);
		margin: 2vw auto 0px 0px;
	}

	#banner-main .asset.button {
		margin: 4vw auto 2em 15px;
		max-width: 375px;
		min-width: 33%;
		width: auto;
	}
		
	
	.asset.button {
		align-items: center;
		-webkit-align-items: center;
		border-radius: 4px;
		line-height: normal;
		text-align:center;
	}

	.prop_tile .btn span,
	.asset.button {
		background-color: var(--purple-dark);
		color: var(--white);	
	}
		
	.btn svg,
	.asset.button svg,
	body#home .property-listing .property-card .property-info svg.arr-right {
		fill:  var(--pink);
		margin-left:8px;
	}
	
	
	a:hover .asset.button:after,
	.asset.button:hover:after {
		-webkit-transform: rotate(-90deg);
		-moz-transform: rotate(-90deg);
		-o-transform: rotate(-90deg);
	}
	
	.off_white_btn .asset.button {					background-color: #f4f2ee;
													border:5px solid #ffffff;
													color: var(--grey-dark);
													padding: 5px 25px; }
	.off_white_btn .asset.button:after {			color: #b7b7b7; }		
	.off_white_btn a:hover.asset.button:after {		color: #000;	}	
	
	.dark_btn .asset.button {						background-color: #59595a;
													color: var(--white);	}
	.dark_btn .asset.button:after {					color: #ffb941; }		
	.dark_btn a:hover.asset.button:after {			color: #222; }
		
	.turq_btn .asset.button {						background-color: var(--purple-dark);
													color: var(--white);	}
													
	.turq_btn .asset.button:after {					color: #f6a924; }		
	.turq_btn a:hover.asset.button:after {			color: #1d6c82; }
	
	.teal_btn .asset.button {						background-color: #005472;
													color: var(--white);	}
	.teal_btn .asset.button:after {					color: #ffb941; }		
	.teal_btn a:hover.asset.button:after {			color: var(--white); }
	
	.orange_btn .asset.button {						background-color: #e59814;
													color: var(--white);	}
	.orange_btn .asset.button:after {				color: #FFC45F; }		
	.orange_btn a:hover.asset.button:after {		color: #905A00; }
	
	
	
	picture,
	picture img {
		object-fit: cover;
		width: 100%;
	}

	picture {
		display:flex;
		display:-webkit-flex;
		height:100%;		
		overflow: hidden;
	}

	


	.breadcrumb {
		background-color:transparent;
		margin-bottom: 15px;
		padding:15px 0px 0px 30px;
	}
	
	.breadcrumb a {
		color: inherit
	}
	
	.breadcrumb li:last-of-type a {
		cursor: default;
	}
	
	.breadcrumb li:last-of-type a:hover {
		text-decoration: none;
	}
	
	
	
	.desc_row {
		line-height:1.6em;
	}
			
	.desc_row > div > * {
		padding-bottom:3vw;
		padding-top:3vw;
	}
			
	.desc_row h2 {
		font-size:1.6em;
	}



	#remarks {
		background-color: var(--steam);
		color: #40410e;
		padding-bottom:3vw;
		padding-top:4vw;
	}

	#remarks .container {
		background-color: var(--white);
		padding-bottom:3vw;
		padding-top:3vw;
	}
		
	#remarks .leading {
		color: #a09400;
		font-size:22px;
		font-weight: 600;
		margin-bottom:1vw;
		padding-bottom:1vw;
	}



/* .................... FORMS ........................................................................................................................ */

/*
	Textarea,
	Input,
	Select {
		background-color: #ffffff;
		color: #1a2575;
		font-family:tahoma, sans-serif, arial, verdana;
		font-size:1.0em;
		padding:2px;
	}
*/





/* Home page ...................................................................................................................... */
	
	body > #intro h1,
	#banner-main h1,
	#why-choose h2 {
		margin-bottom:3rem;
		margin-top:5rem;
	}
	
	
	#banner-main > div:first-of-type {
		justify-content: center;
		-webkit-justify-content: center;
		height: 100%;
		position: absolute;
	}
	
	
	#banner-main .container:first-of-type {
		text-align:left;
	}
	
	
	
	body > #intro .container > div .asset.button,
	#banner-main .container > div .asset.button {
		margin-top: auto;
	}
	
	
	#venue-tiles,
	.prop_tile {
		color: var(--white);
	}


	
	#credentials > img {
		clear: both;
		float:left;
		height:60px;
	}



/*  Testimonial .................................................................................................................................................................. */

	.testimonial_highlight > * {
		width:100%;
	}

	.testimonial_highlight > * {
		float:left;
		margin-bottom:5px;
		padding-bottom:0px;
		text-align:center;
	}

	.testimonial_highlight {
		float: left;
		margin: auto;
		padding: 50px 0px;
	}

	.testimonial_highlight blockquote { 
		border: none;
		color: var(--purple-dark);
		font-size:3rem; 
		font-weight:bold;
		margin-top:10px; 
		padding:0px 20px;
	}
	
	.testimonial_highlight a:hover {
		text-decoration:none;
	}

	.testimonial_highlight label				{ color: #4e4d4a; font-weight:600; }
	.testimonial_highlight svg 					{ color:  var(--pink); width: auto; }
	.testimonial_highlight > svg:last-of-type 	{ float: right;	}
	.testimonial_highlight label a 				{ color:  var(--grey-dark); }

	.enclose_highlight .testimonial_highlight {
		background-color: var(--steam);
		border: #e0e0e0 5px solid;
		margin-bottom:3em;
	}

	.enclose_highlight .testimonial_highlight label {
		margin-bottom:20px;
	}

	#p-details .testimonial_box,
	#home-page .testimonial_box {
			display:flex;
			display:-webkit-flex;
			-webkit-flex-wrap:wrap;
			flex-wrap:wrap;
			justify-content:center;
			-webkit-justify-content:center;
		}







	@media (max-width: 991px) {

		#info-message .asset.button {
			background-color: #555;
			color: #eee;		
			font-size: 1.5em;
			margin-top: 20px;
			padding: 5px 0px;
			text-align: center;
		}
		
		
		body > #intro .container,
		/*#booking .container,		
		#your-surveyor #meet-us,*/
		#why-choose ul,
		#accreditation ul {
			display: flex;
			display: -webkit-flex;
		}
		
		
		#your-surveyor #meet-us,
		body > #intro .container,
		#banner-main .container/*,
		#booking .container*/ {
			flex-direction: column;
			-webkit-flex-direction: column;
		}

		body > #intro .container > div,
		#banner-main .container > div {
			margin-bottom: 3em;
			width:100%;
		}
		
		
		#service-signposts {
			flex-direction:column;
			-webkit-flex-direction:column;
			padding: 7vw 7vw 0vw 7vw;
		}
		
		#service-signposts.padded > * {
			margin: 0vw 0vw 7vw 0vw;
		}
		
		#service-signposts .button {
			font-size:2rem;
		}
		
		
		#banner-main > div:first-of-type {
			height: unset;
			position:relative;		
		}

		body > #intro h1,
		#banner-main h1 {
			/*color: #005472;*/
			font-size: 3em;
			margin:0px auto;
			padding-top:0px;
		}
		
		#banner-main h1 + p {
			/*color: #005472;*/
			font-size:2.5rem;
		}
		
		#banner-main .asset.button {
			margin: auto;
			padding: 6vw 0px;
		}

		#banner-main picture, 
		#banner-main img {
			margin-top: -10vw;
			padding: 0px 10px;
		}
		
			
			
		section.banner h1, 
		section.banner h2 {
			margin: 20px 0em;
			text-align: center;
		}
		
		
		/*#booking {
			padding-bottom: 0px;
			padding-top:0px;
		}*/
	
		section#intro .container > div,
		section#banner-main .container > div {
			width:100%;
			margin-bottom: 30px;
		}
		
		#accreditation,
		#credentials,
		#accreditation ul {
			float:left;
		}
				
		#accreditation ul {
			flex-direction: row;
			-webkit-flex-direction: row;
			flex-wrap: wrap;
			-webkit-flex-wrap: wrap;
			justify-content: center;
			-webkit-justify-content: center;
			
			padding: 15px 0px;
		}
		
		#accreditation ul > li {
			margin:10px 20px;
			padding-left:35px;
		}
		
		
		#signposts.banner {
			padding-bottom:0px;
		}
		
		#signposts .container {
			display:block;
		}
		
		#signposts .container > * {
			margin-bottom:2em;
		}
		
		section#intro p,
		body > #intro h4,
		#banner-main h4,
		#accreditation ul,
		#why-choose p {
			font-size:1.3em;
		}
		
		
			
		
		.banner .carousel-caption, 
		.banner h1 + p {
			text-align:center;
		}
	}





	@media screen and (min-width: 992px) {
		
		body > #intro {
			padding-bottom:40px; 
			padding-top:80px; 
		}
		
		body > #intro > * {
			width: 75%; 
		}
		
		#banner-main {	
			max-height:600px;
		}
		
		.contain-x {
			padding-left: 7vw;
			padding-right: 7vw;
		}
		
		#why-choose li {
			width:33%;
		}
		
	}