@mixin grid-column($name) {
	.#{$name} {
		flex-grow: 1;
		flex-basis: 0;
		padding: 0 $half-gutter-width;
		max-width: 100%;
	}
	
	@for $i from 1 through 12 {
		.#{$name}-#{$i} {
			flex-basis: (8.33%*$i);
			max-width: 8.33%*$i;
			padding: 0 $half-gutter-width;
		}

		.#{$name}-offset-#{$i} {
			margin-left: (8.33%*$i);
		}
	}
}

@mixin alignment($name) {
	&.start-#{$name} {
		justify-content: flex-start;
	}

	&.center-#{$name} {
		justify-content: center;
	}

	&.end-#{$name} {
		justify-content: flex-end;
	}

	&.top-#{$name} {
		align-items: flex-start;
	}

	&.middle-#{$name} {
		align-items: center;
	}

	&.bottom-#{$name} {
		align-items: flex-end;
	}

	&.around-#{$name} {
		justify-content: space-around;
	}

	&.between-#{$name} {
		justify-content: space-between;
	}
}