diff --git a/Frontend/src/App.jsx b/Frontend/src/App.jsx
index b1faa45..e9bd47a 100644
--- a/Frontend/src/App.jsx
+++ b/Frontend/src/App.jsx
@@ -17,6 +17,7 @@ import TermsOfService from './pages/TermsOfService';
 import ContactUs from './pages/ContactUs';
 import SignUp from './components/SignUp';
 import Login from './components/Login';
+import Review from './components/Review';
 import { useState } from 'react';
 
 function App() {
diff --git a/Frontend/src/components/Home.jsx b/Frontend/src/components/Home.jsx
index 8d987d2..4a8756e 100644
--- a/Frontend/src/components/Home.jsx
+++ b/Frontend/src/components/Home.jsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { motion } from 'framer-motion';
 import { Link } from 'react-router-dom';
+import Review from './Review';
 import { FaHospital, FaUserMd, FaCalendarCheck, FaHeartbeat, FaAmbulance, FaLaptopMedical } from 'react-icons/fa';
 
 const Home = () => {
@@ -180,6 +181,7 @@ const Home = () => {
             </Link>
           </div>
         </section>
+        <Review />
       </div>
     );
 };
diff --git a/Frontend/src/components/Review.jsx b/Frontend/src/components/Review.jsx
new file mode 100644
index 0000000..096586a
--- /dev/null
+++ b/Frontend/src/components/Review.jsx
@@ -0,0 +1,84 @@
+import React, { useState, useEffect } from 'react';
+
+const Review = () => {
+  const [rating, setRating] = useState(0);
+  const [hover, setHover] = useState(0);
+  const [comment, setComment] = useState('');
+  const [visible, setVisible] = useState(false);
+
+  // Show the component after 15 seconds
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setVisible(true);
+    }, 15000);
+    return () => clearTimeout(timer);
+  }, []);
+
+  // Function to handle comment change
+  const handleCommentChange = (e) => {
+    setComment(e.target.value);
+  };
+
+  // Function to handle form submit
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    alert(`Thank you for your review!!`);
+    setComment('');
+    setRating(0);
+    setVisible(false);
+  };
+
+  return (
+    <>
+      {visible && (
+        <div className="fixed inset-0 flex justify-center items-center bg-black bg-opacity-50 backdrop-blur-sm z-50">
+          <div className="bg-navy-800 p-6 rounded-lg shadow-lg w-full max-w-md text-white">
+            <h2 className="text-2xl font-bold mb-2 text-center">Rate Us</h2> {/* Centered Heading */}
+            <p className="text-center mb-2">Please take a second to review our services!</p>
+            {/* Star Rating */}
+            <div className="flex justify-center mb-4">
+              {[...Array(5)].map((_, index) => {
+                const starValue = index + 1;
+                return (
+                  <button
+                    key={index}
+                    type="button"
+                    className={`text-5xl transition duration-300 ${
+                      starValue <= (hover || rating) ? 'text-yellow-500' : 'text-gray-400'
+                    }`}
+                    onClick={() => setRating(starValue)}
+                    onMouseEnter={() => setHover(starValue)}
+                    onMouseLeave={() => setHover(0)}
+                  >
+                    ★
+                  </button>
+                );
+              })}
+            </div>
+
+            {/* Comment Box */}
+            <form onSubmit={handleSubmit}>
+  <textarea
+    className="w-full p-2 rounded-lg bg-navy-700 text-black focus:outline-none mb-4" // changed text-white to text-black
+    placeholder="Leave a comment..."
+    rows="4"
+    value={comment}
+    onChange={handleCommentChange}
+  ></textarea>
+
+  {/* Submit Button */}
+  <button
+    type="submit"
+    className="bg-yellow-500 text-navy-900 font-bold py-2 px-4 rounded-lg w-full hover:bg-yellow-600 transition duration-300"
+  >
+    Submit
+  </button>
+</form>
+          </div>
+        </div>
+      )}
+    </>
+  );
+};
+
+export default Review;
diff --git a/Frontend/tailwind.config.js b/Frontend/tailwind.config.js
index 54f61d1..608d413 100644
--- a/Frontend/tailwind.config.js
+++ b/Frontend/tailwind.config.js
@@ -10,6 +10,8 @@ export default {
         'secondary': '#19252BFF',
         'light': '#F6F6F6',
         'accent': '#FFCB74',
+        'navy-800': '#0a1128',
+        'navy-900': '#001f3f'
       },
       fontFamily: {
         montserrat: ['Montserrat', 'sans-serif'],
diff --git a/package-lock.json b/package-lock.json
index ec1bfbe..8c23a75 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,8 +1,7 @@
 {
   "name": "Hospital-Management",
-  "lockfileVersion": 3,
+  "lockfileVersion": 2,
   "requires": true,
-<<<<<<< HEAD
   "packages": {
     "": {
       "dependencies": {
@@ -73,8 +72,56 @@
         "loose-envify": "^1.1.0"
       }
     }
+  },
+  "dependencies": {
+    "herotofu-react": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/herotofu-react/-/herotofu-react-1.0.6.tgz",
+      "integrity": "sha512-q1vNErrQVVoGxi5erpc5IMJ+QtIqiSDL2KF1G45uf69bsmxSKXyIKUFf/vVq9NaYAww4rNIL0TWfupSvb+MOEQ==",
+      "requires": {}
+    },
+    "js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+      "peer": true
+    },
+    "loose-envify": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+      "peer": true,
+      "requires": {
+        "js-tokens": "^3.0.0 || ^4.0.0"
+      }
+    },
+    "react": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
+      "peer": true,
+      "requires": {
+        "loose-envify": "^1.1.0"
+      }
+    },
+    "react-dom": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "peer": true,
+      "requires": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.23.2"
+      }
+    },
+    "scheduler": {
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
+      "peer": true,
+      "requires": {
+        "loose-envify": "^1.1.0"
+      }
+    }
   }
-=======
-  "packages": {}
->>>>>>> 60b5d08 (Save changes to package-lock.json)
 }