@keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-webkit-keyframes fadeOut {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@keyframes slideSubMenuIn {
	0% {
		transform: translateY(15%);
		opacity: 0;
	}

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

@keyframes glow {
	0% {
		filter: none;
	}

	50% {
		filter: drop-shadow(0 0 9px var(--light-color));
	}

	100% {
		filter: none;
	}
}

@-webkit-keyframes glow {
	0% {
		filter: none;
	}

	50% {
		filter: drop-shadow(0 0 9px var(--light-color));
	}

	100% {
		filter: none;
	}
}

@keyframes slideInUp {
	0% {
		transform: translateY(100%);
		opacity: 0;
	}

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

@keyframes slideOutUp {
	0% {
		transform: translateY(0);
		opacity: 1;
	}

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

@keyframes slideInDown {
	0% {
		transform: translateY(-100%);
		opacity: 0;
	}

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

@keyframes slideOutDown {
	0% {
		transform: translateY(0);
		opacity: 1;
	}

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

@keyframes slideInRight {
	0% {
		transform: translateX(-100%);
		opacity: 0;
	}

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

@keyframes slideOutRight {
	0% {
		transform: translateX(0);
		opacity: 1;
	}

	100% {
		transform: translateX(-100%);
		opacity: 0;
	}
}

@keyframes slideInLeft {
	0% {
		transform: translateX(100%);
		opacity: 0;
	}

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

@keyframes slideOutLeft {
	0% {
		transform: translateX(0);
		opacity: 1;
	}

	100% {
		transform: translateX(100%);
		opacity: 0;
	}
}

@keyframes slideMenuInRight {
	0% {
		transform: translateX(100%);
		opacity: 0;
	}

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

@keyframes slideMenuOutRight {
	0% {
		transform: translateX(0);
		opacity: 1;
	}

	100% {
		transform: translateX(100%);
		opacity: 0;
	}
}

.has-animation {
	position: relative;
	opacity: 0;
	transition: all 0.5s ease-in-out;
}

.slideInUp {
	animation: slideInUp 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideOutUp {
	animation: slideOutUp 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideInLeft {
	animation: slideInLeft 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideOutLeft {
	animation: slideOutLeft 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideInRight {
	animation: slideInRight 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideOutRight {
	animation: slideOutRight 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideInDown {
	animation: slideInDown 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideOutDown {
	animation: slideOutDown 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.fadeIn {
	animation: fadeIn 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.fadeOut {
	animation: fadeOut 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}

.slideSubMenuIn {
	animation: slideSubMenuIn 0.25s ease-in-out forwards;
}