/*
Colors:
Green: #11b302
Dk Green: #0b5e04
Mid Green: #23b502
Lt Green: #ceffc9
Red: #ba0202

 */


/* Mobile first approach media queries under <768 pixels
grid (col-xs)
-------------------------------------------------- 
-------------------------------------------------- 
-------------------------------------------------- */

* {
	margin: 0;
	padding: 0;
	border: none
}

body {
	width: 100%;
	/*background: #fff url(/images/bg2.png) repeat-x top left;*/
	background-color:#bc9564;
	font-size: 62.5%;
	font-size: 16px;
	font-family: 'Inter', sans-serif;
	line-height: 26px;
	color: #474747;
}


/* HEADINGS & TYPE
--------------------------------------------------*/

h1, h2, h3, h4, p {
	text-align: left;
	padding-bottom: 20px
}

	.property p {padding-bottom:0;}

h1 {
	font-size: 24px;
	font-weight: bold;
	color: #7f0700;
	border-bottom: double 3px #bc9564;
	padding-bottom: 10px;
	margin-bottom: 10px
}

.eho {height:50px; text-align:center; margin:10px 5px 0 5px;}
.eho img {text-align:center;}

.project h1 {height:50px; margin-top:5px;}

/* Found on /Projects/Default.aspx */
.project-list {
	margin-left: 50px;
}

h2 {
	font-size: 24px;
	font-weight: bold;
	color: #7f0700;
}

.project h2 {font-size:16px;}

h3 {
	font-size: 20px;
	font-weight: bold;
	color: #7f0700;
}

p {
	font-size: 14px
}

.red {color: #7f0700;}

#header {
	width: auto;
	min-height: 200px;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	background: url(/images/Wetzl-Home.jpg) no-repeat center center;
	background-size:cover;
}

.banner h1 {
	border-bottom: none;
	margin-bottom: 10px;
	padding-bottom: 20px;
}

.banner h2 {
	font-size: large;
	padding: 0;
	margin: 0 auto 20px auto;
	text-align: left;
}

.fifty h2 {font-size:1.2em; margin-bottom:0; padding-bottom:0;}

.banner {
	border-bottom: double 3px #ba0202;
	margin-bottom: 10px;
	padding-bottom: 10px;
}

.container {background-color:#fff; padding:30px;}

#slide-header {width:100%; height:130px; margin:0 auto; padding:0;}
	#slide-logo {
		text-align: center;
		position: absolute;
		left: 50%;
		top: 14px;
		transform: translate(-50%, 0);
		z-index: 1000;
		max-width: 190px;
	}

#slide-content {width:100%; margin:0 auto; text-align: center;}
	#slide-content h1 {text-align:center; color:#fff;}

	#slide-content a:link, #slide-content a:visited {color:#fff; text-decoration:underline;}
	#slide-content a:hover, #slide-content a:active {color:gold; text-decoration:underline;}

	#logo {
		text-align: center;
		position: absolute;
		left: 130px;
		top: 0;
		z-index: 1000;
		max-width: 180px;
	}

	#model {width:100%; height:600px; margin-bottom:1px; padding:0; margin:0 auto;}

	.property {
		background-color: #f1f1f1;
		margin: 0;
		padding: 10px 10px 10px 10px;
		border-radius: 5px;
	}

	.property p.right {text-align:center;}
	.property p.ctr {text-align:center;}
	.property p.left {text-align:center;}

.explore {
	background-color: #f1f1f1;
	padding: 20px 14px;
	text-align: center;
	border-radius: 10px;
}

	.explore h2 {
		font-size: x-large;
		text-align: center;
		margin-top: 10px;
		font-style: normal;
	}

	.explore h3 {
		text-align: center;
	}

	.feature {
		display: inline-table;
		background-color: white;
		border: solid 1px #ccc;
		border-radius: 10px;
		height: 200px;
		width: 240px;
		padding: 10px;
		margin: 10px auto;
	}

	.zoom {
		transition: transform .2s; /* Animation */
	}

	.zoom:hover {
		transform: scale(2.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
	}


.welcome {
	/*background-color: #413a2e;
	opacity: 0.90;
	backdrop-filter: opacity(90%);
	height: 136px;*/
	outline: none !important;
	border: none !important;
	padding: 0;
	margin: 0 auto;
}

	#tag {
		height: 135px;
		text-align: center;
		margin-top: 150px;
		padding:0 10px;
		clear: both;		
		background-color:transparent;
	}

		#tag h1 {
			font-style: italic;
			color: #fff;
			font-size: 20px;
			text-align: center;
			border-bottom: none;
		}

	#mid-nav {
		width: 100%;
		margin: 0 auto;
		text-align: center;
		background-color: #413a2e;
		padding: 14px 0;
		font-family: Sans-Serif !important;
	}

		.btn {
			outline: none !important;
			border: none !important;
		}

		.btn-primary {
			background-color: #bd9665 !important;
			color: #000 !important;
			outline-color: goldenrod !important;
			border: none !important;
			font-family: Sans-Serif !important;
			font-size:1em;
			padding:8px;
			border-radius:4px;
		}

		.btn-group, .dropdown, dropdown-toggle {margin:0;}
		#mid-nav .btn {margin-right:5px;}

			.btn-primary:link, .btn-primary:visited {background-color: #bd9665 !important;}
			.btn-primary:hover, .btn-primary:active {background-color: #a58153 !important;}

			.btn:focus, .btn:active {
				outline: none !important;
				box-shadow: none !important;
				border: none !important;
			}

		.btn-primary:not(:disabled):not(.disabled).active:focus,
		.btn-primary:not(:disabled):not(.disabled):active:focus,
		.show > .btn-primary.dropdown-toggle:focus {
			box-shadow: 0 0 0 0.2rem goldenrod;
			border: none !important;
		}

		a.btn-primary:hover {text-decoration:none;}

		.dropdown-toggle, .dropdown-item {
			letter-spacing: 0.04em
		}

		.dropdown-toggle {
			margin: 0 10px;
		}

	.dropdown-item {font-size:1.4em;}

/*#btnHome {display:none;}*/

#logos {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center
}

	#logos ul {
	}

	#logos li {
		display:inline-grid;
		padding: 0 20px;
		list-style: none;
	}


	#bot-nav li {
		list-style: none;
		padding: 3px 20px 0 20px;
		font-family: Sans-Serif;
		font-size: 0.8em;
		letter-spacing: 0.05em;
		font-weight: 700;
	}

	#bot-nav li.first {
		padding-left: 100px
	}

	#right-panel {
		width:100%;
		background-color:#dec89f;
		padding:20px;
		display:inline-grid;
		font-size:15px;
		border-radius:4px;
		font-size:14px;
	}

		#right-panel img {padding:5px 0;}

			#reedhill {width:100%; margin:0 auto; text-align:center;}
				#reedhill img {width:100%; border-radius:6px;}

			#accreditation {
				text-align: center;
				background-color:#fff;
				padding:10px;
			}
				#accreditation p {text-align:center; font-size:1em}

	.office-info {margin:0 auto; padding:20px; border-radius:5px;}
		.office-info td, .more-info td {
			font-size: small;
		}
		.office-info h2, .more-info h2 {margin:0; padding:0;}
			.office-info h3{
				color: #7f0700;
				font-size: 16px;
				margin: 20px auto 0 auto;
				padding: 0;
			}
			.office-info {background-color:#f1f1f1;}
				.more-info {text-align:center; background-color:#fff; border:2px solid darkred;}

				.wide-content {
					padding: 30px;
				}

			.more-info {
				margin: 0 auto;
				padding: 20px 10px 20px 10px;
				border-radius: 5px;
			}

			.more-info h3 {
				color: #7f0700;
				font-size: 17px;
				margin: 10px auto 0 auto;
				padding: 0;
			}

			.more-info p {padding:0; margin:0;}

				.more-info img {
					padding: 0;
					margin: 0;
				}

	.contact {padding-left:100px;}

	.caption {
		font-size: 0.8em
	}

	.caption 
		.caption a:link, .caption a:visited {
			text-decoration: none
		}

		.caption a:hover, .caption a:active {
			text-decoration: none
		}

		.hold-gallery {width:100%; display:block; clear:both; margin:0 auto; text-align:center; padding: 20px; background-color: #efefef; border-radius:6px;} /*#fef2db*/

			#gallery h2 {
				padding: 10px 0 10px 0;
				border-bottom: double 3px #bc9564;				
			}

		.gallery {
			display:inline-block;
			padding:10px;
			border: double 3px #bc9564;
			border-radius:4px;
			margin: 5px 10px;
			background-color:#fff;
		}

	img.bv  {
		padding-right: 10px;
		margin-right: 10px;
		border-right: solid 1px #bc9564
	}

	.bg-white {background-color:#fff; border-radius:8px;}


/* ----------------------------------------
	FORMS
*/

	input, textarea, select, file, .radio, #recaptcha_response_field {
		font-size: 16px;
		width: 80%;
		border: solid 1px #bc9564;
		margin: 10px auto;
		padding: 5px;
		background-color: #fff;
		border-radius: 4px;
	}

		input[type=submit] {
			padding: 10px;
			font-size: 16px;
		}



/*-----------------------------------------
	FOOTER
*/
	#footer {
		float: unset;
		background-color: #413a2e;
		padding: 30px 0;
		color: #fff;
		font-family: sans-serif;
		font-size: .95em;
		text-align: center;
		margin:0 auto;
	}

	.nsytes {
		font-size: .85em;
		text-align: center;
	}

		.nsytes a:link, .nsytes a:visited {
			color: #dec89f;
			text-decoration: none;
		}

		.nsytes a:hover, .nsytes a:active {
			color: #dec89f;
			text-decoration: underline;
		}

	/* LINKS
--------------------------------------------------------------------
*/
	a,
	a:hover,
	a:focus,
	a:active,
	a.active {
		outline: 0;
	}

a:link, a:visited {color:darkred; text-decoration:none;}
a:hover, a:active {color:firebrick; text-decoration:none;}

p.footer a:link, p.footer a:visited {color:#f00; text-decoration:none;}
p.footer a:hover, p.footer a:active {color:#fff; text-decoration:underline;}



/* PAGE ELEMENTS 
-----------------------------------------------------------------------
*/



/* BUTTONS
------------------------------------------------------------------------ */
.btn:focus,
.btn:active,
.btn.active,
.btn:active:focus {outline:0;}


			

	/* FOOTER
	---------------------------------------------------------- */


	::-moz-selection {
		text-shadow:none;
		background:#a3f0fe;
	}

	::selection {
		text-shadow:none;
		background:#a3f0fe;
	}

	img::selection {
		background:0 0;
	}

	img::-moz-selection {
		background:0 0;
	}


	body {
		webkit-tap-highlight-color:#a3f0fe;
	}


/* MISC CSS
-------------------------------------------------- */

/* Dynamic Image Scaling */

img { max-width:100%; }  


.small {font-size:small;}
.italic {font-style:italic;}



/* MAIN CONTENT
------------------------------------------------------ */



/*
------------------------------------------------------
RESPONSIVE CSS    

MEDIA QUERIES
-------------------------------------------------- */

		/* Extra Small devices	(phones,			below <767px)    
		/* Small devices		(tablets,			â‰¥768px  to 991px) 
		/* Medium devices		(desktops,			â‰¥992px to 1199px) 
		/* Large devices		(large desktops,	â‰¥1200px and up) 

-------------------------------------------------- */


/* Extra Small devices (phones up to 767px) 
-------------------------------------------------- */ 

 /* -FOUND ABOVE IN MOBILE FIRST CSS */
 


 
/* Small devices (tablets, 768px and up) 
grid (col-sm)
-------------------------------------------------- */
@media (min-width:768px) {

	#model {
		width: 100%;
		height: 440px;
		margin-bottom: 1px;
		/*background: #413a2e url(/images/bg2.png) repeat-x top left;*/
		padding: 0;
		margin: 0 auto;
	}

	#header {
		max-width:100%;
		min-height: 400px;
		margin: 0 auto;
		padding: 0;
		text-align: center;
		background: url(/images/Wetzl-Home.jpg) no-repeat center center;
		background-size:contain;
	}

	.explore {
		background-color: #f1f1f1;
		padding: 20px 14px;
		text-align: center;
		border-radius: 10px;
	}

		.explore h2 {
			font-size: x-large;
			text-align: center;
			margin-top: 10px;
			font-style: normal;
		}

		.explore h3 {
			text-align: center;
		}

	.feature {
		display: inline-table;
		background-color: white;
		border: solid 1px #ccc;
		border-radius: 10px;
		height: 280px;
		width: 300px;
		padding: 10px;
		margin: 10px auto;
	}

}

 /* Medium devices (desktops, 992px and up) 
 grid (col-md)
-------------------------------------------------- */
	@media (min-width:992px) {

		#logo {
			text-align: left;
			position: absolute;
			left: 50px;
			top: 0;
			z-index: 1000;
			max-width: 240px;
		}

		#header {
			max-width: 100%;
			max-height: 600px;
			margin: 0 auto;
			padding: 0;
			text-align: center;
			background: url(/images/Wetzl-Home.jpg) no-repeat center center;
			background-size: auto;
		}


		/*#model {
			width: 100%;
			height: 455px;
			margin-bottom: 1px;
			background: #413a2e url(/images/bg2.png) repeat-x top left;
			padding: 0;
			margin: 0 auto;
		}*/


		/*.welcome {
			background-color: #413a2e;
			opacity: 0.90;
			backdrop-filter: opacity(90%);
			height: 136px;
			outline: none !important;
			border: none !important;
			padding: 0;
			margin: 0 auto;
		}*/

		.banner h1 {
			border-bottom: none;
			margin-bottom: 10px;
			padding-bottom: 20px;

		}

		.banner h2 {
			font-size: large;
			padding: 0;
			margin: 0 auto 20px auto;
			text-align: left;
		}

		.banner {
			border-bottom: double 3px #ba0202;
			margin-bottom: 10px;
		}

		.fifty h2 {font-size:x-large;}

		.project-list {
			margin-left: 50px;
		}

		.project-list {
			margin-left: 50px;
		}

		#tag {
			height: 135px;
			text-align: center;
			margin-top: 50px;
			padding: 0 10px;
			clear: both;
			background-color: transparent;
		}

			#tag h1 {
				font-style: italic;
				color: #fff;
				font-size: 22px;
				text-align: center;
				border-bottom: none;
			}

		.property p.right {
			text-align: right;
		}

		.property p.ctr {
			text-align: center;
		}

		.property p.left {
			text-align: left;
		}

		.explore {
			background-color: #f1f1f1;
			padding: 30px 20px;
			text-align: center;
			border-radius: 10px;
		}

			.explore h2 {
				font-size: x-large;
				text-align: center;
				margin-top: 20px;
				font-style: normal;
			}

			.explore h3 {
				text-align: center;
			}

		.feature {
			display: inline-table;
			background-color: white;
			border: solid 1px #ccc;
			border-radius: 10px;
			height: 380px;
			width: 460px;
			padding: 20px;
			margin: 10px auto;
		}
}

 /* Large devices (large desktops, â‰¥1200px and up) 
 grid (col-lg)
-------------------------------------------------- */
@media (min-width:1200px) {

	h1, h2, h3, h4, p {
		text-align: left;
		padding-bottom: 20px
	}

	h1 {
		font-size: 30px;
		font-weight: bold;
		color: #7f0700;
		border-bottom: double 3px #bc9564;
		padding-bottom: 10px;
		margin-bottom: 10px
	}

	.project h1 {
		height:70px; margin-top:0;
	}

	.eho {
		height: 80px;
		float: right;
		margin: 0 0 0 10px;
	}

	/*.eho {
		height: 50px;
		float: right;
		margin: 10px 5px 0 5px;
	}*/


	h2 {
		font-size: 22px;
		font-weight: bold;
		color: #7f0700;
		text-align: center;
		font-style: italic;
	}

	h3 {
		font-size: 18px;
		font-weight: bold;
		color: #4b3f2f;
		padding: 0;
		margin: 10px auto;
		line-height:30px;
	}

	p {
		font-size: 17px;
	}

	.property p {font-size:15px; padding-bottom: 0;}


	#logo {
		text-align: left;
		position: absolute;
		left: 50px;
		top: 0;
		z-index: 1000;
		max-width:282px;
	}

	#header {
		width: 100%;
		height: 725px;
		margin: 0 auto;
		padding: 0;
		text-align: center;
		background: url(/images/Wetzl-Home.jpg) no-repeat center center;
		background-size: auto;
	}

	/*.welcome {
		background-color: #413a2e;
		opacity: 0.90;
		backdrop-filter: opacity(90%);
		height: 136px;
		outline: none !important;
		border: none !important;
		padding: 0;
		margin: 0 auto;
	}*/

	#tag {
		height: 135px;
		text-align: center;
		margin-top: 50px;
		padding: 0 10px;
		clear: both;
		background-color: transparent;
	}

		#tag h1 {
			font-style: italic;
			color: #fff;
			font-size: 24px;
			text-align: center;
			border-bottom: none;
		}

	/*#model {
		width: 100%;
		height: 465px;
		margin-bottom: 1px;
		background: #413a2e url(/images/bg2.png) repeat-x top left;
		padding: 0;
		margin: 0 auto;
	}

	#btnHome {
		display:inherit;
	}*/
	#mid-nav .btn {
		margin-right: 10px;
	}


}
