/* Basic animation - Start */

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

@keyframes fadeIn {
	0% {
		visibility: visible;
		opacity: 1;
	}
	100% {
		visibility: collapse;
		opacity: 0;
	}
}

@keyframes preloader {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/* Basic animation - End */

/* Animation - GitHub - Start */

@keyframes shadowFadeInGitHub {
	0% {
		box-shadow: 3px 3px 6px var(--shadow-color-1),
			-3px -3px 6px var(--shadow-color-2);
	}
	50% {
		box-shadow: none;
	}
	100% {
		box-shadow: inset 3px 3px 6px #282e34, inset -3px -3px 6px #363e46;
	}
}

@keyframes shadowFadeOutGitHub {
	0% {
		box-shadow: inset 3px 3px 6px #282e34, inset -3px -3px 6px #363e46;
	}
	50% {
		box-shadow: none;
	}
	100% {
		box-shadow: 3px 3px 6px var(--shadow-color-1),
			-3px -3px 6px var(--shadow-color-2);
	}
}

/* Animation - LinkedIn - End */

/* Animation - LinkedIn - Start */

@keyframes shadowFadeInSocial {
	0% {
		box-shadow: 3px 3px 6px var(--shadow-color-1),
			-3px -3px 6px var(--shadow-color-2);
	}
	50% {
		box-shadow: none;
	}
	100% {
		box-shadow: inset 3px 3px 6px #1e4e87, inset -3px -3px 6px #3280dd;
	}
}

@keyframes shadowFadeOutSocial {
	0% {
		box-shadow: inset 3px 3px 6px #1e4e87, inset -3px -3px 6px #3280dd;
	}
	50% {
		box-shadow: none;
	}
	100% {
		box-shadow: 3px 3px 6px var(--shadow-color-1),
			-3px -3px 6px var(--shadow-color-2);
	}
}

/* Animation - LinkedIn - End */