.team-select { position: relative; margin-bottom: 60px;
	.team-member { position: absolute; top: 0; left: 0; visibility: hidden; opacity: 0; transition: opacity .4s 0s, visibility 0s .4s; }
	.team-member-active { display: block; position: relative; visibility: visible; opacity: 1; transition: opacity .4s .4s, visibility 0s 0s;  }
	.team-members { overflow: hidden; display: flex; flex-wrap: wrap; align-items: baseline;
		.team-header { cursor: pointer; text-align: left; padding: 0 30px; }
		@include breakpoint(small only) { 
			.team-header { width: 100% !important; padding: 0; }
		}
		@include breakpoint(medium only) { 
			.team-header { width: 50% !important; }
		}
	}
}
.team-img-right { 
	.team-image { padding-left: 60px; }
	.team-header { margin-top: 0 !important; }
	.team-info, .team-image { width: 50%; }
	.team-info { float: left; }
	.team-image { float: right; }
}
.team-img-left { 
	.team-image { padding-right: 60px; }
	.team-header { margin-top: 0 !important; }
	.team-info, .team-image { width: 50%; }
	.team-info { float: left; }
	.team-image { float: left; }
}
.team-img-top { 
	.img-wrapper { text-align: center; }
}
.team-member { overflow: hidden; width: 100%; padding-bottom: 1px; 
	// .team-info { padding: 0 30px; }
	.member-desc { margin-bottom: 30px; 
		p a { position: relative; 
			&:after { content: ""; width: 100%; height: 1px; position: absolute; bottom: 0; left: 0; opacity: .5; transition: opacity .4s cubic-bezier(0.16, 0.51, 0.78, 0.64); border-bottom-style: solid; border-bottom-width: 1px; border-color: inherit; background: transparent !important; }
			&:hover:after { opacity: 1; }
		}
	}
	.team-image { position: relative; z-index: 2; margin-bottom: 30px;
		.team-member-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .4s; z-index: 1; }
		a { position: relative; display: inline-block;
			&:hover {
				.team-member-overlay { opacity: 1; }
			}
		}
	}
	.member-socials { margin: 0;
		li { list-style-type: none; display: inline-block; margin-right: 20px;
			// .icon-theme { position: relative; margin: 0 10px; font-size: 8px; color: $accent-color; top: -4px }
			a { display: inline-block; padding-bottom: 3px; font-size: 20px; }
		}
	}
	@include breakpoint(small only) {
		.team-info { padding: 0; }
	}
}

.team-name { display: inline-block; text-align: left; position: relative; padding-bottom: 15px; z-index: 2; }
.team-member .team-name:after { content: ""; position: absolute; bottom: 0; width: 100%; left: 0; height: 2px; z-index: 2; transition: transform .4s, background .4s; }
.team-members .team-name:after {/*  background: transparent; */ content: ""; position: absolute; bottom: 0px; width: 100%; left: 0; height: 2px; z-index: 2; transition: transform .4s, opacity .4s; opacity: 0; }
.team-header { position: relative; margin-bottom: 30px; margin-top: 30px; 
	&:before { content: ""; position: absolute; bottom: 0px; width: 100%; height: 2px; z-index: 1; transition: transform .4s, background .4s; left: 0; }
	&.active .team-name:after { opacity: 1; }
}
.member-name { margin-bottom: 0; }
.member-status { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; }
@include breakpoint(medium down) {
	.team-img-right { 
		.team-image { padding-right: 0; text-align: center; }
		.team-member .team-header { margin-top: 30px; }
		.team-info, .team-image { width: 100%; float: none; }
	}
	.team-img-left { 
		.team-image { padding-left: 0; text-align: center; }
		.team-member .team-header { margin-top: 30px; }
		.team-info, .team-image { width: 100%; float: none; }
	}
	.team-select { 
		.team-members .team-header { width: 50%; }
	}
	.team-grid {
		.team-member { width: 100%; float: none; }
		.team-image { text-align: center; }
	}
}