/* 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{width:100%; max-width:1120px; margin:0 auto; padding:0;}
/*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:auto; margin:0 auto 4%;}
/* DEFAULT COLUMN STYLES */
.col{display:block;float:left;width:100%;}
.reverse .col{float:right;}
@media(min-width:769px){
	.container{padding:20px;}
	.gutters .col{margin-left:2%;}
	.gutters .col:first-child{margin-left:0;}
	.reverse .gutters .col{margin-left:0; margin-right:2%;}
	.reverse .gutters .col:first-child{margin-right:0;}
}
/*COLUMN WIDTH ON DISPLAYS +768px You might need to play with media queries here to suite your design. */
@media(min-width:769px){
.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%;}
}

.row img{max-width:100%; height:auto;}
br{display:block;}