/*
@@@@@@@@@@@@@@@@@@@@@@
ALIGNMENT
@@@@@@@@@@@@@@@@@@@@@@

	about				constants for alignment
	
	syntax

*/
		
	/*///////////////////////////////////////////////////////////////////////////////////////////////////////////
	alignment
	///////////////////////////////////////////////////////////////////////////////////////////////////////////*/
	
		/*+ float
		..........................................................................*/
	
			.floatLeft{float:left;}
			.floatRight{float:right;}
		
		/*+ center a block
		..........................................................................*/
	
			.marginAuto{margin-left:auto; margin-right:auto;}
		
		/*+ alignment
		..........................................................................*/
			
			.alignLeft{text-align:left;}
			.alignRight{text-align:right;}		
			.alignCenter{text-align:center;}		
			.alignJustify{text-align:justify;}		
		
		/*+ vertical alignment
		..........................................................................*/
			
			.alignTop{vertical-align:top;}
			.alignMiddle{vertical-align:middle;}
			.alignBottom{vertical-align:bottom;}
			
			
			
	/*///////////////////////////////////////////////////////////////////////////////////////////////////////////
	push
	///////////////////////////////////////////////////////////////////////////////////////////////////////////*/
	
		/*+ noPush
		..........................................................................*/
			
			.noPush{margin:0px; }
	
		/*+ pushLeft
		..........................................................................*/
			
			.pushLeft{margin-left:10px;}
			
			.pushLeftGrand{margin-left:50px;}
			.pushLeftHeavy{margin-left:40px;}
			.pushLeftGreater{margin-left:30px;}
			.pushLeftBase{margin-left:20px;}
			.pushLeftLesser{margin-left:15px;}
			.pushLeftLight{margin-left:10px;}
			.pushLeftMinimal{margin-left:5px;}
			
			
		/*+ pushRight
		..........................................................................*/
			
			.pushRight{margin-right:10px;}
			
			.pushRightGrand{margin-right:50px;}
			.pushRightHeavy{margin-right:40px;}
			.pushRightGreater{margin-right:30px;}
			.pushRightBase{margin-right:20px;}
			.pushRightLesser{margin-right:15px;}
			.pushRightLight{margin-right:10px;}
			.pushRightMinimal{margin-right:5px;}
			
		/*+ pushTop
		..........................................................................*/
			
			.pushTop{margin-top:10px;}
			
			.pushTopGrand{margin-top:50px;}
			.pushTopHeavy{margin-top:40px;}
			.pushTopGreater{margin-top:30px;}
			.pushTopBase{margin-top:20px;}
			.pushTopLesser{margin-top:15px;}
			.pushTopLight{margin-top:10px;}
			.pushTopMinimal{margin-top:5px;}
			
		/*+ pushBottom
		..........................................................................*/
			
			.pushBottom{margin-bottom:10px;}
			
			.pushBottomGrand{margin-bottom:50px;}
			.pushBottomHeavy{margin-bottom:40px;}
			.pushBottomGreater{margin-bottom:30px;}
			.pushBottomBase{margin-bottom:20px;}
			.pushBottomLesser{margin-bottom:15px;}
			.pushBottomLight{margin-bottom:10px;}
			.pushBottomMinimal{margin-bottom:5px;}
			
	/*///////////////////////////////////////////////////////////////////////////////////////////////////////////
	pull
	///////////////////////////////////////////////////////////////////////////////////////////////////////////*/
			
		/*+ noPull
		..........................................................................*/
			
			.noPull{top:0px;}
			
		/*+ pullToRight
		..........................................................................*/
			
			.pullLeft{position:relative; left:-10px; }
			
			.pullLeftGrand{position:relative; left:-50px;}
			.pullLeftHeavy{position:relative; left:-40px;}
			.pullLeftGreater{position:relative; left:-30px;}
			.pullLeftBase{position:relative; left:-20px;}
			.pullLeftLesser{position:relative; left:-15px;}
			.pullLeftLight{position:relative; left:-10px;}
			.pullLeftMinimal{position:relative; left:-5px;}
			
		/*+ pullRight
		..........................................................................*/
			
			.pullRight{position:relative; right:-10px; }
			
			.pullRightGrand{position:relative; right:-50px;}
			.pullRightHeavy{position:relative; right:-40px;}
			.pullRightGreater{position:relative; right:-30px;}
			.pullRightBase{position:relative; right:-20px;}
			.pullRightLesser{position:relative; right:-15px;}
			.pullRightLight{position:relative; right:-10px;}
			.pullRightMinimal{position:relative; right:-5px;}
			
			
		/*+ pullBottom
		..........................................................................*/
			
			.pullBottom{position:relative; bottom:-10px; }
			
			.pullBottomGrand{position:relative; bottom:-50px;}
			.pullBottomHeavy{position:relative; bottom:-40px;}
			.pullBottomGreater{position:relative; bottom:-30px;}
			.pullBottomBase{position:relative; bottom:-20px;}
			.pullBottomLesser{position:relative; bottom:-15px;}
			.pullBottomLight{position:relative; bottom:-10px;}
			.pullBottomMinimal{position:relative; bottom:-5px;}
			
		/*+ pullTop
		..........................................................................*/
			
			.pullTop{position:relative; top:-10px; }
			
			.pullTopGrand{position:relative; top:-50px;}
			.pullTopHeavy{position:relative; top:-40px;}
			.pullTopGreater{position:relative; top:-30px;}
			.pullTopBase{position:relative; top:-20px;}
			.pullTopLesser{position:relative; top:-15px;}
			.pullTopLight{position:relative; top:-10px;}
			.pullTopMinimal{position:relative; top:-5px;}
			
			
	/*///////////////////////////////////////////////////////////////////////////////////////////////////////////
	position
	///////////////////////////////////////////////////////////////////////////////////////////////////////////*/
	
		/*+ posBottomRight
		..........................................................................*/
			
			.posBottomRight{position:absolute !important; bottom:0px; right:0px; z-index:100; }
			.posBottomLeft{position:absolute !important; bottom:0px; left:0px; z-index:100; }
			.posTopRight{position:absolute !important; top:0px; right:0px; z-index:100; }
			.posTopLeft{position:absolute !important; top:0px; left:0px; z-index:100; }


/*
@@@@@@@@@@@@@@@@@@@@@@
OPACITY
@@@@@@@@@@@@@@@@@@@@@@

	about				constants for making transpart content or to show/hide content
	
	syntax

*/

	/*///////////////////////////////////////////////////////////////////////////////////////////////////////////
	opacity
	///////////////////////////////////////////////////////////////////////////////////////////////////////////*/
		
		/*+ opacity
		..........................................................................*/
			
			.opGrand{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity:0;}
			.opHeavy{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; filter: alpha(opacity=15); opacity:0.15;}
			.opGreater{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=35)"; filter: alpha(opacity=35); opacity:0.35;}
			.opBase{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); opacity:0.5;}
			.opLesser{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=65)"; filter: alpha(opacity=65); opacity:0.65;}
			.opLight{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; filter: alpha(opacity=85); opacity:0.85;}
			.opMinimal{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity:1;}
			
		/*+ display
		..........................................................................*/
			
			.show{display:block;}
			.hide{display:none;}
			
			.showBlock{display:block !important;}
			.showInline{display:inline;}
			.showInlineBlock{display:inline-block;}

/*
@@@@@@@@@@@@@@@@@@@@@@
TEXT
@@@@@@@@@@@@@@@@@@@@@@

	about				constants for type
	
	syntax

*/

	/*///////////////////////////////////////////////////////////////////////////////////////////////////////////
	text
	///////////////////////////////////////////////////////////////////////////////////////////////////////////*/

		/*+ text
		..........................................................................*/
			
			.bold{font-weight:bold; }
			.italic{font-style:italic; }
			.underline{text-decoration:underline; }
			.linethrough{text-decoration:line-through; }
			.uppercase{text-transform:uppercase; }
	
/*
@@@@@@@@@@@@@@@@@@@@@@
CONSTRUCT
@@@@@@@@@@@@@@@@@@@@@@

	about				General styles for component construction 
	
	syntax

*/


	/*///////////////////////////////////////////////////////////////////////////////////////////////////////////
	content
	///////////////////////////////////////////////////////////////////////////////////////////////////////////*/
			
		/*+ image replacement
		..........................................................................*/
			
			[class^="img"], [class^="ico"]{text-indent:-4000px; overflow:hidden; display:inline-block; background-repeat:no-repeat;}
			[class^="ico"]{vertical-align:baseline;}

