/*** PLATFORM & BREAKPOINTS ***/
/* 
	NAME	BREAKPOINT	RANGE		PLATFORM	USE
	sm		0px			0-576px		mobile		mobile devices
	md		577px		577-991px	mobile		tablets or landscape mobiles
	lg		992px		992-1279px	desktop		desktop
	xl		1280px		1280-1919px	desktop		Full HD desktops
	xxl		1920px		>1920px		desktop		4k
*/

/* Element is HIDDEN if window width is WITHIN breakpoint or platform range */
@media (width <= 576px) {
	.hidden-sm {
		display: none !important;
	}
}

@media (577px <= width < 992px) {
	.hidden-md {
		display: none !important;
	}
}

@media (992px <= width < 1279px) {
	.hidden-lg {
		display: none !important;
	}
}

@media (width >= 1280px) {
	.hidden-xl {
		display: none !important;
	}
}

@media (width < 992px) {
	.hidden-mobile {
		display: none !important;
	}
}

@media (width >= 992px) {
	.hidden-desktop {
		display: none !important;
	}
}

/* Element is VISIBLE if window width is WITHIN breakpoint or platform range */
@media not (width <= 576px) {
	.visible-sm {
		display: none !important;
	}
}

@media not (577px <= width < 992px) {
	.visible-md {
		display: none !important;
	}
}

@media not (992px <= width < 1279px) {
	.visible-lg {
		display: none !important;
	}
}

@media not (width >= 1280px) {
	.visible-xl {
		display: none !important;
	}
}

@media not (width < 992px) {
	.visible-mobile {
		display: none !important;
	}
}

@media not (width >= 992px) {
	.visible-desktop {
		display: none !important;
	}
}