.fade-in {
	animation: fade-in 0.4s forwards;
}

@keyframes fade-in {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.fade-out {
	animation: fade-out 0.4s forwards;
}

@keyframes fade-out {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

.fade-in-up {
	animation: fade-in-up 0.5s;
}

@keyframes fade-in-up {
	0% {
		opacity: 0;
		transform: translateY(20px);
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

.fade-in-left {
	animation: fade-in-left 0.5s;
}

@keyframes fade-in-left {
	0% {
		opacity: 0;
		transform: translateX(20px);
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

.fade-in-right {
	animation: fade-in-right 0.5s;
}

@keyframes fade-in-right {
	0% {
		opacity: 0;
		transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

@keyframes fade {
    0% {
        opacity: 0%;
    }
    100% {
        opacity: 100%;
    }
}

@keyframes bounce {
    0%, 20%, 100% {
        transform: translateY(0);
    }
    30% {
        transform: translateY(-10px);
    }
    50% {
        transform: translateY(5px);
    }
    60% {
        transform: translateY(-5px);
    }
    80% {
        transform: translateY(0);
    }
}