.mn-effects-wrapper {
	position: relative;
}

.mn-text-animation-wrapper {
	display: inline-block;
}

.mn-text-unit {
	display: inline-block;
	opacity: 0;
	transform: translateY(0);
}

.mn-text-unit.mn-text-space {
	min-width: 0.25em;
}

/* Support for MN Heading parts as animation units */
.mn-heading.mn-text-animation-wrapper .mn-heading-part.mn-text-unit {
	display: inline-block;
}

.mn-text-unit.mn-animated {
	opacity: 1;
}

.mn-text-unit.mn-animating-out {
	opacity: 0;
	transition: opacity calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease);
}

.mn-animation-fade .mn-text-unit {
	animation: mnFadeIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-fade .mn-text-unit.mn-animating-out {
	animation: mnFadeOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnFadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes mnFadeOut {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}

/* Fade Up */
.mn-animation-fade-up .mn-text-unit {
	animation: mnFadeUpIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-fade-up .mn-text-unit.mn-animating-out {
	animation: mnFadeUpOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnFadeUpIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes mnFadeUpOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(20px);
	}
}

/* Fade Down */
.mn-animation-fade-down .mn-text-unit {
	animation: mnFadeDownIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-fade-down .mn-text-unit.mn-animating-out {
	animation: mnFadeDownOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnFadeDownIn {
	from {
		opacity: 0;
		transform: translateY(-20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes mnFadeDownOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(-20px);
	}
}

/* Fade Left */
.mn-animation-fade-left .mn-text-unit {
	animation: mnFadeLeftIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-fade-left .mn-text-unit.mn-animating-out {
	animation: mnFadeLeftOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnFadeLeftIn {
	from {
		opacity: 0;
		transform: translateX(20px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes mnFadeLeftOut {
	from {
		opacity: 1;
		transform: translateX(0);
	}
	to {
		opacity: 0;
		transform: translateX(20px);
	}
}

/* Fade Right */
.mn-animation-fade-right .mn-text-unit {
	animation: mnFadeRightIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-fade-right .mn-text-unit.mn-animating-out {
	animation: mnFadeRightOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnFadeRightIn {
	from {
		opacity: 0;
		transform: translateX(-20px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes mnFadeRightOut {
	from {
		opacity: 1;
		transform: translateX(0);
	}
	to {
		opacity: 0;
		transform: translateX(-20px);
	}
}

/* Slide Up (from bottom) */
.mn-animation-slide .mn-text-unit {
	animation: mnSlideIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-slide .mn-text-unit.mn-animating-out {
	animation: mnSlideOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnSlideIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes mnSlideOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(20px);
	}
}

/* Slide Down (from top) */
.mn-animation-slide-down .mn-text-unit {
	animation: mnSlideDownIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-slide-down .mn-text-unit.mn-animating-out {
	animation: mnSlideDownOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnSlideDownIn {
	from {
		opacity: 0;
		transform: translateY(-30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes mnSlideDownOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(-30px);
	}
}

/* Slide Left (from right) */
.mn-animation-slide-left .mn-text-unit {
	animation: mnSlideLeftIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-slide-left .mn-text-unit.mn-animating-out {
	animation: mnSlideLeftOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnSlideLeftIn {
	from {
		opacity: 0;
		transform: translateX(30px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes mnSlideLeftOut {
	from {
		opacity: 1;
		transform: translateX(0);
	}
	to {
		opacity: 0;
		transform: translateX(30px);
	}
}

/* Slide Right (from left) */
.mn-animation-slide-right .mn-text-unit {
	animation: mnSlideRightIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-slide-right .mn-text-unit.mn-animating-out {
	animation: mnSlideRightOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnSlideRightIn {
	from {
		opacity: 0;
		transform: translateX(-30px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes mnSlideRightOut {
	from {
		opacity: 1;
		transform: translateX(0);
	}
	to {
		opacity: 0;
		transform: translateX(-30px);
	}
}

.mn-animation-bounce .mn-text-unit {
	animation: mnBounceIn var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-bounce .mn-text-unit.mn-animating-out {
	animation: mnBounceOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnBounceIn {
	0% {
		opacity: 0;
		transform: scale(0.3) translateY(-50px);
	}
	50% {
		opacity: 1;
		transform: scale(1.05);
	}
	70% {
		transform: scale(0.9);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes mnBounceOut {
	0% {
		opacity: 1;
		transform: scale(1);
	}
	100% {
		opacity: 0;
		transform: scale(0.3) translateY(-50px);
	}
}

.mn-animation-wave .mn-text-unit {
	animation: mnWave var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-wave .mn-text-unit.mn-animating-out {
	animation: mnWaveOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnWave {
	0%, 100% {
		transform: translateY(0);
		opacity: 1;
	}
	25% {
		transform: translateY(-15px);
	}
	75% {
		transform: translateY(5px);
	}
}

@keyframes mnWaveOut {
	0% {
		opacity: 1;
		transform: translateY(0);
	}
	100% {
		opacity: 0;
		transform: translateY(15px);
	}
}

.mn-animation-typewriter .mn-text-unit {
	opacity: 0;
	animation: mnTypewriter var(--mn-duration, 100ms) steps(1) forwards;
}

.mn-animation-typewriter .mn-text-unit.mn-animating-out {
	animation: mnTypewriterOut calc(var(--mn-duration, 100ms) / 2) steps(1) forwards;
}

@keyframes mnTypewriter {
	to {
		opacity: 1;
	}
}

@keyframes mnTypewriterOut {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}

.mn-animation-flip .mn-text-unit {
	animation: mnFlip var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
	transform-style: preserve-3d;
}

.mn-animation-flip .mn-text-unit.mn-animating-out {
	animation: mnFlipOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnFlip {
	from {
		opacity: 0;
		transform: rotateY(-90deg);
	}
	to {
		opacity: 1;
		transform: rotateY(0);
	}
}

@keyframes mnFlipOut {
	from {
		opacity: 1;
		transform: rotateY(0);
	}
	to {
		opacity: 0;
		transform: rotateY(90deg);
	}
}

.mn-animation-neon .mn-text-unit {
	animation: mnNeon var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-neon .mn-text-unit.mn-animating-out {
	animation: mnNeonOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnNeon {
	0%, 18%, 22%, 25%, 53%, 57%, 100% {
		text-shadow: 
			0 0 4px #fff,
			0 0 11px #fff,
			0 0 19px #fff,
			0 0 40px currentColor,
			0 0 80px currentColor,
			0 0 90px currentColor,
			0 0 100px currentColor,
			0 0 150px currentColor;
		opacity: 1;
	}
	20%, 24%, 55% {
		text-shadow: none;
		opacity: 0.5;
	}
}

@keyframes mnNeonOut {
	0% {
		text-shadow: 
			0 0 4px #fff,
			0 0 11px #fff,
			0 0 19px #fff,
			0 0 40px currentColor,
			0 0 80px currentColor,
			0 0 90px currentColor,
			0 0 100px currentColor,
			0 0 150px currentColor;
		opacity: 1;
	}
	100% {
		text-shadow: none;
		opacity: 0;
	}
}

.mn-animation-glitch .mn-text-unit {
	animation: mnGlitch var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
	position: relative;
}

.mn-animation-glitch .mn-text-unit.mn-animating-out {
	animation: mnGlitchOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnGlitch {
	0% {
		opacity: 0;
		transform: translate(0);
	}
	20% {
		opacity: 1;
		transform: translate(-2px, 2px);
	}
	40% {
		transform: translate(-2px, -2px);
	}
	60% {
		transform: translate(2px, 2px);
	}
	80% {
		transform: translate(2px, -2px);
	}
	100% {
		opacity: 1;
		transform: translate(0);
	}
}

@keyframes mnGlitchOut {
	0% {
		opacity: 1;
		transform: translate(0);
	}
	50% {
		transform: translate(-2px, 2px);
	}
	100% {
		opacity: 0;
		transform: translate(0);
	}
}

.mn-animation-elastic .mn-text-unit {
	animation: mnElastic var(--mn-duration, 1000ms) var(--mn-easing, ease) forwards;
}

.mn-animation-elastic .mn-text-unit.mn-animating-out {
	animation: mnElasticOut calc(var(--mn-duration, 1000ms) / 2) var(--mn-easing, ease) forwards;
}

@keyframes mnElastic {
	0% {
		opacity: 0;
		transform: scale(0);
	}
	55% {
		opacity: 1;
		transform: scale(1.2);
	}
	70% {
		transform: scale(0.9);
	}
	85% {
		transform: scale(1.05);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes mnElasticOut {
	0% {
		opacity: 1;
		transform: scale(1);
	}
	100% {
		opacity: 0;
		transform: scale(0);
	}
}

.mn-text-unit.mn-hover-trigger {
	transition: all 0.3s ease;
}

.mn-text-unit.mn-hover-trigger:hover {
	transform: scale(1.2);
}

.mn-animation-loop-infinite .mn-text-unit {
	animation-iteration-count: infinite;
}