Spaces:
Sleeping
Sleeping
File size: 6,104 Bytes
c77acf1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 |
import React from "react";
const Team = () => {
return (
<div className="team-main">
<section className="py-24 ">
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div className="mb-12">
<p className="mt-5 text-4xl font-bold leading-tight text-gray-900 sm:leading-tight sm:text-5xl lg:text-6xl lg:leading-tight font-pj ">
Meet the
<span className="relative inline-flex sm:inline">
<span className="bg-gradient-to-r from-[#44BCFF] via-[#FF44EC] to-[#FF675E] blur-lg filter opacity-30 w-full h-full absolute inset-0 "></span>
<span className="relative"> Team</span>
</span>
</p>
<p className="text-lg text-gray-500 text-center">
These people work on making our product best.
</p>
</div>
<div className="flex flex-wrap justify-center gap-y-14 max-w-3xl mx-auto lg:max-w-full ">
<div className="group block text-center lg:w-1/5 sm:w-1/3 min-[450px]:w-1/2 w-full">
<div className="relative mb-5">
<img
src="https://images.unsplash.com/photo-1603562767384-c8fe55858c2f?w=600&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MjR8fHdvbWFuJTIwc2lsaG91ZXR0ZXxlbnwwfHwwfHx8MA%3D%3D"
alt="Vysh image"
className="w-28 h-28 rounded-2xl object-cover mx-auto ransition-all duration-500 border-2 border-solid border-transparent group-hover:border-indigo-600"
/>
</div>
<h4 className="text-xl text-gray-900 font-semibold text-center mb-2 transition-all duration-500 group-hover:text-indigo-600">
Vyshnavi Doke
</h4>
<span className="text-gray-500 text-center block transition-all duration-500 group-hover:text-gray-900">
Generative AI Engineer
</span>
</div>
<div className="group block text-center lg:w-1/5 sm:w-1/3 min-[450px]:w-1/2 w-full">
<div className="relative mb-5">
<img
src="https://images.unsplash.com/photo-1707025204723-27d332fc36ea?w=600&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MjB8fG1hbiUyMHNpbGhvdWV0dGV8ZW58MHx8MHx8fDA%3D"
alt="Shayan image"
className="w-28 h-28 rounded-2xl object-cover mx-auto ransition-all duration-500 border-2 border-solid border-transparent group-hover:border-indigo-600"
/>
</div>
<h4 className="text-xl text-gray-900 font-semibold text-center mb-2 transition-all duration-500 group-hover:text-indigo-600">
Shayan Chakraborty
</h4>
<span className="text-gray-500 text-center block transition-all duration-500 group-hover:text-gray-900">
Founder
</span>
</div>
<div className="group block text-center lg:w-1/5 sm:w-1/3 min-[450px]:w-1/2 w-full">
<div className="relative mb-5">
<img
src="https://images.unsplash.com/photo-1613854121108-551be0a5b978?w=600&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mjh8fG1hbiUyMHNpbGhvdWV0dGV8ZW58MHx8MHx8fDA%3D"
alt="Dj image"
className="w-28 h-28 rounded-2xl object-cover mx-auto ransition-all duration-500 border-2 border-solid border-transparent group-hover:border-indigo-600"
/>
</div>
<h4 className="text-xl text-gray-900 font-semibold text-center mb-2 transition-all duration-500 group-hover:text-indigo-600">
Lethlogonolo Fanampe
</h4>
<span className="text-gray-500 text-center block transition-all duration-500 group-hover:text-gray-900">
Backend Evangelist
</span>
</div>
<div className="group block text-center lg:w-1/5 sm:w-1/3 min-[450px]:w-1/2 w-full">
<div className="relative mb-5">
<img
src="https://images.unsplash.com/photo-1629997383348-4cafdec32fd6?w=600&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MzJ8fG1hbiUyMHNpbGhvdWV0dGV8ZW58MHx8MHx8fDA%3D"
alt="Diwakar image"
className="w-28 h-28 rounded-2xl object-cover mx-auto ransition-all duration-500 border-2 border-solid border-transparent group-hover:border-indigo-600"
/>
</div>
<h4 className="text-xl text-gray-900 font-semibold text-center mb-2 transition-all duration-500 group-hover:text-indigo-600">
Diwakar Mainali
</h4>
<span className="text-gray-500 text-center block transition-all duration-500 group-hover:text-gray-900">
Co-Founder and CEO
</span>
</div>
<div className="group block text-center lg:w-1/5 sm:w-1/3 min-[450px]:w-1/2 w-full">
<div className="relative mb-5">
<img
src="https://plus.unsplash.com/premium_photo-1664461663120-b39152ba92ae?w=600&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OTN8fHdvbWFuJTIwc2lsaG91ZXR0ZXxlbnwwfHwwfHx8MA%3D%3D"
alt="Ayesha image"
className="w-28 h-28 rounded-2xl object-cover mx-auto ransition-all duration-500 border-2 border-solid border-transparent group-hover:border-indigo-600"
/>
</div>
<h4 className="text-xl text-gray-900 font-semibold text-center mb-2 transition-all duration-500 group-hover:text-indigo-600">
Ayesha Virk
</h4>
<span className="text-gray-500 text-center block transition-all duration-500 group-hover:text-gray-900">
Business Specialist
</span>
</div>
</div>
</div>
</section>
</div>
);
};
export default Team;
|