/* ------------------------------------------------------------------
	Amity — scroll reveal
	Content fades in and rises as it enters the viewport.
	The .reveal class is applied by reveal.js, so with JavaScript off
	nothing is ever hidden.
------------------------------------------------------------------- */

.reveal {
	opacity: 0;
	transform: translateY(1.75rem);
	transition:
		opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* Images carry their own fade-in from main.js, so they only travel. */

.reveal.image-component {
	opacity: 1;
}

.reveal.image-component:not(.is-visible) > .frame {
	opacity: 0;
	transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

@media (prefers-reduced-motion: reduce) {

	.reveal,
	.reveal.image-component > .frame {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

}