"Our Team-box-section (Manish Yadav)"
Bootstrap 3.0.0 Snippet by Manish Yadav

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <div class="container"> <div class="row"> <div class="site-heading text-center"> <h3>Our Team</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt <br> ut labore et dolore magna aliqua. Ut enim ad minim </p> <div class="border"></div> </div> </div> <div class="row"> <div class="col-md-4 team-box"> <div class="team-img thumbnail"> <img src="https://images.pexels.com/photos/462680/pexels-photo-462680.jpeg?w=940&h=650&auto=compress&cs=tinysrgb"> <div class="team-content"> <h3>Philip Freeman</h3> <div class="border-team"></div> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus. Donec facilisis fermentum sem, ac viverra ante luctus vel. Donec vel mauris quam.</p> <div class="social-icons"> <a href="https://www.facebook.com/"><i id="social-fb" class="fa fa-facebook-square fa-3x social"></i></a> <a href="https://twitter.com/"><i id="social-tw" class="fa fa-twitter-square fa-3x social"></i></a> <a href="https://plus.google.com/"><i id="social-gp" class="fa fa-google-plus-square fa-3x social"></i></a> <a href="mailto:bootsnipp@gmail.com"><i id="social-em" class="fa fa-envelope-square fa-3x social"></i></a> </div> </div> </div> </div> <div class="col-md-4 team-box"> <div class="team-img thumbnail"> <img src="https://images.pexels.com/photos/567459/pexels-photo-567459.jpeg?w=940&h=650&auto=compress&cs=tinysrgb"> <div class="team-content"> <h3>David Smith</h3> <div class="border-team"></div> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus. Donec facilisis fermentum sem, ac viverra ante luctus vel. Donec vel mauris quam.</p> <div class="social-icons"> <a href="https://www.facebook.com/"><i id="social-fb" class="fa fa-facebook-square fa-3x social"></i></a> <a href="https://twitter.com/"><i id="social-tw" class="fa fa-twitter-square fa-3x social"></i></a> <a href="https://plus.google.com/"><i id="social-gp" class="fa fa-google-plus-square fa-3x social"></i></a> <a href="mailto:bootsnipp@gmail.com"><i id="social-em" class="fa fa-envelope-square fa-3x social"></i></a> </div> </div> </div> </div> <div class="col-md-4 team-box"> <div class="team-img thumbnail"> <img src="https://images.pexels.com/photos/325682/pexels-photo-325682.jpeg?w=940&h=650&auto=compress&cs=tinysrgb"> <div class="team-content"> <h3>Robert D'costa</h3> <div class="border-team"></div> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus. Donec facilisis fermentum sem, ac viverra ante luctus vel. Donec vel mauris quam.</p> <div class="social-icons"> <a href="https://www.facebook.com/"><i id="social-fb" class="fa fa-facebook-square fa-3x social"></i></a> <a href="https://twitter.com/"><i id="social-tw" class="fa fa-twitter-square fa-3x social"></i></a> <a href="https://plus.google.com/"><i id="social-gp" class="fa fa-google-plus-square fa-3x social"></i></a> <a href="mailto:bootsnipp@gmail.com"><i id="social-em" class="fa fa-envelope-square fa-3x social"></i></a> </div> </div> </div> </div> </div> </div>
.team-content { padding: 0px 15px 15px 15px; } .border-team { border-bottom:1px solid #e2e2e2; margin-bottom:10px; } .team-img:hover { background:#f5f5f5; } /* Social Icons */ .social-icons{ margin: 0; padding: 0; font-size : 10px; } .social { margin:7px 7px 7px 0px; color:#232323; } #social-fb:hover { color: #3B5998; transition:all .25s; } #social-tw:hover { color: #4099FF; transition:all .25s; } #social-gp:hover { color: #d34836; transition:all .25s; } #social-em:hover { color: #f39c12; transition:all .25s; } /* Site Heading */ .site-heading h3{ font-size : 40px; margin-bottom: 15px; font-weight: 600; } .border { background: #e1e1e1; height: 1px; width: 25%; margin-left: auto; margin-right: auto; margin-bottom: 45px; }

Related: See More


Questions / Comments: