Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>The Wild Bunch Podcast</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"> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| 'twb-primary': '#ff6b35', | |
| 'twb-secondary': '#1a1a2e', | |
| 'twb-accent': '#4cc9f0', | |
| 'twb-dark': '#0d0d1a', | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700&family=Roboto:wght@300;400;500;700&display=swap'); | |
| body { | |
| font-family: 'Roboto', sans-serif; | |
| background-color: #0d0d1a; | |
| color: #e6e6e6; | |
| overflow-x: hidden; | |
| } | |
| .orbitron { | |
| font-family: 'Orbitron', sans-serif; | |
| } | |
| .glow-text { | |
| text-shadow: 0 0 10px rgba(255, 107, 53, 0.7); | |
| } | |
| .pixel-border { | |
| border: 2px solid #ff6b35; | |
| position: relative; | |
| } | |
| .pixel-border::before { | |
| content: ""; | |
| position: absolute; | |
| top: -5px; | |
| left: -5px; | |
| right: -5px; | |
| bottom: -5px; | |
| border: 2px solid #4cc9f0; | |
| z-index: -1; | |
| } | |
| .post-card { | |
| transition: transform 0.3s ease, box-shadow 0.3s ease; | |
| } | |
| .post-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 10px 25px rgba(76, 201, 240, 0.2); | |
| } | |
| .progress-bar { | |
| height: 8px; | |
| background-color: #1a1a2e; | |
| border-radius: 4px; | |
| overflow: hidden; | |
| } | |
| .progress-fill { | |
| height: 100%; | |
| background-color: #ff6b35; | |
| width: 50%; | |
| border-radius: 4px; | |
| } | |
| .nav-link::after { | |
| content: ''; | |
| display: block; | |
| width: 0; | |
| height: 2px; | |
| background: #ff6b35; | |
| transition: width 0.3s; | |
| } | |
| .nav-link:hover::after { | |
| width: 100%; | |
| } | |
| .mobile-menu { | |
| transform: translateX(100%); | |
| transition: transform 0.3s ease-in-out; | |
| } | |
| .mobile-menu.open { | |
| transform: translateX(0); | |
| } | |
| .episode-card { | |
| background: linear-gradient(145deg, #1a1a2e, #0d0d1a); | |
| border: 1px solid #2a2a40; | |
| } | |
| .sheep-logo { | |
| position: relative; | |
| } | |
| .sheep-logo::before { | |
| content: "DH"; | |
| position: absolute; | |
| top: 50%; | |
| left: 50%; | |
| transform: translate(-50%, -50%); | |
| font-family: 'Orbitron', sans-serif; | |
| font-weight: 700; | |
| color: #ff6b35; | |
| font-size: 1.2rem; | |
| z-index: 2; | |
| } | |
| .sheep-logo::after { | |
| content: "MZ"; | |
| position: absolute; | |
| top: 50%; | |
| left: 50%; | |
| transform: translate(calc(-50% + 15px), calc(-50% + 15px)); | |
| font-family: 'Orbitron', sans-serif; | |
| font-weight: 700; | |
| color: #4cc9f0; | |
| font-size: 1.2rem; | |
| z-index: 2; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-twb-dark"> | |
| <!-- Top Bar --> | |
| <div class="bg-twb-secondary py-2 px-4"> | |
| <div class="container mx-auto flex flex-col md:flex-row justify-between items-center"> | |
| <div class="flex space-x-4 mb-2 md:mb-0"> | |
| <a href="mailto:office@example.org" class="text-twb-accent hover:text-white transition"> | |
| <i class="fas fa-envelope mr-1"></i> office@example.org | |
| </a> | |
| <a href="tel:111222333" class="text-twb-accent hover:text-white transition"> | |
| <i class="fas fa-phone mr-1"></i> 111-222-333 | |
| </a> | |
| </div> | |
| <a href="mailto:diehard@twbguild.com?subject=Sponsor%20Outreach" class="bg-twb-primary hover:bg-orange-600 text-white px-3 py-1 rounded transition font-bold orbitron"> | |
| <i class="fas fa-microphone-alt mr-1"></i> Guest Host Inquiries | |
| </a> | |
| </div> | |
| </div> | |
| <!-- Main Header --> | |
| <header class="py-6 px-4"> | |
| <div class="container mx-auto flex flex-col md:flex-row items-center justify-between"> | |
| <!-- Logo and Title --> | |
| <div class="flex items-center mb-4 md:mb-0"> | |
| <div class="sheep-logo w-16 h-16 bg-white rounded-full overflow-hidden mr-4"> | |
| <img src="https://twbhq.com/wp-content/uploads/2025/03/DALL%C2%B7E-2025-03-27-01.47.41-A-bold-and-dynamic-podcast-logo-for-The-Wild-Bunch-Podcast-featuring-the-initials-DH-and-MZ-shaped-into-the-silhouette-of-a-sheeps-head.-The-de.webp" | |
| alt="The Wild Bunch Podcast Logo" class="w-full h-full object-cover"> | |
| </div> | |
| <div> | |
| <h1 class="orbitron text-2xl md:text-3xl font-bold text-white"> | |
| <a href="http://twbhq.com/" class="hover:text-twb-primary transition">The Wild Bunch Podcast</a> | |
| </h1> | |
| <p class="text-twb-accent orbitron">Where Old-School Guild Loyalty Meets New-Gen Chaos.</p> | |
| </div> | |
| </div> | |
| <!-- Desktop Navigation --> | |
| <nav class="hidden md:flex space-x-8 items-center"> | |
| <a href="http://twbhq.com/2025/03/17/podheads/" class="nav-link text-white hover:text-twb-primary orbitron">HEY! Listen.</a> | |
| <a href="http://twbhq.com/category/podcast-news/" class="nav-link text-white hover:text-twb-primary orbitron">Podcast News</a> | |
| <a href="http://twbhq.com/category/episodes/" class="nav-link text-white hover:text-twb-primary orbitron">Episodes</a> | |
| <a href="http://twbhq.com/about-twbs-podcast/" class="nav-link text-white hover:text-twb-primary orbitron">About TWB's Podcast</a> | |
| <a href="http://twbhq.com/guest-host-signup/" class="nav-link text-white hover:text-twb-primary orbitron">Guest Host Signup</a> | |
| <button class="text-twb-accent hover:text-white"> | |
| <i class="fas fa-search text-xl"></i> | |
| </button> | |
| </nav> | |
| <!-- Mobile Menu Button --> | |
| <button id="mobileMenuButton" class="md:hidden text-twb-accent text-2xl"> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| </div> | |
| </header> | |
| <!-- Mobile Menu --> | |
| <div id="mobileMenu" class="mobile-menu fixed top-0 right-0 h-full w-64 bg-twb-secondary z-50 p-6"> | |
| <button id="closeMobileMenu" class="absolute top-4 right-4 text-twb-accent text-2xl"> | |
| <i class="fas fa-times"></i> | |
| </button> | |
| <div class="mt-12"> | |
| <a href="http://twbhq.com/2025/03/17/podheads/" class="block py-3 text-white hover:text-twb-primary orbitron">HEY! Listen.</a> | |
| <a href="http://twbhq.com/category/podcast-news/" class="block py-3 text-white hover:text-twb-primary orbitron">Podcast News</a> | |
| <a href="http://twbhq.com/category/episodes/" class="block py-3 text-white hover:text-twb-primary orbitron">Episodes</a> | |
| <a href="http://twbhq.com/about-twbs-podcast/" class="block py-3 text-white hover:text-twb-primary orbitron">About TWB's Podcast</a> | |
| <a href="http://twbhq.com/guest-host-signup/" class="block py-3 text-white hover:text-twb-primary orbitron">Guest Host Signup</a> | |
| <div class="mt-8"> | |
| <div class="relative"> | |
| <input type="text" placeholder="Search..." class="w-full bg-twb-dark text-white px-4 py-2 rounded"> | |
| <button class="absolute right-3 top-2 text-twb-accent"> | |
| <i class="fas fa-search"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Hero Section --> | |
| <section class="py-16 px-4 bg-gradient-to-r from-twb-secondary to-twb-dark"> | |
| <div class="container mx-auto text-center"> | |
| <h2 class="orbitron text-4xl md:text-6xl font-bold text-white mb-6 glow-text"> | |
| LEGACY, LOYALTY, AND LOUD OPINIONS | |
| </h2> | |
| <p class="text-xl text-twb-accent max-w-3xl mx-auto mb-10"> | |
| Straight from the Front Lines of Gaming Culture | |
| </p> | |
| <div class="flex flex-wrap justify-center gap-4"> | |
| <a href="http://twbhq.com/category/episodes/" class="bg-twb-primary hover:bg-orange-600 text-white px-8 py-3 rounded-full font-bold orbitron text-lg transition"> | |
| LISTEN NOW | |
| </a> | |
| <a href="http://twbhq.com/guest-host-signup/" class="bg-transparent border-2 border-twb-accent hover:bg-twb-accent text-white px-8 py-3 rounded-full font-bold orbitron text-lg transition"> | |
| BECOME A GUEST HOST | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Latest Episodes --> | |
| <section class="py-16 px-4"> | |
| <div class="container mx-auto"> | |
| <h2 class="orbitron text-3xl md:text-4xl font-bold text-white mb-2 text-center">LATEST EPISODES</h2> | |
| <div class="w-20 h-1 bg-twb-primary mx-auto mb-12"></div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Episode 1 --> | |
| <div class="episode-card post-card rounded-lg overflow-hidden shadow-xl"> | |
| <a href="http://twbhq.com/2025/05/07/elementor-150/"> | |
| <div class="relative"> | |
| <div class="bg-gray-800 h-48 w-full"></div> | |
| <div class="absolute bottom-4 left-4 bg-twb-primary text-white px-3 py-1 rounded orbitron"> | |
| NEW EPISODE | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="orbitron text-xl font-bold text-white mb-3">Elementor #150</h3> | |
| <div class="mb-4"> | |
| <p class="text-twb-accent orbitron mb-1">My Skill Web Designer</p> | |
| <div class="progress-bar"> | |
| <div class="progress-fill"></div> | |
| </div> | |
| <p class="text-right text-sm text-gray-400 mt-1">50% Complete</p> | |
| </div> | |
| <p class="text-gray-300 mb-4">Dive into the world of web design with our special guest...</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-twb-accent orbitron">May 7, 2025</span> | |
| <a href="http://twbhq.com/2025/05/07/elementor-150/" class="text-twb-primary hover:text-orange-400 orbitron"> | |
| LISTEN <i class="fas fa-arrow-right ml-1"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </a> | |
| </div> | |
| <!-- Episode 2 --> | |
| <div class="episode-card post-card rounded-lg overflow-hidden shadow-xl"> | |
| <a href="http://twbhq.com/2025/04/06/our-sample-episode-is-now-live/"> | |
| <div class="relative"> | |
| <img src="http://twbhq.com/wp-content/uploads/2025/04/twb2025-ver1-e1743998514395.png" | |
| alt="Our Sample Episode" class="w-full h-48 object-cover"> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="orbitron text-xl font-bold text-white mb-3">Our Sample Episode is now Live!</h3> | |
| <p class="text-gray-300 mb-4">What started as a sample recording for another show somehow mutated into our official first episode. Oops. We're rolling with it.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-twb-accent orbitron">April 6, 2025</span> | |
| <a href="http://twbhq.com/2025/04/06/our-sample-episode-is-now-live/" class="text-twb-primary hover:text-orange-400 orbitron"> | |
| LISTEN <i class="fas fa-arrow-right ml-1"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </a> | |
| </div> | |
| <!-- Episode 3 --> | |
| <div class="episode-card post-card rounded-lg overflow-hidden shadow-xl"> | |
| <a href="http://twbhq.com/2025/04/06/community-guest-host-opportunity-now-available/"> | |
| <div class="relative"> | |
| <img src="http://twbhq.com/wp-content/uploads/2025/03/helldivers-e1743998151384.webp" | |
| alt="Community guest host opportunity" class="w-full h-48 object-cover"> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="orbitron text-xl font-bold text-white mb-3">Community guest host opportunity Now Available</h3> | |
| <p class="text-gray-300 mb-4">We're excited to start featuring rotating guest hosts on The Wild Bunch Official Podcast!</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-twb-accent orbitron">April 6, 2025</span> | |
| <a href="http://twbhq.com/2025/04/06/community-guest-host-opportunity-now-available/" class="text-twb-primary hover:text-orange-400 orbitron"> | |
| LEARN MORE <i class="fas fa-arrow-right ml-1"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </a> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <a href="http://twbhq.com/category/episodes/" class="orbitron bg-twb-primary hover:bg-orange-600 text-white px-8 py-3 rounded-full font-bold transition inline-block"> | |
| VIEW ALL EPISODES | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- About Section --> | |
| <section class="py-16 px-4 bg-twb-secondary"> | |
| <div class="container mx-auto"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0 md:pr-10"> | |
| <div class="pixel-border p-2 inline-block"> | |
| <img src="https://twbhq.com/wp-content/uploads/2025/03/DALL%C2%B7E-2025-03-27-01.47.41-A-bold-and-dynamic-podcast-logo-for-The-Wild-Bunch-Podcast-featuring-the-initials-DH-and-MZ-shaped-into-the-silhouette-of-a-sheeps-head.-The-de.webp" | |
| alt="The Wild Bunch Podcast" class="w-full max-w-md mx-auto"> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2"> | |
| <h2 class="orbitron text-3xl md:text-4xl font-bold text-white mb-6">ABOUT THE WILD BUNCH</h2> | |
| <p class="text-gray-300 mb-6"> | |
| The Wild Bunch Podcast is where veteran gamers and new-gen enthusiasts collide. We're a passionate community that bridges the gap between old-school guild loyalty and the chaotic energy of modern gaming. | |
| </p> | |
| <p class="text-gray-300 mb-6"> | |
| Founded by DieHard (Casey) and MZ, we bring you unfiltered discussions, deep dives into gaming culture, and the loudest opinions this side of the digital frontier. | |
| </p> | |
| <div class="flex flex-wrap gap-4"> | |
| <a href="http://twbhq.com/about-twbs-podcast/" class="orbitron bg-twb-primary hover:bg-orange-600 text-white px-6 py-2 rounded font-bold transition"> | |
| OUR STORY | |
| </a> | |
| <a href="http://twbhq.com/guest-host-signup/" class="orbitron bg-transparent border-2 border-twb-accent hover:bg-twb-accent text-white px-6 py-2 rounded font-bold transition"> | |
| JOIN US | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Press Release Section --> | |
| <section class="py-16 px-4"> | |
| <div class="container mx-auto text-center"> | |
| <div class="max-w-4xl mx-auto"> | |
| <h2 class="orbitron text-3xl md:text-4xl font-bold text-white mb-6">PODCAST LAUNCHES – THE WILD BUNCH – PRESS RELEASE</h2> | |
| <p class="text-twb-accent orbitron text-xl mb-8">FOR IMMEDIATE RELEASE</p> | |
| <div class="text-5xl mb-8">🎙️</div> | |
| <p class="text-gray-300 mb-8 text-left"> | |
| The Wild Bunch Official Podcast Launches: Legacy, Loyalty, and Loud Opinions—Straight from the Front Lines of Gaming Culture. April 2025 – After years of dominating leaderboards and forging unbreakable guild bonds, The Wild Bunch is taking their legendary camaraderie from voice chat to the airwaves. | |
| </p> | |
| <a href="http://twbhq.com/2025/03/17/podheads/" class="orbitron inline-block bg-twb-primary hover:bg-orange-600 text-white px-8 py-3 rounded-full font-bold transition"> | |
| READ FULL RELEASE | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="py-12 px-4 bg-twb-secondary border-t- | |
| <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=diehardtwb/twbhq" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |