/*~	layout module	
	 Module for controlling alignment, layout and width of page.
	 Limitations:
	 - no support for any order columns
*/

/*~	page alignment	*/
			body.center { text-align : center ; }
			body.center #container { margin : 0 auto ; text-align : left ; }
			
/*~	generic page widths	*/
	/*	fixed width will not scale horizontally	*/
			body .fixed-sm { width : 640px ; }
			body .fixed-md { width : 760px ; }
			body .fixed-lg { width : 900px ; }
			body .fixed-xlg { width : 1000px ; }
			body .fixed-752 { width : 752px ; }
			
	/*	em width will scale both horizontally & vertically	*/
			body .zoom-sm { width : 64em ; }
			body .zoom-md { width : 76em ; }
			body .zoom-lg { width : 90em ; }
			body .zoom-xlg { width : 100em ; }
			
	/*	will fill the whole page	*/
			body .fluid { width : 100% ; }
			
/*~	common stuffs	*/
			.section, .standard, .classic, .layout { clear : both ; width : 100% ; }
			.section, .gr { position : relative ; _position : static ; *position : static ; }
			
			.layout .gr { float : left ; }
			
			/*	makes good with the source order	*/
			.a-b .b, 
			.a-c .c, 
			.b-c .c { float : right ; }
			
			/*	fix nesting for above	*/
			.a-b .gr .b, 
			.b-c .gr .c , 
			.a-c .gr .c { float : left ; }
			
/*~	column widths */
	/*~	.classic	*/
			.classic .a-b-c .gr, 
			.classic .a-b .gr, 
			.classic .b-c .gr,  
			.standard .classic .a-b-c .gr, 
			.standard .classic .a-b .gr, 
			.standard .classic .b-c .gr { width : 25% ; } 
			
			.classic .a-b-c .b, 
			.standard .classic .a-b-c .b { width : 50% ; }
			
			.classic .a-b .b,  
			.classic .b-c .b, 
			.standard .classic .a-b .b,  
			.standard .classic .b-c .b { width : 75% ; }
			
	/*~	.standard - doesn't require the standard class to work though it helps readability	*/
			.a-b-c-d .gr, 
			.standard .a-b-c-d .gr, 
			.standard .layout .a-b-c-d .gr { width : 25% ; _width : 24.9% ; *width : 24.9% ; }
			
			.a-b-c .gr, 
			.standard .a-b-c .gr, 
			.standard .layout .a-b-c .gr { width : 33.3% ; }
			
			.a-c .gr, 
			.standard .a-c .g, 
			.classic .a-c .gr { width : 50% ; _width : 49.9% ; *width : 49.9% ; } 
			
			.a-b .b, 
			.b-c .b, 
			.standard .a-b .b, 
			.standard .b-c .b , 
			.standard .layout .a-b .b, 
			.standard .layout .b-c .b  { width : 67% ; }
			
			.a-b .a, 
			.b-c .a, 
			.standard .a-b .a, 
			.standard .b-c .c, 
			.standard .layout .a-b .a, 
			.standard .layout .b-c .c { width : 33% ; }

/*~	.tidy - handles equal column heights. It will recurse down into nested layouts so if you don't want 
		equal column heights in child layouts then add a class of .untidy to them	\*/
			.tidy .layout { overflow : hidden ; }
			.tidy .gr { margin-bottom : -1000em ! important ; padding-bottom : 1000em ! important ; }
			@media all and (min-width: 0px) {
				.tidy .gr { margin-bottom : 0 ; padding :  0 ; }
				.tidy gr:after { 
					background : inherit ; 
					content : ' ' ; 
					display : block ; 
					margin-bottom : -1000px ; 
					padding-bottom : 1000px ; 
				}
			}
		/*	end equal column height fix	*/
		
/*~	.untidy	over-write equal column heights for child layouts \*/
			.untidy .layout { overflow : visible ; }
			.untidy .gr { margin-bottom : 0 ! important ; padding-bottom : 0 ! important ;  }
			@media all and (min-width: 0px) {
				.tidy gr:after { 
					display : inline ; 
					margin-bottom : 0 ; 
					padding-bottom : 0 ; 
				}
			}