.icon {
	display: inline-flex;
	width: 50px;
	height: 50px;
	text-decoration: none;
	font-size: 26px;
	color: #fff;
	border-radius: 50%;
	outline: 2px solid #fff;
	transition-property: outline-offset, outline-color, background-color;
	transition-duration: 0.25s;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
}
.icon:hover {
	outline-offset: 4px;
}
.icon i {
	margin: auto;
}
.icon:hover i {
	animation: shake 0.25s;
}
.icon--instagram:hover {
	background-image: radial-gradient(
		circle at 30% 107%,
		#fdf497 0%,
		#fdf497 5%,
		#fd5949 45%,
		#d6249f 60%,
		#285aeb 90%
	);
	outline-color: #a02d76;
}
.icon--telegram-send:hover {
	background-color: #1da1f2;
	outline-color: #1da1f2;
}
.icon--mail-send:hover {
	background-color: #b58e00;
	outline-color: #e6db75;
}
.icon--linkedin:hover {
	background-color: #0077b5;
	outline-color: #0077b5;
}
.icon--whatsapp:hover {
	background-color: #2ea44f;
	outline-color: #2ea44f;
}
.icon--share:hover {
	background-color: rgb(17, 8, 145);
	outline-color: rgb(17, 8, 145);
}
.icon--phone:hover {
	background-color: #00a9b5;
	outline-color: #00a9b5;
}
.icon--global:hover {
	background-color: #0077b5;
	outline-color: #0077b5;
}
.icon--information:hover {
	background-color: #0077b5;
	outline-color: #0077b5;
}
@keyframes shake {
	10% {
		transform: rotate(15deg);
	}
	20% {
		transform: rotate(-15deg);
	}
	30% {
		transform: rotate(15deg);
	}
	40% {
		transform: rotate(-15deg);
	}
}