//
// Team //
//
.team-box {
	position: relative;
	.team-img {
		overflow: hidden;
		img {
			@include transform(scale(1.04));
			width: 100%;
			@include transition(transform 0.46s cubic-bezier(0.165, 0.84, 0.44, 1));
		}
	}
	.hover-content {
		position: absolute;
		top: 0;
		left: 0;
		visibility: hidden;
		opacity: 0;
		background: $color-dark-03;
		width: 100%;
		height: 100%;
		color: $color-white-07;
		@include transition(ease-out 0.16s);
		.top {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			padding: 36px;
			@include breakpoint-less(md) {
				padding: 30px;
			}
			ul {
				li {
					@include transform(translateY(8px));
					opacity: 0;
					@include transition(ease-out 0.16s);
					&:nth-child(1) { @include transition-delay(0.06s); }
					&:nth-child(2) { @include transition-delay(0.12s); }
					&:nth-child(3) { @include transition-delay(0.18s); }
					&:nth-child(4) { @include transition-delay(0.24s); }
					&:nth-child(5) { @include transition-delay(0.30s); }
					&:nth-child(6) { @include transition-delay(0.36s); }
					&:nth-child(7) { @include transition-delay(0.42s); }
				}
			}
		}
		.bottom {
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			padding: 36px;
			@include breakpoint-less(md) {
				padding: 30px;
			}
		}
		h1,h2,h3,h4,h5,h6 {
			color: $color-white;
		}
		a {
			&:not([class*=' button'], [class^='button']) {
				color: $color-white-07;
				&:hover, &:focus { color: $color-white; }
			}
		}
	}
	&:hover {
		.team-img {
			img {
				@include transform(scale(1));
			}
		}
		.hover-content {
			visibility: visible;
			opacity: 1;
			.top {
				ul {
					li {
						@include transform(translateY(0));
						opacity: 1;
					}
				}
			}
		}
	}
	//
	// Hover Styles //
	//
	&.hover-style-2 {
		.team-img {
			img { @include transform(scale(1)); }
		}
		.hover-content { background: $color-dark-01; }
		&:hover {
			.team-img {
				img {
					@include transform(scale(1.04));
					@include filter(blur(1.5px));
				}
			}
		}
	}
}