|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Doc's Drive-In Theatre | Austin's Only Drive-In Theater and Underground Speakeasy</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap'); |
|
|
|
|
|
body { |
|
|
font-family: 'Poppins', sans-serif; |
|
|
scroll-behavior: smooth; |
|
|
} |
|
|
|
|
|
.hero { |
|
|
background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fucarecdn.com%2F7c001b5c-559b-4146-b02e-bdcf255ab494%2F-%2Fcrop%2F1261x1262%2F11%2C0%2F-%2Fresize%2F1200x1200%2F&f=1&nofb=1&ipt=76a319eeeb2a37e3b2ce38f1f1c09fbaa450bbbc05df07377e8e2e413d66e87f'); |
|
|
background-size: cover; |
|
|
background-position: center; |
|
|
height: 100vh; |
|
|
min-height: 600px; |
|
|
} |
|
|
|
|
|
.movie-card { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.movie-card:hover { |
|
|
transform: translateY(-10px); |
|
|
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); |
|
|
} |
|
|
|
|
|
.dropdown:hover .dropdown-menu { |
|
|
display: block; |
|
|
} |
|
|
|
|
|
.carousel { |
|
|
scroll-snap-type: x mandatory; |
|
|
} |
|
|
|
|
|
.carousel-item { |
|
|
scroll-snap-align: start; |
|
|
} |
|
|
|
|
|
|
|
|
.custom-checkbox input:checked ~ .checkmark { |
|
|
background-color: #f59e0b; |
|
|
border-color: #f59e0b; |
|
|
} |
|
|
|
|
|
.custom-checkbox .checkmark:after { |
|
|
content: ""; |
|
|
position: absolute; |
|
|
display: none; |
|
|
left: 6px; |
|
|
top: 2px; |
|
|
width: 4px; |
|
|
height: 8px; |
|
|
border: solid white; |
|
|
border-width: 0 2px 2px 0; |
|
|
transform: rotate(45deg); |
|
|
} |
|
|
|
|
|
.custom-checkbox input:checked ~ .checkmark:after { |
|
|
display: block; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-900 text-gray-100"> |
|
|
|
|
|
<div class="md:hidden fixed top-4 right-4 z-50"> |
|
|
<button id="mobile-menu-button" class="text-white focus:outline-none"> |
|
|
<i class="fas fa-bars text-2xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="mobile-menu" class="hidden fixed inset-0 bg-black bg-opacity-90 z-40 flex items-center justify-center"> |
|
|
<div class="text-center"> |
|
|
<button id="close-mobile-menu" class="absolute top-4 right-4 text-white text-2xl"> |
|
|
<i class="fas fa-times"></i> |
|
|
</button> |
|
|
<img src="https://www.docsdriveintheatre.com/public/custom/images/logo.png" alt="Doc's Drive-In Logo" class="mx-auto mb-8 w-48"> |
|
|
<nav class="flex flex-col space-y-6"> |
|
|
<a href="https://www.docsdriveintheatre.com/schedule?view=week" class="text-2xl text-white hover:text-yellow-400">This Week's Movies</a> |
|
|
<div class="relative group"> |
|
|
<button class="text-2xl text-white hover:text-yellow-400 focus:outline-none">About <i class="fas fa-chevron-down ml-1"></i></button> |
|
|
<div class="hidden group-hover:block bg-gray-800 rounded mt-2 py-2 w-64 mx-auto"> |
|
|
<a href="https://www.docsdriveintheatre.com/page/about-us" class="block px-4 py-2 hover:bg-gray-700">About Us</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/first-time-guide" class="block px-4 py-2 hover:bg-gray-700">First Time Guide</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/faq" class="block px-4 py-2 hover:bg-gray-700">FAQ</a> |
|
|
</div> |
|
|
</div> |
|
|
<a href="https://www.docsdriveintheatre.com/rentals" class="text-2xl text-white hover:text-yellow-400">Rentals</a> |
|
|
<div class="relative group"> |
|
|
<button class="text-2xl text-white hover:text-yellow-400 focus:outline-none">Events <i class="fas fa-chevron-down ml-1"></i></button> |
|
|
<div class="hidden group-hover:block bg-gray-800 rounded mt-2 py-2 w-64 mx-auto"> |
|
|
<a href="https://www.docsdriveintheatre.com/events/event-calendar" class="block px-4 py-2 hover:bg-gray-700">Event Calendar</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/theatre-rentals" class="block px-4 py-2 hover:bg-gray-700">Theatre Calendar</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/private-parties" class="block px-4 py-2 hover:bg-gray-700">Private Parties</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/corporate-events" class="block px-4 py-2 hover:bg-gray-700">Corporate Events</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/marketplace" class="block px-4 py-2 hover:bg-gray-700">Marketplace</a> |
|
|
</div> |
|
|
</div> |
|
|
<a href="https://www.docsdriveintheatre.com/blogs" class="text-2xl text-white hover:text-yellow-400">News</a> |
|
|
<a href="https://www.docsdriveintheatre.com/contact" class="text-2xl text-white hover:text-yellow-400">Contact</a> |
|
|
<a href="https://www.docsdriveintheatre.com/user/login" class="text-2xl text-white hover:text-yellow-400">User Login</a> |
|
|
<a href="https://www.toasttab.com/docs-drive-in-1540-satterwhite-rd/v3/?mode=fulfillment" class="text-2xl text-yellow-400 hover:text-yellow-300">Order Food</a> |
|
|
</nav> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<header class="hidden md:block fixed w-full bg-gray-900 bg-opacity-90 z-40"> |
|
|
<div class="container mx-auto px-6 py-4"> |
|
|
<div class="flex items-center justify-between"> |
|
|
<div class="flex items-center space-x-12"> |
|
|
<a href="https://www.docsdriveintheatre.com/"> |
|
|
<img src="https://www.docsdriveintheatre.com/public/custom/images/logo.png" alt="Doc's Drive-In Logo" class="h-12"> |
|
|
</a> |
|
|
|
|
|
<nav class="hidden lg:flex items-center space-x-8"> |
|
|
<a href="https://www.docsdriveintheatre.com/schedule?view=week" class="text-white hover:text-yellow-400 transition">This Week's Movies</a> |
|
|
|
|
|
<div class="relative group"> |
|
|
<button class="text-white hover:text-yellow-400 transition flex items-center focus:outline-none"> |
|
|
About <i class="fas fa-chevron-down ml-1 text-xs"></i> |
|
|
</button> |
|
|
<div class="absolute hidden group-hover:block bg-gray-800 rounded-md shadow-lg py-2 w-48 z-50"> |
|
|
<a href="https://www.docsdriveintheatre.com/page/about-us" class="block px-4 py-2 hover:bg-gray-700">About Us</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/first-time-guide" class="block px-4 py-2 hover:bg-gray-700">First Time Guide</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/faq" class="block px-4 py-2 hover:bg-gray-700">FAQ</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<a href="https://www.docsdriveintheatre.com/rentals" class="text-white hover:text-yellow-400 transition">Rentals</a> |
|
|
|
|
|
<div class="relative group"> |
|
|
<button class="text-white hover:text-yellow-400 transition flex items-center focus:outline-none"> |
|
|
Events <i class="fas fa-chevron-down ml-1 text-xs"></i> |
|
|
</button> |
|
|
<div class="absolute hidden group-hover:block bg-gray-800 rounded-md shadow-lg py-2 w-64 z-50"> |
|
|
<a href="https://www.docsdriveintheatre.com/events/event-calendar" class="block px-4 py-2 hover:bg-gray-700">Event Calendar</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/theatre-rentals" class="block px-4 py-2 hover:bg-gray-700">Theatre Calendar</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/private-parties" class="block px-4 py-2 hover:bg-gray-700">Private Parties</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/corporate-events" class="block px-4 py-2 hover:bg-gray-700">Corporate Events</a> |
|
|
<a href="https://www.docsdriveintheatre.com/page/marketplace" class="block px-4 py-2 hover:bg-gray-700">Marketplace</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<a href="https://www.docsdriveintheatre.com/blogs" class="text-white hover:text-yellow-400 transition">News</a> |
|
|
<a href="https://www.docsdriveintheatre.com/contact" class="text-white hover:text-yellow-400 transition">Contact</a> |
|
|
<a href="https://www.docsdriveintheatre.com/user/login" class="text-white hover:text-yellow-400 transition">User Login</a> |
|
|
</nav> |
|
|
</div> |
|
|
|
|
|
<div class="flex items-center space-x-6"> |
|
|
<a href="https://www.toasttab.com/docs-drive-in-1540-satterwhite-rd/v3/?mode=fulfillment" class="bg-yellow-500 hover:bg-yellow-600 text-gray-900 font-medium px-4 py-2 rounded-full transition flex items-center"> |
|
|
<i class="fas fa-utensils mr-2"></i> Order Food |
|
|
</a> |
|
|
|
|
|
<div class="relative group"> |
|
|
<button class="text-white hover:text-yellow-400 transition focus:outline-none relative"> |
|
|
<i class="fas fa-shopping-cart text-xl"></i> |
|
|
<span class="absolute -top-2 -right-2 bg-yellow-500 text-gray-900 text-xs font-bold rounded-full h-5 w-5 flex items-center justify-center">0</span> |
|
|
</button> |
|
|
<div class="absolute hidden group-hover:block bg-gray-800 rounded-md shadow-lg p-4 right-0 w-64 z-50"> |
|
|
<p class="text-center text-gray-300">Your Cart Is Empty</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<section class="hero flex items-center justify-center pt-24 md:pt-0"> |
|
|
<div class="container mx-auto px-6 text-center"> |
|
|
<h1 class="text-4xl md:text-6xl font-bold mb-6">Austin's Only Drive-In Movie Theater</h1> |
|
|
<p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">Get your family out of the house, steal away for a romantic night, or have the chance to stretch your legs by yourself in a Doc's Drive-In home away from home.</p> |
|
|
<div class="flex flex-col sm:flex-row justify-center gap-4"> |
|
|
<a href="https://www.docsdriveintheatre.com/schedule?view=week" class="bg-yellow-500 hover:bg-yellow-600 text-gray-900 font-bold px-8 py-4 rounded-full text-lg transition"> |
|
|
View This Week's Movies |
|
|
</a> |
|
|
<a href="https://www.docsdriveintheatre.com/rentals" class="bg-transparent hover:bg-gray-800 border-2 border-white text-white font-bold px-8 py-4 rounded-full text-lg transition"> |
|
|
Private Party? |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-gray-800"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<h2 class="text-3xl font-bold mb-12 text-center">Upcoming Showings</h2> |
|
|
|
|
|
<div class="relative"> |
|
|
<div class="carousel flex overflow-x-auto pb-8 space-x-6 scrollbar-hide"> |
|
|
|
|
|
<div class="carousel-item flex-shrink-0 w-64 movie-card"> |
|
|
<div class="bg-gray-700 rounded-lg overflow-hidden shadow-lg"> |
|
|
<img src="http://www.docsdriveintheatre.com/public/uploads/1752831055-h-250-23aaa.jpg" alt="Drag Show: Hot & Bothered at the Speakeasy" class="w-full h-80 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-2">Drag Show: Hot & Bothered at the Speakeasy</h3> |
|
|
<p class="text-yellow-400 mb-3">Aug 23 09:30 pm</p> |
|
|
<a href="https://www.eventbrite.com/e/drag-show-hot-bothered-at-the-speakeasy-tickets-1497799361209?aff=oddtdtcreator" class="block w-full bg-yellow-500 hover:bg-yellow-600 text-gray-900 text-center font-medium py-2 rounded transition"> |
|
|
Buy Tickets |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="carousel-item flex-shrink-0 w-64 movie-card"> |
|
|
<div class="bg-gray-700 rounded-lg overflow-hidden shadow-lg"> |
|
|
<img src="http://www.docsdriveintheatre.com/public/uploads/1751264185-h-250-mmmmm.jpg" alt="Karaoke and Whiskey Wednesday's at the Speakeasy" class="w-full h-80 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-2">Karaoke and Whiskey Wednesday's at the Speakeasy</h3> |
|
|
<p class="text-yellow-400 mb-3">Aug 27 07:00 pm</p> |
|
|
<a href="https://www.eventbrite.com/e/karaoke-and-whiskey-wednesdays-at-the-speakeasy-tickets-1278393311809?aff=oddtdtcreator" class="block w-full bg-yellow-500 hover:bg-yellow-600 text-gray-900 text-center font-medium py-2 rounded transition"> |
|
|
Buy Tickets |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="carousel-item flex-shrink-0 w-64 movie-card"> |
|
|
<div class="bg-gray-700 rounded-lg overflow-hidden shadow-lg"> |
|
|
<img src="http://www.docsdriveintheatre.com/public/uploads/1751264212-h-250-mmmmm.jpg" alt="Karaoke and Whiskey Wednesday's at the Speakeasy" class="w-full h-80 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-2">Karaoke and Whiskey Wednesday's at the Speakeasy</h3> |
|
|
<p class="text-yellow-400 mb-3">Aug 27 09:00 pm</p> |
|
|
<a href="https://www.eventbrite.com/e/karaoke-and-whiskey-wednesdays-at-the-speakeasy-tickets-1278393311809?aff=oddtdtcreator" class="block w-full bg-yellow-500 hover:bg-yellow-600 text-gray-900 text-center font-medium py-2 rounded transition"> |
|
|
Buy Tickets |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="carousel-item flex-shrink-0 w-64 movie-card"> |
|
|
<div class="bg-gray-700 rounded-lg overflow-hidden shadow-lg"> |
|
|
<img src="http://image.tmdb.org/t/p/original/sKCr78MXSLixwmZ8DyJLrpMsd15.jpg" alt="The Lion King" class="w-full h-80 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-2">The Lion King</h3> |
|
|
<p class="text-yellow-400 mb-3">Jul 26 08:50 pm</p> |
|
|
<a href="https://www.docsdriveintheatre.com/event/detail/4580" class="block w-full bg-yellow-500 hover:bg-yellow-600 text-gray-900 text-center font-medium py-2 rounded transition"> |
|
|
Buy Tickets |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="carousel-item flex-shrink-0 w-64 movie-card"> |
|
|
<div class="bg-gray-700 rounded-lg overflow-hidden shadow-lg"> |
|
|
<img src="http://image.tmdb.org/t/p/original/an0nD6uq6byfxXCfk6lQBzdL2J1.jpg" alt="ET" class="w-full h-80 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-2">ET</h3> |
|
|
<p class="text-yellow-400 mb-3">Jul 26 08:55 pm</p> |
|
|
<a href="https://www.docsdriveintheatre.com/event/detail/4589" class="block w-full bg-yellow-500 hover:bg-yellow-600 text-gray-900 text-center font-medium py-2 rounded transition"> |
|
|
Buy Tickets |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="carousel-item flex-shrink-0 w-64 movie-card"> |
|
|
<div class="bg-gray-700 rounded-lg overflow-hidden shadow-lg"> |
|
|
<img src="http://image.tmdb.org/t/p/original/dNqgjqxHIdfsQRQL5XTujNfX9pj.jpg" alt="The Parent Trap" class="w-full h-80 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-2">The Parent Trap</h3> |
|
|
<p class="text-yellow-400 mb-3">Jul 30 08:50 pm</p> |
|
|
<a href="https://www.docsdriveintheatre.com/event/detail/4605" class="block w-full bg-yellow-500 hover:bg-yellow-600 text-gray-900 text-center font-medium py-2 rounded transition"> |
|
|
Buy Tickets |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<button class="absolute left-0 top-1/2 transform -translate-y-1/2 bg-black bg-opacity-50 text-white p-3 rounded-full ml-2 hover:bg-opacity-70 transition focus:outline-none"> |
|
|
<i class="fas fa-chevron-left"></i> |
|
|
</button> |
|
|
<button class="absolute right-0 top-1/2 transform -translate-y-1/2 bg-black bg-opacity-50 text-white p-3 rounded-full mr-2 hover:bg-opacity-70 transition focus:outline-none"> |
|
|
<i class="fas fa-chevron-right"></i> |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="flex justify-center mt-8"> |
|
|
<a href="https://www.docsdriveintheatre.com/events/event-calendar" class="text-yellow-400 hover:text-yellow-300 font-medium flex items-center"> |
|
|
View Full Calendar <i class="fas fa-arrow-right ml-2"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-gray-900"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="flex flex-col lg:flex-row items-center"> |
|
|
<div class="lg:w-1/2 mb-10 lg:mb-0 lg:pr-12"> |
|
|
<h2 class="text-3xl font-bold mb-6">What Is Doc's Drive-In Outdoor Movie Theater?</h2> |
|
|
<p class="text-lg mb-8">Drive in, see a movie, hang out, and stay the night! Come for just a movie or stay for fun, games, events, surprises, and delicious food. Doc's Drive-In does so much more than just show your favorite films – it's a family-friendly, classic drive-in theater experience that expands the boundaries of imagination.</p> |
|
|
|
|
|
<div class="grid md:grid-cols-3 gap-6"> |
|
|
<div class="bg-gray-800 p-6 rounded-lg"> |
|
|
<div class="text-yellow-400 text-3xl mb-4"> |
|
|
<i class="fas fa-film"></i> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl mb-2">Movies</h3> |
|
|
<p class="text-gray-300">Modern and classic movies from every genre in a family-friendly environment.</p> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 p-6 rounded-lg"> |
|
|
<div class="text-yellow-400 text-3xl mb-4"> |
|
|
<i class="fas fa-calendar-alt"></i> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl mb-2">Events</h3> |
|
|
<p class="text-gray-300">Amazing events for movie buffs, enthusiasts, and casual movie-goers.</p> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 p-6 rounded-lg"> |
|
|
<div class="text-yellow-400 text-3xl mb-4"> |
|
|
<i class="fas fa-utensils"></i> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl mb-2">Concessions</h3> |
|
|
<p class="text-gray-300">Extraordinary food choices to enhance your moviegoing experience.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="lg:w-1/2"> |
|
|
<img src="https://www.docsdriveintheatre.com/public/custom/images/tinyhome.png" alt="Tiny Home at Doc's Drive-In" class="rounded-lg shadow-xl w-full"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-gray-800"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="flex flex-col lg:flex-row items-center"> |
|
|
<div class="lg:w-1/2 mb-10 lg:mb-0 lg:pr-12 order-2 lg:order-1"> |
|
|
<img src="https://images.unsplash.com/photo-1582268611958-ebfd161ef9cf?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Drive-In Movie Experience" class="rounded-lg shadow-xl w-full"> |
|
|
</div> |
|
|
|
|
|
<div class="lg:w-1/2 lg:pl-12 order-1 lg:order-2"> |
|
|
<h2 class="text-3xl font-bold mb-6">Did you know you can stay the night?</h2> |
|
|
<p class="text-lg mb-6">No kidding - Doc's Drive-In outdoor movie theater goes beyond Austin's typical movie experience. We plan to provide great food, exciting games, and endless relaxation in your very own movie-themed vacation home.</p> |
|
|
<p class="text-lg mb-8">Get your family out of the house, steal away for a romantic night, or have the chance to stretch your legs by yourself in a Doc's Drive-In home away from home. You can also soak up the sun our your private tiny home deck, then catch a flick after sunset. Start planning your stay now – once we open the doors, our homes are sure to fill up fast!</p> |
|
|
<a href="https://www.docsdriveintheatre.com/rentals" class="inline-block bg-yellow-500 hover:bg-yellow-600 text-gray-900 font-bold px-8 py-3 rounded-full text-lg transition"> |
|
|
More Info |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-gray-900"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="text-center max-w-3xl mx-auto mb-12"> |
|
|
<h2 class="text-3xl font-bold mb-4">Want The Theater To Yourself?</h2> |
|
|
<p class="text-lg">Doc's Drive-In outdoor movie theater is a spacious and beautiful spot, jam-packed with food and fun – a perfect place to book your next birthday party, corporate retreat, or private event.</p> |
|
|
</div> |
|
|
|
|
|
<div class="flex flex-col lg:flex-row items-center"> |
|
|
<div class="lg:w-1/2 mb-10 lg:mb-0 lg:pr-12"> |
|
|
<p class="text-lg mb-8">Let our super-friendly staff help you throw an unforgettable get-together for your most important occasions. Enjoy extraordinary hospitality, a breathtaking Austin movie theater setup, thrilling games, and lovely scenery. Watch your favorite films with your favorite people and relive the magic of the classic Drive-In Movie theater when Doc's Drive-In opens right here in Austin, Texas.</p> |
|
|
<a href="https://www.docsdriveintheatre.com/private-theatre-rentals/" class="inline-block bg-yellow-500 hover:bg-yellow-600 text-gray-900 font-bold px-8 py-3 rounded-full text-lg transition"> |
|
|
More Info |
|
|
</a> |
|
|
</div> |
|
|
|
|
|
<div class="lg:w-1/2"> |
|
|
<div class="bg-gray-800 p-8 rounded-lg"> |
|
|
<h3 class="text-2xl font-bold mb-6 text-center">Perfect For:</h3> |
|
|
<ul class="space-y-4"> |
|
|
<li class="flex items-center"> |
|
|
<div class="bg-yellow-500 rounded-full p-2 mr-4"> |
|
|
<i class="fas fa-briefcase text-gray-900"></i> |
|
|
</div> |
|
|
<span class="text-lg">Corporate Events</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<div class="bg-yellow-500 rounded-full p-2 mr-4"> |
|
|
<i class="fas fa-birthday-cake text-gray-900"></i> |
|
|
</div> |
|
|
<span class="text-lg">Private Parties</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<div class="bg-yellow-500 rounded-full p-2 mr-4"> |
|
|
<i class="fas fa-hand-holding-heart text-gray-900"></i> |
|
|
</div> |
|
|
<span class="text-lg">Charity Events</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<div class="bg-yellow-500 rounded-full p-2 mr-4"> |
|
|
<i class="fas fa-film text-gray-900"></i> |
|
|
</div> |
|
|
<span class="text-lg">Screen 1. 101.7 FM</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<div class="bg-yellow-500 rounded-full p-2 mr-4"> |
|
|
<i class="fas fa-film text-gray-900"></i> |
|
|
</div> |
|
|
<span class="text-lg">Screen 2. 87.9 FM</span> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-yellow-600"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="max-w-4xl mx-auto text-center"> |
|
|
<h2 class="text-3xl font-bold mb-6 text-gray-900">Get All The Updates</h2> |
|
|
<p class="text-lg mb-8 text-gray-900">We want you to be among the first to know the latest about Austin's best drive-in movie theater, Doc's Drive-In! No need to bring your car in yet – we'll send our news and tidbits to your email.</p> |
|
|
|
|
|
<form class="bg-white rounded-lg shadow-lg p-6"> |
|
|
<div class="grid md:grid-cols-2 gap-6 mb-6"> |
|
|
<div> |
|
|
<label for="first-name" class="block text-gray-700 font-medium mb-2">First Name</label> |
|
|
<input type="text" id="first-name" class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-yellow-500"> |
|
|
</div> |
|
|
<div> |
|
|
<label for="last-name" class="block text-gray-700 font-medium mb-2">Last Name</label> |
|
|
<input type="text" id="last-name" class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-yellow-500"> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<label for="email" class="block text-gray-700 font-medium mb-2">Email*</label> |
|
|
<input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-yellow-500"> |
|
|
</div> |
|
|
|
|
|
<div class="mb-8"> |
|
|
<h3 class="text-gray-700 font-medium mb-4">Interests</h3> |
|
|
<div class="grid sm:grid-cols-3 gap-4"> |
|
|
<label class="custom-checkbox flex items-center"> |
|
|
<input type="checkbox" checked class="hidden"> |
|
|
<span class="checkmark border border-gray-400 rounded w-5 h-5 flex-shrink-0 mr-2"></span> |
|
|
<span class="text-gray-700">Movies</span> |
|
|
</label> |
|
|
|
|
|
<label class="custom-checkbox flex items-center"> |
|
|
<input type="checkbox" checked class="hidden"> |
|
|
<span class="checkmark border border-gray-400 rounded w-5 h-5 flex-shrink-0 mr-2"></span> |
|
|
<span class="text-gray-700">Events</span> |
|
|
</label> |
|
|
|
|
|
<label class="custom-checkbox flex items-center"> |
|
|
<input type="checkbox" checked class="hidden"> |
|
|
<span class="checkmark border border-gray-400 rounded w-5 h-5 flex-shrink-0 mr-2"></span> |
|
|
<span class="text-gray-700">Tiny Homes</span> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<button type="submit" class="w-full bg-gray-900 hover:bg-gray-800 text-white font-bold py-3 px-6 rounded transition"> |
|
|
Sign Up |
|
|
</button> |
|
|
</form> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<footer class="bg-gray-900 pt-16 pb-8"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="grid md:grid-cols-4 gap-12 mb-12"> |
|
|
<div> |
|
|
<img src="https://www.docsdriveintheatre.com/public/custom/images/logo.png" alt="Doc's Drive-In Logo" class="h-12 mb-4"> |
|
|
<p class="text-gray-400">Austin's premier drive-in movie theater experience with food, fun, and overnight stays.</p> |
|
|
<div class="flex space-x-4 mt-6"> |
|
|
<a href="https://www.facebook.com/docsdriveintheatre/" class="text-gray-400 hover:text-yellow-400 transition"> |
|
|
<i class="fab fa-facebook-f text-xl"></i> |
|
|
</a> |
|
|
<a href="https://twitter.com/hashtag/docsdriveintheatre" class="text-gray-400 hover:text-yellow-400 transition"> |
|
|
<i class="fab fa-twitter text-xl"></i> |
|
|
</a> |
|
|
<a href="https://www.instagram.com/docsdriveintheatre/?hl=en" class="text-gray-400 hover:text-yellow-400 transition"> |
|
|
<i class="fab fa-instagram text-xl"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">Links</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="https://www.docsdriveintheatre.com/page/about-us" class="text-gray-400 hover:text-yellow-400 transition">About Us</a></li> |
|
|
<li><a href="https://www.docsdriveintheatre.com/schedule" class="text-gray-400 hover:text-yellow-400 transition">Tickets</a></li> |
|
|
<li><a href="https://www.docsdriveintheatre.com/blogs" class="text-gray-400 hover:text-yellow-400 transition">News</a></li> |
|
|
<li><a href="https://www.docsdriveintheatre.com/page/privacy-policy" class="text-gray-400 hover:text-yellow-400 transition">Privacy Policy</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">Contact</h3> |
|
|
<address class="not-italic text-gray-400"> |
|
|
<p class="mb-2">1540 Satterwhite Rd</p> |
|
|
<p class="mb-2">Buda, Texas 78610</p> |
|
|
<p class="mb-4">(512) 960-4460</p> |
|
|
<a href="https://docs.google.com/spreadsheets/d/1efk4oxjplZW79yp1hcWfc3gof4eHc0K7etReELsNG5A/edit#gid=1291354053" class="text-gray-400 hover:text-yellow-400 transition block mb-2">Movie Admin</a> |
|
|
<a href="https://www.docsdriveintheatre.com/contact" class="text-gray-400 hover:text-yellow-400 transition">Report a Website Issue</a> |
|
|
</address> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">Connect</h3> |
|
|
<div class="flex space-x-4"> |
|
|
<a href="https://www.facebook.com/docsdriveintheatre/" class="text-gray-400 hover:text-yellow-400 transition"> |
|
|
<i class="fab fa-facebook-f text-2xl"></i> |
|
|
</a> |
|
|
<a href="https://twitter.com/hashtag/docsdriveintheatre" class="text-gray-400 hover:text-yellow-400 transition"> |
|
|
<i class="fab fa-twitter text-2xl"></i> |
|
|
</a> |
|
|
<a href="https://www.instagram.com/docsdriveintheatre/?hl=en" class="text-gray-400 hover:text-yellow-400 transition"> |
|
|
<i class="fab fa-instagram text-2xl"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="border-t border-gray-800 pt-8"> |
|
|
<p class="text-gray-500 text-center">© 2023 Doc's Drive In Theatre. Brought to you by <a href="http://youthtechsolutions.com/" class="text-yellow-400 hover:text-yellow-300 transition">Yothtechsolutions.com</a></p> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
<script> |
|
|
|
|
|
const mobileMenuButton = document.getElementById('mobile-menu-button'); |
|
|
const mobileMenu = document.getElementById('mobile-menu'); |
|
|
const closeMobileMenu = document.getElementById('close-mobile-menu'); |
|
|
|
|
|
mobileMenuButton.addEventListener('click', () => { |
|
|
mobileMenu.classList.remove('hidden'); |
|
|
document.body.style.overflow = 'hidden'; |
|
|
}); |
|
|
|
|
|
closeMobileMenu.addEventListener('click', () => { |
|
|
mobileMenu.classList.add('hidden'); |
|
|
document.body.style.overflow = 'auto'; |
|
|
}); |
|
|
|
|
|
|
|
|
const carousel = document.querySelector('.carousel'); |
|
|
const prevBtn = document.querySelector('.absolute.left-0'); |
|
|
const nextBtn = document.querySelector('.absolute.right-0'); |
|
|
|
|
|
nextBtn.addEventListener('click', () => { |
|
|
carousel.scrollBy({ left: 300, behavior: 'smooth' }); |
|
|
}); |
|
|
|
|
|
prevBtn.addEventListener('click', () => { |
|
|
carousel.scrollBy({ left: -300, behavior: 'smooth' }); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('header img').forEach(logo => { |
|
|
logo.addEventListener('click', (e) => { |
|
|
if (window.location.pathname === '/') { |
|
|
e.preventDefault(); |
|
|
window.scrollTo({ top: 0, behavior: 'smooth' }); |
|
|
} |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
<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=ssergorp/docs" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
