/* Team Members */
.thb-team-row {
	.row.style1 {
		.columns {
			width: 100%;
		}
		@extend .thb-padding-sizes;
	}

	.thb-team-member {
		display: block;
		margin-bottom: 30px;

		@include min-break($break-medium) {
			margin-bottom: 40px;
		}

		img {
			width: 100%;
			display: block;
			@extend .quick-transition;
		}
		.team-container {
			position: relative;
		}
		h6 {
			color: $black;
			font-size: 20px;
			text-transform: none;
			font-weight: 400;
			margin-bottom: 0;
			letter-spacing: normal;
		}
		.job-title {
			font-size: 14px;
			margin-bottom: 10px;
			opacity: 0.6;
		}
		.thb-description {
			font-size: 14px;
			color: #343434;
		}
		.thb-icons {
			a {
				font-size: 14px;
				display: inline-flex;
				margin-right: 4px;
				color: $black;
			}
		}
		.team-information {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			opacity: 0;
			padding: 30px;
			background: transparent;
			display: flex;
			flex-direction: column;
			justify-content: flex-end;
			color: #343434;
			will-change: opacity;
			z-index: 10;
			@extend .quick-transition;
		}
		.team-link {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			z-index: 20;
		}
		&:hover {
			.team-information {
				opacity: 1;
			}
		}
		&.member_style1 {
			.team-container {
				overflow: hidden;
				margin-bottom: 15px;
			}
			h6 {
				color: $black;
			}
			.job-title {
				margin: 0;
				color: $black;
				opacity: 0.4;
				font-size: 12px;
			}
			.team-information {
				justify-content: space-between;
				bottom: -1px;
				@extend .quick-transition;
			}
			.thb-icons {
				a {
					align-items: center;
					justify-content: center;
					width: 30px;
					height: 30px;
					color: #fff;
					border-radius: 15px;
					font-size: 12px;
					margin-right: 2px;
					&.twitter {
						background: map-get($social, twitter);

						&:hover {
							background: darken(map-get($social, twitter), 10%);
						}
					}
					&.facebook {
						background: map-get($social, facebook);

						&:hover {
							background: darken(map-get($social, facebook), 10%);
						}
					}
					&.linkedin {
						background: map-get($social, linkedin);

						&:hover {
							background: darken(map-get($social, linkedin), 10%);
						}
					}
					&.instagram {
						background: map-get($social, instagram);

						&:hover {
							background: darken(map-get($social, instagram), 10%);
						}
					}
				}
			}
			&.team-has-link {
				.thb-icons {
					position: relative;
					z-index: 30;
				}
			}
		} /* End .member_style1 */
		&.member_style3 {
			&.team-has-link {
				.thb-icons {
					position: relative;
					z-index: 30;
				}
			}
			.team-container {
				border-radius: 3px;
				@extend .quick-transition;
			}
			.team-information {
				border-radius: 3px;
				justify-content: space-between;
			}
			.thb-description {
				margin-bottom: 15px;
			}
			img {
				border-radius: 3px;
			}
			&:hover {
				.team-container {
					@include box-shadow(0 10px 40px rgba(#1fa1fc, 0.45));
				}
			}
			.info-container {
				flex: 1;
				display: flex;
				flex-direction: column;
				padding-top: 10px;
				justify-content: space-between;
			}
		} /* End .member_style3 */

		&.member_style1,
		&.member_style3 {
			.thb-description {
				@include backface-visibility(hidden);
				@include transition(opacity 2s ease);
			}
			&:hover .thb-description {
				@include transform(rotateY(0deg) skewY(0deg));
			}
		}
		&.member_style4 {
      text-align: center;

      .team-container {
        width: 214px;
        height: 214px;
        margin: 0 auto 30px;
        img {
          width: 100%;
          height: 100%;
          border-radius: 50%;
          object-fit: cover;
        }
      }
      h6 {
        font-weight: 600;
        font-size: 14px;
        letter-spacing: normal !important;
      }
      .job-title {
        margin-bottom: 5px;
      }
			.team-information {
				justify-content: center;
				text-align: center;
				border-radius: 50%;
			}
      .thb-icons {
      	a {
      		display: inline-flex;
      		font-size: 12px;
      		margin: 0 2px;
      		&.twitter {
      			color: map-get($social, twitter);

      			&:hover {
      				color: darken(map-get($social, twitter), 10%);
      			}
      		}
      		&.facebook {
      			color: map-get($social, facebook);

      			&:hover {
      				color: darken(map-get($social, facebook), 10%);
      			}
      		}
      		&.linkedin {
      			color: map-get($social, linkedin);

      			&:hover {
      				color: darken(map-get($social, linkedin), 10%);
      			}
      		}
      		&.instagram {
      			color: map-get($social, instagram);

      			&:hover {
      				color: darken(map-get($social, instagram), 10%);
      			}
      		}
      	}
      }
    } // .member_style4
    &.member_style5 {
			&.team-has-link {
				.thb-icons {
					position: relative;
					z-index: 30;
				}
			}
    	.team-container {
        overflow: hidden;
      }
      .team-information-hover {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 10;
        @include translateY(calc(100% - 50px));
        @extend .mid-transition;
        @include min-break($break-small) {
          padding: 35px;
          padding-top: 0;
          @include translateY(calc(100% - 70px));
        }
      }

      .team-information {
        opacity: 1;
        padding: 15px;
        padding-top: 0;
        top: auto;
        bottom: 0;
        z-index: 20;
        @extend .mid-transition;
        @include translateY(calc(100% - 50px));
        @include min-break($break-small) {
          padding: 35px;
          padding-top: 0;
          @include translateY(calc(100% - 70px));
        }

        .team-title {
          display: flex;
          height: 50px;
          align-items: center;

          @include min-break($break-small) {
          	height: 70px;
          }
          p {
            display: inline-flex;
            font-size: 18px;
            margin: 0;
            line-height: 1;
            color: $black;
            opacity: 1;
            & + p {
              &:before {
                display: inline-flex;
                content: '-';
                margin-left: 3px;
                margin-right: 3px;
              }
            }
            &.member-title {
              font-weight: 600;
            }
          }
        }
        .thb-icons {
          margin-top: 20px;

          a {
            font-size: 16px;
          }
        }
      }
      &:hover {
        .team-information,
        .team-information-hover {
        	@include translateY(0);
        }
      }
    }
  } /* End .thb-team-member */

	&.team-light {
		.member_style3,
		.member_style5 {
			.team-information {
				color: #fff;

				h6,
				.thb-description,
				.thb-icons a {
					color: #fff;
				}

			}
		}
		.member_style5 {
			.team-information .team-title p {
        color: #fff;
      }
    }
		.member_style1 {
			.thb-description {
				color: #fff;
			}
		}
	}
} /* End .thb-team-row */