html {
	--swup-slide-theme-direction: 1;
	--swup-slide-theme-translate: 60px;
	--swup-slide-theme-duration-fade: 0.3s;
	--swup-slide-theme-duration-slide: 0.4s;
	--swup-slide-theme-translate-forward: calc(
		var(--swup-slide-theme-direction) * var(--swup-slide-theme-translate)
	);
	--swup-slide-theme-translate-backward: calc(-1 * var(--swup-slide-theme-translate-forward));
}

html.swup-theme-reverse {
	--swup-slide-theme-direction: -1;
}

html.is-changing .swup-transition-main {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	transition:
		opacity var(--swup-slide-theme-duration-fade),
		transform var(--swup-slide-theme-duration-slide);
}

html.is-animating .swup-transition-main {
	opacity: 0;
	transform: translate3d(0, var(--swup-slide-theme-translate-backward), 0);
}

html.is-animating.is-leaving .swup-transition-main {
	transform: translate3d(0, var(--swup-slide-theme-translate-forward), 0);
}
