

/* ====================== [  Start Button Style ] ====================== */

.btn-curve{
	background: transparent;
	padding: 12px 35px;
	border: 1px solid #1e1e1e;
	font-family: 'Teko', sans-serif;
	position: relative;
	overflow: hidden;
	cursor: pointer;

	&:focus{
		outline: none;
	}

	&:hover{
		outline: none;

		&:after{
			bottom: -30px;
			transform: rotate(0deg);
		}

		span{
			color: #fff;
		}
	}

	&:after{
		content: '';
		position: absolute;
		top: -30px;
		left: -30px;
		right: -30px;
		bottom: 130%;
		background: #1e1e1e;
		transform: rotate(-5deg);
		transition: all .8s;
	}

	span{
		font-size: 18px;
		text-transform: uppercase;
		letter-spacing: 2px;
		position: relative;
		z-index: 2;
		transition: all .8s;
	}

	&.btn-lit{
		border-color: #fff;
		color: #fff;

		&:hover{

			span{
				color: $main-color;
			}
		}

		&:after{
			background: #fff;
		}
	}

	&.btn-blc{
		background: #1e1e1e;

		&:after{
			background: #fff;
		}

		span{
			color: #fff;
		}

		&:hover{
	
			span{
				color: #1e1e1e;
			}
		}
	}

	&.btn-color{
		background: $main-color;
		border-color: $main-color;

		&:after{
			background: #fff;
		}

		span{
			color: #fff;
		}

		&:hover{
	
			span{
				color: $main-color;
			}
		}
	}

	&.btn-lg{
		padding: 14px 40px;

		span{
			font-size: 14px;
		}
	}

	&.btn-wit{
		background: #fff;
		border-color: #fff;

		&:after{
			background: #090909;
		}

		span{
			color: #1e1e1e;
		}

		&:hover{
	
			span{
				color: #fff;
			}
		}
	}

	&.btn-radius{
		border-radius: 30px;
	}
}

/* ====================== [ End Button Style ] ====================== */