/*	24 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;
	*behavior: url(../../../../js/boxsizing.html);
	/*	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 {
	margin: 0 auto;
	max-width:960px;
}


/*	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%;
}


.gutters .col {
	margin-left: 2%;
}

.gutters .col:first-child {
	margin-left: 0;
}

@media screen and (max-width: 767px) {

	.gutters .col {
		margin-left: auto;
	}
	.gutters .col:first-child {
		margin-left: auto;
	}
}

.span_1 { width: 4.16666666667%; }
.span_2 { width: 8.33333333333%; }
.span_3 { width:12.5%; }
.span_4 { width: 16.6666666667%; }
.span_5 { width: 20.8333333333%; }
.span_6 { width: 25%; }
.span_7 { width: 29.1666666667%; }
.span_8 { width: 33.3333333333%; }
.span_9 { width: 37.5%; }
.span_10 { width: 41.6666666667%; }
.span_11 { width: 45.8333333333%; }
.span_12 { width: 50%; }
.span_13 { width: 54.1666666667%; }
.span_14 { width: 58.3333333333%; }
.span_15 { width: 62.5%; }
.span_16 { width: 66.6666666667%; }
.span_17 { width: 70.8333333333%; }
.span_18 { width: 75%; }
.span_19 { width: 79.1666666667%; }
.span_20 { width: 83.3333333333%; }
.span_21 { width: 87.5%; }
.span_22 { width: 91.6666666667%; }
.span_23 { width: 95.8333333333%; }
.span_24 { width: 100%; }

.gutters .span_1 { width: 2.25%; }
.gutters .span_2 { width: 6.5%; }
.gutters .span_3 { width: 10.75%; }
.gutters .span_4 { width: 15.0%; }
.gutters .span_5 { width: 19.25%; }
.gutters .span_6 { width: 23.5%; }
.gutters .span_7 { width: 27.75%; }
.gutters .span_8 { width: 32.0%; }
.gutters .span_9 { width: 36.25%; }
.gutters .span_10 { width: 40.5%; }
.gutters .span_11 { width: 44.75%; }
.gutters .span_12 { width: 49.0%; }
.gutters .span_13 { width: 53.25%; }
.gutters .span_14 { width: 57.5%; }
.gutters .span_15 { width: 61.75%; }
.gutters .span_16 { width: 66.0%; }
.gutters .span_17 { width: 70.25%; }
.gutters .span_18 { width: 74.5%; }
.gutters .span_19 { width: 78.75%; }
.gutters .span_20 { width: 83.0%; }
.gutters .span_21 { width: 87.25%; }
.gutters .span_22 { width: 91.5%; }
.gutters .span_23 { width: 95.75%; }
.gutters .span_24 { width: 100%; }


@media screen and (max-width: 767px) {
	.span_1, .span_2, .span_3, .span_4, .span_5, .span_6, .span_7, .span_8, .span_9, .span_10, .span_11, .span_12, .span_13, .span_14, .span_15, .span_16, .span_17, .span_18, .span_19, .span_20, .span_21, .span_22, .span_23, .span_24 {
		width: auto;
	}

	.gutters .span_1, .gutters .span_2, .gutters .span_3, .gutters .span_4, .gutters .span_5, .gutters .span_6, .gutters .span_7, .gutters .span_8, .gutters .span_9, .gutters .span_10, .gutters .span_11, .gutters .span_12, .gutters .span_13, .gutters .span_14, .gutters .span_15, .gutters .span_16, .gutters .span_17, .gutters .span_18, .gutters .span_19, .gutters .span_20, .gutters .span_21, .gutters .span_22, .gutters .span_23, .gutters .span_24 {
		width: auto;
	}


}