.push {
	position: relative;
	overflow: hidden;
	display: block;
	float:left;width: 18%;
	min-width: 100px;
	line-height: 2.5rem;
	margin: .5rem 1rem 1rem 0;
	font-size: 1.1rem;
	text-align: center;
	color:#000 !important;
	border: 1px #030 solid;
	background-color: #f2f2f2; 
	cursor: pointer;
	transition: all 0.25s ease;
}

.push:before {
  content: "";
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  transition: all 0.3s ease;
  z-index: 0;
}

.push:hover {
	color: #fff !important;
	background: transparent;
}

.push:hover:before {
	left: 0;
	z-index: -1;
}


.push.facebook:before { background: linear-gradient(135deg, #215997, #1a4576); }
.push.twitter:before { background: linear-gradient(135deg, #007acc, #0098d4); }
.push.linkedin:before { background: linear-gradient(135deg, #0A66C2, #004182); }
.push.reddit:before { background: linear-gradient(135deg, #FF4500, #CC3700); }
.push.telegram:before { background: linear-gradient(135deg, #0072aa, #0098d4); }