/*
1020px / 972px grid system ~ Core CSS.
12 columns ~ margin: 24px
*/

/* =Containers
--------------------------------------------------------------------------------*/
.container
{
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	text-align: center;
	position: relative;
}

/* =Grid >> Global
--------------------------------------------------------------------------------*/
.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol, .twelvecol, #main-left-column {
	display: inline;
	float: left;
	margin-left: 24px;
}

.row {
max-width: 972px;
width: auto;
margin: 0 auto;
overflow: hidden;
text-align: left;
}

.padded-row { 
	padding: 6px;
	max-width: 960px;
	}


#main-left-column { width: 198px; margin-left: 0; position: relative; } /* Width: 201px (225 - 24) - 3px (what's left from 24/9 rounded up) */
	
/* =Grid >> 12 Columns
--------------------------------------------------------------------------------*/
.onecol {width:59px;}
.twocol {width:142px;}
.threecol {width:225px;}
.fourcol {width:308px;}
.fivecol {width:391px;}
.sixcol {width:474px;}
.sevencol {width:557px;}
.eightcol {width:640px;}
.ninecol {width:723px;}
.tencol {width:806px;}
.elevencol {width:889px;}
.twelvecol {width:972px;}

/* =Grid >> 12 Columns with padded top container (6px padding)
--------------------------------------------------------------------------------*/
.padded-row .onecol {width:58px;} 
.padded-row .twocol {width:140px;}
.padded-row .threecol {width:222px;}
.padded-row .fourcol {width:304px;}
.padded-row .fivecol {width:386px;}
.padded-row .sixcol {width:468px;}
.padded-row .sevencol {width:550px;}
.padded-row .eightcol {width:632px;}
.padded-row .ninecol {width:714px;}
.padded-row .tencol {width:796px;}
.padded-row .elevencol {width:878px;}
.padded-row .twelvecol {width:960px;}

/* =Grid >> 12 Columns - no left margin
--------------------------------------------------------------------------------*/
.push1 {margin-left:107px;}
.push2 {margin-left:190px;}
.push3 {margin-left:273px;}
.push4 {margin-left:356px;}
.push5 {margin-left:439px;}
.push6 {margin-left:522px;}
.push7 {margin-left:605px;}
.push8 {margin-left:688px;}
.push9 {margin-left:771px;}
.push10 {margin-left:854px;}
.push11 {margin-left:937px;}
.push12 {margin-left:1020px;}

.first { margin-left:0; }

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content:' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}
