| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Swimming - NAGAS - Northbridge Athletic Groups and Sports</title> |
| <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@700;900&family=Open+Sans:wght@400;600&display=swap" rel="stylesheet"> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <script> |
| tailwind.config = { |
| theme: { |
| extend: { |
| colors: { |
| primary: '#5ec0cc', |
| secondary: '#5ECCA2', |
| dark: '#121212', |
| darker: '#0a0a0a' |
| } |
| } |
| } |
| } |
| </script> |
| <style> |
| body { |
| font-family: 'Open Sans', sans-serif; |
| background-color: #121212; |
| color: #ffffff; |
| } |
| h1, h2, h3, h4, h5, h6 { |
| font-family: 'Montserrat', sans-serif; |
| } |
| .hero-image { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| object-fit: cover; |
| z-index: -1; |
| } |
| .swimmer-card:hover { |
| transform: translateY(-5px); |
| transition: all 0.3s ease; |
| } |
| .schedule-item:hover { |
| background-color: #1e1e1e; |
| } |
| .gallery-item:hover { |
| transform: scale(1.05); |
| transition: all 0.3s ease; |
| } |
| .stat-card { |
| transition: all 0.3s ease; |
| } |
| .stat-card:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 10px 25px rgba(94, 192, 204, 0.2); |
| } |
| .filter-active { |
| background-color: #5ec0cc; |
| color: #0a0a0a; |
| } |
| .stroke-filter { |
| background-color: #1e1e1e; |
| border: 1px solid #5ec0cc; |
| } |
| .stroke-filter:focus { |
| outline: none; |
| border-color: #5ECCA2; |
| } |
| </style> |
| </head> |
| <body class="bg-dark text-white"> |
| |
| <header class="fixed w-full z-50 bg-dark border-b border-primary"> |
| <div class="container mx-auto px-4 py-3 flex justify-between items-center"> |
| <div class="flex items-center"> |
| <div class="w-10 h-10 bg-primary rounded-full mr-3"></div> |
| <a href="index.html" class="text-xl font-extrabold"><span class="text-[#5ec0cc]">NAGAS</span><span class="text-white">ATHLETICS</span></a> |
| </div> |
| <nav class="hidden md:flex space-x-6"> |
| <a href="index.html" class="hover:text-primary">Home</a> |
| <a href="about.html" class="hover:text-primary">About</a> |
| <a href="teams.html" class="hover:text-primary">Teams</a> |
| <a href="schedule.html" class="hover:text-primary">Schedule</a> |
| <a href="council.html" class="hover:text-primary">Council</a> |
| <a href="news.html" class="hover:text-primary">News</a> |
| <a href="get-involved.html" class="hover:text-primary">Get Involved</a> |
| </nav> |
| <button id="menu-toggle" class="md:hidden text-white"> |
| <i data-feather="menu"></i> |
| </button> |
| </div> |
| </header> |
|
|
| |
| <div id="mobile-menu" class="fixed inset-0 bg-dark z-50 hidden"> |
| <div class="flex justify-between items-center p-4 border-b border-primary"> |
| <div class="flex items-center"> |
| <div class="w-10 h-10 bg-primary rounded-full mr-3"></div> |
| <span class="text-xl font-extrabold"><span class="text-[#5ec0cc]">NAGAS</span><span class="text-white">ATHLETICS</span></span> |
| </div> |
| <button id="menu-close" class="text-white"> |
| <i data-feather="x"></i> |
| </button> |
| </div> |
| <nav class="p-4"> |
| <a href="index.html" class="block py-3 hover:text-primary border-b border-[#2e2e2e]">Home</a> |
| <a href="about.html" class="block py-3 hover:text-primary border-b border-[#2e2e2e]">About</a> |
| <a href="teams.html" class="block py-3 hover:text-primary border-b border-[#2e2e2e]">Teams</a> |
| <a href="schedule.html" class="block py-3 hover:text-primary border-b border-[#2e2e2e]">Schedule</a> |
| <a href="council.html" class="block py-3 hover:text-primary border-b border-[#2e2e2e]">Council</a> |
| <a href="news.html" class="block py-3 hover:text-primary border-b border-[#2e2e2e]">News</a> |
| <a href="get-involved.html" class="block py-3 hover:text-primary border-b border-[#2e2e2e]">Get Involved</a> |
| </nav> |
| </div> |
| |
| <div class="pt-20 pb-4 bg-darker border-b border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <nav class="text-sm"> |
| <a href="index.html" class="text-primary hover:underline">Home</a> > |
| <a href="teams.html" class="text-primary hover:underline">Teams</a> > |
| <span class="text-white">Swimming</span> |
| </nav> |
| </div> |
| </div> |
|
|
| |
| <section class="relative h-96 flex items-center justify-center overflow-hidden"> |
| <img src="http://static.photos/sport/1200x630/7" alt="NAGAS Swimming Action" class="hero-image"> |
| <div class="absolute inset-0 bg-black bg-opacity-70"></div> |
| <div class="relative z-10 text-center px-4"> |
| <h1 class="text-4xl md:text-5xl font-bold text-primary mb-2">NAGAS SWIMMING</h1> |
| <p class="text-xl mb-4">Gold Squad • Development • Biathlon</p> |
| <div class="flex flex-wrap justify-center gap-2"> |
| <div class="bg-secondary text-dark py-1 px-4 rounded-full text-sm">2025-2026 Season</div> |
| <div class="bg-primary text-dark py-1 px-4 rounded-full text-sm">FINA Standard Pool</div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">ABOUT OUR PROGRAM</h2> |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 items-center"> |
| <div> |
| <p class="mb-4">Our swimmers compete in ISSAPP meets and train in our FINA-standard 25m pool. We develop technique, endurance, and race strategy for all levels of swimmers.</p> |
| <p class="mb-6">Programs for all levels from beginners to competitive swimmers. Our focus is on personal development, teamwork, and achieving personal bests.</p> |
| <p class="text-secondary font-bold">2024 ISSAPP Medalists - 5 Individual Medals</p> |
| </div> |
| <div class="bg-[#1e1e1e] p-6 rounded-lg"> |
| <div class="flex items-center"> |
| <img src="http://static.photos/people/100x100/80" alt="Swimming Coach" class="w-16 h-16 rounded-full mr-4"> |
| <div> |
| <h3 class="text-xl font-bold">Sokha Mey</h3> |
| <p class="text-secondary">Head Swimming Coach</p> |
| </div> |
| </div> |
| <p class="mt-4">Former national team swimmer with 15 years coaching experience. Specializes in stroke technique and race strategy.</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e] bg-[#0a0a0a]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">OUR SWIMMERS</h2> |
| |
| |
| <div class="flex flex-wrap gap-2 mb-8"> |
| <select id="strokeFilter" class="stroke-filter py-2 px-4 rounded"> |
| <option value="all">All Strokes</option> |
| <option value="freestyle">Freestyle</option> |
| <option value="backstroke">Backstroke</option> |
| <option value="breaststroke">Breaststroke</option> |
| <option value="butterfly">Butterfly</option> |
| <option value="im">Individual Medley</option> |
| </select> |
| </div> |
| |
| |
| <div class="mb-12"> |
| <h3 class="text-2xl font-bold mb-6 text-secondary">Gold Squad (Competitive)</h3> |
| |
| <div class="mb-8"> |
| <h4 class="text-xl font-bold mb-4">Juniors (Grades 6-8)</h4> |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
| |
| <div class="swimmer-card bg-[#1e1e1e] rounded-lg overflow-hidden" data-stroke="freestyle butterfly"> |
| <img src="http://static.photos/people/320x240/81" alt="Junior Swimmer" class="w-full h-48 object-cover"> |
| <div class="p-4"> |
| <h4 class="font-bold text-lg">Sok Visal</h4> |
| <p class="text-secondary">Freestyle, Butterfly</p> |
| <p>50m Free PB: 28.4s</p> |
| <p>100m Fly PB: 1:05.2</p> |
| </div> |
| </div> |
| |
| |
| <div class="swimmer-card bg-[#1e1e1e] rounded-lg overflow-hidden" data-stroke="backstroke"> |
| <img src="http://static.photos/people/320x240/82" alt="Junior Swimmer" class="w-full h-48 object-cover"> |
| <div class="p-4"> |
| <h4 class="font-bold text-lg">Chea Sopheak</h4> |
| <p class="text-secondary">Backstroke Specialist</p> |
| <p>100m Back PB: 1:08.7</p> |
| <p>200m Back PB: 2:25.3</p> |
| </div> |
| </div> |
| |
| |
| <div class="swimmer-card bg-[#1e1e1e] rounded-lg overflow-hidden" data-stroke="breaststroke im"> |
| <img src="http://static.photos/people/320x240/83" alt="Junior Swimmer" class="w-full h-48 object-cover"> |
| <div class="p-4"> |
| <h4 class="font-bold text-lg">Lyhour Meng</h4> |
| <p class="text-secondary">Breaststroke, IM</p> |
| <p>100m Breast PB: 1:15.4</p> |
| <p>200m IM PB: 2:38.9</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div> |
| <h4 class="text-xl font-bold mb-4">Seniors (Grades 9-12)</h4> |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
| |
| <div class="swimmer-card bg-[#1e1e1e] rounded-lg overflow-hidden" data-stroke="freestyle"> |
| <img src="http://static.photos/people/320x240/84" alt="Senior Swimmer" class="w-full h-48 object-cover"> |
| <div class="p-4"> |
| <h4 class="font-bold text-lg">Thay Sethean</h4> |
| <p class="text-secondary">Distance Freestyle</p> |
| <p>200m Free PB: 2:01.3</p> |
| <p>400m Free PB: 4:18.7</p> |
| </div> |
| </div> |
| |
| |
| <div class="swimmer-card bg-[#1e1e1e] rounded-lg overflow-hidden" data-stroke="butterfly"> |
| <img src="http://static.photos/people/320x240/85" alt="Senior Swimmer" class="w-full h-48 object-cover"> |
| <div class="p-4"> |
| <h4 class="font-bold text-lg">Sokhim Chhun</h4> |
| <p class="text-secondary">Butterfly Specialist</p> |
| <p>100m Fly PB: 58.3</p> |
| <p>200m Fly PB: 2:12.4</p> |
| </div> |
| </div> |
| |
| |
| <div class="swimmer-card bg-[#1e1e1e] rounded-lg overflow-hidden" data-stroke="im"> |
| <img src="http://static.photos/people/320x240/86" alt="Senior Swimmer" class="w-full h-48 object-cover"> |
| <div class="p-4"> |
| <h4 class="font-bold text-lg">Kosal Khemarak</h4> |
| <p class="text-secondary">Individual Medley</p> |
| <p>200m IM PB: 2:18.7</p> |
| <p>400m IM PB: 4:52.3</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div class="mb-12"> |
| <h3 class="text-2xl font-bold mb-6 text-secondary">Development Squad</h3> |
| |
| <div class="mb-8"> |
| <h4 class="text-xl font-bold mb-4">Juniors</h4> |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
| <div class="bg-[#1e1e1e] rounded-lg p-8 text-center"> |
| <i data-feather="users" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <p>Development swimmers roster coming soon</p> |
| </div> |
| </div> |
| </div> |
| |
| <div> |
| <h4 class="text-xl font-bold mb-4">Seniors</h4> |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
| <div class="bg-[#1e1e1e] rounded-lg p-8 text-center"> |
| <i data-feather="users" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <p>Development swimmers roster coming soon</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div> |
| <h3 class="text-2xl font-bold mb-6 text-secondary">Biathlon Program</h3> |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
| <div class="bg-[#1e1e1e] rounded-lg p-8 text-center"> |
| <i data-feather="users" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <p>Biathlon participants roster coming soon</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">2025-2026 MEET SCHEDULE</h2> |
| |
| <div class="mb-12"> |
| <h3 class="text-2xl font-bold mb-6 text-secondary">Upcoming Meets</h3> |
| <div class="space-y-4"> |
| <div class="schedule-item bg-[#1e1e1e] p-4 rounded-lg flex flex-col md:flex-row justify-between items-start md:items-center"> |
| <div> |
| <p class="text-secondary">July 15, 2025 - 9:00 AM</p> |
| <p class="font-bold">NAGAS vs. ISSPP All-Stars</p> |
| <p>NISC Aquatics Centre</p> |
| <p>Events: All Strokes, All Distances</p> |
| </div> |
| <button class="mt-2 md:mt-0 bg-primary text-dark font-bold py-2 px-4 rounded hover:bg-[#4ab3c6] transition">Add to Calendar</button> |
| </div> |
| |
| <div class="schedule-item bg-[#1e1e1e] p-4 rounded-lg flex flex-col md:flex-row justify-between items-start md:items-center"> |
| <div> |
| <p class="text-secondary">July 22, 2025 - 2:00 PM</p> |
| <p class="font-bold">NAGAS vs. NIST Thunder</p> |
| <p>Away - NIST Pool</p> |
| <p>Events: Freestyle, Backstroke</p> |
| </div> |
| <button class="mt-2 md:mt-0 bg-primary text-dark font-bold py-2 px-4 rounded hover:bg-[#4ab3c6] transition">Add to Calendar</button> |
| </div> |
| |
| <div class="schedule-item bg-[#1e1e1e] p-4 rounded-lg flex flex-col md:flex-row justify-between items-start md:items-center"> |
| <div> |
| <p class="text-secondary">July 29, 2025 - 10:00 AM</p> |
| <p class="font-bold">NAGAS vs. NISB Eagles</p> |
| <p>NISC Aquatics Centre</p> |
| <p>Events: Breaststroke, Butterfly, IM</p> |
| </div> |
| <button class="mt-2 md:mt-0 bg-primary text-dark font-bold py-2 px-4 rounded hover:bg-[#4ab3c6] transition">Add to Calendar</button> |
| </div> |
| </div> |
| </div> |
| |
| <div> |
| <h3 class="text-2xl font-bold mb-6 text-secondary">Recent Results</h3> |
| <div class="space-y-4"> |
| <div class="bg-[#1e1e1e] p-4 rounded-lg"> |
| <p class="font-bold">ISSAPP Mid-Season Meet</p> |
| <p>Team Score: 2nd Place (142 Points)</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] p-4 rounded-lg"> |
| <p class="font-bold">ASAC Regional Championships</p> |
| <p>Team Score: 3rd Place (118 Points)</p> |
| </div> |
| </div> |
| </div> |
| |
| <div class="mt-8 text-center"> |
| <a href="schedule.html#swimming" class="inline-block bg-primary text-dark font-bold py-2 px-6 rounded hover:bg-[#4ab3c6] transition">Full Schedule</a> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e] bg-[#0a0a0a]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">MEET THE COACHES</h2> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
| <div class="bg-[#1e1e1e] rounded-lg overflow-hidden"> |
| <div class="md:flex"> |
| <img src="http://static.photos/people/200x200/80" alt="Sokha Mey" class="w-full md:w-32 h-32 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold">Sokha Mey</h3> |
| <p class="text-secondary mb-2">Head Swimming Coach</p> |
| <p>Former national team swimmer with 15 years coaching experience.</p> |
| </div> |
| </div> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg overflow-hidden"> |
| <div class="md:flex"> |
| <img src="http://static.photos/people/200x200/87" alt="Assistant Coach" class="w-full md:w-32 h-32 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold">Visal Sreytouch</h3> |
| <p class="text-secondary mb-2">Assistant Coach</p> |
| <p>Specializes in stroke technique and race preparation.</p> |
| </div> |
| </div> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg overflow-hidden"> |
| <div class="md:flex"> |
| <img src="http://static.photos/people/200x200/88" alt="Michelle Dean" class="w-full md:w-32 h-32 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold">Michelle Dean</h3> |
| <p class="text-secondary mb-2">Swim Coordinator</p> |
| <p>Manages training schedules and competition logistics.</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div class="mt-8 text-center"> |
| <a href="mailto:swimming-coaches@nagas.edu.kh" class="inline-block bg-primary text-dark font-bold py-2 px-6 rounded hover:bg-[#4ab3c6] transition">Contact Coaches</a> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">TEAM RECORDS</h2> |
| <div class="overflow-x-auto"> |
| <table class="w-full bg-[#1e1e1e] rounded-lg overflow-hidden"> |
| <thead> |
| <tr class="bg-[#2e2e2e]"> |
| <th class="text-left py-3 px-4">Event</th> |
| <th class="text-left py-3 px-4">Swimmer</th> |
| <th class="text-left py-3 px-4">Time</th> |
| <th class="text-left py-3 px-4">Year</th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr class="border-b border-[#2e2e2e] hover:bg-[#2a2a2a]"> |
| <td class="py-3 px-4">50m Freestyle</td> |
| <td class="py-3 px-4">Thay Sethean</td> |
| <td class="py-3 px-4">23.8s</td> |
| <td class="py-3 px-4">2024</td> |
| </tr> |
| <tr class="border-b border-[#2e2e2e] hover:bg-[#2a2a2a]"> |
| <td class="py-3 px-4">100m Butterfly</td> |
| <td class="py-3 px-4">Sokhim Chhun</td> |
| <td class="py-3 px-4">58.3</td> |
| <td class="py-3 px-4">2023</td> |
| </tr> |
| <tr class="border-b border-[#2e2e2e] hover:bg-[#2a2a2a]"> |
| <td class="py-3 px-4">200m Individual Medley</td> |
| <td class="py-3 px-4">Kosal Khemarak</td> |
| <td class="py-3 px-4">2:18.7</td> |
| <td class="py-3 px-4">2024</td> |
| </tr> |
| <tr class="border-b border-[#2e2e2e] hover:bg-[#2a2a2a]"> |
| <td class="py-3 px-4">400m Freestyle</td> |
| <td class="py-3 px-4">Thay Sethean</td> |
| <td class="py-3 px-4">4:18.7</td> |
| <td class="py-3 px-4">2024</td> |
| </tr> |
| <tr class="border-b border-[#2e2e2e] hover:bg-[#2a2a2a]"> |
| <td class="py-3 px-4">100m Backstroke</td> |
| <td class="py-3 px-4">Chea Sopheak</td> |
| <td class="py-3 px-4">1:05.2</td> |
| <td class="py-3 px-4">2023</td> |
| </tr> |
| <tr class="border-b border-[#2e2e2e] hover:bg-[#2a2a2a]"> |
| <td class="py-3 px-4">200m Breaststroke</td> |
| <td class="py-3 px-4">Lyhour Meng</td> |
| <td class="py-3 px-4">2:38.9</td> |
| <td class="py-3 px-4">2024</td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| <div class="mt-8 text-center"> |
| <button class="bg-primary text-dark font-bold py-2 px-6 rounded hover:bg-[#4ab3c6] transition">View Full Records</button> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e] bg-[#0a0a0a]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">OUR PROGRAMS</h2> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
| <div class="bg-[#1e1e1e] p-6 rounded-lg"> |
| <h3 class="text-xl font-bold mb-4 text-secondary">Gold Squad</h3> |
| <p class="mb-4">For competitive swimmers training 5+ times per week</p> |
| <ul class="space-y-2 mb-4"> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Advanced technique training</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Race strategy development</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>ISSAPP competition preparation</span> |
| </li> |
| </ul> |
| <p class="text-sm"><span class="font-bold">Schedule:</span> Mon/Wed/Fri 6:00-7:30 AM, Tue/Thu 3:30-5:00 PM</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] p-6 rounded-lg"> |
| <h3 class="text-xl font-bold mb-4 text-secondary">Development Squad</h3> |
| <p class="mb-4">For swimmers improving technique and fitness</p> |
| <ul class="space-y-2 mb-4"> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Stroke correction focus</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Endurance building</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Fun, supportive environment</span> |
| </li> |
| </ul> |
| <p class="text-sm"><span class="font-bold">Schedule:</span> Mon/Wed/Fri 3:30-4:30 PM</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] p-6 rounded-lg"> |
| <h3 class="text-xl font-bold mb-4 text-secondary">Biathlon Program</h3> |
| <p class="mb-4">Combined swimming and running for all fitness levels</p> |
| <ul class="space-y-2 mb-4"> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Goal setting and achievement</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Personal best focus</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Flexible training plans</span> |
| </li> |
| </ul> |
| <p class="text-sm"><span class="font-bold">Schedule:</span> Tue/Thu 4:30-5:30 PM</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">POOL ACTION</h2> |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-4"> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/7" alt="Race Start" class="w-full h-48 object-cover rounded"> |
| </div> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/19" alt="Butterfly Stroke" class="w-full h-48 object-cover rounded"> |
| </div> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/20" alt="Relay Exchange" class="w-full h-48 object-cover rounded"> |
| </div> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/21" alt="Backstroke" class="w-full h-48 object-cover rounded"> |
| </div> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/22" alt="Freestyle Finish" class="w-full h-48 object-cover rounded"> |
| </div> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/23" alt="Technique Training" class="w-full h-48 object-cover rounded"> |
| </div> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/24" alt="Award Ceremony" class="w-full h-48 object-cover rounded"> |
| </div> |
| <div class="gallery-item"> |
| <img src="http://static.photos/sport/640x360/25" alt="Team Photo" class="w-full h-48 object-cover rounded"> |
| </div> |
| </div> |
| <div class="mt-8 text-center"> |
| <button class="bg-primary text-dark font-bold py-2 px-6 rounded hover:bg-[#4ab3c6] transition">View All Photos</button> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e] bg-[#0a0a0a]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">TEAM HONORS</h2> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-6"> |
| <div class="bg-[#1e1e1e] p-6 rounded-lg text-center"> |
| <i data-feather="award" class="text-secondary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">2024 ISSAPP Medalists</h3> |
| <p>5 Individual Medals Won</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] p-6 rounded-lg text-center"> |
| <i data-feather="award" class="text-secondary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">2023 ASAC Finalists</h3> |
| <p>Reached regional championship finals</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] p-6 rounded-lg text-center"> |
| <i data-feather="user" class="text-secondary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">Swimmer of the Month</h3> |
| <p>Featured athlete program</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">OUR POOL</h2> |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 items-center"> |
| <div> |
| <img src="http://static.photos/indoor/640x360/9" alt="NAGAS Aquatics Centre" class="w-full rounded-lg"> |
| </div> |
| <div> |
| <h3 class="text-2xl font-bold mb-4">25m FINA Standard Pool</h3> |
| <ul class="space-y-3 mb-6"> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>8 competition lanes with international timing system</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Heated to 27°C for optimal performance</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Diving blocks and backstroke flags</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Spectator seating for 200</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Separate warm-up/warm-down pool</span> |
| </li> |
| </ul> |
| <button class="bg-primary text-dark font-bold py-2 px-6 rounded hover:bg-[#4ab3c6] transition">Virtual Tour</button> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 border-b border-[#2e2e2e] bg-[#0a0a0a]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">JOIN THE TEAM</h2> |
| <div class="bg-[#1e1e1e] rounded-lg p-8 max-w-3xl mx-auto text-center"> |
| <p class="text-xl mb-4">All levels welcome - from beginners to competitive swimmers</p> |
| <p class="mb-6">First practice: <span class="text-secondary">September 8, 2025</span></p> |
| <p class="mb-4">Equipment needed:</p> |
| <ul class="mb-6 text-left max-w-xs mx-auto"> |
| <li class="flex items-center mb-2"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Swimsuit</span> |
| </li> |
| <li class="flex items-center mb-2"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Goggles</span> |
| </li> |
| <li class="flex items-center mb-2"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Swim cap (optional)</span> |
| </li> |
| <li class="flex items-center mb-2"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Water bottle</span> |
| </li> |
| </ul> |
| <a href="get-involved.html#tryouts" class="inline-block bg-primary text-dark font-bold py-3 px-8 rounded hover:bg-[#4ab3c6] transition">Register Now</a> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">SAFETY FIRST</h2> |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> |
| <div class="bg-[#1e1e1e] rounded-lg overflow-hidden"> |
| <div class="md:flex"> |
| <img src="http://static.photos/people/200x200/89" alt="Buntheng Chhou" class="w-full md:w-32 h-32 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold">Buntheng Chhou</h3> |
| <p class="text-secondary mb-2">Head Lifeguard</p> |
| <p>Certified lifeguard with 8 years experience. Specializes in emergency response.</p> |
| </div> |
| </div> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg overflow-hidden"> |
| <div class="md:flex"> |
| <img src="http://static.photos/people/200x200/90" alt="Narong Snguon" class="w-full md:w-32 h-32 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold">Narong Snguon</h3> |
| <p class="text-secondary mb-2">Assistant Lifeguard</p> |
| <p>Certified lifeguard with focus on prevention and safety protocols.</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="mt-8 bg-[#1e1e1e] rounded-lg p-6 max-w-3xl mx-auto"> |
| <h3 class="text-xl font-bold mb-4 text-center">Safety Protocols</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>All sessions supervised by certified lifeguards</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Emergency action plans in place</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Regular safety equipment inspections</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Swimmer safety education program</span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <footer class="bg-darker py-12 border-t border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
| <div> |
| <h3 class="text-xl font-bold mb-4">Contact Info</h3> |
| <p>Northbridge International School Cambodia</p> |
| <p>#98C, Street 169, Phnom Penh</p> |
| <p>Email: info@nagas.edu.kh</p> |
| <p>Phone: +855 12 345 678</p> |
| </div> |
| <div> |
| <h3 class="text-xl font-bold mb-4">Follow Us</h3> |
| <div class="flex space-x-4"> |
| <a href="#" class="text-primary hover:text-secondary"> |
| <i data-feather="facebook"></i> |
| </a> |
| <a href="#" class="text-primary hover:text-secondary"> |
| <i data-feather="instagram"></i> |
| </a> |
| </div> |
| <p class="mt-2">@NAGAS_NISC</p> |
| </div> |
| <div> |
| <h3 class="text-xl font-bold mb-4">Quick Links</h3> |
| <ul class="space-y-2"> |
| <li><a href="teams.html" class="hover:text-primary">Teams</a></li> |
| <li><a href="schedule.html" class="hover:text-primary">Schedule</a></li> |
| <li><a href="news.html" class="hover:text-primary">News</a></li> |
| <li><a href="#" class="hover:text-primary">Athlete Portal</a></li> |
| </ul> |
| </div> |
| </div> |
| <div class="border-t border-[#2e2e2e] mt-8 pt-8 text-center"> |
| <p>© 2023 NAGAS - Northbridge Athletic Groups and Sports. All rights reserved.</p> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| feather.replace(); |
| |
| |
| document.getElementById('strokeFilter').addEventListener('change', function() { |
| const selectedStroke = this.value; |
| const swimmers = document.querySelectorAll('.swimmer-card'); |
| |
| swimmers.forEach(swimmer => { |
| if (selectedStroke === 'all') { |
| swimmer.style.display = 'block'; |
| } else { |
| const swimmerStrokes = swimmer.getAttribute('data-stroke'); |
| if (swimmerStrokes.includes(selectedStroke)) { |
| swimmer.style.display = 'block'; |
| } else { |
| swimmer.style.display = 'none'; |
| } |
| } |
| }); |
| }); |
| |
| |
| document.getElementById('menu-toggle').addEventListener('click', function() { |
| document.getElementById('mobile-menu').classList.remove('hidden'); |
| }); |
| |
| document.getElementById('menu-close').addEventListener('click', function() { |
| document.getElementById('mobile-menu').classList.add('hidden'); |
| }); |
| </script> |
| </body> |
| </html> |
|
|
