Our team with social

 <div class="ourTeam">
  <div class="container"> 
    <div class="row">
      <div class="col-lg-3 col-sm-6">
        <div class="single-team">
          <div class="img-wrapper"><img src="https://www.tolmatol.com/uploads-images/bootrap-snippets-our-team/6.jpg" alt=""></div>
          <div class="txt">
            <h5>Nour Smith</h5>
            <span>CEO &amp; Founder</span> </div>
          <div class="social-links">
            <ul>
              <li><a href="#"><i class="fa fa-facebook"></i></a></li>
              <li><a href="#"><i class="fa fa-twitter"></i></a></li>
              <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
              <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
            </ul>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-sm-6">
        <div class="single-team">
          <div class="img-wrapper"><img src="https://www.tolmatol.com/uploads-images/bootrap-snippets-our-team/3.jpg" alt=""></div>
          <div class="txt">
            <h5>Jay Williams</h5>
            <span>CEO &amp; Founder</span> </div>
          <div class="social-links">
           <ul>
              <li><a href="#"><i class="fa fa-facebook"></i></a></li>
              <li><a href="#"><i class="fa fa-twitter"></i></a></li>
              <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
              <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
            </ul>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-sm-6">
        <div class="single-team">
          <div class="img-wrapper"><img src="https://www.tolmatol.com/uploads-images/bootrap-snippets-our-team/4.jpg" alt=""></div>
          <div class="txt">
            <h5>Phonex</h5>
            <span>CEO &amp; Founder</span> </div>
          <div class="social-links">
            <ul>
              <li><a href="#"><i class="fa fa-facebook"></i></a></li>
              <li><a href="#"><i class="fa fa-twitter"></i></a></li>
              <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
              <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
            </ul>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-sm-6">
        <div class="single-team">
          <div class="img-wrapper"><img src="https://www.tolmatol.com/uploads-images/bootrap-snippets-our-team/5.jpg" alt=""></div>
          <div class="txt">
            <h5>Smith</h5>
            <span>CEO &amp; Founder</span> </div>
          <div class="social-links">
           <ul>
              <li><a href="#"><i class="fa fa-facebook"></i></a></li>
              <li><a href="#"><i class="fa fa-twitter"></i></a></li>
              <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
              <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <style>
    .ourTeam {
    padding: 111px 0px 165px;
}

.ourTeam .section-title h2 {
    text-transform: uppercase;
    color: #333333;
}

.ourTeam .section-title span {
    color: #797e82;
}

.ourTeam .single-team {
    position: relative;
}

.ourTeam .single-team::before {
    position: absolute;
    content: "";
    background-color: #333333;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    visibility: hidden;
    opacity: 0;
    z-index: 3;
    -webkit-transition: .5s;
    transition: .5s;
}

.ourTeam .single-team:hover::before {
    visibility: visible;
    opacity: .4;
}

.ourTeam .single-team .social-links {
    position: absolute;
    top: 50%;
    left: 0;
    height: auto;
    width: 100%;
    z-index: 5;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.ourTeam .single-team .social-links ul {
    padding: 0px;
    list-style: none;
    width: 100%;
    text-align: center;
}

.ourTeam .single-team .social-links ul li {
    display: inline-block;
    margin-right: 8px;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateX(-20px) rotate(-180deg);
    transform: translateX(-20px) rotate(-180deg);
    -webkit-transition: 1s;
    transition: 1s;
}

.ourTeam .single-team:hover .social-links ul li {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
}

.ourTeam .single-team .social-links ul li a {
    color: #fff;
    display: block;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    background-color: #6f0ac8;
    border: 1px solid #6f0ac8;
    line-height: 40px;
    font-size: 20px;
    -webkit-transition: .5s;
    transition: .5s;
}

.ourTeam .single-team .social-links ul li a:hover {
    background-color: #fff;
    color: #6f0ac8;
}

.ourTeam .single-team .img-wrapper {
    overflow: hidden;
}

.ourTeam .single-team img {
    width: 100%;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    -webkit-transition: .5s;
    transition: .5s;
}

.ourTeam .single-team:hover img {
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

.ourTeam .single-team .txt {
    position: absolute;
    bottom: 0;
    z-index: 10;
    padding: 21px 0px 16px;
    background-color: #fff;
    width: 80%;
    left: 50%;
    -webkit-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
    text-align: center;
    -webkit-box-shadow: 0px 24px 18px 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 24px 18px 0px rgba(0, 0, 0, 0.05);
    -webkit-transition: .5s;
    transition: .5s;
}

.ourTeam .single-team:hover .txt {
    width: 100%;
    background-color: #6f0ac8;
    color: #fff;
    -webkit-box-shadow: 0px;
    box-shadow: 0px;
}

.ourTeam .single-team .txt h5 {
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 700;
    color: #333333;
    margin: 0px;
    -webkit-transition: .5s;
    transition: .5s;
}

.ourTeam .single-team:hover .txt h5 {
    color: #fff;
}

.ourTeam .single-team .txt span {
    text-transform: uppercase;
    font-size: 14px;
}
 
    </style>