// Spacing
@for $i from 1 through 10 {
	.mt-#{$i} {
		margin-top: #{$i}rem !important;
	}
}

@for $i from 1 through 10 {
	.mb-#{$i} {
		margin-bottom: #{$i}rem !important;
	}
}

@include mq(md) {
	@for $i from 0 through 10 {
		.mt-md-#{$i} {
			margin-top: #{$i}rem !important;
		}
	}

	@for $i from 0 through 10 {
		.mb-md-#{$i} {
			margin-bottom: #{$i}rem !important;
		}
	}
}

@include mq(lg) {
	@for $i from 0 through 10 {
		.mt-lg-#{$i} {
			margin-top: #{$i}rem !important;
		}
	}

	@for $i from 0 through 10 {
		.mb-lg-#{$i} {
			margin-bottom: #{$i}rem !important;
		}
	}
}

@include mq(xl) {
	@for $i from 0 through 10 {
		.mt-xl-#{$i} {
			margin-top: #{$i}rem !important;
		}
	}

	@for $i from 0 through 10 {
		.mb-xl-#{$i} {
			margin-bottom: #{$i}rem !important;
		}
	}
}

@include mq(xxl) {
	@for $i from 0 through 10 {
		.mt-xxl-#{$i} {
			margin-top: #{$i}rem !important;
		}
	}

	@for $i from 0 through 10 {
		.mb-xxl-#{$i} {
			margin-bottom: #{$i}rem !important;
		}
	}
}

$space: ( 1: .4, 2: .8, 3: 1.6, 4: 2.4, 5: 4.8 ) !default;
@for $i from 1 through 6 {
	.m-b-#{$i}, .m-y-#{$i} {
		margin-bottom: #{map-get($space, $i)}rem !important;
	}
	.m-t-#{$i}, .m-y-#{$i} {
		margin-top: #{map-get($space, $i)}rem !important;
	}
	.m-l-#{$i}, .m-x-#{$i} {
		margin-left: #{map-get($space, $i)}rem !important;
	}
	.m-r-#{$i}, .m-x-#{$i} {
		margin-right: #{map-get($space, $i)}rem !important;
	}
	.p-b-#{$i}, .p-y-#{$i} {
		padding-bottom: #{map-get($space, $i)}rem !important;
	}
	.p-t-#{$i}, .p-y-#{$i} {
		padding-top: #{map-get($space, $i)}rem !important;
	}
	.p-l-#{$i}, .p-x-#{$i} {
		padding-left: #{map-get($space, $i)}rem !important;
	}
	.p-r-#{$i}, .p-x-#{$i} {
		padding-right: #{map-get($space, $i)}rem !important;
	}
}

.pl-6, .px-6 {
    padding-left: 4rem !important;
}

.pr-6, .px-6 {
    padding-right: 4rem !important;
}