/*

Derived from https://codepen.io/phat-xluong/pen/ZEWNxdq

Colors:
	* Orange: fc8517 - de873d
	* Red: de3964 - 962857
	* Lavander: 782cda - 7e5ea2
	* Aqua: 33e7ea - a1f5f5
	* Green: 36c176 - 56ca8b

*/

a.slickButton
{
	font-size: 30px;
	border: none;
	border-radius: 4px;
	padding: 20px 40px 20px 40px;
	overflow: hidden;
	position: relative;
	outline: none;
	cursor: pointer;
	text-shadow: 0px 0px 10px #00000080;
	box-shadow: 0px 0px 0px 2px #fc851729 inset, 0px 0px 10px 0px #fc8517ff;
	background-image: linear-gradient( to bottom, #fc851790, #de873d50 );
	background-image: -webkit-gradient( linear, left top, left bottom, from( #fc851790 ), to( #de873d50 ) );
	transition: background-position .7s, box-shadow .4s;
	-webkit-transition: background-position .7s, box-shadow .4s;
}

.slickButton:after
{
	font-size: 100px;
	opacity: .3;
	right: -120px;
	top: -20px;
	transition: right .4s, transform .2s;
	transition: right .4s, -webkit-transform .2s;
	transition: right .4s, transform .2s, -webkit-transform .2s;
	-webkit-transition: right .4s, -webkit-transform .2s;
}

.slickButton:hover
{
	box-shadow: 0px 0px 0px 2px #fc851729 inset, 0px 0px 30px 0px #fc8517ff;
	background-position: 0% 30%;
}

.slickButton:hover:after
{
	right: -40px;
	transition: right .4s, -webkit-transform 30s .2s linear;
	transition: right .4s, transform 30s .2s linear;
	transition: right .4s, transform 30s .2s linear, -webkit-transform 30s .2s linear;
	-webkit-transition: right .4s, -webkit-transform 30s .2s linear;
}