Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Down South Smash Burgers & Wings</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap'); | |
| body { | |
| font-family: 'Poppins', sans-serif; | |
| background-color: #fff9f2; | |
| } | |
| .hero { | |
| background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.unsplash.com/photo-1568901346375-23c9450c58cd?ixlib=rb-4.0.3'); | |
| background-size: cover; | |
| background-position: center; | |
| } | |
| .menu-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); | |
| } | |
| .footer-links li:hover { | |
| color: #f59e0b; | |
| } | |
| /* Custom animation for the logo */ | |
| @keyframes sizzle { | |
| 0% { transform: scale(1); } | |
| 50% { transform: scale(1.05); } | |
| 100% { transform: scale(1); } | |
| } | |
| .logo-animate:hover { | |
| animation: sizzle 0.5s ease-in-out; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <!-- Header/Navigation --> | |
| <header class="bg-red-800 text-white sticky top-0 z-50 shadow-lg"> | |
| <div class="container mx-auto px-4 py-3 flex justify-between items-center"> | |
| <div class="flex items-center space-x-2"> | |
| <div class="logo-animate"> | |
| <i class="fas fa-hamburger text-2xl text-amber-400"></i> | |
| </div> | |
| <h1 class="text-xl md:text-2xl font-bold"> | |
| <span class="text-amber-400">DOWN SOUTH</span> SMASH BURGERS | |
| </h1> | |
| </div> | |
| <!-- Mobile Menu Button --> | |
| <button id="mobile-menu-button" class="md:hidden text-white focus:outline-none"> | |
| <i class="fas fa-bars text-2xl"></i> | |
| </button> | |
| <!-- Desktop Navigation --> | |
| <nav class="hidden md:flex space-x-6"> | |
| <a href="#home" class="hover:text-amber-400 transition">Home</a> | |
| <a href="#menu" class="hover:text-amber-400 transition">Menu</a> | |
| <a href="#about" class="hover:text-amber-400 transition">About</a> | |
| <a href="#locations" class="hover:text-amber-400 transition">Locations</a> | |
| <a href="#contact" class="hover:text-amber-400 transition">Contact</a> | |
| </nav> | |
| </div> | |
| <!-- Mobile Menu --> | |
| <div id="mobile-menu" class="hidden md:hidden bg-red-900 px-4 py-3"> | |
| <nav class="flex flex-col space-y-3"> | |
| <a href="#home" class="hover:text-amber-400 transition">Home</a> | |
| <a href="#menu" class="hover:text-amber-400 transition">Menu</a> | |
| <a href="#about" class="hover:text-amber-400 transition">About</a> | |
| <a href="#locations" class="hover:text-amber-400 transition">Locations</a> | |
| <a href="#contact" class="hover:text-amber-400 transition">Contact</a> | |
| </nav> | |
| </div> | |
| </header> | |
| <!-- Hero Section --> | |
| <section id="home" class="hero flex items-center justify-center text-white h-screen"> | |
| <div class="container mx-auto px-4 text-center"> | |
| <h2 class="text-4xl md:text-6xl font-bold mb-6"> | |
| <span class="text-amber-400">DOWN SOUTH</span> SMASH BURGERS & WINGS | |
| </h2> | |
| <p class="text-xl md:text-2xl mb-8">Authentic southern flavors smashed between two buns!</p> | |
| <div class="flex flex-col md:flex-row justify-center space-y-4 md:space-y-0 md:space-x-4"> | |
| <a href="#menu" class="bg-amber-500 hover:bg-amber-600 text-red-900 font-bold py-3 px-6 rounded-full transition duration-300 transform hover:scale-105"> | |
| <i class="fas fa-utensils mr-2"></i>View Menu | |
| </a> | |
| <a href="#locations" class="bg-transparent border-2 border-white hover:bg-red-800 text-white font-bold py-3 px-6 rounded-full transition duration-300 transform hover:scale-105"> | |
| <i class="fas fa-map-marker-alt mr-2"></i>Find Us | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Specials Section --> | |
| <section class="bg-amber-50 py-12"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center text-red-800 mb-8">Today's Specials</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> | |
| <!-- Special 1 --> | |
| <div class="bg-white rounded-lg overflow-hidden shadow-lg transition duration-300 transform hover:scale-105"> | |
| <div class="h-48 bg-gray-300 relative"> | |
| <img src="https://images.unsplash.com/photo-1586190848861-99aa4a171e90?ixlib=rb-4.0.3" alt="Double Smash Burger" class="w-full h-full object-cover"> | |
| <div class="absolute top-4 right-4 bg-red-700 text-white px-3 py-1 rounded-full font-bold text-sm"> | |
| $12.99 | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold text-red-800 mb-2">Double Smash Deluxe</h3> | |
| <p class="text-gray-600">Two smashed patties, American cheese, caramelized onions, pickles, and our signature Down South sauce.</p> | |
| </div> | |
| </div> | |
| <!-- Special 2 --> | |
| <div class="bg-white rounded-lg overflow-hidden shadow-lg transition duration-300 transform hover:scale-105"> | |
| <div class="h-48 bg-gray-300 relative"> | |
| <img src="https://images.unsplash.com/photo-1561758033-d89a9ad46330?ixlib=rb-4.0.3" alt="Hot Wings" class="w-full h-full object-cover"> | |
| <div class="absolute top-4 right-4 bg-red-800 text-white px-3 py-1 rounded-full font-bold text-sm"> | |
| $9.99 | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold text-red-800 mb-2">Hot Honey Wings</h3> | |
| <p class="text-gray-600">Crispy wings tossed in our sweet & spicy hot honey sauce, served with ranch and celery.</p> | |
| </div> | |
| </div> | |
| <!-- Special 3 --> | |
| <div class="bg-white rounded-lg overflow-hidden shadow-lg transition duration-300 transform hover:scale-105"> | |
| <div class="h-48 bg-gray-300 relative"> | |
| <img src="https://images.unsplash.com/photo-1559849453-2cf0062c1720?ixlib=rb-4.0.3" alt="Burger Combo" class="w-full h-full object-cover"> | |
| <div class="absolute top-4 right-4 bg-red-900 text-white px-3 py-1 rounded-full font-bold text-sm"> | |
| $14.99 | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold text-red-800 mb-2">Smash Combo</h3> | |
| <p class="text-gray-600">Single smash burger with fries and drink. Upgrade to a Double Smash for $2 more.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Menu Section --> | |
| <section id="menu" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center text-red-800 mb-8">Our Menu</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> | |
| <!-- Burgers Column --> | |
| <div> | |
| <h3 class="text-2xl font-semibold text-amber-600 border-b-2 border-amber-600 pb-2 mb-6"> | |
| <i class="fas fa-hamburger mr-2"></i>Smash Burgers | |
| </h3> | |
| <!-- Menu Item --> | |
| <div class="menu-card bg-amber-50 p-6 rounded-lg mb-6 transition duration-300"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <h4 class="font-bold text-lg text-red-800">Classic Smash</h4> | |
| <p class="text-gray-600">Smashed patty, American cheese, pickles, onions, Down South sauce</p> | |
| </div> | |
| <span class="font-bold text-red-800">$8.99</span> | |
| </div> | |
| </div> | |
| <!-- Menu Item --> | |
| <div class="menu-card bg-amber-50 p-6 rounded-lg mb-6 transition duration-300"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <h4 class="font-bold text-lg text-red-800">Bacon Double Smash</h4> | |
| <p class="text-gray-600">Two smashed patties, cheddar, crispy bacon, BBQ sauce, onion rings</p> | |
| </div> | |
| <span class="font-bold text-red-800">$12.99</span> | |
| </div> | |
| </div> | |
| <!-- Menu Item --> | |
| <div class="menu-card bg-amber-50 p-6 rounded-lg mb-6 transition duration-300"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <h4 class="font-bold text-lg text-red-800">Hot & Spicy Smash</h4> | |
| <p class="text-gray-600">Smashed patty, pepper jack, jalapeños, spicy mayo, crispy onions</p> | |
| </div> | |
| <span class="font-bold text-red-800">$10.99</span> | |
| </div> | |
| </div> | |
| <!-- Menu Item --> | |
| <div class="menu-card bg-amber-50 p-6 rounded-lg mb-6 transition duration-300"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <h4 class="font-bold text-lg text-red-800">Southern Pimento Cheese</h4> | |
| <p class="text-gray-600">Smashed patty, homemade pimento cheese, bacon jam, brioche bun</p> | |
| </div> | |
| <span class="font-bold text-red-800">$11.99</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Wings Column --> | |
| <div> | |
| <h3 class="text-2xl font-semibold text-amber-600 border-b-2 border-amber-600 pb-2 mb-6"> | |
| <i class="fas fa-drumstick-bite mr-2"></i>Wings | |
| </h3> | |
| <!-- Menu Item --> | |
| <div class="menu-card bg-amber-50 p-6 rounded-lg mb-6 transition duration-300"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <h4 class="font-bold text-lg text-red-800">Classic Buffalo (6pc)</h4> | |
| <p class="text-gray-600">Hand-breaded wings tossed in our signature buffalo sauce</p> | |
| </div> | |
| <span class="font-bold text-red-800">$7.99</span> | |
| </div> | |
| </div> | |
| <!-- Menu Item --> | |
| <div class="menu-card bg-amber-50 p-6 rounded-lg mb-6 transition duration-300"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <h4 class="font-bold text-lg text-red-800">Sweet Heat BBQ | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=LEGENDZEATZ/dsmb" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |