/* *****************************
	************************************
  ******            		        ******
******   Contact www.buildmyweb.org   ******
******   for help or future projects. ******
  ******  				            ******
	************************************
	  ***************************** */


/* 
	light green		= 86ed7e
	green			= 2e8d27
	dark green		= 142f12
	light gray		= a9b5a9
	dark gray		= 202420
*/

@import url(https://fonts.googleapis.com/css?family=Lora:400,400italic,700);


/* HTML TAGS */
html, body	{ margin:0; padding:0; line-height:0.0; } /* defaults */
body 		{ font:normal 100% 'Lora', 'Garamond', serif; color:#5e625e; text-decoration:none; line-height:1.8; }

a 			{ color:#2e8d27; text-decoration:none; border:0px; outline-style:none; outline-width:0px; }
a:hover 	{ color:#0d4c08; text-decoration:none; }

h1			{ font-size:2.3em; color:#142f12; line-height:1.2; margin:0 0 80px 0; }
h2, h3		{ font-size:1.3em; color:#5e725d; margin:60px 0 0 0; }
h1+p, h1+ul, h2+p, h2+ul, h3+p, h3+ul {
	margin:0; 
}

form		{ width:50%; margin:40px auto; border-radius:25px/15px; padding:2% 4% 4% 4%; }
form h2		{ font-size:1.6em; text-align:left; margin:0 0 30px 0; }

label					{ display:inline-block; width:25%; }
input[type='text'], input[type='password'], input[type='submit'], textarea	{ 
	display:inline-block; width:96%; padding:1% 2%; font-size:1.0em; margin-bottom:20px; 
}
input[type='submit']		{ display:block; width:40%; margin:30px auto 0 auto; }
input[type='submit']:hover	{ cursor:pointer; }


/* GLOBALS */
#banner, #primary_nav, #main /*#footer, : left out because we sticky it */  {
	position:relative; top:0px; left:0px; width:100%; 
}

.wrapper	{ position:relative; margin:0 auto; width:80%; min-height:100%; max-width:1200px; } /* CENTERS THE SITE CONTENT */

section.content			{ padding:80px 0; }

#status_messages		{ width:95%; padding:20px 2%; background:#ececec; border:1px solid #e5e5e5; }
#status_messages p		{ margin:0 0 0 5px; padding:0; }
.status_msg_good, .status_msg_bad 	{ 
	font-style:italic; font-size:0.8em; color:green; background:url('../pics/icons/checkmark.png') no-repeat left center; background-size:20px; padding-left:30px; 
}
.status_msg_bad			{ color:red; background-image:url('../pics/icons/alert.png'); }

.first_letter h4::first-letter	{ float:left; font-size:2.0em; line-height:1.0; }

.block_center		{ display:block; margin:0 auto; max-width:94%; }

/* ============= RESPONSIVE MAPS ============== */
.map_container 			{ position:relative; float:right; margin:20px 0px 20px 3%; width:45%; padding-bottom:35%; height:0; overflow:hidden; }
	
.map_container iframe 	{ position: absolute; top:0; left:0; width:100% !important; height:100% !important; }

.box_shadow	{
	-webkit-box-shadow: 3px 3px 7px 6px rgba(0, 0, 0, 0.2);  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
	-moz-box-shadow:    3px 3px 7px 6px rgba(0, 0, 0, 0.2);  /* Firefox 3.5 - 3.6 */
	box-shadow:         3px 3px 7px 6px rgba(0, 0, 0, 0.2);  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

.img_right		{ float:right; margin:0 0 10px 30px; max-width:40%; }
.img_left		{ float:left; margin:0 30px 10px 0; max-width:40%; }

/* ============= FADE-IN ON SCROLL ============== */
.fade_in_obj	{ opacity:0; }

.clear_fix		{ clear:both;  width:100%; height:0; }


/* **************** BANNER *************** */
#banner				{ width:100%; padding:15px 0; } 
#subbanner			{ width:100%; background:url('../pics/subbanners/company.jpg') center center; padding-top:15.79%; background-size:cover; border-bottom:5px solid #a9b5a9; }
#page_services #subbanner	{ background-image:url('../pics/subbanners/services.jpg'); }
#page_contact #subbanner	{ background-image:url('../pics/subbanners/lighthouse.jpg'); }

#logo		{ float:left; max-width:25%; }

#primary_nav			{ float:left; width:75%; text-align:right; font-size:1.2em; }
#primary_nav ul			{ width:100%; list-style-type:none; margin:0px; padding:0px; }

#primary_nav .wrapper 	{ position:relative; }


/* **************** MAIN *************** */
#main 					{ display:block; width:100%; padding:80px 0px 80px 0px; font-size:1.2em; }
#main p:first-of-type 	{ margin-top:0px; }

#main>section			{ position:relative; width:100%; }


/* **************** FOOTER *************** */
#footer 			{ font-size:0.92em; line-height:1.3; background:#202420; }

#footer_left, #footer_right	{ 
	float:left; width:50%; text-align:left;
}
#footer_left a		{ float:left; margin-right:20px; }
#footer_right		{ text-align:right; }

#footer .block		{ float:left; width:100%; margin-top:30px; text-align:center; }

/* STICKY FOOTER */
/* https://css-tricks.com/snippets/css/sticky-footer/ */
html, body 			{ height:100%; }
#page-wrap 			{ min-height:100%; margin-bottom:-300px; }
#page-wrap:after 	{ height:300px; content: ""; display:block;}
#footer				{ height:270px; padding-top:30px; }
/* STICKY FOOTER */


/* ============= COMPANY ============== */
#page_company #main 	{ padding:0; }

#company_bios			{ padding:80px 0; background:#e3f2e2; color:#2b4429; }
.staff_bio				{ float:left; width:23%; margin-left:12.5%; padding:1% 1%; background:#fff; text-align:center; font-size:0.8em; }
.staff_bio:first-child	{ margin-left:0; }
.staff_bio img			{ max-width:99%; }


/* ============= HOME ============== */
#img_home		{ position:relative; width:100%; background:url('../pics/nyc.jpg') center top no-repeat; padding-top:44.94%; background-size:cover; }
.img_home_txt	{ position:absolute; top:17%; left:50%; margin-left:-30%; width:60%; color:#fff; font-weight:bold; text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.6); text-align:center; }

.tagline		{ font-size:4.6em; line-height:1.2; }

#img_home a			{ display:inline-block; padding:2.5% 5%; background:#2e8d27; font-size:1.6em; text-shadow:none; color:#fff; transition:all 1s ease; }
#img_home a:hover	{ background:#86ed7e; color:#2e8d27; }	


/* ============= SERVICES ============== */
.service_block		{ overflow:hidden; margin-bottom:60px; padding:5%; width:90%; background:#eee; }
.service_block h2	{ margin-top:0; }


/* ----------- smaller desktops and laptops ----------- */
@media only screen
and (max-width : 1160px)
{
	.wrapper	{ width:96%; }
	
	/* ==================== HOME ==================== */
	.img_home_txt	{ top:15%; }
	.tagline		{ font-size:3.2em; }
}

/* ----------- tablets and smaller ----------- */
@media only screen
and (max-width : 1024px)
{
	/* ==================== HOME ==================== */
	.img_home_txt	{ top:10%; }
	.tagline		{ font-size:3.0em; }
}

/* ----------- Tablet Portrait ----------- */
@media only screen
and (max-width : 768px)
{
	h1			{ font-size:1.5em; }
	h2, h3		{ font-size:1.2em; }

	.img_right, .img_left	{ float:none; position:relative; display:block; max-width:90%; margin:20px auto; }
	
	.map_container 	{ margin:20px 0px; width:100%; padding-bottom:45%; }
	
	/*ul.slimmenu>li:last-child a	{ padding-right:30px; }*/
	
	/* ==================== BANNER ==================== */
	#logo			{ max-width:35%; }
	#primary_nav	{ width:65%; }
	
	/* ==================== MAIN ==================== */
	#main 			{ font-size:1.0em; }
	
	/* STICKY FOOTER */
	#page-wrap 			{ margin-bottom:-480px; }
	#page-wrap:after 	{ height:480px; }
	#footer				{ height:450px; font-size:0.8em; }
	/* STICKY FOOTER */

	#footer_left, #footer_right	{ 
		width:90%; margin:0px 0px 20px 5%; text-align:center;
	}
	
	#footer_right	{ margin-bottom:0; }
	
	#footer_left a		{ float:none; margin-right:20px; }
	
	/* ============= COMPANY ============== */
	.staff_bio				{ width:28%; margin-left:4.5%; }
	
	/* ==================== HOME ==================== */
	#img_home		{ background-image:url('../pics/nyc_mobile.jpg'); padding-top:86.07%; }
	.img_home_txt	{ margin-left:-48%; width:96%; top:10%; }
	.tagline		{ font-size:3.4em; }
	#img_home a		{ font-size:1.8em; }
}

/* ----------- Smartphones (portrait and landscape) ----------- */
@media only screen
and (max-width : 500px)
{	
	.col2		{ width:90%; margin-left:5%; }
	
	/* ==================== BANNER ==================== */
	#logo			{ float:none; max-width:100%; display:block; margin:0 auto; }
	#primary_nav	{ float:none; width:100%; text-align:center; }
	
	/* ============= COMPANY ============== */
	.staff_bio				{ float:none; width:60%; margin:0 auto 40px auto; padding:2%; font-size:1.0em; }
	.staff_bio:first-child	{ margin-left:auto; }
	.staff_bio img			{ max-width:98%; }
	
	/* ==================== HOME ==================== */
	.img_home_txt	{ top:15%; margin-left:-49%; width:98%; }
	.tagline		{ font-size:2.0em; margin-bottom:20px; }
	#img_home a		{ font-size:1.0em; }
}