@-webkit-keyframes f {
	0% {
		opacity: 0;
		-webkit-transform: rotate(45deg) translateY(300%);
		transform: rotate(45deg) translateY(300%)
	}
	50% {
		opacity: 1
	}
	to {
		opacity: 0;
		-webkit-transform: rotate(45deg) translateY(-300%);
		transform: rotate(45deg) translateY(-300%)
	}
}

@keyframes f {
	0% {
		opacity: 0;
		-webkit-transform: rotate(45deg) translateY(300%);
		transform: rotate(45deg) translateY(300%)
	}
	50% {
		opacity: 1
	}
	to {
		opacity: 0;
		-webkit-transform: rotate(45deg) translateY(-300%);
		transform: rotate(45deg) translateY(-300%)
	}
}
.vdm_btn_cls {
	letter-spacing: .1em;
	text-transform: uppercase;
	text-align: center;
	background-color: #343434;
	color: #fff;
	display: inline-block;
	padding: 1.5rem 1rem;
	text-decoration: none;
	-webkit-transition: background-color .2s ease-out;
	transition: background-color .2s ease-out;
	font-weight: 400;
	-webkit-transition: background-color .6s ease-out;
	transition: background-color .6s ease-out;
	outline: none;
	position: relative;
	max-width: 23rem;
	min-width: 21.5rem;
	word-break: break-word;
    overflow: hidden;
}
.vdm_btn_cls:active, .vdm_btn_cls:focus, .vdm_btn_cls:hover {
	background-color: #525252;
}
.vdm_btn_cls:after {
	background: hsla(0,0%,100%,.15);
	content: "";
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
.vdm_btn_cls:hover:after {
	-webkit-animation: f .6s linear forwards;
	animation: f .6s linear forwards;
}