html.yb-js.yb-page-loading::before {
	position: fixed;
	content: "";
	inset: 0;
	z-index: 99998;
	width: 100vw;
	height: 100vh;
	background: var(--yb-page-transition-bg, var(--yb-preloader-bg, #0C0C0C));
	pointer-events: auto;
	transform: translate3d(0, 0, 0);
	transition: transform var(--yb-page-transition-exit-duration, 500ms) cubic-bezier(.76, 0, .24, 1);
	will-change: transform;
}

.yb-page-transition {
	position: fixed;
	inset: 0;
	z-index: 99999;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	pointer-events: auto;
	background: transparent;
}

html:not(.yb-js) .yb-page-transition,
.yb-page-transition.is-hidden {
	visibility: hidden;
	pointer-events: none;
}

.yb-page-transition__panel {
	position: absolute;
	inset: 0;
	background: var(--yb-page-transition-bg, var(--yb-preloader-bg, #0C0C0C));
	transform: translate3d(0, 0, 0);
	transition-property: transform;
	transition-duration: var(--yb-page-transition-exit-duration, 500ms);
	transition-timing-function: cubic-bezier(.76, 0, .24, 1);
	will-change: transform;
}

.yb-page-transition.is-revealing .yb-page-transition__panel {
	transform: translate3d(0, -100%, 0);
	transition-duration: var(--yb-page-transition-exit-duration, 500ms);
}

.yb-page-transition.is-hidden .yb-page-transition__panel,
.yb-page-transition.is-covering .yb-page-transition__panel {
	transform: translate3d(0, 100%, 0);
	transition-duration: 0ms;
}

.yb-page-transition.is-covering.is-covering-active .yb-page-transition__panel {
	transform: translate3d(0, 0, 0);
	transition-duration: var(--yb-page-transition-enter-duration, 400ms);
}

@media (prefers-reduced-motion: reduce) {
	html.yb-js.yb-page-loading::before,
	.yb-page-transition {
		display: none !important;
	}
}