diff --git a/hotel_booking/.gitignore b/hotel_booking/.gitignore
new file mode 100644
index 0000000..2c31100
--- /dev/null
+++ b/hotel_booking/.gitignore
@@ -0,0 +1 @@
+images/*
\ No newline at end of file
diff --git a/hotel_booking/about.php b/hotel_booking/about.php
index d438059..99af111 100644
--- a/hotel_booking/about.php
+++ b/hotel_booking/about.php
@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Midtown Hotel | About the hotel</title>
+    <title>About the hotel | Midtown Hotel</title>
     <?php require('./components/link.php') ?>
     <style>
         .about-hero{
@@ -287,7 +287,7 @@
         <div class="hero-content">
             <div class="hero-head">
                 <h1 class="hero-title">About the Hotel</h1>
-                <p class="hero-subtitle">Midtown Hotel, where quality and great atmosphere unite</p>
+                <p class="hero-subtitle">Midtown hotel, where quality and great atmosphere unite</p>
             </div>
         </div>
     </div>
diff --git a/hotel_booking/components/header.php b/hotel_booking/components/header.php
index fece2aa..cb1eff6 100644
--- a/hotel_booking/components/header.php
+++ b/hotel_booking/components/header.php
@@ -28,7 +28,7 @@
                     <a class="nav-link" href="../about.php">About</a>
                 </li>
                 <li class="nav-item">
-                    <a class="nav-link" href="#">Contact</a>
+                    <a class="nav-link" href="../contact.php">Contact</a>
                 </li>
                 <li class="nav-item">
                     <a class="nav-link" data-bs-toggle="modal" data-bs-target="#loginBackdrop" style="cursor: pointer;">Login</a>
@@ -70,7 +70,7 @@
                     <a href="../about.php" class="nav-link">About</a>
                 </li>
                 <li class="nav-item">
-                    <a href="#" class="nav-link">Contact</a>
+                    <a href="../contact.php" class="nav-link">Contact</a>
                 </li>
                 <li style="padding-top: 50px">
                     <buton type="button" class="nav-link btn shadow-none" data-bs-toggle="modal" data-bs-target="#loginBackdrop" style="border: 1px solid white; font-weight: 500; color: white;">Login</button>
diff --git a/hotel_booking/contact.php b/hotel_booking/contact.php
new file mode 100644
index 0000000..59c7389
--- /dev/null
+++ b/hotel_booking/contact.php
@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Contact | Midtown Hotel</title>
+    <?php require('./components/link.php') ?>
+    <style>
+        .contact-hero{
+            position: relative;
+            height: 100vh;
+            background-size: cover;
+            background-position: center;
+            background-image: url(images/contact.jpg);
+            width: 100%;
+            display: flex;
+            flex-direction: column;
+        }
+        .contact-container{
+            width: 80%;
+            display: flex;
+            justify-content: space-between;
+            position: relative;
+            align-items: center;
+            margin: 150px auto;
+        }
+        .contact-wrapper{
+            height:100%;
+            width: 100%;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            align-items: center;
+        }
+        .video-contact{
+            width: 100%;
+            height: auto;
+        }
+        @media (max-width:980px) {
+            .contact-container{
+                flex-direction: column;
+                gap: 50px;
+                margin: 75px auto;
+                width: 90%;
+            }
+        }
+        @media (max-width:450px) {
+            .contact-hero{
+                height: 80vh;
+            }
+            .contact-container{
+                margin: 50px auto;
+            }
+        }
+    </style>
+</head>
+<body>
+    <!--Hero & Navbar section-->
+    <div class="contact-hero">
+        <?php require('./components/header.php') ?>
+        <div class="hero-content">
+            <div class="hero-head">
+                <h1 class="hero-title">Contact</h1>
+                <p class="hero-subtitle">We look forward to assisting you with arranging your </br> next stay at Midtown hotel</p>
+            </div>
+        </div>
+    </div>
+    <div class="panel" data-color="white">
+        <div class="contact-container">
+            <div class="contact-wrapper">
+                <p style="margin-bottom: 50px; color: #BFB4A4; font-weight: 500; letter-spacing: 1px;">Address</p>
+                <p style="text-align: center; font-size: 28px;">Midtown Hotel</p>
+                <p style="text-align: center;">36381 Trantow Hill, New Port, FL 57941</p>
+                <div class="col-lg-12 text-center mt-5 mb-2">
+                    <a href="https://www.google.com/maps/place/Florida/@28.1703405,-82.5355157,7.46z/data=!4m6!3m5!1s0x88c1766591562abf:0xf72e13d35bc74ed0!8m2!3d27.6648274!4d-81.5157535!16zL20vMDJ4cnk?entry=ttu" class="btn-th">Open map</a>
+                </div>
+            </div>
+            <div class="contact-wrapper">
+                <video class="video-contact" autoplay muted>
+                    <source src="./images/video.mp4" type="video/mp4" >
+                </video> 
+            </div>
+        </div>
+        
+    </div>
+
+
+
+
+     <!--footer-->
+     <?php require('./components/footer.php'); ?>
+
+    <?php require('./components/script.php') ?>
+</body>
+</html>
\ No newline at end of file
diff --git a/hotel_booking/services.php b/hotel_booking/services.php
index ce13d14..b9a0e13 100644
--- a/hotel_booking/services.php
+++ b/hotel_booking/services.php
@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Midtown Hotel | Services</title>
+    <title>Services | Midtown Hotel</title>
     <?php require('./components/link.php') ?>
     <style>
         .service-hero, .sauna-service{
