@keyframes blurIn {
	from {
		opacity: 0;
		filter: blur(16px);
	}
	to {
		opacity: 1;
		filter: blur(0);
	}
}

.blurIn {
	animation-name: blurIn;
}

@keyframes blurInUp {
	from {
		opacity: 0;
		filter: blur(16px);
		transform: translate3d(0, 28px, 0);
	}
	to {
		opacity: 1;
		filter: blur(0);
		transform: translate3d(0, 0, 0);
	}
}

.blurInUp {
	animation-name: blurInUp;
}

@keyframes blurInDown {
	from {
		opacity: 0;
		filter: blur(16px);
		transform: translate3d(0, -28px, 0);
	}
	to {
		opacity: 1;
		filter: blur(0);
		transform: translate3d(0, 0, 0);
	}
}

.blurInDown {
	animation-name: blurInDown;
}

@keyframes blurInLeft {
	from {
		opacity: 0;
		filter: blur(16px);
		transform: translate3d(-28px, 0, 0);
	}
	to {
		opacity: 1;
		filter: blur(0);
		transform: translate3d(0, 0, 0);
	}
}

.blurInLeft {
	animation-name: blurInLeft;
}

@keyframes blurInRight {
	from {
		opacity: 0;
		filter: blur(16px);
		transform: translate3d(28px, 0, 0);
	}
	to {
		opacity: 1;
		filter: blur(0);
		transform: translate3d(0, 0, 0);
	}
}

.blurInRight {
	animation-name: blurInRight;
}

@media (prefers-reduced-motion: reduce) {
	.blurIn,
	.blurInUp,
	.blurInDown,
	.blurInLeft,
	.blurInRight {
		animation-duration: 1ms !important;
		animation-iteration-count: 1 !important;
		filter: none !important;
		transform: none !important;
		opacity: 1 !important;
	}
}