@media only screen and (min-width: 576px) {

	.flex-basis-sm-50p {
		flex-basis: 50%;
	}
	.position-sm-absolute {
		position: absolute;
	}
	.top-sm-auto {
		top: auto;
	}
	.bottom-sm-auto {
		bottom: auto;
	}
	@each $size, $length in $sizes {
		.w-sm-#{$size} {
			width: $length !important;
		}
		.h-sm-#{$size} {
			height: $length !important;
		}
		.min-h-sm-#{$size} {
			min-height: $length;
		}
		.max-h-sm-#{$size} {
			max-height: $length;
		}
		.min-w-sm-#{$size} {
			min-width: $length;
		}
		.max-w-sm-#{$size} {
			max-width: $length;
		}
	}
	@each $name, $value in $line-heights {
		.leading-sm-#{$name} {
			line-height: $value !important;
		}
	}
	@each $size, $value in $font-sizes {
		.fz-sm-#{$size} {
			font-size: $value;
		}
	}
	@each $name, $value in $rounded {
		.rounded-sm-#{$name} {
			border-radius: $value;
		}
	}
	@each $name, $value in $spacers{
		.top-sm-#{$name} {
			top: $value;
		}
		.bottom-sm-#{$name} {
			bottom: $value;
		}
		.right-sm-n#{$name} {
			right: $value * -1;
		}
	}
	.h-sm-screen {
	    height: 100vh !important;
	}
	.w-sm-screen {
	    width: 100vw !important;
	}
}
