/*	12 COLUMN : RESPONSIVE GRID SYSTEM
	DEVELOPER : DENIS LEBLANC
	URL : http://responsive.gs
	VERSION : 3.0
	LICENSE : GPL & MIT */


/* 	SET ALL ELEMENTS TO BOX-SIZING : BORDER-BOX */
* { 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/*	If you need support for IE7 and lower make 
		sure the boxsizing.htc file is linked properly.
		More info here:  https://github.com/Schepp/box-sizing-polyfill */
}


/*	MAIN CONTAINER 
	Set the width to whatever you want the width of your site to be. */
.container { 
	max-width: 1170px;
	min-width: 1170px;
	margin: 0 auto; 
}



/*	SELF CLEARING FLOATS - CLEARFIX METHOD */
.container:after,
.row:after, 
.col:after, 
.clr:after, 
.group:after { 
	content: ""; 
	display: table; 
	clear: both; 
}

/* 	DEFAULT ROW STYLES 
	Set bottom padding according to preference */
.row {
    padding-bottom: 0;
}
			
								  
/* DEFAULT COLUMN STYLES */
.col { 
	display: block;
	float: left;
	width: 100%;
}

.center-col {
    margin: 0 auto !important;
}

@media ( min-width : 768px ) {
	
	.gutters > .col {
		margin-left: 2%;        
	}
	
	.gutters .col:first-child { 
		margin-left: 0; 
	}
}


.table {
    display: table;
    width: 100%;
}

.table-row {
    display: table-row;
}

.table-cell {
    display: table-cell;
    vertical-align: top;
}



/*	COLUMN WIDTH ON DISPLAYS +768px 
	You might need to play with media queries here to suite your design. */
@media ( min-width : 768px ) {
	.span_1 { width: 8.33333333333%; }
	.span_2 { width: 16.6666666667%; }
	.span_2_5 { width: 20%; }
	.span_3 { width: 25%; }
	.span_4 { width: 33.3333333333%; }
	.span_5 { width: 41.6666666667%; }
	.span_6 { width: 50%; }
	.span_7 { width: 58.3333333333%; }
	.span_8 { width: 66.6666666667%; }
	.span_9 { width: 75%; }
	.span_10 { width: 83.3333333333%; }
	.span_11 { width: 91.6666666667%; }
	.span_12 { width: 100%; }
	
	.gutters > .span_1 { width: 6.5%; }
	.gutters > .span_2 { width: 15.0%; }
	/*.gutters .span_3 { width: 23.5%; }*/
    .gutters > .span_3 { width: 23.5%; }

	.gutters > .span_4 { width: 32.0%; }
	.gutters > .span_5 { width: 40.5%; }
	.gutters > .span_6 { width: 49.0%; }

	.gutters > .span_7 { width: 57.5%; }
	.gutters > .span_8 { width: 66.0%; }
	.gutters > .span_9 { width: 74.5%; }
	.gutters > .span_10 { width: 83.0%; }
	.gutters > .span_11 { width: 91.5%; }
	.gutters > .span_12 { width: 100%; }

    .gutters .span_3:nth-child(4n+1) {
        margin-left: 0;
    }

	.gutters .span_4:nth-child(3n+1) {
		margin-left: 0;
	}

	.gutters .span_6:nth-child(2n+1) {
		margin-left: 0;
	}

    .zap_mobile {
        display: none;
    }

}

@media only screen and (max-width: 767px) {
    .zap_full { display: none;}
}