PresentationSections
Teams
Teams 1
Copied
<div class="w-full">
<section class="pt-20 pb-48">
<div class="container mx-auto px-4">
<div class="mb-24">
<div class="pt-6">
<div class="mb-12 flex flex-wrap -mx-4 justify-center">
<div class="px-4 relative w-full lg:w-8/12 text-center">
<h6 class="mb-2 font-bold uppercase text-orange-500">The entourage</h6>
<h3 class="text-3xl font-bold mt-3 mb-1 text-blueGray-700">It is everything, and it won't change</h3>
<p class="mt-2 mb-4 text-xl leading-relaxed text-blueGray-400">It depends on your friends and companions, it depends on who goes out with you, if they have money, if you have money.</p>
</div>
</div>
</div>
</div>
<div class="flex flex-wrap">
<div class="w-full md:w-6/12 lg:w-3/12 lg:mb-0 mb-12 px-4">
<div class="px-6">
<img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/team-1-800x800.fa5a7ac2.jpg" class="shadow-lg rounded-full mx-auto max-w-120-px">
<div class="pt-6 text-center">
<h5 class="text-xl font-bold">Ryan Tompson</h5>
<p class="mt-1 text-sm text-blueGray-400 uppercase font-bold">Web Developer</p>
<div class="mt-6"><a href="javascript:;" target="_blank" type="button" class="bg-lightBlue-400 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-twitter"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-lightBlue-500 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-facebook"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-pink-500 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-dribbble"></i></a></div>
</div>
</div>
</div>
<div class="w-full md:w-6/12 lg:w-3/12 lg:mb-0 mb-12 px-4">
<div class="px-6">
<img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/team-2-800x800.2f02b23c.jpg" class="shadow-lg rounded-full mx-auto max-w-120-px">
<div class="pt-6 text-center">
<h5 class="text-xl font-bold">Romina Hadid</h5>
<p class="mt-1 text-sm text-blueGray-400 uppercase font-bold">Marketing Specialist</p>
<div class="mt-6"><a href="javascript:;" target="_blank" type="button" class="bg-pink-700 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-instagram"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-lightBlue-500 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-facebook"></i></a></div>
</div>
</div>
</div>
<div class="w-full md:w-6/12 lg:w-3/12 lg:mb-0 mb-12 px-4">
<div class="px-6">
<img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/team-3-800x800.19201574.jpg" class="shadow-lg rounded-full mx-auto max-w-120-px">
<div class="pt-6 text-center">
<h5 class="text-xl font-bold">Alexa Smith</h5>
<p class="mt-1 text-sm text-blueGray-400 uppercase font-bold">UI/UX Designer</p>
<div class="mt-6"><a href="javascript:;" target="_blank" type="button" class="bg-pink-700 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-instagram"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-lightBlue-500 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-facebook"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-lightBlue-400 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-twitter"></i></a></div>
</div>
</div>
</div>
<div class="w-full md:w-6/12 lg:w-3/12 lg:mb-0 mb-12 px-4">
<div class="px-6">
<img alt="..." src="https://demos.creative-tim.com/notus-pro-react/static/media/team-4-470x470.4ef82ef4.png" class="shadow-lg rounded-full mx-auto max-w-120-px">
<div class="pt-6 text-center">
<h5 class="text-xl font-bold">Jenna Kardi</h5>
<p class="mt-1 text-sm text-blueGray-400 uppercase font-bold">Founder and CEO</p>
<div class="mt-6"><a href="javascript:;" target="_blank" type="button" class="bg-pink-700 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-instagram"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-lightBlue-500 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-facebook"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-lightBlue-400 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-twitter"></i></a><a href="javascript:;" target="_blank" type="button" class="bg-pink-500 inline-flex items-center justify-center text-white w-8 h-8 rounded-full outline-none focus:outline-none mr-1 mb-1"><i class="fab fa-dribbble"></i></a></div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>Teams 2
Copied
testimonials
They've been or not with you
It's your life, and there are a lot of people with you, but this doesn't mean that everything is ok, it can be anyhow. You stay with your friends and nothing matters anymore.
<div class="w-full">
<div class="py-12">
<div class="flex flex-wrap -mx-4">
<div class="relative">
<div class="relative w-full overflow-hidden">
<div class="relative float-left w-full transform duration-500 transition-all ease-in-out block">
<div class="container mx-auto px-4">
<div class="flex flex-wrap -mx-4">
<div class="px-12 py-12 px-4 relative w-full md:w-5/12 ml-auto">
<div class="p-6"><img class="w-full rounded-lg shadow-xl transform" src="https://demos.creative-tim.com/notus-pro-react/static/media/kareya-saleh.b94f8020.jpg" alt="..."></div>
</div>
<div class="pt-12 px-4 relative w-full md:w-5/12 mr-auto flex align-center items-center">
<div class="p-4 pt-6 md:p-0">
<h2 class="text-2xl font-bold mt-0 mb-2">Lili Watson</h2>
<p class="mt-3 text-lg leading-relaxed text-blueGray-500">Artist is a term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person should is one who expresses him- or herself through a medium".</p>
<ul class="mt-6 list-none">
<li class="py-2">
<div class="flex items-center">
<span class="inline-flex text-center rounded-full mr-3 items-center justify-center text-sm w-8 h-8 text-pink-500 bg-pink-200"><i class="fas fa-atom"></i></span>
<h6 class="text-md text-blueGray-500">Dedicated entrepreneur</h6>
</div>
</li>
<li class="py-2">
<div class="flex items-center">
<span class="inline-flex text-center rounded-full mr-3 items-center justify-center text-sm w-8 h-8 text-emerald-500 bg-emerald-200"><i class="fas fa-running"></i></span>
<h6 class="text-md text-blueGray-500">Urban city exploration</h6>
</div>
</li>
<li class="py-2">
<div class="flex items-center">
<span class="inline-flex text-center rounded-full mr-3 items-center justify-center text-sm w-8 h-8 text-lightBlue-500 bg-lightBlue-200"><i class="fab fa-facebook"></i></span>
<h6 class="text-md text-blueGray-500">Active on Facebook since 2015</h6>
</div>
</li>
</ul>
<div class="py-6 pl-12 text-left"><a href="javascript:;" class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2 text-white bg-twitter-regular border-twitter-regular active:bg-twitter-active active:border-twitter-active text-sm px-6 py-2 shadow hover:shadow-lg rounded-md"><i class="fab fa-twitter"></i></a><a href="javascript:;" class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2 text-white bg-facebook-regular border-facebook-regular active:bg-facebook-active active:border-facebook-active text-sm px-6 py-2 shadow hover:shadow-lg rounded-md"><i class="fab fa-facebook"></i></a><a href="javascript:;" class="inline-block outline-none focus:outline-none align-middle transition-all duration-150 ease-in-out uppercase border border-solid font-bold last:mr-0 mr-2 text-white bg-dribbble-regular border-dribbble-regular active:bg-dribbble-active active:border-dribbble-active text-sm px-6 py-2 shadow hover:shadow-lg rounded-md"><i class="fab fa-dribbble"></i></a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="relative w-full -mt-12"><a href="javascript:;" class="absolute z-1 top-0 bottom-0 flex items-center justify-center w-1/6 text-white text-center opacity-50 hover:opacity-100 transition-opacity duration-150 ease-linear left-0" style="left: 90%; width: 5%;"><i class="text-lightBlue-500 fas fa-chevron-left"></i><span class="sr-only">Previous</span></a><a href="javascript:;" class="absolute z-1 top-0 bottom-0 flex items-center justify-center w-1/6 text-white text-center opacity-50 hover:opacity-100 transition-opacity duration-150 ease-linear right-0" style="width: 5%;"><i class="text-lightBlue-500 fas fa-chevron-right"></i><span class="sr-only">Next</span></a></div>
</div>
</div>
</div>