Medss / stats-counter.html
rainbowhunt's picture
Upload 26 files
5e92b2c verified
<!-- Stats Counter Section -->
<section class="bg-primary py-16 text-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-3xl font-bold mb-4">TN Medical Connect by the Numbers</h2>
<p class="text-gray-300 max-w-2xl mx-auto">Join thousands of medical professionals who are already benefiting from our platform</p>
</div>
<div class="grid md:grid-cols-4 gap-8 text-center">
<!-- Stat 1 -->
<div class="p-6 bg-white/10 rounded-lg backdrop-blur-sm">
<i class="fas fa-user-md text-4xl mb-4 text-accent"></i>
<p class="text-4xl font-bold mb-2 counter-animation" data-target="2500">0</p>
<p class="text-gray-300">Verified Doctors</p>
</div>
<!-- Stat 2 -->
<div class="p-6 bg-white/10 rounded-lg backdrop-blur-sm">
<i class="fas fa-book-medical text-4xl mb-4 text-accent"></i>
<p class="text-4xl font-bold mb-2 counter-animation" data-target="350">0</p>
<p class="text-gray-300">Research Papers</p>
</div>
<!-- Stat 3 -->
<div class="p-6 bg-white/10 rounded-lg backdrop-blur-sm">
<i class="fas fa-podcast text-4xl mb-4 text-accent"></i>
<p class="text-4xl font-bold mb-2 counter-animation" data-target="120">0</p>
<p class="text-gray-300">Medical Podcasts</p>
</div>
<!-- Stat 4 -->
<div class="p-6 bg-white/10 rounded-lg backdrop-blur-sm">
<i class="fas fa-briefcase-medical text-4xl mb-4 text-accent"></i>
<p class="text-4xl font-bold mb-2 counter-animation" data-target="85">0</p>
<p class="text-gray-300">Active Grants</p>
</div>
</div>
<div class="text-center mt-12">
<a href="#features" class="bg-white text-primary px-8 py-3 rounded-md font-medium shadow-sm hover:shadow-md transition-all btn-hover-effect inline-block">
Explore Our Features
</a>
</div>
</div>
</section>