diff --git a/.vscode/settings.json b/.vscode/settings.json
index a90daae9..d85aeb14 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,3 +1,3 @@
 {
-    "liveServer.settings.port": 5501
+    "liveServer.settings.port": 5502
 }
diff --git a/index.html b/index.html
index 4156ce88..6f03dbbc 100644
--- a/index.html
+++ b/index.html
@@ -17,6 +17,9 @@
     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"
     rel="stylesheet">
 
+    <!-- transalator -->
+    <script src="https://translate.google.com/translate_a/element.js?cb=loadGoogleTranslate" ></script>
+
   <!-- CSS Files -->
   <link href="Css-Files/animate.min.css" rel="stylesheet">
   <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
@@ -81,7 +84,37 @@
     border-radius: 5px;
     margin-top: 20px;
 }
-
+select{
+  padding: 1px;
+  background-color: #55a5ea;
+  color: white;
+ height: 5vh;
+ width: 17vh;
+}
+option{
+  background-color: #55a5ea;
+  color: white;
+}
+/* }
+.VIpgJd-ZVi9od-ORHb-OEVmcd{
+  display: none;
+}
+.VIpgJd-ZVi9od-l4eHX-hSRGPd{
+  display: none;
+}  
+.skiptranslate{
+  font-size: 0;
+
+} */
+/* body {
+  top: 0px !important; 
+} */
+/* iframe.skiptranslate { visibility: hidden !important; } */
+/* .VIpgJd-ZVi9od-ORHb-OEVmcd .skiptranslate{
+  display: none !important;
+  background: none !important;
+  visibility: hidden !important;
+} */
 @media screen and (max-width: 992px) {
     .container {
         flex-wrap: wrap;
@@ -186,7 +219,6 @@
 .avatar{
   margin: 20px 100px;
 }
-
 .textbox input{
   width:200px;
   height: 40px;
@@ -293,6 +325,8 @@
           <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>
+          <li  >  
+<div  id="google_element" class="myclass" style="color: #ffffff; display: flex;" ></div>          </li>
           <a href="login.html">Sign in/Sign up</a>
           <a href="./Html-Files/Doctor Experience.html"><button>Find a Doctor</button></a>
 
@@ -309,7 +343,6 @@
       
       <a href="#appointment" class="appointment-btn scrollto">
         <span class="d-md-inline">EMERGENCY</span></a>
-
     </div>
   </header>
 
@@ -1233,6 +1266,11 @@ <h4>RAPIDOC Newsletter</h4><br>
 
   <!-- JS Files -->
   <script>
+
+function loadGoogleTranslate(){
+          new google.translate.TranslateElement("google_element");
+      }
+
     var currentYear = new Date().getFullYear();
     document.getElementById('year').textContent = currentYear;
   </script>
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 00000000..77f3a1a3
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,6 @@
+{
+  "name": "RAPIDOC-HEALTHCARE-WEBSITE-",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}