@media screen and (max-width: 480px) {
	/* disable webkit text size adjust (for iPhone) */
	html {
		-webkit-text-size-adjust: none;
	}
	
	#wrapper {
		width: 100%;
		margin: auto 0 auto;
	}

	#nav{margin: 3px auto 0;} 
		#nav .nav-container{max-width: 100%; height: auto; background: #0d422f;}
		#nav ul{margin: 8px 7px 5px; padding-bottom: 10px;}
		#nav ul li a:after{right: 20px;}
		
	#banner{margin-left: 0px;}
		.rflash{max-width: 100%; margin-bottom: 0; height: auto;}
		
		.slogan{text-align: center; position: relative; margin: 0 auto; bottom: 90px; left: 0;}
	
		.banner-statement{max-width: 100%; margin-top: -79px;}
		.banner-statement p{width: 98%; text-align: center; margin: auto; font-size: 17px;}
		
	#mid{width: 100%; margin: 15px 0px auto;}	
		.mid-container{text-align: center; max-width: 100%;}
		.mid-box:first-child{border-top: 0;}
		.mid-box{background: #047340; text-align: center; width: 90%; margin: 0px auto 10px; border-radius: 10px; overflow: hidden;}
		.mid-box h3{padding-left: 160px;}
		.mid-box p{padding-left: 160px; width: 240px;}
		.mid-box img{left: 10px;}
		.mid-box a{left: 160px;}
	
	#main{width: 95%;}
	
	#copyright {margin: 30px auto auto; width: 95%; text-align: center;}
}

@media screen and (max-width: 450px) {
	#header{text-align: center; margin: auto;}
		#logo{width: 97%; text-align: center; margin: 16px auto 0px;}
		
	.mid-box{text-align: center; height: 195px;}	
		.mid-box img{display: none;}	
		.mid-box h3{text-align: center; padding-left: 0; padding-top: 15px;}
		.mid-box p{text-align: center; padding-left: 0; width: 83%; margin: 0px auto;}
		.mid-box a{position: static; text-align: center; margin: 20px auto;}
	
	#sidebar{padding: 10px;}
		.sidebar-box{text-align: center; margin: 10px auto 0px; background: #7bc840; border-radius: 10px; width: 290px; height: 179px;}
			.sidebar-box .text-container{background: #fff; border-radius: 10px; left: 15px; width: 260px; text-align: center;}
			.sidebar-box h3{text-align: center; padding-left: 0;}
			.sidebar-box p{text-align: center; padding-left: 32px; margin: -10px 0px 5px;}
			.sidebar-box a{position: static;}
		.sidebar-links{text-align: center;}
			.sidebar-links ul{margin-left: 0;}
			.sidebar-links ul li a{max-width: 100%; background: #0c3f2d; border-radius: 5px; line-height: 40px;}
			.sidebar-links ul li a:hover{background: #7bc840;}
			.sidebar-links ul li a:after, .sidebar-links ul li a:hover:after{content: "";}
			
	#main{margin-top: 15px;}	
		.welcome span{line-height: 35px;}
		#main #main-canvas .center-text{text-align: justify;}
		#main #main-canvas .main-img-area .main-thumb{display: none;}
			
	#bottom{width: 100%; margin-top: 15px;}		
		.areas-covered{text-align: center; width: 90%; margin: 0px auto;}
		.areas-covered h3{text-align: center; padding-left: 0;}
		.areas-covered h3:after{content: "";}
		.areas-covered p{width: 435px; max-width: 95%; text-align: center; padding-left: 5px;}
		.areas-covered a{text-align: center; margin: 15px auto; display: block;}
		
		.events a{text-align: center; width: 90%; margin: 15px auto 0;}
		.events a:after{content: "";}
		.events a h3{text-align: center; margin-left: 0;}
}

@media screen and (max-width: 430px) {
	#contact-info p small{display: none;}
	#contact-info p span{display: block;}

	#nav p{font-size: 18px; left: 8px;}
	#nav a img{margin-left: 13px;}
	#pull{font-size: 16px; top: 20px; right: 5px;}
	#pull:before{top: -5px; left: -57px;}
	
	#footer {width: 100%; height: auto; margin: 20px auto 0; background: #064b32; padding-bottom: 30px;}
}

@media screen and (max-width: 420px) {
	#footer {width: 100%; height: auto; margin: 20px auto 0; background: #064b32; padding-bottom: 30px;}
		#footer h4{padding-top: 10px;}
}

@media screen and (max-width: 350px) {
	.slogan{bottom: 80px;}
	.slogan p{font-size: 29px;}
	.slogan span{font-size: 22px;}
}