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="fas fa-user"></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 class="blur-shadow-avatar">
<img class="avatar avatar-xxl shadow-lg" src="../../assets/img/bruce-mars.jpg">
</div>
</div>
</div>
<div class="card-body ps-0">
<h5 class="mb-0">Alec Thompson</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 class="blur-shadow-avatar">
<img class="avatar avatar-xxl shadow-lg" src="../../assets/img/team-3.jpg">
</div>
</div>
</div>
<div class="card-body ps-0">
<h5 class="mb-0">Alec Thompson</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 class="blur-shadow-avatar">
<img class="avatar avatar-xxl shadow-lg" src="../../assets/img/team-4.jpg">
</div>
</div>
</div>
<div class="card-body ps-0">
<h5 class="mb-0">Alec Thompson</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-gradient 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 class="blur-shadow-image">
<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-bolder 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 class="blur-shadow-image">
<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-bolder mb-0">Jordan 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 class="blur-shadow-image">
<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-bolder mb-0">Nora 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 class="blur-shadow-image">
<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-bolder 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" style="background-image: url('../../assets/img/curved-images/curved14.jpg'); background-size:cover;">
<span class="mask bg-gradient-dark"></span>
<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-info shadow text-center mb-3">
<i class="fas fa-users"></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="p-3 pe-md-0">
<img class="w-100 border-radius-md" src="../../assets/img/kal-visuals-square.jpg">
</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="p-3 pe-md-0">
<img class="w-100 border-radius-md" src="../../assets/img/bruce-mars.jpg">
</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">Boss</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-5">
<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="p-3 pe-md-0">
<img class="w-100 border-radius-md" src="../../assets/img/team-4.jpg">
</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">Ivana Flow</h5>
<h6 class="text-info">Athlete</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">
<div class="row">
<div class="col-lg-4 col-md-6 col-12 pe-lg-0">
<a href="javascript:;">
<div class="p-3 pe-md-0">
<img class="w-100 border-radius-md" src="../../assets/img/ivana-square.jpg">
</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">Sophia Garcia</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>
<div class="position-absolute w-100 z-index-1 bottom-0">
<svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 40" preserveAspectRatio="none" shape-rendering="auto">
<defs>
<path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
</defs>
<g class="moving-waves">
<use xlink:href="#gentle-wave" x="48" y="-1" fill="rgba(255,255,255,0.40"></use>
<use xlink:href="#gentle-wave" x="48" y="3" fill="rgba(255,255,255,0.35)"></use>
<use xlink:href="#gentle-wave" x="48" y="5" fill="rgba(255,255,255,0.25)"></use>
<use xlink:href="#gentle-wave" x="48" y="8" fill="rgba(255,255,255,0.20)"></use>
<use xlink:href="#gentle-wave" x="48" y="13" fill="rgba(255,255,255,0.15)"></use>
<use xlink:href="#gentle-wave" x="48" y="16" fill="rgba(255,255,255,0.95"></use>
</g>
</svg>
</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-gradient 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 card-profile card-plain">
<div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
<a href="javascript:;">
<img class="w-100 border-radius-md" src="../../assets/img/kal-visuals.jpg">
</a>
<h5 class="mt-3 mb-1 d-md-block d-none">Miriam Lendra</h5>
<p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Miriam Lendra</p>
<p class="mb-0 text-xs font-weight-bolder text-warning text-gradient text-uppercase">Desktop Publisher</p>
</div>
</div>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<div class="card card-profile card-plain">
<div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
<a href="javascript:;">
<img class="w-100 border-radius-md" src="../../assets/img/brooke.jpg">
</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-bolder text-warning text-gradient text-uppercase">Credit Analyst</p>
</div>
</div>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<div class="card card-profile card-plain">
<div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
<a href="javascript:;">
<img class="w-100 border-radius-md" src="../../assets/img/ivana.jpg">
</a>
<h5 class="mt-3 mb-1 d-md-block d-none">Bella Audrey</h5>
<p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Bella Audrey</p>
<p class="mb-0 text-xs font-weight-bolder text-warning text-gradient text-uppercase">Economist</p>
</div>
</div>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<div class="card card-profile card-plain">
<div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
<a href="javascript:;">
<img class="w-100 border-radius-md" src="../../assets/img/jordan.jpg" alt="card image">
</a>
<h5 class="mt-3 mb-1 d-md-block d-none">Wesley 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-bolder text-warning text-gradient text-uppercase">Aviation Inspector</p>
</div>
</div>
</div>
</div>
<div class="row mt-5">
<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-gradient 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 card-body">
<div class="row">
<div class="col-lg-7">
<h5 class="mb-2">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 class="col-lg-5 text-end my-auto">
<img class="avatar avatar-xxl" src="../../assets/img/team-2.jpg">
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 mb-4">
<div class="card card-body">
<div class="row">
<div class="col-lg-7">
<h5 class="mb-2">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 class="col-lg-5 text-end my-auto">
<img class="avatar avatar-xxl" src="../../assets/img/team-3.jpg">
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 mb-4">
<div class="card card-body">
<div class="row">
<div class="col-lg-7">
<h5 class="mb-2">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 class="col-lg-5 text-end my-auto">
<img class="avatar avatar-xxl" src="../../assets/img/team-2.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-gradient 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:;">
<div class="p-3">
<img class="w-100 border-radius-md" src="../../assets/img/ivana-square.jpg">
</div>
</a>
<div class="card-body blur justify-content-center text-center mt-n5 mx-4 mb-4 border-radius-md">
<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 mt-md-0 mt-5">
<a href="javascript:;">
<div class="p-3">
<img class="w-100 border-radius-md" src="../../assets/img/kal-visuals-square.jpg">
</div>
</a>
<div class="card-body blur justify-content-center text-center mt-n5 mx-4 mb-4 border-radius-md">
<h4 class="mb-0">Annie 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 mt-5">
<a href="javascript:;">
<div class="p-3">
<img class="w-100 border-radius-md" src="../../assets/img/bruce-mars.jpg">
</div>
</a>
<div class="card-body blur justify-content-center text-center mt-n5 mx-4 mb-4 border-radius-md">
<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>