/*============================*/
/*	TEAM
/*============================*/

.team-member
	text-align: center
	position: relative
	z-index: 1

	&:after
		content: ""
		position: absolute
		top:  -7px
		left: -7px
		right: -7px
		bottom:  -7px
		border: 4px solid $main-color
		z-index: -1
		opacity: 0
		+transform(scale(1.03))
		@extend .transition

	.team-member-img
		width: 100%
		height: 340px
		background: #000
		overflow: hidden

		img
			min-height:  100%
			min-width: 100%
			max-width: none
			opacity: 1
			@extend .transition

	.caption
		padding: 30px 0 20px
		position: relative
		top: 0
		color: #707070
		@extend .transition


		.heading
			margin: 0
			@extend .transition

		p
			margin: 0


	.social

		margin:  0 0 30px
		padding: 0
		font-size: 0
		text-align: center
		position: absolute 
		bottom: 0
		left: 0
		right: 0
		opacity: 0
		+transform(scale(0))
		@extend .transition

		li
			display: inline-block
			border-left: 1px solid #707070
			width: 40px
			height: 20px

			&:first-child
				border: none

			a
				display: block
				font-size: 16px
				line-height: 20px
				color: #333
				text-decoration: none

				&:hover
					color: $main-color


	&:hover
		&:after
			opacity: 1
			+transform(scale(1))
		.team-member-img
			img
				opacity: 0.4
		.caption
			top: -220px
			color: $main-color
			.heading
				color: #fff
		.social
			opacity: 1
			+transform(scale(1))

/* style-2 */
.team-member.style-2
	&:after
		display: none

	.team-member-img
		width: 260px
		height: 260px
		border-radius: 50%
		border: 7px solid #fff
		margin: 0 auto

	.caption
		padding: 20px 0 0
		position: static
		color: #fff

		.heading
			margin: 0 0 5px
			color: #fff
		p
			margin: 0

	.social
		display: none