Team 1
<section class="py-5">
<div class="container">
<div class="row">
<div class="col-md-7 mb-5">
<div class="icon icon-shape bg-gradient-primary shadow text-center mb-3">
<i class="ni ni-single-02 text-white opacity-10"></i>
</div>
<h3>Our Awesome Team</h3>
<p>This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</p>
</div>
</div>
<div class="row mt-5">
<div class="col-lg-4 col-md-6 mt-md-0 mt-5">
<div class="card card-profile card-plain">
<div class="text-start mt-n5 z-index-1">
<div class="position-relative w-25">
<div>
<img class="avatar avatar-xxl shadow-lg rounded-circle" src="../../assets/img/james.jpg">
</div>
</div>
</div>
<div class="card-body ps-0">
<h5 class="mb-0">Lucian Cramp</h5>
<p class="text-muted">CEO / Co-Founder</p>
<p>
And I love you like Kanye loves Kanye. We need to restart the human foundation.
</p>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-twitter" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-twitter"></i></span>
</button>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-dribbble" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-dribbble"></i></span>
</button>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-linkedin" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-linkedin"></i></span>
</button>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mt-md-0 mt-5">
<div class="card card-profile card-plain">
<div class="mt-n5 z-index-1">
<div class="position-relative w-25">
<div>
<img class="avatar avatar-xxl shadow-lg rounded-circle" src="../../assets/img/emily.jpg">
</div>
</div>
</div>
<div class="card-body ps-0">
<h5 class="mb-0">Alessia Lauren</h5>
<p class="text-muted">CEO / Co-Founder</p>
<p>
And I love you like Kanye loves Kanye. We need to restart the human foundation.
</p>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-twitter" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-twitter"></i></span>
</button>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-dribbble" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-dribbble"></i></span>
</button>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-linkedin" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-linkedin"></i></span>
</button>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mx-md-auto mt-md-0 mt-5">
<div class="card card-profile card-plain">
<div class="mt-n5 z-index-1">
<div class="position-relative w-25">
<div>
<img class="avatar avatar-xxl shadow-lg rounded-circle" src="../../assets/img/michael.jpg">
</div>
</div>
</div>
<div class="card-body ps-0">
<h5 class="mb-0">Jimmy Brown</h5>
<p class="text-muted">CEO / Co-Founder</p>
<p>
And I love you like Kanye loves Kanye. We need to restart the human foundation.
</p>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-twitter" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-twitter"></i></span>
</button>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-dribbble" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-dribbble"></i></span>
</button>
<button type="button" class="btn-icon-only btn-simple btn btn-lg btn-linkedin" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
<span class="btn-inner--icon"><i class="fab fa-linkedin"></i></span>
</button>
</div>
</div>
</div>
</div>
</div>
</section>Team 2
<section class="py-5">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto text-center mb-5">
<h3 class="text-info">The Executive Team</h3>
<p class="font-weight-normal">This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</p>
</div>
</div>
<div class="row mt-lg-5 mt-3">
<div class="col-md-6">
<div class="card card-profile card-plain">
<div class="row">
<div class="col-lg-5">
<a href="javascript:;">
<div class="position-relative">
<div>
<img class="w-100 rounded-3 shadow-lg" src="../../assets/img/kal-visuals.jpg">
</div>
</div>
</a>
</div>
<div class="col-lg-7 ps-0 my-auto">
<div class="card-body text-start">
<div class="p-md-0 pt-3">
<h5 class="font-weight-bold mb-0">Ryan Samuel</h5>
<p class="text-uppercase text-sm font-weight-bold mb-2">Financial Examiner</p>
</div>
<p class="mb-4">Today you are you! That is truer than true! There is no one alive who is you-er than you!</p>
<button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
<i class="fab fa-facebook"></i>
</button>
<button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
<i class="fab fa-twitter"></i>
</button>
<button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
<i class="fab fa-github"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card card-profile card-plain">
<div class="row">
<div class="col-lg-5">
<a href="javascript:;">
<div class="position-relative">
<div>
<img class="w-100 rounded-3 shadow-lg" src="../../assets/img/jordan.jpg" alt="profile image">
</div>
</div>
</a>
</div>
<div class="col-lg-7 ps-0 my-auto">
<div class="card-body text-start">
<div class="p-md-0 pt-3">
<h5 class="font-weight-bold mb-0">Sofia Michael</h5>
<p class="text-uppercase text-sm font-weight-bold mb-2">UI Designer</p>
</div>
<p class="mb-4">Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
<button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
<i class="fab fa-facebook"></i>
</button>
<button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
<i class="fab fa-twitter"></i>
</button>
<button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
<i class="fab fa-github"></i>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row mt-lg-5 mt-3">
<div class="col-md-6">
<div class="card card-profile card-plain">
<div class="row">
<div class="col-lg-5">
<a href="javascript:;">
<div class="position-relative">
<div>
<img class="w-100 rounded-3 shadow-lg" src="../../assets/img/ivana.jpg">
</div>
</div>
</a>
</div>
<div class="col-lg-7 ps-0 my-auto">
<div class="card-body text-start">
<div class="p-md-0 pt-3">
<h5 class="font-weight-bold mb-0">Noral Hazel</h5>
<p class="text-uppercase text-sm font-weight-bold mb-2">Legal Secretary</p>
</div>
<p class="mb-4">Do not dwell in the past, do not dream of the future, concentrate the mind...</p>
<button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
<i class="fab fa-facebook"></i>
</button>
<button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
<i class="fab fa-twitter"></i>
</button>
<button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
<i class="fab fa-github"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card card-profile card-plain">
<div class="row">
<div class="col-lg-5">
<a href="javascript:;">
<div class="position-relative">
<div>
<img class="w-100 rounded-3 shadow-lg" src="../../assets/img/brooke.jpg">
</div>
</div>
</a>
</div>
<div class="col-lg-7 ps-0 my-auto">
<div class="card-body text-start">
<div class="p-md-0 pt-3">
<h5 class="font-weight-bold mb-0">Otto Gonzalez</h5>
<p class="text-uppercase text-sm font-weight-bold mb-2">Landscape Architect</p>
</div>
<p class="mb-4">Success is not final, failure is not fatal: it is the courage to continue that counts...</p>
<button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
<i class="fab fa-facebook"></i>
</button>
<button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
<i class="fab fa-twitter"></i>
</button>
<button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
<i class="fab fa-github"></i>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- END Teams w/ 4 cards w/ image on left & descriptio/social link on right -->Team 3
<section class="py-7 position-relative bg-dark">
<div class="container position-relative mb-4">
<div class="row">
<div class="col-md-8 mx-auto text-center mb-5">
<div class="icon icon-shape bg-gradient-primary shadow text-center mb-3">
<i class="ni ni-single-copy-04 text-white opacity-10"></i>
</div>
<h3 class="text-white z-index-1 position-relative">The Executive Team</h3>
<p class="lead text-white opacity-6">There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill.</p>
</div>
</div>
<div class="row">
<div class="col-lg-6 col-12">
<div class="card card-profile overflow-hidden">
<div class="row">
<div class="col-lg-4 col-md-6 col-12 pe-lg-0">
<a href="javascript:;">
<div class="pe-md-0">
<img class="w-100 border-radius-lg border-radius-top-end-0 border-radius-bottom-end-0" src="../../assets/img/emily.jpg" alt="image">
</div>
</a>
</div>
<div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
<div class="card-body">
<h5 class="mb-0">Emma Roberts</h5>
<h6 class="text-info">UI Designer</h6>
<p class="mb-0">Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="card card-profile mt-lg-0 mt-5 overflow-hidden">
<div class="row">
<div class="col-lg-4 col-md-6 col-12 pe-lg-0">
<a href="javascript:;">
<div class="pe-md-0">
<img class="w-100 border-radius-lg border-radius-top-end-0 border-radius-bottom-end-0" src="../../assets/img/emilyz.jpg" alt="image">
</div>
</a>
</div>
<div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
<div class="card-body">
<h5 class="mb-0">Sofia Garcia</h5>
<h6 class="text-info">Marketing</h6>
<p>Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row mt-4">
<div class="col-lg-6 col-12">
<div class="card card-profile overflow-hidden z-index-2">
<div class="row">
<div class="col-lg-4 col-md-6 col-12 pe-lg-0">
<a href="javascript:;">
<div class="pe-md-0">
<img class="w-100 border-radius-lg border-radius-top-end-0 border-radius-bottom-end-0" src="../../assets/img/michael.jpg" alt="image">
</div>
</a>
</div>
<div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
<div class="card-body">
<h5 class="mb-0">Ivan Flow</h5>
<h6 class="text-info">Developer</h6>
<p>Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="card card-profile mt-lg-0 mt-5 overflow-hidden z-index-2">
<div class="row">
<div class="col-lg-4 col-md-6 col-12 pe-lg-0">
<a href="javascript:;">
<div class="pe-md-0">
<img class="w-100 border-radius-lg border-radius-top-end-0 border-radius-bottom-end-0" src="../../assets/img/james.jpg" alt="image">
</div>
</a>
</div>
<div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
<div class="card-body">
<h5 class="mb-0">William Pearce</h5>
<h6 class="text-info">JS Developer</h6>
<p>Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>Team 4
<!-- START Teams w/ 4 cards in a row w/ image & name & function -->
<section class="py-5">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto text-center">
<h6 class="text-warning">The Executive Team</h6>
<h2>Building the future</h2>
</div>
</div>
<div class="row mt-md-5 mt-4">
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<div class="card shadow-lg">
<div class="card-body px-0 pt-0 text-center border-radius-lg bg-white">
<a href="javascript:;">
<img class="w-100 border-radius-lg border-radius-bottom-end-0 border-radius-bottom-start-0" src="../../assets/img/kal-visuals.jpg" alt="card image">
</a>
<h5 class="mt-3 mb-1 d-md-block d-none">Mike Lendra</h5>
<p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Mike Lendra</p>
<p class="mb-0 text-xs font-weight-bold text-warning text-uppercase">Desktop Publisher</p>
</div>
</div>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<div class="card shadow-lg">
<div class="card-body px-0 pt-0 text-center bg-white border-radius-lg">
<a href="javascript:;">
<img class="w-100 border-radius-lg border-radius-bottom-end-0 border-radius-bottom-start-0" src="../../assets/img/brooke.jpg" alt="card image">
</a>
<h5 class="mt-3 mb-1 d-md-block d-none">Natalie Paisley</h5>
<p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Natalie Paisley</p>
<p class="mb-0 text-xs font-weight-bold text-warning text-uppercase">Credit Analyst</p>
</div>
</div>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<div class="card shadow-lg">
<div class="card-body px-0 pt-0 text-center bg-white border-radius-lg">
<a href="javascript:;">
<img class="w-100 border-radius-lg border-radius-bottom-end-0 border-radius-bottom-start-0" src="../../assets/img/ivana.jpg" alt="card image">
</a>
<h5 class="mt-3 mb-1 d-md-block d-none">James Audrey</h5>
<p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">James Audrey</p>
<p class="mb-0 text-xs font-weight-bold text-warning text-uppercase">Economist</p>
</div>
</div>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<div class="card shadow-lg">
<div class="card-body px-0 pt-0 text-center bg-white border-radius-lg">
<a href="javascript:;">
<img class="w-100 border-radius-lg border-radius-bottom-end-0 border-radius-bottom-start-0" src="../../assets/img/jordan-visuals.jpg" alt="card image">
</a>
<h5 class="mt-3 mb-1 d-md-block d-none">Mila Skylar</h5>
<p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Mila Skylar</p>
<p class="mb-0 text-xs font-weight-bold text-warning text-uppercase">Aviation Inspector</p>
</div>
</div>
</div>
</div>
<div class="row pt-7 pb-6">
<div class="col-lg-6">
<h2>Get your own app</h2>
<p>The Arctic Ocean freezes every winter and much of the sea-ice then thaws every summer, and that process will continue whatever.</p>
</div>
<div class="col-lg-6 text-end d-flex flex-column justify-content-center">
<button type="button" class="btn bg-gradient-warning mb-0 ms-lg-auto me-lg-0 me-auto mt-lg-0 mt-2">Join Team</button>
</div>
</div>
</div>
</section>
<!-- END Teams w/ 4 cards w/ image on left & descriptio/social link on right -->Team 5
<!-- START Teams w/ 4 cards in a row w/ avatar on bottom end-->
<section class="py-8">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto text-center">
<h4 class="text-primary">Join our awesome team</h4>
</div>
</div>
<div class="row mt-lg-5 mt-4">
<div class="col-lg-4 col-sm-6 mb-4">
<div class="card shadow-lg card-body p-0">
<div class="row">
<div class="col-lg-7">
<div class="py-3 ps-3">
<h5 class="mb-2 mt-1">Michael Frisen</h5>
<span class="badge badge-sm rounded-pill mb-3 text-dark">PHP Developer</span>
<br/>
<button type="button" class="btn btn-twitter btn-simple px-2 mb-0">
<i class="fab fa-twitter text-lg"></i>
</button>
<button type="button" class="btn btn-dribbble btn-simple px-2 mb-0">
<i class="fab fa-dribbble text-lg"></i>
</button>
<button type="button" class="btn btn-slack btn-simple px-2 mb-0">
<i class="fab fa-slack text-lg"></i>
</button>
</div>
</div>
<div class="col-lg-5 text-end my-auto">
<img class="img-fluid border-radius-lg border-radius-bottom-start-0 border-radius-top-start-0" src="../../assets/img/michael.jpg">
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 mb-4">
<div class="card shadow-lg card-body p-0">
<div class="row">
<div class="col-lg-7">
<div class="py-3 ps-3">
<h5 class="mb-2 mt-1">Laurent Shaun</h5>
<span class="badge badge-sm rounded-pill mb-3 text-dark">Laravel Senior</span>
<br/>
<button type="button" class="btn btn-facebook btn-simple px-2 mb-0">
<i class="fab fa-facebook-f text-lg"></i>
</button>
<button type="button" class="btn btn-dribbble btn-simple px-2 mb-0">
<i class="fab fa-dribbble text-lg"></i>
</button>
<button type="button" class="btn btn-slack btn-simple px-2 mb-0">
<i class="fab fa-slack text-lg"></i>
</button>
</div>
</div>
<div class="col-lg-5 text-end my-auto">
<img class="img-fluid border-radius-lg border-radius-bottom-start-0 border-radius-top-start-0" src="../../assets/img/james.jpg">
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 mb-4">
<div class="card shadow-lg card-body p-0">
<div class="row">
<div class="col-lg-7">
<div class="py-3 ps-3">
<h5 class="mb-2 mt-1">Ramon Siente</h5>
<span class="badge badge-sm rounded-pill mb-3 text-dark">Vue.js Specialist</span>
<br/>
<button type="button" class="btn btn-twitter btn-simple px-2 mb-0">
<i class="fab fa-twitter text-lg"></i>
</button>
<button type="button" class="btn btn-dribbble btn-simple px-2 mb-0">
<i class="fab fa-dribbble text-lg"></i>
</button>
<button type="button" class="btn btn-github btn-simple px-2 mb-0">
<i class="fab fa-github text-lg"></i>
</button>
</div>
</div>
<div class="col-lg-5 text-end my-auto">
<img class="img-fluid border-radius-lg border-radius-bottom-start-0 border-radius-top-start-0" src="../../assets/img/emily.jpg">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- END Teams w/ 4 cards in a row w/ avatar on bottom end-->Team 6
<section class="py-5 bg-gray-100">
<div class="container">
<div class="row">
<div class="col-md-7 mx-auto text-center mb-5">
<h3 class="text-info mb-0">Our Team</h3>
<h3>You are into a great company</h3>
<p>This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</p>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="card card-profile">
<a href="javascript:;">
<img class="w-100 border-radius-md border-radius-bottom-end-0 border-radius-bottom-start-0" src="../../assets/img/emily.jpg">
</a>
<div class="card-body justify-content-center text-center">
<h4 class="mb-0">Hattie McKenzie</h4>
<p>Montreal, QC</p>
<div class="row justify-content-center text-center">
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">323</h5>
<small>Projects</small>
</div>
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">500+</h5>
<small>Hours</small>
</div>
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">24/7</h5>
<small>Support</small>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="card card-profile">
<a href="javascript:;">
<img class="w-100 border-radius-md border-radius-bottom-end-0 border-radius-bottom-start-0" src="../../assets/img/michael.jpg">
</a>
<div class="card-body justify-content-center text-center">
<h4 class="mb-0">Ricardo Spratt</h4>
<p>Bucharest, RO</p>
<div class="row justify-content-center text-center">
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">450</h5>
<small>Projects</small>
</div>
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">400+</h5>
<small>Hours</small>
</div>
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">24/7</h5>
<small>Support</small>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mx-md-auto">
<div class="card card-profile mt-md-0">
<a href="javascript:;">
<img class="w-100 border-radius-md border-radius-bottom-end-0 border-radius-bottom-start-0" src="../../assets/img/james.jpg">
</a>
<div class="card-body justify-content-center text-center">
<h4 class="mb-0">Bruce Mars</h4>
<p>Atlanta, U.S.</p>
<div class="row justify-content-center text-center">
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">750</h5>
<small>Projects</small>
</div>
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">800+</h5>
<small>Hours</small>
</div>
<div class="col-lg-4 col-4">
<h5 class="text-info mb-0">24/7</h5>
<small>Support</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>