.btn {

}
	.btn:link , 
	.btn:visited {
		text-transform: uppercase;
		text-decoration: none;
		padding: 1.5rem 4rem;  /* top&bottom  left&right */
		display: inline-block;
		border-radius: 10rem;
		transition: all .2s;
		position: relative;  }
	.btn:hover {
		transform: translateY(-3px);
		box-shadow: 0 .5rem 1rem rgba(218,213,189,.4); /* x y blur color */ }
	.btn:active {
		transform: translateY(-1px);
		box-shadow: 0 .5rem .5rem rgba(218,213,189,.4); /* x y blur color */ }
	.btn::after {
		content: "";
		display: inline-block;
		height: 100%; /* of the button */
		width: 100%;
		border-radius: 10rem;
		position: absolute;
		top: 0;  /*based off first relative position element it can find */
		left: 0;
		z-index: -1;
		transition: all .4s; }
	.btn:hover::after {
		transform: scaleX(1.4) scaleY(1.6);
		opacity: 0; /* trick for fading it out */  }

.btn-white {
	background-color: #DAD5BD;
	color: #777777;  
}
	.btn-white::after {
		background-color: #DAD5BD;  }

.btn-purple {
	background-color: #5A1189;
}
	.btn-purple:link,
	.btn-purple:visited {
		color:#FFFFFF;
		font-size: 1.4rem;
	}
	.btn-purple::after {
		background-color: #5A1189;  }


.btn-animated {
	animation: moveInUp .5s ease-out .75s;
	animation-fill-mode: backwards;  
}

.btn-text {

}
.btn-text:link,
.btn-text:visited {
	color: #5A1189;
	font-size: 1.6rem;
	display: inline-block;
	text-decoration: none;
	border-bottom: 1px solid #5A1189;
	padding: 3px;
	transition: all .2s;
}
.btn-text:hover {
	background-color: #5A1189;
	color: #FFF;
	box-shadow: 0 1rem 2rem rgba(0,0,0,.15);
	transform:  translateY(-2px);
}
.btn-text:active {
	box-shadow:  0 .5rem 1rem rgba(0,0,0,.15);
	transform: translateY(0);
}