| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Global Essay Competition</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> |
| <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| <style> |
| .hero-gradient { |
| background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 50%, #9333ea 100%); |
| } |
| .card-hover:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); |
| } |
| .transition-all { |
| transition: all 0.3s ease; |
| } |
| </style> |
| </head> |
| <body class="font-sans bg-gray-50"> |
| |
| <nav class="bg-white shadow-sm"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="flex justify-between h-16"> |
| <div class="flex items-center"> |
| <div class="flex-shrink-0 flex items-center"> |
| <i data-feather="edit-3" class="h-8 w-8 text-indigo-600"></i> |
| <span class="ml-2 text-xl font-bold text-gray-900">Global Essay</span> |
| </div> |
| </div> |
| <div class="hidden md:ml-6 md:flex md:items-center md:space-x-8"> |
| <a href="#" class="text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 border-indigo-500 text-sm font-medium">Home</a> |
| <a href="submit.html" class="text-gray-500 hover:text-gray-700 inline-flex items-center px-1 pt-1 text-sm font-medium">Submit Essay</a> |
| <a href="judges.html" class="text-gray-500 hover:text-gray-700 inline-flex items-center px-1 pt-1 text-sm font-medium">Judges Portal</a> |
| <a href="results.html" class="text-gray-500 hover:text-gray-700 inline-flex items-center px-1 pt-1 text-sm font-medium">Results</a> |
| </div> |
| <div class="-mr-2 flex items-center md:hidden"> |
| <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" aria-controls="mobile-menu" aria-expanded="false"> |
| <i data-feather="menu"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| </nav> |
|
|
| |
| <div class="hero-gradient text-white"> |
| <div class="max-w-7xl mx-auto py-16 px-4 sm:py-24 sm:px-6 lg:px-8"> |
| <div class="text-center" data-aos="fade-up"> |
| <h1 class="text-4xl font-extrabold tracking-tight sm:text-5xl lg:text-6xl"> |
| Global Essay Competition 2023 |
| </h1> |
| <p class="mt-6 max-w-lg mx-auto text-xl"> |
| Showcase your writing talent and compete with the best minds worldwide |
| </p> |
| <div class="mt-10 flex justify-center space-x-6"> |
| <a href="submit.html" class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-indigo-600 bg-white hover:bg-gray-50"> |
| Submit Your Essay |
| </a> |
| <a href="judges.html" class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-indigo-600 bg-opacity-60 hover:bg-opacity-70"> |
| Judges Portal |
| </a> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="py-12 bg-white"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="lg:text-center"> |
| <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Competition</h2> |
| <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl"> |
| Why Participate? |
| </p> |
| </div> |
|
|
| <div class="mt-10"> |
| <div class="grid grid-cols-1 gap-10 sm:grid-cols-2 lg:grid-cols-3"> |
| <div class="bg-gray-50 rounded-lg p-6 transition-all card-hover" data-aos="fade-up" data-aos-delay="100"> |
| <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white"> |
| <i data-feather="award"></i> |
| </div> |
| <div class="mt-5"> |
| <h3 class="text-lg font-medium text-gray-900">Prestigious Awards</h3> |
| <p class="mt-2 text-base text-gray-500"> |
| Win cash prizes, certificates, and publication opportunities in our annual anthology. |
| </p> |
| </div> |
| </div> |
|
|
| <div class="bg-gray-50 rounded-lg p-6 transition-all card-hover" data-aos="fade-up" data-aos-delay="200"> |
| <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white"> |
| <i data-feather="users"></i> |
| </div> |
| <div class="mt-5"> |
| <h3 class="text-lg font-medium text-gray-900">Expert Judges</h3> |
| <p class="mt-2 text-base text-gray-500"> |
| Your work will be evaluated by renowned authors, professors, and industry professionals. |
| </p> |
| </div> |
| </div> |
|
|
| <div class="bg-gray-50 rounded-lg p-6 transition-all card-hover" data-aos="fade-up" data-aos-delay="300"> |
| <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white"> |
| <i data-feather="globe"></i> |
| </div> |
| <div class="mt-5"> |
| <h3 class="text-lg font-medium text-gray-900">Global Recognition</h3> |
| <p class="mt-2 text-base text-gray-500"> |
| Gain international exposure and connect with writers from around the world. |
| </p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="py-12 bg-gray-50"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="lg:text-center"> |
| <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Schedule</h2> |
| <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl"> |
| Competition Timeline |
| </p> |
| </div> |
|
|
| <div class="mt-10"> |
| <div class="relative"> |
| <div class="absolute left-1/2 -ml-px h-full w-0.5 bg-indigo-200" aria-hidden="true"></div> |
| |
| <div class="relative mb-8 flex items-center" data-aos="fade-right"> |
| <div class="flex-shrink-0"> |
| <span class="flex items-center justify-center h-8 w-8 rounded-full bg-indigo-500 text-white border-2 border-indigo-600"> |
| 1 |
| </span> |
| </div> |
| <div class="ml-4 flex-1 pt-1"> |
| <div class="flex items-center justify-between"> |
| <h3 class="text-lg font-medium text-gray-900">Submission Period</h3> |
| <span class="text-sm text-gray-500">June 1 - August 31</span> |
| </div> |
| <p class="mt-1 text-base text-gray-500"> |
| Submit your original essays through our online portal. |
| </p> |
| </div> |
| </div> |
|
|
| <div class="relative mb-8 flex items-center" data-aos="fade-left"> |
| <div class="flex-shrink-0"> |
| <span class="flex items-center justify-center h-8 w-8 rounded-full bg-indigo-500 text-white border-2 border-indigo-600"> |
| 2 |
| </span> |
| </div> |
| <div class="ml-4 flex-1 pt-1"> |
| <div class="flex items-center justify-between"> |
| <h3 class="text-lg font-medium text-gray-900">Judging Period</h3> |
| <span class="text-sm text-gray-500">September 1 - October 15</span> |
| </div> |
| <p class="mt-1 text-base text-gray-500"> |
| Our panel of judges will evaluate all submissions. |
| </p> |
| </div> |
| </div> |
|
|
| <div class="relative mb-8 flex items-center" data-aos="fade-right"> |
| <div class="flex-shrink-0"> |
| <span class="flex items-center justify-center h-8 w-8 rounded-full bg-indigo-500 text-white border-2 border-indigo-600"> |
| 3 |
| </span> |
| </div> |
| <div class="ml-4 flex-1 pt-1"> |
| <div class="flex items-center justify-between"> |
| <h3 class="text-lg font-medium text-gray-900">Results Announcement</h3> |
| <span class="text-sm text-gray-500">November 1</span> |
| </div> |
| <p class="mt-1 text-base text-gray-500"> |
| Winners will be notified and results published on our website. |
| </p> |
| </div> |
| </div> |
|
|
| <div class="relative flex items-center" data-aos="fade-left"> |
| <div class="flex-shrink-0"> |
| <span class="flex items-center justify-center h-8 w-8 rounded-full bg-indigo-500 text-white border-2 border-indigo-600"> |
| 4 |
| </span> |
| </div> |
| <div class="ml-4 flex-1 pt-1"> |
| <div class="flex items-center justify-between"> |
| <h3 class="text-lg font-medium text-gray-900">Awards Ceremony</h3> |
| <span class="text-sm text-gray-500">December 10</span> |
| </div> |
| <p class="mt-1 text-base text-gray-500"> |
| Virtual awards ceremony with special guests and winners' readings. |
| </p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <footer class="bg-gray-800"> |
| <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8"> |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-8"> |
| <div> |
| <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Competition</h3> |
| <ul class="mt-4 space-y-4"> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">About</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Rules</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">FAQ</a></li> |
| </ul> |
| </div> |
| <div> |
| <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Participants</h3> |
| <ul class="mt-4 space-y-4"> |
| <li><a href="submit.html" class="text-base text-gray-300 hover:text-white">Submit Essay</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Guidelines</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Past Winners</a></li> |
| </ul> |
| </div> |
| <div> |
| <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Judges</h3> |
| <ul class="mt-4 space-y-4"> |
| <li><a href="judges.html" class="text-base text-gray-300 hover:text-white">Judges Portal</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Judging Criteria</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Become a Judge</a></li> |
| </ul> |
| </div> |
| <div> |
| <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Connect</h3> |
| <ul class="mt-4 space-y-4"> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Contact Us</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Twitter</a></li> |
| <li><a href="#" class="text-base text-gray-300 hover:text-white">Instagram</a></li> |
| </ul> |
| </div> |
| </div> |
| <div class="mt-8 border-t border-gray-700 pt-8 md:flex md:items-center md:justify-between"> |
| <div class="flex space-x-6 md:order-2"> |
| <a href="#" class="text-gray-400 hover:text-gray-300"> |
| <i data-feather="twitter"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-gray-300"> |
| <i data-feather="instagram"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-gray-300"> |
| <i data-feather="facebook"></i> |
| </a> |
| </div> |
| <p class="mt-8 text-base text-gray-400 md:mt-0 md:order-1"> |
| © 2023 Global Essay Competition. All rights reserved. |
| </p> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| AOS.init(); |
| feather.replace(); |
| </script> |
| </body> |
| </html> |
|
|
