a.read-more.button {
	background-image: linear-gradient(to right, #008060 0%, #00a9d3 51%, #009ac9 100%);
}

a.read-more.button {
	font-size: 13px;
	padding: 8px 25px;
	text-align: center;
	transition: 0.5s;
	background-size: 200% auto;
	color: white;
	box-shadow: rgba(0,0,0,.14) 0 2px 6px 0;
	border-bottom: 2px solid rgba(0, 0, 0, .2);
	border-radius: 120px;
}

a.read-more.button:hover {
	background-position: right center;
	transform: translateY(0);
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.4);
	/* change the direction of the change here */
	color: #fff;
	text-decoration: none;
}