@mixin col-base {
	box-sizing: border-box;
	flex: 1 1 auto;
	margin: 0;
	padding: 1em 0 0 1em;
	min-width: 0;
	max-width: 100%;
}

@mixin default-col-behavior($suffix, $measurement) {
	@media screen and (min-width: #{$measurement}) {
		.row {
			.col {
				@for $i from 1 through 12 {
					&.#{$suffix}-#{$i} {
						flex: 0 0 ($i / 12) * 100%;
					}
					&.offset-#{$suffix}-#{$i} {
						margin-left: ($i / 12) * 100%;
					}
				}
		    }
		}
	}
}