"Team"
Bootstrap 3.0.3 Snippet by csstutorial

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!-- youtube: https://www.youtube.com/channel/UCqlv40k1N0L9nsSrzL1OWwg/videos site: http://www.templateindirr.com --> <link href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet"> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <div class="team"> <div class="container"> <div class="row"> <div class="col-lg-6 col-lg-offset-3 text-center"> <h2><span class="ion-minus"></span>Our Team<span class="ion-minus"></span></h2> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus </p><br> </div> </div> <div class="row text-center"> <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <img class="img-rounded" alt="team-photo" src="https://images.pexels.com/photos/295821/pexels-photo-295821.jpeg?h=350&auto=compress&cs=tinysrgb" width="100%"> <div class="team-member"> <h4>John Doe</h4> <p>Web developer</p> </div> <p class="social"> <a href="#"><span class="fa fa-facebook-square"></span></a> <a href="#"><span class="fa fa-twitter-square"></span></a> <a href="#"><span class="fa fa-linkedin-square"></span></a> <a href="#"><span class="fa fa-google-plus-square"></span></a> </p> </div> <!--col-lg-4 --> <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <img class="img-rounded" alt="team-photo" src="https://images.pexels.com/photos/428333/pexels-photo-428333.jpeg?h=350&auto=compress&cs=tinysrgb" width="100%"> <div class="team-member"> <h4>Jack Doe</h4> <p>Web designer</p> </div> <p class="social"> <a href="#"><span class="fa fa-facebook-square"></span></a> <a href="#"><span class="fa fa-twitter-square"></span></a> <a href="#"><span class="fa fa-linkedin-square"></span></a> <a href="#"><span class="fa fa-google-plus-square"></span></a> </p> </div> <!--col-lg-4 --> <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <img class="img-rounded" alt="team-photo" src="https://images.pexels.com/photos/295821/pexels-photo-295821.jpeg?h=350&auto=compress&cs=tinysrgb" width="100%"> <div class="team-member"> <h4>James</h4> <p>CEO</p> </div> <p class="social"> <a href="#"><span class="fa fa-facebook-square"></span></a> <a href="#"><span class="fa fa-twitter-square"></span></a> <a href="#"><span class="fa fa-linkedin-square"></span></a> <a href="#"><span class="fa fa-google-plus-square"></span></a> </p> </div> <!-- col-lg-4 --> </div> <!-- row text-center --> </div> </div>
@import url(https://fonts.googleapis.com/css?family=Raleway:400,900,700,600,500,300,200,100,800); h2 { color: #4C4C4C; word-spacing: 5px; font-size: 30px; font-weight: 700; margin-bottom:30px; font-family: 'Raleway', sans-serif; } .ion-minus{ padding:0px 10px; } .team{ background-color:#f6f6f6; padding:60px 0px; font-family: 'Raleway', sans-serif; } .team h4 { margin-top: 20px; color: #5db4c0; } .team .fa{ color: #5db4c0; font-size: 18px; margin-top: 10px; padding: 3px; }

Related: See More


Questions / Comments: