/*
Theme Name:  Salient
Description: Styles for the "Button" shortcode element.
*/
.n-sc-button[class*="gradient"] {
	background-color: transparent !important;
	opacity: 1;
	box-shadow: none;
}

.n-sc-button[class*="gradient"]:after, .n-sc-button[class*="gradient"][class*="see-through"]:after {
	position: absolute;
	content: " ";
	top: -2%;
	left: -1%;
	width: 101.5%;
	height: 104%;
	transform-origin: right;
	-webkit-transform-origin: right;
	-ms-transform-origin: right;
	transform: scale(0, 1);
	-webkit-transform: scale(0, 1);
	-ms-transform: scale(0, 1);
	-ms-transition: transform .38s cubic-bezier(.2, .95, .4, .95), background-size .38s ease;
	transition: transform .38s cubic-bezier(.2, .95, .4, .95), background-size .38s ease;
	-webkit-transition: transform .38s cubic-bezier(.2, .95, .4, .95), background-size .38s ease;
	z-index: -1;
}

.n-sc-button[class*="see-through"][class*="gradient"]:after, .n-sc-button[class*="gradient"]:hover:after {
	background-size: 225% 100% !important;
	background-position: right !important;
}

.n-sc-button[class*="see-through"][class*="gradient"]:hover:after, .n-sc-button[class*="gradient"]:after {
	background-position: left !important;
	background-size: 100% 100% !important;
}

.n-sc-button[class*="see-through"][class*="gradient"]:hover:after {
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	transform-origin: left;
	-webkit-transform-origin: left;
	-ms-transform-origin: left;
}

.n-sc-button[class*="gradient"]:after {
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	transform-origin: left;
	-webkit-transform-origin: left;
	-ms-transform-origin: left;
}

.n-sc-button[class*="gradient"]:hover:after {
	transform: scale(0, 1);
	-webkit-transform: scale(0, 1);
	-ms-transform: scale(0, 1);
	transform-origin: right;
	-webkit-transform-origin: right;
	-ms-transform-origin: right;
}

.n-sc-button[class*="gradient"] .start, .n-sc-button[class*="gradient"] .hover, .n-sc-button[class*="see-through"][class*="gradient"] .start, .n-sc-button[class*="see-through"][class*="gradient"] .hover {
	-ms-transition: transform .38s cubic-bezier(.2, .95, .4, .95), opacity .38s cubic-bezier(.2, .95, .4, .95);
	transition: transform .38s cubic-bezier(.2, .95, .4, .95), opacity .38s cubic-bezier(.2, .95, .4, .95);
	-webkit-transition: transform .38s cubic-bezier(.2, .95, .4, .95), opacity .38s cubic-bezier(.2, .95, .4, .95);
}

.n-sc-button[class*="gradient"] .start {
	animation: gradientTextHoverHover .38s;
	animation-timing-function: cubic-bezier(.2, .9, .4, .9);
	animation-fill-mode: forwards;
	display: inline-block;
}

.n-sc-button[class*="gradient"] .hover {
	position: absolute;
	display: inline;
	left: 0;
	animation: gradientTextHoverOff .38s;
	animation-timing-function: cubic-bezier(.2, .9, .4, .9);
	animation-fill-mode: forwards;
	text-align: center;
	width: 100%;
	opacity: 0;
	z-index: 0;
}

.n-sc-button[class*="gradient"]:hover .hover {
	animation: gradientTextHoverHover .38s;
	animation-timing-function: cubic-bezier(.2, .9, .4, .9);
	animation-fill-mode: forwards;
}

.n-sc-button[class*="gradient"]:hover .start {
	animation: gradientTextHoverOff .38s;
	animation-timing-function: cubic-bezier(.2, .9, .4, .9);
	animation-fill-mode: forwards;
}

.n-sc-button[class*="see-through"][class*="gradient"] .hover {
	position: absolute;
	display: inline;
	left: 0;
	text-align: center;
	width: 100%;
	opacity: 0;
	z-index: 100;
}

.n-sc-button[class*="gradient"] .start.loading {
	animation: gradientTextHoverHover 0s;
}

.light .n-sc-button[class*="gradient"]:hover .hover, .light .n-sc-button[class*="see-through"][class*="gradient"]:hover .start, .light .n-sc-button[class*="see-through"][class*="gradient"] .start {
	background: none !important;
	-webkit-background-clip: border-box;
	-webkit-text-fill-color: #fff;
	background-clip: border-box;
}

.light .n-sc-button[class*="gradient"].no-text-grad .start {
	color: #fff !important;
}

.light .n-sc-button[class*="see-through"][class*="gradient"]:hover .start, .light .n-sc-button[class*="see-through"][class*="gradient"] .start, .light .n-sc-button[class*="gradient"] .start {
	opacity: 1 !important;
	animation: none !important;
}

.light .n-sc-button[class*="see-through"][class*="gradient"] .hover, .light .n-sc-button[class*="gradient"] .hover {
	opacity: 0 !important;
	animation: none !important;
}

@keyframes gradientTextHoverHover {
	0% {
		transform: translateX(0px);
		opacity: 0;
	}
	
	70% {
		opacity: 1;
	}
	
	100% {
		transform: translateX(0px) !important;
		opacity: 1;
	}
}

@keyframes gradientTextHoverOff {
	0% {
		transform: translateX(0px);
		opacity: 1;
	}
	
	70% {
		opacity: 0;
	}
	
	100% {
		transform: translateX(0px) !important;
		opacity: 0;
	}
}

.n-sc-button[class*="gradient"].medium.has-icon {
	padding: 7px 30px;
}

.n-sc-button[class*="gradient"].large.has-icon {
	padding: 12px 35px;
}

.n-sc-button[class*="gradient"] i {
	opacity: 1;
	right: 24px;
	background: inherit;
	background-size: 500% 100%;
	background-position: right;
}

.n-sc-button[class*="gradient"].has-icon span {
	left: -18px;
}

.n-sc-button[class*="gradient"].has-icon:hover span, .n-sc-button[class*="gradient"].has-icon:hover i {
	-ms-transform: none;
	transform: none;
	-webkit-transform: none;
}

.n-sc-button[class*="gradient"].jumbo i {
	opacity: 1;
	font-size: 20px;
	line-height: 20px;
	width: 20px;
	text-align: center;
	margin-top: -10px;
}

.n-sc-button[class*="gradient"].extra_jumbo i {
	width: 40px;
}

.n-sc-button[class*="gradient"].has-icon.extra_jumbo span {
	left: -35px;
}

.n-sc-button[class*="gradient"].has-icon.jumbo span {
	left: -16px;
}

.n-sc-button[class*="gradient"].has-icon.large span {
	left: -14px;
}

.n-sc-button[class*="gradient"].has-icon.medium span {
	left: -13px;
}

.n-sc-button[class*="gradient"].has-icon.small span {
	left: -11px;
}

.n-sc-button[class*="gradient"].jumbo .hover i {
	right: 8px;
}

.n-sc-button[class*="gradient"].extra_jumbo .hover i {
	right: 19px;
}

.n-sc-button[class*="gradient"].large .hover i {
	right: 5px;
}

.n-sc-button[class*="gradient"].medium .hover i {
	right: 3px;
}

.n-sc-button[class*="gradient"].small .hover i {
	right: 7px;
}

.n-sc-button[class*="gradient"].jumbo .start i {
	right: -32px;
}

.n-sc-button[class*="gradient"].extra_jumbo .start i {
	right: -75px;
}

.n-sc-button[class*="gradient"].large .start i {
	right: -32px;
}

.n-sc-button[class*="gradient"].medium .start i {
	right: -30px;
}

.n-sc-button[class*="gradient"].small .start i {
	right: -30px;
}

.n-sc-button[class*="gradient"].small {
	padding: 5px 14px;
}

.n-sc-button[class*="gradient"].medium {
	border-width: 3px;
	padding: 7px 15px;
}

.n-sc-button[class*="gradient"].large {
	border-width: 3px;
	padding: 12px 22px;
}

.n-sc-button[class*="gradient"].jumbo {
	border-width: 4px;
	padding: 21px 40px;
}

.n-sc-button[class*="gradient"].extra_jumbo {
	border-width: 10px;
	padding: 56px 90px;
}

.n-sc-button[class*="gradient"] span {
	z-index: 100;
}