diff --git "a/images/Screenshot 2026-04-01 at 10.23.29\342\200\257PM.png" "b/images/Screenshot 2026-04-01 at 10.23.29\342\200\257PM.png"
new file mode 100644
index 0000000..cff78a4
Binary files /dev/null and "b/images/Screenshot 2026-04-01 at 10.23.29\342\200\257PM.png" differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..54fb103
--- /dev/null
+++ b/index.html
@@ -0,0 +1,36 @@
+
+
+
+
+ DriveBox
+
+
+
+
+
+ 🚗 Click Bates Drive-Thru
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..01ceda4
--- /dev/null
+++ b/script.js
@@ -0,0 +1,58 @@
+function updateMenu(title, items) {
+ menuTitle.textContent = title;
+ menuDisplay.innerHTML = items;
+}
+console.log("JavaScript is connected!");
+//Button//
+const breakfastButton = document.querySelector("#breakfast-btn");
+const lunchButton = document.querySelector("#lunch-btn");
+const dinnerButton = document.querySelector("#dinner-btn");
+//Menu//
+const breakfastMenu = document.querySelector("#breakfast-menu");
+const lunchMenu = document.querySelector("#lunch-menu");
+const dinnerMenu = document.querySelector("#dinner-menu");
+//Event Listeners//
+breakfastButton.addEventListener("click", () => {
+ breakfastMenu.style.display = "block";
+ lunchMenu.style.display = "none";
+ dinnerMenu.style.display = "none";
+});
+lunchButton.addEventListener("click", () => {
+ breakfastMenu.style.display = "none";
+ lunchMenu.style.display = "block";
+ dinnerMenu.style.display = "none";
+});lunchButton.addEventListener("click", function () {
+ menuTitle.textContent = "Lunch Menu";
+ menuDisplay.textContent = "Burger, Fries, Salad";
+});
+const menuTitle = document.querySelector("#menu-title");
+const menuDisplay = document.querySelector("#menu-display");
+dinnerButton.addEventListener("click", () => {
+ breakfastMenu.style.display = "none";
+ lunchMenu.style.display = "none";
+ dinnerMenu.style.display = "block";
+});dinnerButton.addEventListener("click", function () {
+ menuTitle.textContent = "Dinner Menu";
+ menuDisplay.textContent = "Steak, Rice, Vegetables";
+});
+breakfastButton.addEventListener("click", function () {
+ updateMenu(
+ "Breakfast Menu",
+ `
+ Pancakes
+ Fluffy and delicious
+
+ Eggs & Bacon
+ Classic breakfast combo
+ `
+ );
+});updateMenu("Breakfast Menu", breakfastItems);
+
+lunchButton.addEventListener("click", function () {
+ menuTitle.textContent = "Lunch Menu";
+ menuDisplay.textContent = "Burger, Fries, Salad";
+});
+dinnerButton.addEventListener("click", function () {
+ menuTitle.textContent = "Dinner Menu";
+ menuDisplay.textContent = "Steak, Rice, Vegetables";
+});const drinksButton = document.querySelector("#drinks-btn");
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..338ab8a
--- /dev/null
+++ b/style.css
@@ -0,0 +1,72 @@
+body {
+ font-family: Arial, sans-serif;
+ text-align: center;
+ background: #0F172A;
+ color: #F8FAFC;
+ overflow-x: hidden;
+}
+
+/* Logo / Title */
+.logo {
+ font-size: 2.5rem;
+ margin-top: 20px;
+}
+
+/* Buttons container */
+.buttons {
+ margin: 20px;
+}
+
+/* Buttons */
+button {
+ margin: 10px;
+ padding: 12px 20px;
+ border: none;
+ border-radius: 999px;
+ background: #22C55E;
+ color: black;
+ font-weight: bold;
+ cursor: pointer;
+ box-shadow: 0 0 15px #22C55E;
+ transition: 0.3s;
+}
+
+button:hover {
+ transform: scale(1.1);
+}
+
+/* Menu Display Box */
+.menu-box {
+ margin: 30px auto;
+ padding: 20px;
+ width: 300px;
+ background: rgba(255,255,255,0.05);
+ border-radius: 20px;
+ backdrop-filter: blur(10px);
+ font-size: 18px;
+ animation: fadeIn 0.5s ease-in;
+}
+
+/* Floating Food */
+.floating-food img {
+ position: absolute;
+ width: 100px;
+ animation: float 4s ease-in-out infinite;
+}
+
+.burger { top: 20%; left: 10%; }
+.fries { top: 50%; right: 10%; }
+.drink { bottom: 10%; left: 40%; }
+
+/* Floating animation */
+@keyframes float {
+ 0% { transform: translateY(0px); }
+ 50% { transform: translateY(-20px); }
+ 100% { transform: translateY(0px); }
+}
+
+/* Fade in effect */
+@keyframes fadeIn {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
\ No newline at end of file
+ 
+ 
+