.button {
	background: #fff;
	border: 2px solid var(--primary);
	color: var(--primary);
	border-radius: 50px;
	font-size: var(--button);
	font-weight: 600;
	padding: 0.5rem 2rem;
	cursor: pointer;
	align-self: center;
	position: relative;
	overflow: hidden;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: ease;
}

.button:hover {
	background: var(--secondary);
  	color: #fff;
	text-decoration: none;
}

.button:after {
	background: #fff;
	content: "";
	height: 155px;
	left: -75px;
	opacity: 0.2;
	position: absolute;
	top: -50px;
	transform: rotate(35deg);
	transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
	width: 50px;
}

.button:hover:after {
	left: 120%;
	transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.button-sm {
	padding: 0.8rem 3rem;
}

.button-inverse {
	color: white;
	background: black;
	border: 2px solid white;
}

.button-inverse:hover {
	-ms-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}