<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 ----------> <section id="team" class="text-center section"> <div class="container"> <h2><span class="highlight_secondary">Our</span> Team</h2> <h5> Our people are our greatest asset and biggest differentiator.<br>They also believe in having a lot of fun along the way. </h5> <div class="hr big_size_hr invisible_hr"> <i class="fa fa-"></i> </div> <div class="row"> <div class="col-md-4 col-sm-12"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><a href="#"><h5>Jose Knutson</h5></a></div> <div class="team-role">Co-founder</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> <div class="col-md-4 col-sm-12"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><a href="#"><h5>Mary Ramos</h5></a></div> <div class="team-role">Co-founder</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> <div class="col-md-4 col-sm-12"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><a href="#"><h5>Michael Alexander</h5></a></div> <div class="team-role">Co-founder</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> </div> <div class="hr invisible_hr"> <i class="fa fa-"></i> </div> <div class="row"> <div class="col-md-2 col-sm-4 col-xs-6"><!-- add col-md-offset-1 for 5 members --> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><h5>Herman Mach</h5></div> <div class="team-role">Software Developer</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> <div class="col-md-2 col-sm-4 col-xs-6"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><h5>Joyce Wagner</h5></div> <div class="team-role">Designer</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> <div class="col-md-2 col-sm-4 col-xs-6"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><h5>Donald Speth</h5></div> <div class="team-role">Account manager</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> <div class="col-md-2 col-sm-4 col-xs-6"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><h5>Frank McGuire</h5></div> <div class="team-role">Programmer</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> <div class="col-md-2 col-sm-4 col-xs-6"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><h5>Natasha Miley</h5></div> <div class="team-role">Journalist</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> <div class="col-md-2 col-sm-4 col-xs-6"> <div class="team"> <div class="team-image"> <a href="#"> <img src="http://dummyimage.com/450x450/d9dadc/1c1f24.png&text=+" class="img-circle img-responsive"> </a> <div class="team-links"> <div class="team-links-list"> <a href="#" target="_blank"><i class="fa fa-envelope"></i></a> <a href="#" target="_blank"><i class="fa fa-facebook"></i></a> <a href="#" target="_blank"><i class="fa fa-linked"></i></a> <a href="#" target="_blank"><i class="fa fa-twitter"></i></a> </div><!-- /.team-links-list --> </div><!-- /.team-links --> </div><!-- /.team-image --> <div class="team-content"> <div class="team-name"><h5>Lavona Smith</h5></div> <div class="team-role">Photographer</div> <div class="team-description"></div> </div><!-- /.team-content --> </div><!-- /.team --> </div> </div> <div class="hr big_size_hr invisible_hr"> <i class="fa fa-"></i> </div> </div><!-- /.container --> </section>

@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300; src: local("Open Sans Light"), local("OpenSans-Light"), url("https://fonts.gstatic.com/s/opensans/v10/DXI1ORHCpsQm3Vp6mXoaTegdm0LZdjqr5-oayXSOefg.woff2") format("woff2"), url("https://fonts.gstatic.com/s/opensans/v10/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff") format("woff"); } @font-face { font-family: "Open Sans"; font-style: normal; font-weight: 400; src: local("Open Sans"), local("OpenSans"), url("https://fonts.gstatic.com/s/opensans/v10/cJZKeOuBrn4kERxqtaUH3VtXRa8TVwTICgirnJhmVJw.woff2") format("woff2"), url("https://fonts.gstatic.com/s/opensans/v10/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff") format("woff"); } @font-face { font-family: "Open Sans"; font-style: normal; font-weight: 600; src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url("https://fonts.gstatic.com/s/opensans/v10/MTP_ySUJH_bn48VBG8sNSugdm0LZdjqr5-oayXSOefg.woff2") format("woff2"), url("https://fonts.gstatic.com/s/opensans/v10/MTP_ySUJH_bn48VBG8sNSnhCUOGz7vYGh680lGh-uXM.woff") format("woff"); } @font-face { font-family: "Open Sans"; font-style: normal; font-weight: 700; src: local("Open Sans Bold"), local("OpenSans-Bold"), url("https://fonts.gstatic.com/s/opensans/v10/k3k702ZOKiLJc3WVjuplzOgdm0LZdjqr5-oayXSOefg.woff2") format("woff2"), url("https://fonts.gstatic.com/s/opensans/v10/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff") format("woff"); } body { font-family: "Open Sans"; line-height: 26px; } h1, h2, h3, h4, h5, h6 { font-family: "Open Sans"; font-weight: 300; } h1 { font-size: 46px; } h2 { font-size: 44px; } h3 { font-size: 32px; } h4 { font-size: 24px; } h5 { font-size: 22px; line-height: 30px; } h6 { font-size: 20px; } .section { color: #5c6166; } .hr.invisible_hr { height: 0; padding: 0; } .hr.big_size_hr { margin: 30px 0; } .hr { clear: both; display: block; font-size: 0; height: 24px; margin: 20px 0; overflow: hidden; padding: 2px 0; position: relative; text-align: center; width: 100%; } .highlight_secondary { color: #F24046; } .team-role { color: #A4A7AA; }