| | <!DOCTYPE html> |
| | <html lang="en"> |
| | <head> |
| | <meta charset="UTF-8"> |
| | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| | <title>Club Menu | Groovy Beats & Smooth Seats</title> |
| | <link rel="icon" type="image/x-icon" href="/static/favicon.ico"> |
| | <script src="https://cdn.tailwindcss.com"></script> |
| | <script src="https://unpkg.com/feather-icons"></script> |
| | <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| | <style> |
| | .menu-category { |
| | scroll-margin-top: 120px; |
| | } |
| | .menu-item:hover .menu-item-content { |
| | transform: translateY(-5px); |
| | box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.4); |
| | } |
| | .menu-item-content { |
| | transition: all 0.3s ease; |
| | } |
| | </style> |
| | </head> |
| | <body class="bg-gray-900 text-gray-100 font-sans"> |
| | |
| | <nav class="bg-black bg-opacity-70 backdrop-filter backdrop-blur-sm sticky top-0 z-50"> |
| | <div class="container mx-auto px-6 py-4"> |
| | <div class="flex items-center justify-between"> |
| | <div class="flex items-center space-x-4"> |
| | <i data-feather="music" class="text-amber-500"></i> |
| | <span class="text-xl font-bold bg-gradient-to-r from-amber-400 to-amber-600 bg-clip-text text-transparent">Groovy Beats</span> |
| | </div> |
| | <div class="hidden md:flex items-center space-x-8"> |
| | <a href="index.html" class="text-gray-300 hover:text-amber-400 transition">Home</a> |
| | <a href="performances.html" class="text-gray-300 hover:text-amber-400 transition">Performances</a> |
| | <a href="history.html" class="text-gray-300 hover:text-amber-400 transition">History</a> |
| | <a href="menu.html" class="text-amber-400 font-medium hover:text-amber-300 transition">Menu</a> |
| | <a href="reservation.html" class="bg-amber-600 hover:bg-amber-700 text-white px-4 py-2 rounded-full transition">Reserve Table</a> |
| | </div> |
| | <button class="md:hidden text-gray-300 focus:outline-none"> |
| | <i data-feather="menu"></i> |
| | </button> |
| | </div> |
| | </div> |
| | </nav> |
| |
|
| | |
| | <main class="relative z-10 py-12"> |
| | <div class="container mx-auto px-6"> |
| | <div class="mb-12 text-center"> |
| | <h1 class="text-4xl md:text-5xl font-bold mb-4"> |
| | <span class="bg-gradient-to-r from-amber-400 to-amber-600 bg-clip-text text-transparent">Club</span> Menu |
| | </h1> |
| | <p class="text-gray-400 max-w-2xl mx-auto"> |
| | Our carefully crafted menu features gourmet small plates and innovative cocktails designed to complement your jazz experience. |
| | </p> |
| | </div> |
| |
|
| | |
| | <div class="sticky top-20 z-10 bg-gray-900 bg-opacity-90 py-4 mb-8"> |
| | <div class="flex overflow-x-auto space-x-4 pb-2 scrollbar-hide"> |
| | <a href="#cocktails" class="whitespace-nowrap px-4 py-2 bg-amber-600 text-white rounded-full">Cocktails</a> |
| | <a href="#wines" class="whitespace-nowrap px-4 py-2 bg-gray-800 hover:bg-gray-700 rounded-full transition">Wines</a> |
| | <a href="#beers" class="whitespace-nowrap px-4 py-2 bg-gray-800 hover:bg-gray-700 rounded-full transition">Beers</a> |
| | <a href="#small-plates" class="whitespace-nowrap px-4 py-2 bg-gray-800 hover:bg-gray-700 rounded-full transition">Small Plates</a> |
| | <a href="#desserts" class="whitespace-nowrap px-4 py-2 bg-gray-800 hover:bg-gray-700 rounded-full transition">Desserts</a> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="space-y-16"> |
| | |
| | <section id="cocktails" class="menu-category"> |
| | <div class="flex items-center justify-between mb-8"> |
| | <h2 class="text-3xl font-bold flex items-center"> |
| | <i data-feather="droplet" class="text-amber-500 mr-3"></i> |
| | Signature Cocktails |
| | </h2> |
| | <span class="text-gray-400">$14 - $18</span> |
| | </div> |
| |
|
| | <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6 h-full"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Midnight Sax</h3> |
| | <span class="text-amber-400 font-medium">$16</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Bourbon, blackberry liqueur, lemon juice, mint, and a splash of soda. Served in a chilled coupe. |
| | </p> |
| | <div class="text-xs text-gray-500 flex items-center"> |
| | <i data-feather="clock" class="w-4 h-4 mr-1"></i> |
| | Recommended with: Bebop performances |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6 h-full"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Blue Note</h3> |
| | <span class="text-amber-400 font-medium">$17</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Gin, crème de violette, elderflower liqueur, lime juice, and edible glitter for that stage sparkle. |
| | </p> |
| | <div class="text-xs text-gray-500 flex items-center"> |
| | <i data-feather="clock" class="w-4 h-4 mr-1"></i> |
| | Recommended with: Vocal jazz nights |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6 h-full"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Smooth Operator</h3> |
| | <span class="text-amber-400 font-medium">$18</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Mezcal, pineapple juice, ginger syrup, lime, and a dash of chili tincture. Smoked with oak chips. |
| | </p> |
| | <div class="text-xs text-gray-500 flex items-center"> |
| | <i data-feather="clock" class="w-4 h-4 mr-1"></i> |
| | Recommended with: Latin jazz nights |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6 h-full"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Jazz Hands</h3> |
| | <span class="text-amber-400 font-medium">$15</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Vodka, St. Germain, grapefruit juice, honey syrup, and a rosemary sprig for aroma. |
| | </p> |
| | <div class="text-xs text-gray-500 flex items-center"> |
| | <i data-feather="clock" class="w-4 h-4 mr-1"></i> |
| | Recommended with: Cool jazz sets |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6 h-full"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">The Standard</h3> |
| | <span class="text-amber-400 font-medium">$14</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Our perfect Manhattan: rye whiskey, sweet vermouth, bitters, and a luxardo cherry. |
| | </p> |
| | <div class="text-xs text-gray-500 flex items-center"> |
| | <i data-feather="clock" class="w-4 h-4 mr-1"></i> |
| | Recommended with: Classic jazz performances |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6 h-full"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">The Improviser</h3> |
| | <span class="text-amber-400 font-medium">$18</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Bartender's choice based on your preferences. Let our mixologists craft something special for you. |
| | </p> |
| | <div class="text-xs text-gray-500 flex items-center"> |
| | <i data-feather="clock" class="w-4 h-4 mr-1"></i> |
| | Recommended when: You're feeling adventurous |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </section> |
| |
|
| | |
| | <section id="wines" class="menu-category pt-16"> |
| | <div class="flex items-center justify-between mb-8"> |
| | <h2 class="text-3xl font-bold flex items-center"> |
| | <i data-feather="glass" class="text-amber-500 mr-3"></i> |
| | Wine Selection |
| | </h2> |
| | <span class="text-gray-400">$10 - $25 / glass</span> |
| | </div> |
| |
|
| | <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> |
| | |
| | <div> |
| | <h3 class="text-xl font-bold mb-4 text-amber-400">Sparkling</h3> |
| | <div class="space-y-6"> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Prosecco, Zardetto (Italy)</h4> |
| | <p class="text-sm text-gray-400">Dry, crisp with apple and pear notes</p> |
| | </div> |
| | <span class="text-amber-400">$12</span> |
| | </div> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Crémant de Bourgogne (France)</h4> |
| | <p class="text-sm text-gray-400">Elegant with brioche and citrus</p> |
| | </div> |
| | <span class="text-amber-400">$14</span> |
| | </div> |
| | </div> |
| |
|
| | <h3 class="text-xl font-bold mb-4 mt-8 text-amber-400">White</h3> |
| | <div class="space-y-6"> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Sauvignon Blanc, Cloudy Bay (NZ)</h4> |
| | <p class="text-sm text-gray-400">Vibrant acidity with tropical fruits</p> |
| | </div> |
| | <span class="text-amber-400">$16</span> |
| | </div> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Chardonnay, Rombauer (California)</h4> |
| | <p class="text-sm text-gray-400">Buttery with oak and vanilla notes</p> |
| | </div> |
| | <span class="text-amber-400">$18</span> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div> |
| | <h3 class="text-xl font-bold mb-4 text-amber-400">Red</h3> |
| | <div class="space-y-6"> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Pinot Noir, Belle Glos (California)</h4> |
| | <p class="text-sm text-gray-400">Silky with cherry and spice</p> |
| | </div> |
| | <span class="text-amber-400">$20</span> |
| | </div> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Cabernet Sauvignon, Caymus (California)</h4> |
| | <p class="text-sm text-gray-400">Full-bodied with dark fruit and cocoa</p> |
| | </div> |
| | <span class="text-amber-400">$25</span> |
| | </div> |
| | </div> |
| |
|
| | <h3 class="text-xl font-bold mb-4 mt-8 text-amber-400">Dessert</h3> |
| | <div class="space-y-6"> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Sauternes, Château d'Yquem (France)</h4> |
| | <p class="text-sm text-gray-400">Luscious honey and apricot</p> |
| | </div> |
| | <span class="text-amber-400">$22</span> |
| | </div> |
| | <div class="flex justify-between"> |
| | <div> |
| | <h4 class="font-medium">Port, Graham's 20 Year Tawny (Portugal)</h4> |
| | <p class="text-sm text-gray-400">Nutty with dried fruit complexity</p> |
| | </div> |
| | <span class="text-amber-400">$15</span> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </section> |
| |
|
| | |
| | <section id="beers" class="menu-category pt-16"> |
| | <div class="flex items-center justify-between mb-8"> |
| | <h2 class="text-3xl font-bold flex items-center"> |
| | <i data-feather="zap" class="text-amber-500 mr-3"></i> |
| | Craft Beers |
| | </h2> |
| | <span class="text-gray-400">$7 - $12</span> |
| | </div> |
| |
|
| | <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
| | |
| | <div class="flex items-start space-x-4"> |
| | <div class="bg-amber-900 bg-opacity-50 rounded-lg p-3 flex items-center justify-center"> |
| | <i data-feather="box" class="text-amber-400"></i> |
| | </div> |
| | <div> |
| | <h3 class="font-bold">Jazz IPA</h3> |
| | <p class="text-sm text-gray-400 mb-1">Local Brewery | 6.8% ABV</p> |
| | <p class="text-sm">Hoppy with citrus and pine notes</p> |
| | <span class="text-amber-400 text-sm">$8</span> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="flex items-start space-x-4"> |
| | <div class="bg-amber-900 bg-opacity-50 rounded-lg p-3 flex items-center justify-center"> |
| | <i data-feather="box" class="text-amber-400"></i> |
| | </div> |
| | <div> |
| | <h3 class="font-bold">Smooth Stout</h3> |
| | <p class="text-sm text-gray-400 mb-1">Craft Brew Co | 5.5% ABV</p> |
| | <p class="text-sm">Creamy with chocolate and coffee undertones</p> |
| | <span class="text-amber-400 text-sm">$7</span> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="flex items-start space-x-4"> |
| | <div class="bg-amber-900 bg-opacity-50 rounded-lg p-3 flex items-center justify-center"> |
| | <i data-feather="box" class="text-amber-400"></i> |
| | </div> |
| | <div> |
| | <h3 class="font-bold">Bebop Blonde</h3> |
| | <p class="text-sm text-gray-400 mb-1">Artisan Ales | 5.0% ABV</p> |
| | <p class="text-sm">Light and crisp with subtle fruitiness</p> |
| | <span class="text-amber-400 text-sm">$7</span> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="flex items-start space-x-4"> |
| | <div class="bg-amber-900 bg-opacity-50 rounded-lg p-3 flex items-center justify-center"> |
| | <i data-feather="box" class="text-amber-400"></i> |
| | </div> |
| | <div> |
| | <h3 class="font-bold">Improv Saison</h3> |
| | <p class="text-sm text-gray-400 mb-1">Farmhouse Brews | 6.2% ABV</p> |
| | <p class="text-sm">Peppery with earthy and citrus notes</p> |
| | <span class="text-amber-400 text-sm">$9</span> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="flex items-start space-x-4"> |
| | <div class="bg-amber-900 bg-opacity-50 rounded-lg p-3 flex items-center justify-center"> |
| | <i data-feather="box" class="text-amber-400"></i> |
| | </div> |
| | <div> |
| | <h3 class="font-bold">Resonance Pilsner</h3> |
| | <p class="text-sm text-gray-400 mb-1">Euro Imports | 4.9% ABV</p> |
| | <p class="text-sm">Clean and refreshing with noble hops</p> |
| | <span class="text-amber-400 text-sm">$10</span> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="flex items-start space-x-4"> |
| | <div class="bg-amber-900 bg-opacity-50 rounded-lg p-3 flex items-center justify-center"> |
| | <i data-feather="box" class="text-amber-400"></i> |
| | </div> |
| | <div> |
| | <h3 class="font-bold">Barrel-Aged Soloist</h3> |
| | <p class="text-sm text-gray-400 mb-1">Limited Edition | 11.5% ABV</p> |
| | <p class="text-sm">Bourbon barrel-aged strong ale</p> |
| | <span class="text-amber-400 text-sm">$12</span> |
| | </div> |
| | </div> |
| | </div> |
| | </section> |
| |
|
| | |
| | <section id="small-plates" class="menu-category pt-16"> |
| | <div class="flex items-center justify-between mb-8"> |
| | <h2 class="text-3xl font-bold flex items-center"> |
| | <i data-feather="coffee" class="text-amber-500 mr-3"></i> |
| | Small Plates |
| | </h2> |
| | <span class="text-gray-400">$12 - $24</span> |
| | </div> |
| |
|
| | <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> |
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl overflow-hidden group"> |
| | <div class="h-48 overflow-hidden"> |
| | <img src="http://static.photos/food/640x360/1" alt="Tuna Tartare" class="w-full h-full object-cover group-hover:scale-105 transition duration-500"> |
| | </div> |
| | <div class="p-6"> |
| | <div class="flex justify-between items-start mb-2"> |
| | <h3 class="text-xl font-bold">Tuna Tartare</h3> |
| | <span class="text-amber-400 font-medium">$18</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Sashimi-grade tuna with avocado, sesame oil, and crispy wontons. Served with house-made taro chips. |
| | </p> |
| | <div class="text-xs text-gray-500">Contains: Fish, Sesame</div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl overflow-hidden group"> |
| | <div class="h-48 overflow-hidden"> |
| | <img src="http://static.photos/food/640x360/2" alt="Burrata Salad" class="w-full h-full object-cover group-hover:scale-105 transition duration-500"> |
| | </div> |
| | <div class="p-6"> |
| | <div class="flex justify-between items-start mb-2"> |
| | <h3 class="text-xl font-bold">Burrata & Heirloom Tomatoes</h3> |
| | <span class="text-amber-400 font-medium">$16</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Creamy burrata with seasonal heirloom tomatoes, basil oil, aged balsamic, and grilled sourdough. |
| | </p> |
| | <div class="text-xs text-gray-500">Contains: Dairy, Gluten</div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl overflow-hidden group"> |
| | <div class="h-48 overflow-hidden"> |
| | <img src="http://static.photos/food/640x360/3" alt="Duck Confit" class="w-full h-full object-cover group-hover:scale-105 transition duration-500"> |
| | </div> |
| | <div class="p-6"> |
| | <div class="flex justify-between items-start mb-2"> |
| | <h3 class="text-xl font-bold">Duck Confit Croquettes</h3> |
| | <span class="text-amber-400 font-medium">$22</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Crispy fried duck confit with black truffle aioli and cherry mostarda. Served with micro greens. |
| | </p> |
| | <div class="text-xs text-gray-500">Contains: Poultry</div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl overflow-hidden group"> |
| | <div class="h-48 overflow-hidden"> |
| | <img src="http://static.photos/food/640x360/4" alt="Lamb Lollipops" class="w-full h-full object-cover group-hover:scale-105 transition duration-500"> |
| | </div> |
| | <div class="p-6"> |
| | <div class="flex justify-between items-start mb-2"> |
| | <h3 class="text-xl font-bold">Lamb Lollipops</h3> |
| | <span class="text-amber-400 font-medium">$24</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Herb-crusted lamb chops with mint chimichurri and roasted garlic mashed potatoes. |
| | </p> |
| | <div class="text-xs text-gray-500">Contains: Lamb, Dairy</div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </section> |
| |
|
| | |
| | <section id="desserts" class="menu-category pt-16"> |
| | <div class="flex items-center justify-between mb-8"> |
| | <h2 class="text-3xl font-bold flex items-center"> |
| | <i data-feather="pie-chart" class="text-amber-500 mr-3"></i> |
| | Sweet Finales |
| | </h2> |
| | <span class="text-gray-400">$10 - $14</span> |
| | </div> |
| |
|
| | <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Chocolate Decadence</h3> |
| | <span class="text-amber-400 font-medium">$12</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Flourless chocolate cake with raspberry coulis and vanilla bean ice cream. |
| | </p> |
| | <div class="text-xs text-gray-500">Contains: Dairy, Eggs</div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Jazzberry Cheesecake</h3> |
| | <span class="text-amber-400 font-medium">$14</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | New York-style cheesecake with mixed berry compote and almond brittle. |
| | </p> |
| | <div class="text-xs text-gray-500">Contains: Dairy, Eggs, Nuts</div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Bourbon Bread Pudding</h3> |
| | <span class="text-amber-400 font-medium">$10</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Warm brioche bread pudding with bourbon caramel sauce and whipped cream. |
| | </p> |
| | <div class="text-xs text-gray-500">Contains: Dairy, Eggs, Gluten, Alcohol</div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="menu-item"> |
| | <div class="menu-item-content bg-gray-800 rounded-xl p-6"> |
| | <div class="flex justify-between items-start mb-4"> |
| | <h3 class="text-xl font-bold">Seasonal Sorbet Trio</h3> |
| | <span class="text-amber-400 font-medium">$10</span> |
| | </div> |
| | <p class="text-gray-400 mb-4"> |
| | Three scoops of house-made sorbet with fresh fruit and mint garnish. |
| | </p> |
| | <div class="text-xs text-gray-500">Vegan Option Available</div> |
| | </div> |
| | </div> |
| | </div> |
| | </section> |
| | </div> |
| | </div> |
| | </main> |
| |
|
| | |
| | <footer class="relative z-10 bg-black bg-opacity-90 py-12"> |
| | <div class="container mx-auto px-6"> |
| | <div class="grid grid-cols-1 md:grid-cols-4 gap-8"> |
| | <div> |
| | <div class="flex items-center space-x-2 mb-4"> |
| | <i data-feather="music" class="text-amber-500"></i> |
| | <span class="text-xl font-bold bg-gradient-to-r from-amber-400 to-amber-600 bg-clip-text text-transparent">Groovy Beats</span> |
| | </div> |
| | <p class="text-gray-400"> |
| | The finest jazz experience in the city since 1965. |
| | </p> |
| | </div> |
| | <div> |
| | <h3 class="text-white font-medium mb-4">Quick Links</h3> |
| | <ul class="space-y-2"> |
| | <li><a href="index.html" class="text-gray-400 hover:text-amber-400 transition">Home</a></li> |
| | <li><a href="performances.html" class="text-gray-400 hover:text-amber-400 transition">Performances</a></li> |
| | <li><a href="history.html" class="text-gray-400 hover:text-amber-400 transition">History</a></li> |
| | <li><a href="menu.html" class="text-gray-400 hover:text-amber-400 transition">Menu</a></li> |
| | </ul> |
| | </div> |
| | <div> |
| | <h3 class="text-white font-medium mb-4">Information</h3> |
| | <ul class="space-y-2"> |
| | <li class="text-gray-400">123 Jazz Avenue</li> |
| | <li class="text-gray-400">New York, NY 10001</li> |
| | <li class="text-gray-400">(212) 555-7890</li> |
| | <li class="text-gray-400">info@groovybeats.com</li> |
| | </ul> |
| | </div> |
| | <div> |
| | <h3 class="text-white font-medium mb-4">Opening Hours</h3> |
| | <ul class="space-y-2"> |
| | <li class="text-gray-400">Monday - Thursday: 6PM - 1AM</li> |
| | <li class="text-gray-400">Friday - Saturday: 6PM - 2AM</li> |
| | <li class="text-gray-400">Sunday: 5PM - 12AM</li> |
| | </ul> |
| | </div> |
| | </div> |
| | <div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center"> |
| | <p class="text-gray-500 text-sm mb-4 md:mb-0"> |
| | © 2023 Groovy Beats & Smooth Seats. All rights reserved. |
| | </p> |
| | <div class="flex space-x-4"> |
| | <a href="#" class="text-gray-400 hover:text-amber-400 transition"> |
| | <i data-feather="facebook"></i> |
| | </a> |
| | <a href="#" class="text-gray-400 hover:text-amber-400 transition"> |
| | <i data-feather="instagram"></i> |
| | </a> |
| | <a href="#" class="text-gray-400 hover:text-amber-400 transition"> |
| | <i data-feather="twitter"></i> |
| | </a> |
| | </div> |
| | </div> |
| | </div> |
| | </footer> |
| |
|
| | <script> |
| | |
| | feather.replace(); |
| | |
| | |
| | document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
| | anchor.addEventListener('click', function (e) { |
| | e.preventDefault(); |
| | |
| | document.querySelector(this.getAttribute('href')).scrollIntoView({ |
| | behavior: 'smooth' |
| | }); |
| | }); |
| | }); |
| | </script> |
| | </body> |
| | </html> |
| |
|
