/*
 Width: 1000px
 # Columns : 12 
 Column width: 76px
 Gutter : 8px 

    
formula  is as follows

grid width + gutter + grid width / total width

    for grid 1 it is just grid width/total
    for grid 2 it is grid 1 w + gutter + grid 2 w / total width
    for grid 3 it is grid 1 w + gutter + grid 2 w + gutter plus grid 3 w / total

    it is always the sum of the number columns plus the sum of the number of gutters MINUS ONE divided by total width

    grid_1 =  89 / 1200 = width perc
    grid_2 = 89 + 12 + 89 / 1200
    grid_3 = 89 + 12 + 89 + 12 + 89 / 1200
    grid_4 = 89 + 12 + 89 + 12 + 89 + 12 + 89 / 1200
    etc 

target / context = result

target / context = result

 */
.grid_1 { width: 7.6%; }
.grid_2 { width: 16%; }
.grid_3 { width: 24.4%; }
.grid_4 { width: 32%; }
.grid_5 { width: 41.2%; }
.grid_6 { width: 49.6%; }
.grid_7 { width: 58%; }
.grid_8 { width: 66.4%; }
.grid_9 { width: 74.8%; }
.grid_10 { width: 83.2%; }
.grid_11 { width: 91.6%; }
.grid_12 { width: 100%; }

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	margin-top: 0;
    margin-right: .8%;
    margin-bottom: 0;
    margin-left:auto 0;
	float: left;
	display: block;
}

.alpha{margin-left:0;}
.omega{margin-right:0;}

.container{
	width: 100%; 
	max-width: 1000px;
	margin: auto;	
}



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

* html .clearfix,*:first-child+html .clearfix{zoom:1}