simple media queries

simple_media_queries.scss

@mixin media-hidden {
	@media only screen and (max-width: 319px) {
		display: none;
	}
}

@mixin xs-screen {
	@media only screen and (max-width: 575px) {
		@content;
	}
}

@mixin sm-screen {
	@media only screen and (min-width: 576px) {
		@content;
	}
}

@mixin md-screen {
	@media only screen and (min-width: 768px) {
		@content;
	}
}

@mixin md-screen-max {
	@media only screen and (max-width: 991px) {
		@content;
	}
}

@mixin lg-screen {
	@media only screen and (min-width: 992px) {
		@content;
	}
}

@mixin xl-screen {
	@media only screen and (min-width: 1200px) {
		@content;
	}
}