/* 
    Created on : 23.01.2015, 14:04:43
    Author     : DFD
	Styles for : Our Team Box
*/
.dfd-team-box {
	.rel();
	overflow: hidden;
	//max-width: 380px;
	margin: 0 auto;
	.dfd-team-front {
		.rel();
		.image-wrap {
			.rel();
			overflow: hidden;
			.rounded(3px);
			img {
				.block();
				margin: 0 auto;
			}
		}
		.hover-mask {
			.abs();
			top: 0;
			left: 0;
			.block();
			width: 100%;
			height: 100%;
			background: fade(@forth-site-dark-color, 30%);
			.opacity(0);
			visibility: hidden;
			.transition(~"opacity .3s ease, visibility .3s ease");
			> a {
				.abs();
				top: 0;
				left: 0;
				.block();
				width: 100%;
				height: 100%;
			}
		}
		.soc-icon-aligment {
			.abs();
			bottom: 50%;
			.block();
			width: 100%;
			padding: 0 20px;
			.opacity(0);
			visibility: hidden;
			.transition(~"bottom .3s ease, opacity .3s ease, visibility .3s ease");
			.widget.soc-icons {
				a {
					color: @main-site-dark-color;
				}
			}
		}
		.dfd-team-box-heading {
			.abs();
			top: 100%;
			left: 0;
			.block();
			width: 100%;
			text-align: inherit;
			padding: 10px 0;
			.transition(~"top .3s ease, -webkit-transform .3s ease, -moz-transform .3s ease, -o-transform .3s ease, transform .3s ease");
			.feature-title,
			.subtitle {
				padding: 0;
				.transition(~"padding .3s ease, color .3s ease");
			}
		}
	}
	.dfd-team-back {
		.rel();
		overflow: hidden;
		.block();
		min-height: 60px;
		text-align: inherit;
		.content {
			padding: 20px 0;
			.transform(translateY(110%));
			.transition-transform(.3s ease);
		}
	}
	&:hover {
		.dfd-team-front {
			.hover-mask {
				visibility: visible;
				.opacity(1);
			}
			.soc-icon-aligment {
				bottom: 20px;
				visibility: visible;
				.opacity(1);
				.widget.soc-icons {
				}
			}
			.dfd-team-box-heading {
				top: 50%;
				.transform(translateY(-50%));
				.feature-title,
				.subtitle {
					padding: 0 20px;
				}
				.feature-title {
					color: @main-site-dark-color;
				}
				.subtitle {
					color: fade(@main-site-dark-color, 50%);
				}
			}
		}
		.dfd-team-back {
			.content {
				.transform(translateY(0));
			}
		}
	}
}