/*
	RESET - ADAPTED FROM MEYER RESET
	URL - http://meyerweb.com/eric/tools/css/reset/
	LICENSE - PUBLIC DOMAIN
*/

/* RESET
----------------------------------------------------------------------------------------------------*/
/*a, abbr, acronym, address, applet, article, aside, audio,
b, big, blockquote, body, caption, canvas, center, cite, code,
dd, del, details, dfn, dialog, div, dl, dt, em, embed,
fieldset, figcaption, figure, form, footer,
header, hgroup, h1, h2, h3, h4, h5, h6, html,
i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav,
object, ol, output, p, pre, q, ruby,
s, samp, section, main, small, span, strike, strong, sub, summary, sup,
tt, table, tbody, textarea, tfoot, thead, time, tr, th, td,
u, ul, var, video {*/
a, abbr, acronym, address, applet, article, aside, audio,
b, big, blockquote, body, caption, canvas, center, cite, code,
dd, del, details, dfn, dialog, div, dl, dt, em, embed,
fieldset, figcaption, figure, form, footer,
header, hgroup, h1, h2, h3, h4, h5, h6, html,
i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav,
object, ol, output, p, pre, q, ruby,
s, samp, section, main, small, span, strike, strong, sub, summary, sup,
tt, u, ul, var, video {
	font-family: inherit;
	font-size: 100%;
	font-weight: inherit;
	/*font-style: inherit;*/
	vertical-align: baseline;
	white-space: normal;
	text-align: left;
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	background: transparent;
}

article, aside, details, figcaption, figure, footer, header, hgroup,
menu, nav, section, main {
	display: block;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

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


/*	MAIN CONTAINER
	Set the width to whatever you want the width of your site to be. */
.container {
	max-width: 990px;
	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: 0em;
}


/* DEFAULT COLUMN STYLES */
.col {
	display: block;
	float: left;
	width: 100%;
}

@media ( min-width : 768px ) {

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

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




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