codingburgas · NIIvanov24 · Apr 16, 2025 · Apr 24, 2025 · Apr 24, 2025 · Apr 24, 2025
diff --git a/Html/categories.html b/Html/categories.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Categories | Flex-Auto</title>
+</head>
+<body>
+    <h1></h1>
+</body>
+</html>
diff --git a/Html/index.html b/Html/index.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+
+<head>
+  <meta charset="UTF-8">
+  <title>Flex-Auto</title>
+  <link rel="stylesheet" href="../Styles/indexcss.css">
+</head>
+<body>
+  <header>
+    <div class="logo-container">
+        <a href="index.html">
+          <img src="../images/9026B910-0E90-4327-85D9-7EA27659B853 (1).png" alt="Лого на Rent-a-Car" class="logo" >
+        </a>
+      </div>
+      <nav>
+        <ul>
+
+
+        </ul>
+      </nav>
+
+      <h1>Welcome to Flex-Auto!</h1>
+
+    <nav>
+      <ul>
+        <li><a href="index.html#index">Home</a></li> <hr>
+        <li><a href="categories.html">Categories</a></li> <hr>
+     <li><a href="#contact.html">Contact</a></li> <hr>
+
+        <li><a href="loginpage.html">Sing in</a></li>
+
+      </ul>
+    </nav>
+
+<div>
+
+
+</div>
+
+
+  </header>
+  <div class="booking-form">
+    <h1>Car Rental Booking</h1>
+
+    <section id="reservation" class="section bg-light">
+      <div class="container">
+        <h2>Reserve Your Car</h2>
+        <div class="booking-form">
+          <div class="form-group">
+            <label for="pickup-location">Pick-up location</label>
+            <input type="text" id="pickup-location" placeholder="Airport, city or station">
+          </div>
+
+          <div class="form-row">
+            <div class="form-group">
+              <label for="pickup-date">Pick-up date</label>
+              <input type="date" id="pickup-date">
+            </div>
+
+            <div class="form-group">
+              <label for="pickup-time">Time</label>
+              <input type="time" id="pickup-time" value="10:00">
+            </div>
+          </div>
+
+          <div class="form-row">
+            <div class="form-group">
+              <label for="dropoff-date">Drop-off date</label>
+              <input type="date" id="dropoff-date">
+            </div>
+
+            <div class="form-group">
+              <label for="dropoff-time">Time</label>
+              <input type="time" id="dropoff-time" value="10:00">
+            </div>
+          </div>
+  <main>
+    <section>
+      <h2>Rent vehicle fast and easy!</h2>
+      <p>Browse our extensive collection of rental cars and choose the one that suits you best!</p>
+    </section>
+  </main>
+
+  <footer>
+    <h2>Contact Us</h2>
+        <p>Email: <a href="mailto:[email protected]">[email protected]</a></p>
+        <p>Phone: +1 234 567 000</p>
+
+    <p>&copy; 2025 Flex-Auto</p>
+  </footer>
+</body>
+</html>
diff --git a/Html/loginpage.html b/Html/loginpage.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Login | Flex-Auto</title>
+    <link rel="stylesheet" href="../Styles/loginregister.css">
+
+
+</head>
+<body>
+
+    <header>
+        <div class="logo">🚗 Flex-Auto</div>
+        <nav>
+            <ul>
+                <li><a href="index.html">Home</a></li>
+
+                <li><a href="#">Categories</a></li>
+
+                <li><a href="#">Our Team</a></li>
+                <li><a href="#">Contact</a></li>
+
+            </ul>
+        </nav>
+    </header>
+
+    <main>
+        <section class="login-section">
+            <h1>Login to <span>Flex-Auto</span></h1>
+
+                <label for="email">Email:</label>
+                <input type="email" id="email" name="email" placeholder="Enter your email" required><br>
+
+                <label for="password">Password:</label>
+                <input type="password" id="password" name="password" placeholder="Enter a password" required><br>
+
+                <button type="button" class="button-primary" onclick="window.location.href='../Html/index.html'">
+                    Login
+                  </button>
+            </form>
+            <p>Don't have an account? <a href="../Html/register.html">Register here.</a></p>
+            <p><a href="../Html/index.html">← Back to Home</a></p>
+        </section>
+    </main>
+
+    <footer>
+        <p>© 2025 Flex-Auto. All rights reserved. | <a href="privacy.html">Privacy Policy</a></p>
+    </footer>
+
+</body>
+</html>
diff --git a/Html/register.html b/Html/register.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Register | Flex-Auto</title>
+    <link rel="stylesheet" href="../Styles/loginregister.css">
+</head>
+<body>
+
+    <header>
+        <div class="logo">🚗 Flex-Auto</div>
+        <nav>
+            <ul>
+                <li><a href="index.html">Home</a></li>
+
+                <li><a href="#">Categories</a></li>
+
+
+                <li><a href="#">Our Team</a></li>
+                <li><a href="#">Contact</a></li>
+
+
+            </ul>
+        </nav>
+    </header>
+
+    <main>
+        <section class="login-section">
+            <h1>Register to <span>Flex-Auto</span></h1>
+            <form action="/submit_form" method="post">
+                <label for="fname">First Name:</label>
+                <input type="text" id="fname" name="firstname" placeholder="Enter your first name" required><br>
+
+                <label for="lname">Last Name:</label>
+                <input type="text" id="lname" name="lastname" placeholder="Enter your last name" required><br>
+
+                <label for="username">Username:</label>
+                <input type="text" id="username" name="username" placeholder="Choose a username" required><br>
+
+                <label for="email">Email:</label>
+                <input type="email" id="email" name="email" placeholder="Enter your email" required><br>
+
+                <label for="password">Password:</label>
+                <input type="password" id="password" name="password" placeholder="Choose a password" required><br>
+
+                <label for="postcode">Post Code:</label>
+                <input type="text" id="postcode" name="postcode" placeholder="Enter your post code" pattern="\d+" required><br>
+
+                <label for="tel">Tel. Number:</label>
+                <input type="tel" id="tel" name="tel" placeholder="Enter your phone number" pattern="\d+" required><br>
+
+                <button type="button" class="button-primary" onclick="window.location.href='../Html/index.html'">
+                    Login
+                  </button><br>
+            </form>
+            <p>Have an account already? <a href="../Html/loginpage.html">Login here.</a></p>
+            <p><a href="../Html/index.html">← Back to Home</a></p>
+        </section>
+    </main>
+
+    <footer>
+        <p>© 2025 Flex-Auto. All rights reserved. | <a href="privacy.html">Privacy Policy</a></p>
+    </footer>
+
+</body>
+</html>
diff --git a/README.md b/README.md
@@ -1,2 +1,29 @@
-# 8grade---RentACar
-first 8 grade project
+![Лого на Flex-Auto](https://github.com/codingburgas/8grade-html-css-project-flexauto/blob/main/images/9026B910-0E90-4327-85D9-7EA27659B853%20(1).png)
+
+
+
+
+# 🚙 Flex-Auto
+**Flex-Auto** is a web-based car rental platform designed to offer users a simple and flexible way to find, book, and manage car rentals online. This project was developed as part of a school assignment to showcase modern web development techniques and create a practical, user-centric application.
+
+
+
+## 🌟 Key Features
+
+- 🔍 **Easy Search & Filters** – Quickly find the perfect car by location, type, price range, and availability.
+- 📆 **Flexible Booking System** – Rent by the hour, day, or week — your ride, your rules.
+- 🛡️ **Secure Payments** – Safe, encrypted transactions with multiple payment options.
+- 🚘 **Wide Range of Vehicles** – From budget-friendly compacts to luxurious SUVs and electric cars.
+- 📱 **Mobile Responsive** – Seamlessly accessible on all devices, from desktop to mobile.
+- ⭐ **User Reviews & Ratings** – Trustworthy feedback from real renters.
+- 💬 **Live Chat Support** – Get help instantly from our support team.
+
+
+
+## 💻 Technology used:
+
+<img src="https://github.com/codingburgas/8grade-html-css-project-flexauto/blob/main/images/Microsoft-Teams-Logo.png" width="100">
+<img src="https://github.com/codingburgas/8grade-html-css-project-flexauto/blob/main/images/R.png" width="100">
+<img src="https://github.com/codingburgas/8grade-html-css-project-flexauto/blob/main/images/css-3-logo.png" width="100">
+<img src="https://github.com/codingburgas/8grade-html-css-project-flexauto/blob/main/images/Canva-Emblem.png" width="100">
+<img src="https://github.com/codingburgas/8grade-html-css-project-flexauto/blob/main/images/html-logo.png" width="100">