| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Get Involved - 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; |
| } |
| .option-card:hover, .sport-card:hover, .role-card:hover { |
| transform: translateY(-5px); |
| transition: all 0.3s ease; |
| } |
| .faq-item { |
| border-bottom: 1px solid #2e2e2e; |
| } |
| .faq-question { |
| cursor: pointer; |
| padding: 1rem 0; |
| } |
| .faq-answer { |
| display: none; |
| padding-bottom: 1rem; |
| } |
| .active .faq-answer { |
| display: block; |
| } |
| .accordion-icon { |
| transition: transform 0.3s ease; |
| } |
| .active .accordion-icon { |
| transform: rotate(180deg); |
| } |
| .form-input { |
| background-color: #1e1e1e; |
| border: 1px solid #5ec0cc; |
| } |
| .form-input:focus { |
| outline: none; |
| border-color: #5ECCA2; |
| } |
| .btn-primary { |
| background-color: #5ec0cc; |
| color: #0a0a0a; |
| } |
| .btn-primary:hover { |
| background-color: #4ab3c6; |
| } |
| .btn-secondary { |
| border: 2px solid #5ECCA2; |
| color: #5ECCA2; |
| } |
| .btn-secondary:hover { |
| background-color: #5ECCA2; |
| color: #0a0a0a; |
| } |
| </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="text-primary font-bold">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> |
| |
| <section class="relative h-96 flex items-center justify-center overflow-hidden"> |
| <div class="grid grid-cols-2 md:grid-cols-4 w-full h-full"> |
| <div class="relative"> |
| <img src="http://static.photos/sport/640x360/1" alt="Basketball Action" class="w-full h-full object-cover"> |
| </div> |
| <div class="relative"> |
| <img src="http://static.photos/sport/640x360/2" alt="Volleyball Match" class="w-full h-full object-cover"> |
| </div> |
| <div class="relative"> |
| <img src="http://static.photos/sport/640x360/3" alt="Swimming Meet" class="w-full h-full object-cover"> |
| </div> |
| <div class="relative"> |
| <img src="http://static.photos/sport/640x360/4" alt="Track & Field" class="w-full h-full object-cover"> |
| </div> |
| </div> |
| <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-4">JOIN THE NAGAS FAMILY</h1> |
| <p class="text-xl mb-8">Athlete, Volunteer, or Fan - There's a Place for You!</p> |
| <div class="flex flex-col sm:flex-row justify-center gap-4"> |
| <a href="#tryouts" class="btn-primary font-bold py-3 px-6 rounded hover:bg-[#4ab3c6] transition">Try Out for a Team</a> |
| <a href="#volunteer" class="btn-secondary font-bold py-3 px-6 rounded hover:bg-[#5ECCA2] transition">Become a Volunteer</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-12 text-center">HOW YOU CAN PARTICIPATE</h2> |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> |
| |
| <div class="option-card bg-[#1e1e1e] rounded-lg p-6 flex flex-col h-full"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="users" class="text-primary mr-3" style="width: 32px; height: 32px;"></i> |
| <h3 class="text-xl font-bold">JOIN A TEAM</h3> |
| </div> |
| <p class="mb-6 flex-grow">Try out for one of our competitive teams</p> |
| <a href="#tryouts" class="btn-primary font-bold py-2 px-4 rounded text-center">View Tryout Info</a> |
| </div> |
| |
| |
| <div class="option-card bg-[#1e1e1e] rounded-lg p-6 flex flex-col h-full"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="heart" class="text-primary mr-3" style="width: 32px; height: 32px;"></i> |
| <h3 class="text-xl font-bold">VOLUNTEER</h3> |
| </div> |
| <p class="mb-6 flex-grow">Help with events, coaching, or operations</p> |
| <a href="#volunteer" class="btn-primary font-bold py-2 px-4 rounded text-center">Volunteer Opportunities</a> |
| </div> |
| |
| |
| <div class="option-card bg-[#1e1e1e] rounded-lg p-6 flex flex-col h-full"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="megaphone" class="text-primary mr-3" style="width: 32px; height: 32px;"></i> |
| <h3 class="text-xl font-bold">CHEER US ON</h3> |
| </div> |
| <p class="mb-6 flex-grow">Attend games and show your spirit</p> |
| <a href="schedule.html" class="btn-primary font-bold py-2 px-4 rounded text-center">Game Schedule</a> |
| </div> |
| |
| |
| <div class="option-card bg-[#1e1e1e] rounded-lg p-6 flex flex-col h-full"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="gift" class="text-primary mr-3" style="width: 32px; height: 32px;"></i> |
| <h3 class="text-xl font-bold">SUPPORT NAGAS</h3> |
| </div> |
| <p class="mb-6 flex-grow">Contribute to our programs</p> |
| <a href="#donate" class="btn-primary font-bold py-2 px-4 rounded text-center">Make a Donation</a> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="tryouts" 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">TRY OUT FOR A TEAM</h2> |
| <p class="mb-8 max-w-3xl">All NISC students in grades 6-12 are eligible to try out for our teams. No experience necessary for most sports - we develop athletes!</p> |
| |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mb-12"> |
| |
| <div class="sport-card bg-[#1e1e1e] rounded-lg p-6"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="basketball" class="text-primary mr-3" style="width: 24px; height: 24px;"></i> |
| <h3 class="text-xl font-bold">Basketball</h3> |
| </div> |
| <p class="mb-2"><span class="font-bold">Tryout Dates:</span> Nov 4-6, 2025</p> |
| <p class="mb-2"><span class="font-bold">Location:</span> Sports Hall</p> |
| <p class="mb-2"><span class="font-bold">Requirements:</span> Bring athletic clothing and water bottle</p> |
| <p class="mb-4"><span class="font-bold">Contact:</span> Coach Sarith Meng - basketball@nisc.edu.kh</p> |
| </div> |
| |
| |
| <div class="sport-card bg-[#1e1e1e] rounded-lg p-6"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="volleyball" class="text-primary mr-3" style="width: 24px; height: 24px;"></i> |
| <h3 class="text-xl font-bold">Volleyball</h3> |
| </div> |
| <p class="mb-2"><span class="font-bold">Tryout Dates:</span> Nov 11-13, 2025</p> |
| <p class="mb-2"><span class="font-bold">Location:</span> Sports Hall</p> |
| <p class="mb-2"><span class="font-bold">Requirements:</span> Knee pads recommended</p> |
| <p class="mb-4"><span class="font-bold">Contact:</span> Coach Sok Vanna - volleyball@nisc.edu.kh</p> |
| </div> |
| |
| |
| <div class="sport-card bg-[#1e1e1e] rounded-lg p-6"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="circle" class="text-primary mr-3" style="width: 24px; height: 24px;"></i> |
| <h3 class="text-xl font-bold">Football</h3> |
| </div> |
| <p class="mb-2"><span class="font-bold">Tryout Dates:</span> Nov 18-20, 2025</p> |
| <p class="mb-2"><span class="font-bold">Location:</span> NISC Field</p> |
| <p class="mb-2"><span class="font-bold">Requirements:</span> Cleats and mouthguard required</p> |
| <p class="mb-4"><span class="font-bold">Contact:</span> Coach Sok Visal - football@nisc.edu.kh</p> |
| </div> |
| |
| |
| <div class="sport-card bg-[#1e1e1e] rounded-lg p-6"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="activity" class="text-primary mr-3" style="width: 24px; height: 24px;"></i> |
| <h3 class="text-xl font-bold">Track & Field</h3> |
| </div> |
| <p class="mb-2"><span class="font-bold">Tryout Dates:</span> Dec 1-3, 2025</p> |
| <p class="mb-2"><span class="font-bold">Location:</span> NISC Track</p> |
| <p class="mb-2"><span class="font-bold">Requirements:</span> Running shoes required</p> |
| <p class="mb-4"><span class="font-bold">Contact:</span> Coach Sokha Mey - track@nisc.edu.kh</p> |
| </div> |
| |
| |
| <div class="sport-card bg-[#1e1e1e] rounded-lg p-6"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="droplet" class="text-primary mr-3" style="width: 24px; height: 24px;"></i> |
| <h3 class="text-xl font-bold">Swimming</h3> |
| </div> |
| <p class="mb-2"><span class="font-bold">Tryout Dates:</span> Ongoing evaluations</p> |
| <p class="mb-2"><span class="font-bold">Location:</span> Aquatics Centre</p> |
| <p class="mb-2"><span class="font-bold">Requirements:</span> Swim cap and goggles</p> |
| <p class="mb-4"><span class="font-bold">Contact:</span> Michelle Dean - swim@nisc.edu.kh</p> |
| </div> |
| |
| |
| <div class="sport-card bg-[#1e1e1e] rounded-lg p-6 opacity-70"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="golf" class="text-primary mr-3" style="width: 24px; height: 24px;"></i> |
| <h3 class="text-xl font-bold">Golf & Badminton</h3> |
| <span class="ml-auto bg-secondary text-dark text-xs py-1 px-2 rounded">Coming 2026</span> |
| </div> |
| <p>New programs launching in 2026. Check back for tryout information!</p> |
| </div> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6 max-w-3xl mx-auto"> |
| <h3 class="text-xl font-bold mb-4 text-center">TRYOUT PREPARATION TIPS</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Get adequate rest before tryouts</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Stay hydrated throughout the day</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Arrive 15 minutes early to warm up</span> |
| </li> |
| <li class="flex items-center"> |
| <i data-feather="check-circle" class="text-secondary mr-2"></i> |
| <span>Bring all required equipment</span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="volunteer" class="py-16 border-b border-[#2e2e2e]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">VOLUNTEER WITH US</h2> |
| <p class="mb-8 max-w-3xl">We rely on volunteers to make our programs successful!</p> |
| |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-8"> |
| |
| <div class="role-card bg-[#1e1e1e] rounded-lg p-6"> |
| <h3 class="text-xl font-bold mb-4">Game Day Help</h3> |
| <p class="mb-2"><span class="font-bold">Tasks:</span> Scorekeeping, concessions, setup/cleanup</p> |
| <p><span class="font-bold">Time Commitment:</span> 2-4 hours per event</p> |
| </div> |
| |
| |
| <div class="role-card bg-[#1e1e1e] rounded-lg p-6"> |
| <h3 class="text-xl font-bold mb-4">Coaching Assistant</h3> |
| <p class="mb-2"><span class="font-bold">Tasks:</span> Help with practices, skill development</p> |
| <p><span class="font-bold">Requirements:</span> Some sport experience preferred</p> |
| </div> |
| |
| |
| <div class="role-card bg-[#1e1e1e] rounded-lg p-6"> |
| <h3 class="text-xl font-bold mb-4">Event Organizer</h3> |
| <p class="mb-2"><span class="font-bold">Tasks:</span> Plan tournaments and special events</p> |
| <p><span class="font-bold">Skills Needed:</span> Organization and creativity</p> |
| </div> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6 max-w-3xl mx-auto mb-8"> |
| <p class="text-center mb-4">All volunteers receive training and NAGAS gear!</p> |
| <p class="text-center"><span class="font-bold">Contact:</span> Volunteer Coordinator - volunteer@nisc.edu.kh</p> |
| </div> |
| |
| <div class="text-center"> |
| <button class="btn-primary font-bold py-3 px-8 rounded">Sign Up to Volunteer</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">FOR PARENTS</h2> |
| |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-8"> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6"> |
| <h3 class="text-xl font-bold mb-4">Transportation</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Team buses provided for away games</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Carpool coordination available</span> |
| </li> |
| </ul> |
| </div> |
| |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6"> |
| <h3 class="text-xl font-bold mb-4">Communication</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Weekly emails from coaches</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Team Group chats for updates</span> |
| </li> |
| </ul> |
| </div> |
| |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6"> |
| <h3 class="text-xl font-bold mb-4">Requirements</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Sports physical required</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check-circle" class="text-secondary mr-2 mt-1"></i> |
| <span>Academic eligibility maintained</span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| |
| <div class="text-center"> |
| <button class="btn-primary font-bold py-3 px-8 rounded">Download Parent Handbook</button> |
| </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">SHOW YOUR SPIRIT</h2> |
| <p class="mb-8 max-w-3xl">Join our student spirit squad!</p> |
| |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-8"> |
| <div class="bg-[#1e1e1e] rounded-lg p-6 text-center"> |
| <i data-feather="ticket" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">Free Admission</h3> |
| <p>Free admission to all home games</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6 text-center"> |
| <i data-feather="t-shirt" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">Spirit Gear</h3> |
| <p>Exclusive spirit gear for members</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6 text-center"> |
| <i data-feather="users" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">Leadership</h3> |
| <p>Leadership opportunities in athletics</p> |
| </div> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-8 max-w-3xl mx-auto"> |
| <h3 class="text-xl font-bold mb-6 text-center">Spirit Squad Signup</h3> |
| <form> |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6"> |
| <div> |
| <label class="block mb-2">Name</label> |
| <input type="text" class="form-input w-full py-2 px-3 rounded"> |
| </div> |
| <div> |
| <label class="block mb-2">Grade</label> |
| <select class="form-input w-full py-2 px-3 rounded"> |
| <option>Grade 6</option> |
| <option>Grade 7</option> |
| <option>Grade 8</option> |
| <option>Grade 9</option> |
| <option>Grade 10</option> |
| <option>Grade 11</option> |
| <option>Grade 12</option> |
| </select> |
| </div> |
| <div> |
| <label class="block mb-2">Email</label> |
| <input type="email" class="form-input w-full py-2 px-3 rounded"> |
| </div> |
| <div> |
| <label class="block mb-2">Sport Interest</label> |
| <select class="form-input w-full py-2 px-3 rounded"> |
| <option>All Sports</option> |
| <option>Basketball</option> |
| <option>Volleyball</option> |
| <option>Football</option> |
| <option>Track & Field</option> |
| <option>Swimming</option> |
| </select> |
| </div> |
| </div> |
| <div class="text-center"> |
| <button type="submit" class="btn-primary font-bold py-3 px-8 rounded">Join Spirit Squad</button> |
| </div> |
| </form> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="donate" 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">SUPPORT NAGAS ATHLETICS</h2> |
| <p class="mb-8 max-w-3xl">Your contributions help us provide:</p> |
| |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-8"> |
| <div class="bg-[#1e1e1e] rounded-lg p-6 text-center"> |
| <i data-feather="package" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">Equipment & Uniforms</h3> |
| <p>Quality gear for all athletes</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6 text-center"> |
| <i data-feather="home" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">Facility Improvements</h3> |
| <p>State-of-the-art training environments</p> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-6 text-center"> |
| <i data-feather="award" class="text-primary mx-auto mb-4" style="width: 48px; height: 48px;"></i> |
| <h3 class="text-xl font-bold mb-2">Scholarships</h3> |
| <p>Support for deserving athletes</p> |
| </div> |
| </div> |
| |
| <div class="bg-[#1e1e1e] rounded-lg p-8 max-w-3xl mx-auto mb-8"> |
| <h3 class="text-xl font-bold mb-6 text-center">Donation Options</h3> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> |
| <button class="bg-[#2e2e2e] py-3 px-4 rounded text-center hover:bg-[#3e3e3e] transition">One-time Gift</button> |
| <button class="bg-[#2e2e2e] py-3 px-4 rounded text-center hover:bg-[#3e3e3e] transition">Monthly Supporter</button> |
| <button class="bg-[#2e2e2e] py-3 px-4 rounded text-center hover:bg-[#3e3e3e] transition">Equipment Sponsor</button> |
| </div> |
| <div class="text-center"> |
| <button class="btn-primary font-bold py-3 px-8 rounded">Donate Now</button> |
| </div> |
| </div> |
| |
| <div class="text-center"> |
| <p>Questions about donations? Contact us at <a href="mailto:development@nisc.edu.kh" class="text-primary hover:underline">development@nisc.edu.kh</a></p> |
| </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">FREQUENTLY ASKED QUESTIONS</h2> |
| |
| <div class="max-w-3xl mx-auto"> |
| |
| <div class="faq-item"> |
| <div class="faq-question flex justify-between items-center"> |
| <h3 class="font-bold">Do I need experience to join a team?</h3> |
| <i data-feather="chevron-down" class="accordion-icon text-primary"></i> |
| </div> |
| <div class="faq-answer"> |
| <p>No! We welcome all skill levels and provide training for beginners. Our programs are designed to develop athletes from all backgrounds.</p> |
| </div> |
| </div> |
| |
| |
| <div class="faq-item"> |
| <div class="faq-question flex justify-between items-center"> |
| <h3 class="font-bold">What's the time commitment?</h3> |
| <i data-feather="chevron-down" class="accordion-icon text-primary"></i> |
| </div> |
| <div class="faq-answer"> |
| <p>Varies by sport, typically 2-3 practices and 1 game per week. During tournament season, additional time may be required. Specific schedules are provided by each coach.</p> |
| </div> |
| </div> |
| |
| |
| <div class="faq-item"> |
| <div class="faq-question flex justify-between items-center"> |
| <h3 class="font-bold">Are there academic requirements?</h3> |
| <i data-feather="chevron-down" class="accordion-icon text-primary"></i> |
| </div> |
| <div class="faq-answer"> |
| <p>Yes, athletes must maintain good academic standing to participate. We believe in developing well-rounded student-athletes who excel both in the classroom and on the field.</p> |
| </div> |
| </div> |
| |
| |
| <div class="faq-item"> |
| <div class="faq-question flex justify-between items-center"> |
| <h3 class="font-bold">What equipment do I need?</h3> |
| <i data-feather="chevron-down" class="accordion-icon text-primary"></i> |
| </div> |
| <div class="faq-answer"> |
| <p>Most equipment is provided by NAGAS. Personal items vary by sport and will be listed in tryout information. Generally, athletic clothing and appropriate footwear are required.</p> |
| </div> |
| </div> |
| |
| |
| <div class="faq-item"> |
| <div class="faq-question flex justify-between items-center"> |
| <h3 class="font-bold">Can I play multiple sports?</h3> |
| <i data-feather="chevron-down" class="accordion-icon text-primary"></i> |
| </div> |
| <div class="faq-answer"> |
| <p>Yes! Many athletes participate in multiple sports throughout the year. We encourage multi-sport participation as it develops well-rounded athletes and reduces injury risk.</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-[#0a0a0a]"> |
| <div class="container mx-auto px-4"> |
| <h2 class="text-3xl font-bold text-primary mb-8">QUESTIONS?</h2> |
| <p class="mb-8 max-w-3xl">We're here to help!</p> |
| |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-12"> |
| <div> |
| <div class="bg-[#1e1e1e] rounded-lg p-8"> |
| <h3 class="text-xl font-bold mb-6">Send us a Message</h3> |
| <form> |
| <div class="mb-4"> |
| <label class="block mb-2">Name</label> |
| <input type="text" class="form-input w-full py-2 px-3 rounded"> |
| </div> |
| <div class="mb-4"> |
| <label class="block mb-2">Email</label> |
| <input type="email" class="form-input w-full py-2 px-3 rounded"> |
| </div> |
| <div class="mb-4"> |
| <label class="block mb-2">Sport Interest</label> |
| <select class="form-input w-full py-2 px-3 rounded"> |
| <option>Select a sport</option> |
| <option>Basketball</option> |
| <option>Volleyball</option> |
| <option>Football</option> |
| <option>Track & Field</option> |
| <option>Swimming</option> |
| <option>Other</option> |
| </select> |
| </div> |
| <div class="mb-6"> |
| <label class="block mb-2">Message</label> |
| <textarea class="form-input w-full py-2 px-3 rounded" rows="4"></textarea> |
| </div> |
| <button type="submit" class="btn-primary font-bold py-3 px-8 rounded w-full">Send Message</button> |
| </form> |
| </div> |
| </div> |
| |
| <div> |
| <div class="bg-[#1e1e1e] rounded-lg p-8 h-full"> |
| <h3 class="text-xl font-bold mb-6">Alternative Contact Methods</h3> |
| <div class="space-y-6"> |
| <div> |
| <h4 class="font-bold mb-2">General Inquiries</h4> |
| <p><a href="mailto:athletics@nisc.edu.kh" class="text-primary hover:underline">athletics@nisc.edu.kh</a></p> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Tryouts</h4> |
| <p><a href="mailto:tryouts@nisc.edu.kh" class="text-primary hover:underline">tryouts@nisc.edu.kh</a></p> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Volunteering</h4> |
| <p><a href="mailto:volunteer@nisc.edu.kh" class="text-primary hover:underline">volunteer@nisc.edu.kh</a></p> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Donations</h4> |
| <p><a href="mailto:development@nisc.edu.kh" class="text-primary hover:underline">development@nisc.edu.kh</a></p> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Phone</h4> |
| <p>+855 12 345 678</p> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Office Hours</h4> |
| <p>Monday-Friday: 8:00 AM - 4:00 PM</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </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.querySelectorAll('.faq-question').forEach(question => { |
| question.addEventListener('click', () => { |
| const item = question.parentElement; |
| item.classList.toggle('active'); |
| }); |
| }); |
| |
| |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
| anchor.addEventListener('click', function(e) { |
| e.preventDefault(); |
| const target = document.querySelector(this.getAttribute('href')); |
| if (target) { |
| window.scrollTo({ |
| top: target.offsetTop - 80, |
| behavior: 'smooth' |
| }); |
| } |
| }); |
| }); |
| |
| |
| const forms = document.querySelectorAll('form'); |
| forms.forEach(form => { |
| form.addEventListener('submit', function(e) { |
| e.preventDefault(); |
| let isValid = true; |
| |
| |
| const requiredFields = form.querySelectorAll('input[required], select[required], textarea[required]'); |
| requiredFields.forEach(field => { |
| if (!field.value.trim()) { |
| isValid = false; |
| field.classList.add('border-red-500'); |
| } else { |
| field.classList.remove('border-red-500'); |
| } |
| }); |
| |
| |
| const emailFields = form.querySelectorAll('input[type="email"]'); |
| const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; |
| emailFields.forEach(email => { |
| if (email.value && !emailRegex.test(email.value)) { |
| isValid = false; |
| email.classList.add('border-red-500'); |
| } else { |
| email.classList.remove('border-red-500'); |
| } |
| }); |
| |
| if (isValid) { |
| |
| alert('Form submitted successfully!'); |
| form.reset(); |
| } else { |
| alert('Please fill in all required fields correctly.'); |
| } |
| }); |
| }); |
| </script> |
| </body> |
| </html> |
