:root{
	--snap-gutter: 30px;
	--snap-container: 100vh;
	--snap-offset: calc( var(--snap-container) / 2 - var(--snap-gutter) / 2 );
}

.snap-left-yes{
	margin-left: calc( -1 * var(--snap-gutter) / 2 ) !important;
}
.snap-left-no{
	margin-left: auto !important;
}
.snap-right-yes{
	margin-right: calc( -1 * var(--snap-gutter) / 2 ) !important;
}
.snap-right-no{
	margin-right: auto !important;
}

@media(min-width:576px){
	:root{
		--snap-container: 540px;
	}
	.snap-left-yes,
	.snap-sm-left-yes{
		margin-left: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-sm-left-no{
		margin-left: auto !important;
	}
	.snap-right-yes,
	.snap-sm-right-yes{
		margin-right: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-sm-right-no{
		margin-right: auto !important;
	}
}

@media(min-width:768px){
	:root{
		--snap-container: 720px;
	}

	.snap-md-left-yes{
		margin-left: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-md-left-no{
		margin-left: auto !important;
	}
	.snap-md-right-yes{
		margin-right: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-md-right-no{
		margin-right: auto !important;
	}
}

@media(min-width:992px){
	:root{
		--snap-container: 960px;
	}

	.snap-lg-left-yes{
		margin-left: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-lg-left-no{
		margin-left: auto !important;
	}
	.snap-lg-right-yes{
		margin-right: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-lg-right-no{
		margin-right: auto !important;
	}
}

@media(min-width:1200px){
	:root{
		--snap-container: 1140px;
	}

	.snap-xl-left-yes{
		margin-left: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-xl-left-no{
		margin-left: auto !important;
	}
	.snap-xl-right-yes{
		margin-right: calc( -50vw + var(--snap-offset) + var(--scrollbar-half) ) !important;
	}
	.snap-xl-right-no{
		margin-right: auto !important;
	}
}