diff --git a/index.html b/index.html
index 05670ef9..2e27c9da 100644
--- a/index.html
+++ b/index.html
@@ -4,11 +4,12 @@
 <head>
   <meta charset="utf-8">
   <meta content="width=device-width, initial-scale=1.0" name="viewport">
- <link rel="shortcut icon" href="images/Screenshot 2024-05-18 at 10.12.21 PM.png" type="image/x-icon">
+  <link rel="icon" type="image/x-icon" href="/favicon.ico">
+
   <link rel="stylesheet" type="text/css" href="./style.css" />
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
   <script src="https://kit.fontawesome.com/b08b6de27e.js" crossorigin="anonymous"></script>
-  
+
   <title>RapiDoc</title>
   <link
     href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i"
@@ -24,60 +25,78 @@
   <link href="remixicon/remixicon.css" rel="stylesheet">
   <link href="swiper/swiper-bundle.min.css" rel="stylesheet">
   <link href="style.css" rel="stylesheet">
-  <link href="Css-Files\patient-portal.css" rel="stylesheet">
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
 
+                         
+  <link href="patient-portal.css" rel="stylesheet">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"
+    integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A=="
+    crossorigin="anonymous" referrerpolicy="no-referrer" />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/css/intlTelInput.css">
+    <style>
+      /* Ensure the input takes up full width */
+        .iti--allow-dropdown input {
+            padding-left: 50px;
+            background-color: black; /*Adjust padding to prevent overlap*/
+        }
+        .iti.iti--allow-dropdown{
+          margin-left: 250px;
+        }
+       
+
+    </style>
 </head>
 
 <body>
-      <!-- ############# Header ############# -->
-  
-      <header class="header_container">
-        <div class="img">
-        <img src="images/rd.png" width="70" height="80"> 
-      </div>
-      <div class="text" style="margin-left: -20rem;">
-  
-        <h1 class="logo me-auto"><a style="text-decoration: none; color: #55a5ea;" href="index.html">RapiDoc</a></h1>
-      </div>
-      <nav class="nav_menu">
-
-        <ul class="nav_link">
-          <li><a href="index.html">Home</a></li>
-          <li><a href="#about">About</a></li>
-          <li><a href="Html-Files/news.html">News</a></li>
-          <li><a href="#services">Services</a></li>
-          <li><a href="#patient-portal">Patient Portal</a></li>
-          <li><a href="#doctors">Doctor</a></li>
-          <li><a href="Html-Files/contact.html">Contact us</a></li>
-        </ul>
-      </nav>
-      </div>
-    </header>
+  <!-- ############# Header ############# -->
+
+  <header class="header_container">
+    <div class="img">
+      <img id="rd-logo" style="width: 90px; height: auto;" src="/images/rd.png">
+    </div>
+    <div class="text" style="margin-left: -33rem;">
+
+      <h1 class="logo me-auto"><a style="text-decoration: none; color: #55a5ea;" href="index.html">RapiDoc</a></h1>
+    </div>
+    <nav class="nav_menu">
+
+      <ul class="nav_link">
+        <li><a href="index.html">Home</a></li>
+        <li><a href="#about">About</a></li>
+        <li><a href="Html-Files/news.html">News</a></li>
+        <li><a href="#services">Services</a></li>
+        <li><a href="#patient-portal">patient Portal</a></li>
+        <li><a href="#doctors">Doctor</a></li>
+        <li><a href="Html-Files/contact.html">Contact us</a></li>
+      </ul>
+    </nav>
+    </div>
+  </header>
+
 
 
   <div class="container">
     <div class="content">
       <h1 style="font-size: 65px;">
-        Welcome to <span>RapiDoc!</span> <br /> Your one-stop digital <br> healthcare destination
+        Welcome to <span style="color: #55a5ea;">RapiDoc!</span> <br /> Your one-stop digital <br> healthcare
+        destination
       </h1>
-      <h2>
-       <a href="#about" class="btn-get-started scrollto">Download App</a>
-      </h2>
-    </div>    
-    <img style="position: relative; top: -70px; right: -10rem;" class="sec-img" src="images/rd.png" alt="" />
+      <h4>
+        <!-- <a href="#about" class="btn-get-started scrollto">Download App</a> -->
+      </h4>
+    </div>
+    <img style="position: relative; top: -60px; right: -10rem;" class="sec-img" src="images/rd.png" alt="" />
   </div>
   <br><br><br><br><br>
   <!-- End Home -->
   <main id="main">
 
-   
-   
+
+
     <!-- ############ Featured Services Section ############ -->
-    
-    
+
+
     <section id="featured-services" class="featured-services">
-      <div class="container-fluid" data-aos="fade-up">
+      <div class="container" data-aos="fade-up">
 
         <div class="row">
           <div class="col-md-6 col-lg-3 d-flex align-items-stretch mb-5 mb-lg-0">
@@ -110,7 +129,7 @@ <h4 class="title"><a href="">Body temperature</a></h4>
             <div class="icon-box" data-aos="fade-up" data-aos-delay="200">
               <div class="icon4"><i class="fas fa-hand-holding-medical"></i></div>
               <h4 class="title"><a href="">Medicine use</a></h4>
-              <p class="description">Know what to use when to use and how to use.
+              <p class="description">Know what to use when to use and how to use.
               </p>
             </div>
           </div>
@@ -120,35 +139,35 @@ <h4 class="title"><a href="">Medicine use</a></h4>
       </div>
     </section><!-- End Featured Services Section -->
 
-   
+
     <!-- ################### About Section ################### -->
-   
-   
+
+
     <section id="about" class="about">
-      <div class="container-fluid" data-aos="fade-up">
+      <div class="container" data-aos="fade-up">
         <div class="section-title">
-          <h2 style="text-align: center;">About Us</h2>
-          <p >RapiDoc is an online platform which enables you to get information about your nearest hospitals and
+          <h2>About Us</h2>
+          <p>RapiDoc is an online platform which enables you to get information about your nearest hospitals and
             healthcare facilities. It aims to address health-related issues. It is a one-stop destination for all your
-            medical needs providing 24X7 helpline services for conventional benefits.</p>
+            medical needs.</p>
         </div>
 
         <div class="row">
-          <!-- <div class="col-xl-5 col-lg-6 video-box d-flex justify-content-center
+          <div class="col-xl-5 col-lg-6 video-box d-flex justify-content-center
      align-items-stretch position-relative">
-            <a href="https://youtu.be/ImQqQ9_s38k" class="glightbox play-btn mb-4"></a>
-          </div> -->
- <div class="col-xl-7 col-lg-6 icon-boxes d-flex flex-column align-items-stretch
+            <!-- <a href="https://youtu.be/ImQqQ9_s38k" class="glightbox play-btn mb-4"></a> -->
+          </div>
+          <div class="col-xl-7 col-lg-6 icon-boxes d-flex flex-column align-items-stretch
      justify-content-center py-5 px-lg-5">
 
             <div class="icon-box">
-              <div class="icon"><i class="fas fa-heart"></i></div>
+              <div class="icon"><i class="bx bx-heart"></i></div>
               <h4 class="title"><a href="">HEALTH CHECKUPS</a></h4>
               <p class="description">Bootcamps, personalised check-ups, newsletters, it’s all here.</p>
             </div>
-                   
+
             <div class="icon-box">
-              <div class="icon"><i class="fas fa-stethoscope"></i></div>
+              <div class="icon"><i class="bx bx-health"></i></div>
               <h4 class="title"><a href="">EMERGENCY WARDS</a></h4>
               <p class="description">Avoid rush and get immediate medical assistance, know the
                 wards and vacancies.
@@ -156,7 +175,7 @@ <h4 class="title"><a href="">EMERGENCY WARDS</a></h4>
             </div>
 
             <div class="icon-box">
-              <div class="icon"><i class="fas fa-question"></i></div>
+              <div class="icon"><i class="bx bx-help-circle"></i></div>
               <h4 class="title"><a href="">SERVICES</a></h4>
               <p class="description">An apple a day won’t keep RapiDoc away. We are always here at your service,
                 bringing to you the best facilities.</p>
@@ -167,14 +186,14 @@ <h4 class="title"><a href="">SERVICES</a></h4>
       </div>
     </section><!-- End About Section -->
 
-   
+
     <!-- ################## Counts Section ################## -->
-   
-   
+
+
     <section id="counts" class="counts">
       <div class="container" data-aos="fade-up">
 
-        <div class="row-d">
+        <div class="row no-gutters">
 
           <div class="col-lg-3 col-md-6 d-md-flex align-items-md-stretch">
             <div class="count-box">
@@ -221,10 +240,10 @@ <h4 class="title"><a href="">SERVICES</a></h4>
       </div>
     </section><!-- End Counts Section -->
 
-   
+
     <!-- #################### Services Section #################### -->
-   
-   
+
+
     <section id="services" class="services">
       <div class="container">
 
@@ -325,12 +344,10 @@ <h2>Patient Portal</h2>
 
       <!-- Add Forgot Password Link -->
 
-    </div>
-  </section><!-- End Patient Portal Section -->
-   
+
     <!-- ############# Appointment Section ############# -->
-   
-   
+
+
     <section id="appointment" class="appointment section-bg">
       <div class="container">
 
@@ -340,93 +357,104 @@ <h2>Make an Appointment</h2>
         </div>
         <div class="layout">
           <form accept="" role="form" class="php-email-form">
-  <div class="row">
-    <div class="col-md-4 form-group">
-      <input type="text" name="name" class="form-control" id="name" placeholder="Your Name">
-    </div>
-    <div class="col-md-4 form-group mt-3 mt-md-0">
-      <input type="email" class="form-control" name="email" id="email" placeholder="Your Email">
-    </div>
-    <div class="col-md-4 form-group mt-3 mt-md-0">
-      <input type="tel" class="form-control" name="phone" id="phone" placeholder="Your Phone">
-    </div>
-  </div>
-  <div class="row">
-    <div class="col-md-4 form-group mt-3">
-      <input type="datetime" name="date" class="form-control datepicker" id="date" placeholder="Appointment Date">
-    </div>
-    <div class="col-md-4 form-group mt-3">
-      <select name="age" id="age" class="form-select">
-        <option value="">Select Age</option>
-        <option value="Department 1">18 or below</option>
-        <option value="Department 2">18 to 55</option>
-        <option value="Department 3">55 above</option>
-      </select>
-    </div>
-    <div class="col-md-4 form-group mt-3">
-      <select name="doctor" id="doctor" class="form-select">
-        <option value="">Your Location</option>
-        <option value="Doctor 1">Mumbai</option>
-        <option value="Doctor 2">Delhi</option>
-        <option value="Doctor 3">Chennai</option>
-        <!-- Add more locations as needed -->
-      </select>
-    </div>
-  </div>
+            <div class="row">
+              <div class="col-md-4 form-group">
+                <input type="text" name="name" class="form-control" id="name" placeholder="Your Name">
+              </div>
+              <div class="col-md-4 form-group mt-3 mt-md-0">
+                <input type="email" class="form-control" name="email" id="email" placeholder="Your Email">
+              </div>
+              <div class="col-md-4 form-group mt-3 mt-md-0">
+                <input type="tel" class="form-control" name="phone" id="phone" placeholder="Your Phone" maxlength="10"
+                  minlength="10" pattern="[0-9]*" style="width: 100%;">
+              </div>
+            </div>
+            <div class="row">
+              <div class="col-md-4 form-group mt-3">
+                <input type="date" name="date" class="form-control datepicker" id="date" placeholder="Appointment Date">
+
+                <script>   //To set value of minimum date in calender 
+                  var currentDate = new Date();
+                  var year = currentDate.getFullYear();
+                  var month = (currentDate.getMonth() + 1).toString().padStart(2, '0');
+                  var day = currentDate.getDate().toString().padStart(2, '0');
+                  var formattedDate = `${year}-${month}-${day}`;
+
+                  document.getElementById('date').setAttribute('min', formattedDate);
+                </script>
+              </div>
+              <div class="col-md-4 form-group mt-3">
+                <select name="age" id="age" class="form-select">
+                  <option value="">Select Age</option>
+                  <option value="Department 1">18 or below</option>
+                  <option value="Department 2">18 to 55</option>
+                  <option value="Department 3">55 above</option>
+                </select>
+              </div>
+              <div class="col-md-4 form-group mt-3">
+                <select name="doctor" id="doctor" class="form-select">
+                  <option value="">Your Location</option>
+                  <option value="Doctor 1">Mumbai</option>
+                  <option value="Doctor 2">Delhi</option>
+                  <option value="Doctor 3">Chennai</option>
+                  <!-- Add more locations as needed -->
+                </select>
+              </div>
+            </div>
 
-  <!-- Time Slot Section -->
-  <div class="row">
-    <div class="col-md-12 form-group mt-3">
-     
-      <select name="time-slot" id="time-slot" class="form-select">
-        <option value="">Select Time Slot</option>
-        <!-- Populate with available time slots -->
-        <option value="9:00 AM">9:00 AM</option>
-        <option value="11:00 AM">11:00 AM</option>
-        <option value="2:00 PM">2:00 PM</option>
-        <!-- Add more time slots as needed -->
-      </select>
-    </div>
-  </div>
+            <!-- Time Slot Section -->
+            <div class="row">
+              <div class="col-md-12 form-group mt-3">
+
+                <select name="time-slot" id="time-slot" class="form-select">
+                  <option value="">Select Time Slot</option>
+                  <!-- Populate with available time slots -->
+                  <option value="9:00 AM">9:00 AM</option>
+                  <option value="11:00 AM">11:00 AM</option>
+                  <option value="2:00 PM">2:00 PM</option>
+                  <!-- Add more time slots as needed -->
+                </select>
+              </div>
+            </div>
 
-  <!-- Hospital Selection Section -->
-  <div class="row">
-    <div class="col-md-12 form-group mt-3">
-     
-      <select name="hospital" id="hospital" class="form-select">
-        <option value="">Select Hospital</option>
-        <!-- Populate with available hospitals -->
-        <option value="Hospital 1">Hospital 1</option>
-        <option value="Hospital 2">Hospital 2</option>
-        <option value="Hospital 3">Hospital 3</option>
-        <!-- Add more hospitals as needed -->
-      </select>
-    </div>
-  </div>
+            <!-- Hospital Selection Section -->
+            <div class="row">
+              <div class="col-md-12 form-group mt-3">
+
+                <select name="hospital" id="hospital" class="form-select">
+                  <option value="">Select Hospital</option>
+                  <!-- Populate with available hospitals -->
+                  <option value="Hospital 1">Hospital 1</option>
+                  <option value="Hospital 2">Hospital 2</option>
+                  <option value="Hospital 3">Hospital 3</option>
+                  <!-- Add more hospitals as needed -->
+                </select>
+              </div>
+            </div>
 
-  <!-- OPD Section -->
-  <div class="row">
-    <div class="col-md-12 form-group mt-3">
-      
-      <select name="opd-section" id="opd-section" class="form-select">
-        <option value="">Select OPD Section</option>
-        <!-- Populate with available OPD sections -->
-        <option value="ENT">ENT</option>
-        <option value="Gynecologist">Gynecologist</option>
-        <!-- Add more OPD sections as needed -->
-      </select>
-    </div>
-  </div>
+            <!-- OPD Section -->
+            <div class="row">
+              <div class="col-md-12 form-group mt-3">
+
+                <select name="opd-section" id="opd-section" class="form-select">
+                  <option value="">Select OPD Section</option>
+                  <!-- Populate with available OPD sections -->
+                  <option value="ENT">ENT</option>
+                  <option value="Gynecologist">Gynecologist</option>
+                  <!-- Add more OPD sections as needed -->
+                </select>
+              </div>
+            </div>
 
-  <div class="form-group mt-3">
-    <textarea class="form-control" name="message" rows="5" placeholder="Message (Optional)"></textarea>
-  </div>
-  <div class="text-center">
-    <a href="successful_appointment.html" style="text-decoration: none;">
-      <button type="submit">Make an Appointment</button>
-    </a>
-  </div>
-</form>
+            <div class="form-group mt-3">
+              <textarea class="form-control" name="message" rows="5" placeholder="Message (Optional)"></textarea>
+            </div>
+            <div class="text-center">
+              <a href="successful_appointment.html" style="text-decoration: none;">
+                <button type="submit">Make an Appointment</button>
+              </a>
+            </div>
+          </form>
 
         </div>
 
@@ -436,8 +464,8 @@ <h2>Make an Appointment</h2>
 
 
     <!-- ################# Doctors Section ################# -->
-  
-  
+
+
     <section id="doctors" class="doctors">
       <div class="container">
 
@@ -450,7 +478,8 @@ <h2>Doctors</h2>
 
           <div class="col-lg-6">
             <div class="member d-flex align-items-start">
-              <div class="pic"><img src="img/doctors/1.png" class="img-fluid" alt="" style="width: 188px; height: 188px;"></div>
+              <div class="pic"><img src="img/doctors/1.png" class="img-fluid" alt=""
+                  style="width: 188px; height: 188px;"></div>
               <div class="member-info">
                 <h4>Dermatologist</h4>
                 <br>
@@ -472,7 +501,8 @@ <h4>Gynecologist</h4>
 
           <div class="col-lg-6 mt-4">
             <div class="member d-flex align-items-start">
-              <div class="pic"><img src="img/doctors/3.png" class="img-fluid" alt="" style="width: 188px; height: 188px;"></div>
+              <div class="pic"><img src="img/doctors/3.png" class="img-fluid" alt=""
+                  style="width: 188px; height: 188px;"></div>
               <div class="member-info">
                 <h4>Cardiologist</h4>
                 <br>
@@ -483,7 +513,8 @@ <h4>Cardiologist</h4>
 
           <div class="col-lg-6 mt-4">
             <div class="member d-flex align-items-start">
-              <div class="pic"><img src="img/doctors/4.png" class="img-fluid" alt="" style="width: 188px; height: 188px;"></div>
+              <div class="pic"><img src="img/doctors/4.png" class="img-fluid" alt=""
+                  style="width: 188px; height: 188px;"></div>
               <div class="member-info">
                 <h4>ENT</h4>
                 <br>
@@ -491,15 +522,26 @@ <h4>ENT</h4>
               </div>
             </div>
           </div>
+          <div class="col-lg-6 mt-4">
+            <div class="member d-flex align-items-start">
+              <div class="pic"><img src="img/doctors/Image(13).png" class="img-fluid" alt=""
+                  style="width: 188px; height: 188px;"></div>
+              <div class="member-info">
+                <h4>Pediatrician</h4>
+                <br>
+                <div class="nxt-pg"><a href="Html-Files/doc.html"><button type="">Appoint a Doctor</button></a></div>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
     </section><!-- End Doctors Section -->
 
 
-     <!-- ################# Contact Section ################# -->
-    
-    
-     <section id="contact" class="contact">
+    <!-- ################# Contact Section ################# -->
+
+
+    <section id="contact" class="contact">
       <div class="container">
 
         <div class="section-title">
@@ -541,19 +583,20 @@ <h2>Contact</h2>
           <div class="col-lg-4">
             <div class="info">
               <div class="address">
-                <i class="fa fa-location-dot"></i>
+                <i class="bi bi-geo-alt"></i>
                 <h4>Location:</h4>
-                <p><a href="https://www.google.com/maps/search/?api=1&query=IGDTUW,Delhi" target="_blank">IGDTUW, Delhi</a></p>
+                <p><a href="https://www.google.com/maps/search/?api=1&query=IGDTUW,Delhi" target="_blank">IGDTUW,
+                    Delhi</a></p>
               </div>
 
               <div class="email">
-                <i class="fa fa-envelope"></i>
+                <i class="bi bi-envelope"></i>
                 <h4>Email:</h4>
                 <p><a href="mailto:rapidoc@mail.com">rapidoc@mail.com</a></p>
               </div>
 
               <div class="phone">
-                <i class="fa fa-phone"></i>
+                <i class="bi bi-phone"></i>
                 <h4>Call:</h4>
                 <p><a href="tel:+91 1234567890">+91 1234567890</a></p>
               </div>
@@ -588,153 +631,181 @@ <h4>Call:</h4>
 
 
     <!-- Feedback System-->
-  <section id="feedback" class="feed">
-    <div class="feedback">
-      <h1>Give Us Your Valuable Feedback.</h1>
-      <p>Your feedback is very important for Rapidoc.</p>
-      <div class="emoji">
+    <section id="feedback" class="feed">
+      <div class="feedback">
+        <h1>Give Us Your Valuable Feedback.</h1>
+        <p>Your feedback is very important for Rapidoc.</p>
+        <div class="emoji">
           <button class="btn normal">&#128578;</button>
           <button class="btn normal">&#128515;</button>
           <button class="btn normal">&#128519;</button>
           <button class="btn normal">&#128531;</button>
           <button class="btn normal">&#128532;</button>
           <button class="btn normal">&#128545;</button>
-      </div>
-      <p class="ques">What you want to say?</p>
-      <textarea id="textarea" cols="20" rows="5"></textarea>
-      <p class="ques">Are you satisfied with rapidoc?</p>
-      <div class="radiobtn">
+        </div>
+        <p class="ques">What you want to say?</p>
+        <textarea id="textarea" cols="20" rows="5"></textarea>
+        <p class="ques">Are you satisfied with rapidoc?</p>
+        <div class="radiobtn">
           <div class="one">
-            <input class="input"  type="radio" name="one" id="Yes" />
+            <input class="input" type="radio" name="one" id="Yes" />
             <label class="label" for="Yes">Yes</label>
           </div>
           <div class="one">
-            <input class="input"  type="radio" name="one" id="No" />
+            <input class="input" type="radio" name="one" id="No" />
             <label class="label" for="No">No</label>
           </div>
+        </div>
       </div>
-    </div>
-    <div class="info">
-      <div class="center">
+      <div class="info">
+        <div class="center">
           <button class="btn button">Submit</button>
+        </div>
+
       </div>
-      
-    </div>
-  </section>
+    </section>
 
 
   </main><!-- End #main -->
-<hr>
+
+
   <!-- ############### Footer ############### -->
- 
- 
-  <footer id="footer">
-    <div class="footer-top">
-      <div class="container">
-        <div class="row">
 
-          <div class="col-lg-4 col-md-6">
-            <div class="footer-info">
-              <h3>RapiDoc</h3>
-              <p>
-                Address<br>
-                Delhi, India<br><br>
-                <strong>Phone:</strong> <i class="bi bi-phone"></i><a href="tel:+91 1234567890">+91 1234567890</a><br>
-                <strong>Email:</strong> <a href="mailto:rapidoc@mail.com">rapidoc@mail.com</a>
-                <br>
-              </p>
-              <div class="social-links mt-4">
-                <a href="#" class="facebook"><i class="fa-brands fa-facebook-f"></i></a>
-                <a href="#" class="instagram"><i class="fa-brands fa-instagram"></i></a>
-                <a href="#" class="twitter"><i class="fa-brands fa-x-twitter"></i></a>
-                <a href="#" class="google-plus"><i class="fa-brands fa-skype"></i></a>
-                <a href="#" class="linkedin"><i class="fa-brands fa-linkedin-in"></i></a>
-              </div>
-            </div>
-          </div>
 
-          <div class="col-lg-2 col-md-6 footer-links">
-            <h3>Links</h3>
-            <ul>
-              <li><i class="bx bx-chevron-right"></i> <a href="#">Home</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="#about">About us</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="#services">Services</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="#doctor">Doctors</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="Html-Files/contact.html">Contact</a></li>
-            </ul>
-          </div>
+  <div class="col-lg-3 col-md-6">
+    <div class="footer-info">
+      <h3>RapiDoc</h3>
+      <p>
+        Address<br>
+        Delhi, India<br><br>
+        <strong>Phone:</strong> <i class="bi bi-phone"></i><a href="tel:+91 1234567890">+91 1234567890</a><br>
+        <strong>Email:</strong> <a href="mailto:rapidoc@mail.com">rapidoc@mail.com</a>
+        <br>
+      </p>
+      <div class="social-links mt-3">
+        <a href="#" class="facebook"><i class="fa-brands fa-facebook-f"></i></a>
+        <a href="#" class="instagram"><i class="fa-brands fa-instagram"></i></a>
+        <a href="#" class="twitter"><i class="fa-brands fa-x-twitter"></i></a>
+        <a href="#" class="linkedin"><i class="fa-brands fa-linkedin-in"></i></a>
+      </div>
+    </div>
+  </div>
+
+  <footer>
+    <div class="row">
+      <!-- map -->
+      <div class="col" id="col1">
+        <div class="contact-location">
+          <!-- <img style="height: 100%;;" src="img/home icon.webp" alt="" class="logo"> -->
+          <iframe
+            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3500.8055368048804!2d77.22981385036265!3d28.6655407892513!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x390cfd0683919c3b%3A0xf5fc331b74c2b9e2!2sIndira%20Gandhi%20Delhi%20Technical%20University%20for%20Women!5e0!3m2!1sen!2sin!4v1679424592719!5m2!1sen!2sin"
+            width="100%" height="200px" style="border: 0; padding: 2rem 2em 0 0" allowfullscreen="" loading="lazy"
+            referrerpolicy="no-referrer-when-downgrade"></iframe>
+        </div>
+      </div>
+      <!-- map -->
 
-          <div class="col-lg-3 col-md-6 footer-links">
-            <h3>Our Services</h3>
-            <ul>
-              <li><i class="bx bx-chevron-right"></i> <a href="#">Location Services</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="#">Online OPDs</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="#">Availability Status</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="#">Pharmacy Services</a></li>
-              <li><i class="bx bx-chevron-right"></i> <a href="#">User Benefits</a></li>
-            </ul>
+      <!-- contact -->
+      <div class="col" id="col2">
+        <h3>
+          Contact
+          <div class="underline"><span></span></div>
+        </h3>
+
+        <p><a href="">contact@rapidoc.com</a></p>
+        <p><a href="">+91 1234567890</a></p>
+      </div>
+      <!-- contact -->
+
+      <!-- Links -->
+      <div class="col" id="col3">
+        <h3>
+          Quick Links
+          <div class="underline"><span></span></div>
+        </h3>
+        <div class="quick-links" id="bottom">
+          <!-- <div class="footer-title">
+                        QUICK LINKS
+                    </div> -->
+          <div class="quick-links-info">
+            <div><a href="./index.html">Home</a></div>
+            <div><a href="#about">About us</a></div>
+            <div><a href="./Html-Files/contact.html">Contact us</a></div>
+            <div><a href="#services">Services</a></div>
+            <div><a href="#doctors">Doctors</a></div>
           </div>
+        </div>
+      </div>
+      <!-- links -->
 
-          <div class="col-lg-8 footer-newsletter justify-content-center">
-            <h4>Daily Newsletter</h4>
-            <p>Get your medical insights! Subscribe to our newsletters now!</p>
-            <form action="" method="post">
-              <input type="email" name="email" placeholder="Email"><input type="submit" value="Subscribe">
-            </form>
+      <div class="col" id="col4">
+        <h3>
+          SOCIAL
+          <div class="underline"><span></span></div>
+        </h3>
+        <div class="social-icons">
+
+          <div class="social">
+            <a href="#" target="_blank"><img src="#" alt="">Instagram</a>
 
           </div>
+          <div class="social">
+            <a href="#" target="_blank"><img src="" alt="">LinkedIn</a>
 
+          </div>
+          <div class="social">
+            <a href="#"><img src="" alt=""> Facebook</a>
+
+          </div>
         </div>
       </div>
     </div>
 
-    <div class="container">
-      <div class="copyright">
-        &copy; 2024 Copyright <strong><span>RapiDoc</span></strong>. All Rights Reserved
-      </div>
+    <!-- Copyright -->
+    <div id="copyright" style="text-align: center">
+      <p style="align-items: center">
+        © <span id="year"></span><span> RapiDoc</span>&nbsp;| All Rights
+        Reserved
+      </p>
+      <p>Made with ❤️ by RapiDoc</p>
     </div>
   </footer>
 
-  <div id="back-to-top-container">
-    <div class="circle">
-  <svg id="back-to-top" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-up-circle-fill" viewBox="0 0 16 16">
-    <path d="M16 8A8 8 0 1 0 0 8a8 8 0 0 0 16 0m-7.5 3.5a.5.5 0 0 1-1 0V5.707L5.354 7.854a.5.5 0 1 1-.708-.708l3-3a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 5.707z"/>
-  </svg>
-  </div>
-  </div>
+
+  <div id="preloader"></div>
+  <a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i
+      class="bi bi-arrow-up-short"></i></a>
+
   <!-- JS Files -->
   <script>
     var currentYear = new Date().getFullYear();
     document.getElementById('year').textContent = currentYear;
   </script>
-  
- <script>
-  document.addEventListener("DOMContentLoaded", function () {
-      const backToTopButton = document.getElementById('back-to-top-container');
-  
-      function checkButtonVisibility() {
-          if (window.innerWidth > 100 && window.scrollY > 100) {
-              backToTopButton.style.display = 'block';
-          } else {
-              backToTopButton.style.display = 'none';
-          }
-      }
-  
-      window.addEventListener('scroll', checkButtonVisibility);
-      window.addEventListener('resize', checkButtonVisibility);
-  
-      backToTopButton.addEventListener('click', function () {
-          window.scrollTo({
-              top: 0,
-              behavior: 'smooth' 
-          });
-      });
-      checkButtonVisibility();
-  });
-  
-  </script>
+   <script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/intlTelInput.min.js"></script>
+   <script>
+       document.addEventListener("DOMContentLoaded", function() {
+           const phoneInputField = document.getElementById('phone');
+           const iti = window.intlTelInput(phoneInputField, {
+               initialCountry: "auto",
+               geoIpLookup: function(callback) {
+                   fetch('https://ipinfo.io/json?token=YOUR_TOKEN')
+                       .then(response => response.json())
+                       .then(data => callback(data.country))
+                       .catch(() => callback('us'));
+               },
+               utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/utils.js"
+           });
+
+           document.getElementById('phone-form').addEventListener('submit', function(event) {
+               event.preventDefault();
+               const phoneNumber = iti.getNumber();
+               console.log('Full Phone Number:', phoneNumber);
+
+               // You can now send this phone number to your server or process it as needed
+           });
+       });
+   </script>
 
-  <!-- JS Files -->
   <script src="bootstrap/js/bootstrap.bundle.min.js"></script>
   <script src="glightbox/js/glightbox.min.js"></script>
   <script src="php-email-form/validate.js"></script>
@@ -747,4 +818,4 @@ <h4>Daily Newsletter</h4>
   <script src="https://mediafiles.botpress.cloud/b1d766f9-2fd0-4a60-96bb-fc1f494d156c/webchat/config.js" defer></script>
 </body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/style.css b/style.css
index 3eb3ed8c..24887ad4 100644
--- a/style.css
+++ b/style.css
@@ -1383,6 +1383,16 @@ footer {
   fill: hsl(214, 50%, 60%); 
 }
 
+.back-to-top:hover {
+  background: #3fbcc0cd;
+  color: #fff;
+}
+
+.back-to-top.active {
+  visibility: visible;
+  opacity: 1;
+}
+
 
 
 /* Style for pateint portal  */
@@ -1411,7 +1421,7 @@ footer {
 .form-group {
   margin-bottom: 15px; /* Adds bottom margin for form-group */
 }
-.form-control2 {
+.form-control{
   width: 60%; /* Full width */
   padding: 10px;
   border: 1px solid #ccc; /* Light gray border */
