/*
	aw.css
	
	Alexander-Wright.com Stylesheet.
	
	Contains mobile phone styles for the Alexander Wright website.
	
	© Alexander Wright, 2013
	
	Design
	
	 ___________________________________________________
	|                                                   |
	|   Head                              				|
	|___________________________________________________|
	|   Navigation						                |
	|___________________________________________________|
	|  	Content                                          |
	|                                                   |
	|                                                   |
	|                                                   |
	|                                                   |
	|                                                   |
	|                                                   |
	|                                                   |
	|___________________________________________________|
	|    Foot                                           |
	|___________________________________________________|
	
	
	
	Green Colour:	#339933 - on white backgrounds
					#66cc66 - on black backgrounds
	
	
 */
 
 
 
/* 
 	Layout: 
	=============================================================================== 
 */

 @media (max-width: 700px) {
 
	#headerIndex {
		padding: 					30px 10px 20px 10px;
		font-size:					0.8em;
	}
	
	.headerImageIndex {
		width: 						60%;
	}
 


	.logoBox {
		float: 						none;
		width: 						100%;
		padding: 					20px;
	}
	
	.logoIm {
		width: 						100%;
	}
	
	
	.socialLeft {
		width: 						100%;
		text-align: 				center;
		float: 						none;
		padding-bottom: 			10px;		
	}
	
	.socialMid {
		width: 						100%;
		text-align: 				center;
		float: 						none;	
		padding-bottom: 			10px;
	}
	
	.socialRight {
		width: 						100%;
		text-align: 				center;
		float: 						none;	
		padding-bottom: 			10px;
	}
	
	h1{
		font-size:					1.5em;
	}	
	
	h2{
		font-size:					1.4em;
	}	
	
	.navText {
		font-size:					1.2em;	
	}
	
	.gradBoxContainer {
		width: 						33%;	
		float: 						left;
		text-align: 				center;
	}	
	
	
	.screenList {
		display: 					none;
	}
	
	.mobileGrid {
		display: 					inline;
	}
	
}


 @media (max-width: 500px) {
	.gradBoxContainer {
		width: 						50%;	
		float: 						left;
		text-align: 				center;
	} 
	
	
}

 @media (max-width: 250px) {
	.gradBoxContainer {
		width: 						100%;	
		float: 						left;
		text-align: 				center;
	} 
	
	
}