/* Animation CSS
---------------------------------------------------------------------------- */
.anim {
	opacity: 0;
	transform: translate(0, 10vh);
}

.anim.a-rdy{
	transition: all 1s;
}
.anim.visible {
	opacity: 1;
	transform: translate(0, 0);
}

/* Content w/ Media (Chevron Image) */
.anim.asset-chevron-image {
	opacity: 0;
	transform: unset;
	& .f-asset {
		transform: translate(10vw, 0);
	}

	& .f-text {
		transform: translate(-10vw, 0);
	}

	& .row-inner::before {
		opacity: 0;
		transition: opacity 400ms;
		transition-delay: .6s !important;
	}

	&.a-rdy {
		transition: transform 1s, opacity 1s;
		& .f-asset, & .f-text, & .row-inner::before {
			transition: transform 1s;
		}
	}

	&.visible {
		opacity: 1;
		& .f-asset, & .f-text {
			transform: translate(0, 0);
		}

		& .row-inner::before {
			opacity: 1;
		}
	}
}

/* Homepage Hero Slider */
.anim.hero-slider-container {
	opacity: 0;
	transform: translate(10vw, 0);

	& .f-carousel__viewport {
		opacity: 0;
		transform: translate(0, 10vw);
	}

	&.a-rdy {
		transition: transform 1s, opacity 1s;
		transition-delay: 1.5s;
		& .f-carousel__viewport {
			transition: transform 1s, opacity 1s;
			transition-delay: 2s;
		}
	}

	&.visible {
		opacity: 1;
		transform: translate(0, 0);
		& .f-carousel__viewport {
			transform: translate(0, 0);
			opacity: 1;
		}
	}
}

/* 50 / 50 Content */
.anim.content-50-50 {
	&.a-rdy .phone-button {
		opacity: 0;
		transform: translate(2vw, 0);
		transition: opacity 1s, transform 1s;
		transition-delay: 1s;
	}
	&.visible .phone-button {
		opacity: 1;
		transform: translate(0, 0);
	}
}

/* Industry Slider */
.anim.industry-slider {
	&.a-rdy .slick-arrow {
		opacity: 0;
		transform: translate(2vw, -50%);
		transition: opacity 1s, transform 1s;
		transition-delay: 1s;
	}
	
	&.visible .slick-arrow {
		opacity: 1;
		transform: translate(0, -50%);
	}
}

/* Disable Animations at 600px */
@media only screen and (max-width:600px) {
	.anim {
		opacity: unset;
		transform: unset;
	}
	.anim.a-rdy {
		transition: unset;
	}
	.anim.visible {
		opacity: unset;
		transform: unset;
	}
}