.styled-button-holder {
	position: relative;
	width: 100%;
}

.styled-button-holder.align-left {
	text-align: left;
}
.styled-button-holder.align-right {
	text-align: right;
}
.styled-button-holder.align-center {
	text-align: center;
}

@media screen and (max-width: 768px) {
	.styled-button-holder.alignMob-left {
		text-align: left;
	}
	.styled-button-holder.alignMob-right {
		text-align: right;
	}
	.styled-button-holder.alignMob-center {
		text-align: center;
	}
}

a.styled-button {
	display: inline-block;
	position: relative;
	background-color: var(--ast-global-color-0);
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	font-size: var(--text-size-100);
	font-weight: 600;
	letter-spacing: 1px;
	padding: 12px 32px;
	cursor: pointer;
	border-radius: 0;
	transition: all 0.3s ease-in-out;
	box-shadow: 0px 0px 0px 0px var(--fl-global-secondary);
}

a.styled-button.color-gradient {
	color: #fff;
	background-image: linear-gradient(
		90deg,
		var(--accent-color) 0%,
		var(--base-color-alt) 100%
	);
	text-shadow: 0px 0px 5px rgba(11, 15, 0, 0.6);
	transition: all 1s ease-in-out;
}

/* a.styled-button.color-gradient:hover
{
	background-image: linear-gradient(90deg, var(--accent-color) 0%, var(--base-color-alt) 0%);
} */

a.styled-button span {
	position: relative;
}

a.styled-button span::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 0;
	left: 0;
	right: 0;
	border-bottom: 1px solid #fff;
	bottom: -2px;
	opacity: 0;
	transition: all 0.3s ease-in-out;
}

a.styled-button:hover span::after {
	opacity: 1;
}

a.styled-button.color-dark {
	background: var(--ast-global-color-1);
}
a.styled-button.width-wider {
	padding-left: 64px;
	padding-right: 64px;
}
a.styled-button.width-wider::after {
	right: 24px;
}

a.styled-button.color-light {
	background: #fff;
	color: var(--fl-global-primary, #111) !important;
}

a.styled-button.color-white {
	background: #fff;
	color: var(--fl-global-primary, #111) !important;
}

a.styled-button.color-primary {
	background: var(--fl-global-primary, #111);
	color: #fff !important;
}

a.styled-button.color-secondary {
	background: var(--fl-global-secondary, #111);
	color: #fff !important;
}

a.styled-button.color-primary:hover,
a.styled-button.color-white:hover,
a.styled-button.color-light:hover {
	box-shadow: 4px 4px 0px 0px var(--fl-global-secondary);
}

@media screen and (max-width: 768px) {
	a.styled-button {
		text-decoration: none;
	}
	a.styled-button span::after {
		display: none;
	}
}