// Home slider styles

// Slick reset
.slick-slide {
	border-radius: 0 !important;
	outline: none !important;
}

// SLIDER
#home-slider-next {
	border: 2px solid $red;
	border-radius: 6px;
	color: $red;
	cursor: pointer;
	font-size: 20px;
	padding-top: 12px;
	position: absolute;
	text-align: center;
	top: calc(100vh - 140px); right: 30px;
	@include transition(0.15s);
	width: 48px; height: 48px;
	z-index: 1001;

	&:hover {
		background-color: $white;
		box-shadow: 0 0 0 0.2rem rgba($white, 0.5) !important;
		color: $red;
	}
}
#home-slider {
	overflow: hidden;
	height: 100vh;

	.slick-list, .slick-track {
		height: 100%;
	}
	.home-slider-slide {
		color: $white;
		display: flex;
	    justify-content: center;
	    align-items: center;
		float: left;
		height: 100%;
		overflow: hidden;
		position: relative;

		.slider-bg-image {
			position: absolute;
			bottom: 0; left: 50%;
			transform: translate(-50%, 3%);
			flex-shrink: 0;
		    min-width: 100%;
		    min-height: 100%;
			z-index: -1;
		}
		.container-fluid, .container-fluid > .row {
			height: 100%;
		}
		.container-fluid > .row {
		}
		.slide-img-wrapper {
			display: flex;
			align-items: center;
			justify-content: center;

			.slide-img {
				position: relative;

				img {
					position: relative;
					width: 100%;
					z-index: 2;

					&.home-slider-photo {
						border-radius: 12px;
						box-shadow: 0 8px 20px rgba(0,0,0,0.15);
					}
				}
				.slide-img-accent {
					position: absolute;
				}
				.slide-img-circ {
					background-color: rgba($white, 0.7);
					border-radius: 50%;
					filter: blur(20vw);
					margin-top: -45vw; margin-left: -45vw;
					position: absolute;
					top: 50%; left: 50%;
					width: 90vw; height: 90vw;
					z-index: 0;
				}
			}
			#imparables-vida-logo {
				margin: 8px auto 24px;
				width: 25vw;
				max-width: 160px;
			}
		}
		.slide-text {
			display: flex;
			flex-direction: column;
			align-items: start;
			justify-content: center;
			margin-top: 32px;
			z-index: 1;

			img {
				margin-left: auto;
				margin-right: auto;
				max-width: 100%;
			}
			h1 {
				font-size: 24px;
			}
			h3 {
				font-size: 18px;

				span {
					color: $gold;
				}
			}
			p {
				font-size: 16px;
				margin-bottom: 24px;
				text-shadow: 0 1px 8px rgba(0,0,0,0.15);
			}
			&.slide-text-condensed {
				align-items: center;

				h1, h3 {
					font-family: $font-family-condensed;
					text-transform: uppercase;
					text-transform: uppercase;
				}
				h3 {
					font-weight: 400;
					font-size: 24px;
				}
			}
		}
		a.slider-slide-link {
			position: absolute;
			top: 0; left: 0;
			width: 100%; height: 100%;
		}
		.slide-float {
			animation: fg-drift ease-out 14s 1 both;
			-webkit-mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
			mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
			position: absolute;
		}
		&.animate-slide {

			.slider-bg-image {
				animation: bg-drift ease-out 14s 1 both;
			}
		}
		&.dark-slide:before {
			content: '';
			display: block;
			background-color: rgba(#000, 0.25);
			position: absolute;
			top: 0; left: 0;
			width: 100%; height: 100%;
		}
		&.dark-slide-text {
			color: $gray-900;

			h2, p {
				color: $gray-900;
			}
		}
		&#mlm-guru-slide {

			.slide-text {
				display: block;

				h1 {
					color: $white;
					font-family: $font-family-sans-serif;
					font-size: 24px !important;
					font-style: italic;
					text-transform: none;
				}
				h3 {
					color: $white;
					font-family: $font-family-sans-serif;
					font-size: 24px !important;
					font-style: italic;
					font-weight: $bold;
					margin-top: 24px;
					text-transform: none;

					span {
						color: $gold;
						font-size: 1.25em;
					}
				}
			}
			.slide-img-wrapper {
				margin-bottom: 0;
				margin-top: 64px;
			}
		}
	}
}




// Animations
@keyframes bg-drift {
    from {
    	transform: translate(-45%, 1%) scale(1.2);
    }
    to {
    	transform: translate(-50%, 0%) scale(1);
    }
}
@keyframes fg-drift {
    from {
    	transform: translate(0,0) scale(1);
    }
    to {
    	transform: translate(-1vw, -1vh) scale(1.05);
    }
}