.gsc-team{
  .social-icons{
    a{
      @include size(35px, 35px);
      line-height: 35px;
      text-align: center;
      @include border-radius(50%);
      margin-right: 10px;
      display: inline-block;
      color: $white;
      @include transition(all 0.35s);
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
      &:hover{
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.4);
      }
    }
  }
  .team-name{
    font-size: 20px;
    text-transform: capitalize;
    padding: 0 0 15px ;
    position: relative;
    margin: 0;
    font-family: $headings-font-family;
    @include media-breakpoint-down(md){
      font-size: 18px;
    }
  }
  .team-position{
    text-transform: capitalize;
    color: $theme-color;
    font-size: 13px;
  }  
  .team-info{
    margin: 15px 0;
  }  

  &.team-horizontal{
    margin-top: 50px;
    .team-header{
      position: relative;
      overflow: hidden;
      img{
        @include transition(all 3s);
        display: inline-block;
      }
      .box-hover{
        @include opacity(0);
        @include scale(0.8);
        position: absolute;
        top: 0;
        left: 0;
        @include transition(all 0.35s);
        @include size(100%, 100%);
        background: rgba(0, 0, 0, 0.6);
        .content-inner{
          position: absolute;
          top: 50%;
          margin-top: -15px;
          left: 0;
          width: 100%;
          height: auto;
          padding: 0 20px;
        }
      }
      .social-list{
        a{
          background: none;
          color: $white!important;
          @include transition(all 0.35s);
          margin-right: 20px;
          display: inline-block;
          font-size: 16px;
          &:last-child{
            margin-right: 0;
          }
          &:hover{
            color: $theme-color!important;
          }
        }
      }
    }
    .team-name{
       font-size: 18px;
       margin: 0 0 12px 0;
       text-transform: uppercase;
       padding: 0 0 12px;
       position: relative;
       &:after{
          bottom: 0;
          left: 0;
          content: "";
          background: $theme-color;
          @include size(45px, 1px);
          position: absolute;
       } 
    }
    &:hover{
      .box-hover{
        @include opacity(1);
        @include scale(1);
      }
      .team-header{
        img{
          @include scale(1.2);
        }
      }
    } 
  }
  &.team-vertical{  //vertical
     position: relative;
     background: none;
     @include transition(all 0.35s);
     @include border-radius(6px);  
     max-width: 450px;
     margin: 0 auto 30px;
     .team-header{
       overflow: hidden;
       position: relative;
       img{
         @include transition(all 3s);
         display: inline-block;  
       }
       .social-list{
         position: absolute;
         bottom: 45px;
         left: 0;
         width: 100%;
         z-index: 9;
         text-align: center;
          a{
            background: none;
            color: $white!important;
            @include transition(all 0.35s);
            margin-right: 20px;
            display: inline-block;
            font-size: 16px;
            &:last-child{
              margin-right: 0;
            }
            &:hover{
              color: $theme-color!important;
            }
          }
        }
     }
     .team-name{
       padding: 0;
       color: $white;
       font-family: $headings-font-family;
     }
     .team-position{
       color: rgba(255, 255, 255, 0.8);
       margin: 5px 0 0;
     }
     .team-content{
       color: $white;
     }
     .box-hover{
       @include opacity(0);
       @include scale(0.8);
       position: absolute;
       top: 0;
       left: 0;
       @include transition(all 0.35s);
       @include size(100%, 100%);
       background: rgba(0, 0, 0, 0.6);
       .team-content{
         position: absolute;
         left: 0;
         width: 100%;
         height: auto;
         padding: 0 20px;
         top: 50%;
         @include translateY(-50%);
       }
     }
     .team-body{
       bottom: 0;
       left: 0;
       @include transition(all 0.35s);
       .content-hover{
         @include opacity(0);
       }
       .info{
         padding: 20px 15px;
         position: relative;
         margin-top: -35px;
         margin-left: 15px;
         margin-right: 15px;
         z-index: 9;
         background: $theme-color;
       }
     }
     &:hover{
       .box-hover{
         @include opacity(1);
         @include scale(1);
       }
     }  
   }
    &.team-circle{  //vertical
      margin-bottom: 30px;
      position: relative;
      background: none;
      @include transition(all 0.35s);
      @include border-radius(50%);  
      .team-header{
        overflow: hidden;
        position: relative;
        img{
          @include transition(all 3s);
          display: inline-block;  
          @include border-radius(50%);
        }
        .social-list{
          position: absolute;
          bottom: 45px;
          left: 0;
          width: 100%;
          z-index: 9;
          text-align: center;
          a{
            background: none;
            color: $white!important;
            @include transition(all 0.35s);
            margin-right: 20px;
            display: inline-block;
            font-size: 16px;
            &:last-child{
              margin-right: 0;
            }
            &:hover{
              color: $theme-color!important;
            }
          }
        }
      }
      .team-name{
        padding: 0;
        color: $headings-color;
        font-family: $headings-font-family;
      }
      .team-position{
        color: #999;
        margin: 5px 0 0;
      }
      .team-content{
        color: #999;
      }
      .box-hover{
        @include opacity(0);
        @include scale(0.8);
        position: absolute;
        top: 0;
        left: 0;
        @include transition(all 0.35s);
        @include size(100%, 100%);
        background: rgba(0, 0, 0, 0.6);
        @include border-radius(50%);
      .team-content{
        position: absolute;
        left: 0;
        width: 100%;
        height: auto;
        padding: 0 20px;
      }
    }
    .team-body{
      @include transition(all 0.35s);
      text-align: center;
      .content-hover{
        @include opacity(0);
      }
      .info{
        padding: 20px 15px;
        position: relative;
        margin-top: -35px;
        z-index: 9;
        background: $white;
      }
    }
    &:hover{
      .box-hover{
        @include opacity(1);
        @include scale(1);
      }
    } 
  }
}