/* Shared base styles merged from the inline <style> blocks that were duplicated
   across index.php, patio_covers.php, screen_room.php, pool_cages.php, awnings.php,
   screens.php, testimonials.php, thankyou.php and contact.php. Page-specific rules
   (backgrounds, fonts, form fields, gallery/video layouts, etc.) remain inline. */

#header {
	margin:0 auto; 
	max-width:960px;
	width:100%; 
	text-align:center; 
	padding-top:6px;
	background-color:#204418;
	color:#ffffff;
}
#header a {
	color:#ffffff;
	text-decoration:none;
	font-weight:bold;
}
#header a:hover {
	color:#CCCCCC;
	text-decoration:none;
	font-weight:bold;
}
#header-inner-left {
	float:left; 
	width:45.9%; 
	text-align:left; 
	margin-left:2%	
}
#header-inner-right {
	float:left; 
	width:45.9%; 
	text-align:right; 
	padding:10px 2% 0 12px;	
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	line-height:1.2;
}
.header-contact-info {
	display:inline-block;
	text-align:left;	
}

@media screen and (max-width:767px){
	.header-contact-info a {
		padding:10px 0;
		display:inline-block;
	}
}
#main-content-left {
	float:left; 
	max-width: 440px; 
	width:50%;
	padding:30px 20px 10px 40px;	
}
#main-content-right {
	float:left; 
	width:50%;
	padding:30px 10px 10px 29px;	
}
* {
	box-sizing:border-box;	
}
#footer {
	margin:auto; 
	max-width:719px; 
	width:100%; 
	padding:4px 20px 10px 20px; 
	text-align:center; 
	font-size:10px; 
	color:#fff	
}
img {
	max-width:100%;
	height:auto;	
}
#burger-container {
	display:none;	
}

@media screen and (max-width:1023px){
	#header-nav a {
		padding:10px;
		display:inline-block;	
	}
	body {
		margin-top:0;	
	}
}

@media screen and (max-width:767px){
	#header-nav {
		display:none;	
	}
	#burger-container {
		display:block;	
	}
	#hamburger button {
		background-color:#fff;
		padding:8px 15px;
		box-shadow:none;
		border:none;
		color:#204418;	
		cursor:pointer;
	}
	.sep {
		display:none;	
	}
	#header-nav a {
		display:block;	
		border:1px solid #fff;
		width:90%;
		margin:0 auto 2px auto;
	}
	#header-nav a:first-child {
		margin-top:20px;	
	}
}

@media screen and (max-width:500px){
	#header-inner-left {
		width:100%;
		margin:0;
		text-align:left;
		padding-left:15px;	
		padding-right:15px;
	}
	#header-inner-right {
		width:100%;	
		text-align:left;
		padding-left:15px;
		
	}
	#main-content-left {
		padding-left:22px;
		width:100%;	
	}
	#main-content-right {
		width:100%;	
		padding-left:22px;
		padding-right:20px;
	}
}