fixed Language selection UI in Footer section to match with site's UI

footer.css

@@ -0,0 +1,19 @@
+.goog-te-combo{
+    background: #5074cf;
+    color: white;
+    height: 40px;
+    border-radius: 70px;
+    padding: 10px;
+    border: #1457ff;
+    backdrop-filter: blur(20px);
+    font-size: medium;
+    font-weight: 400;
+}
+
+.goog-te-combo option{
+    background: #9fbaff;
+    height: 40px;
+    margin-top: 5px;
+    font-size: medium;
+    color: black;
+}

index.html

@@ -33,6 +33,7 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 
   <link rel="stylesheet" href="styles.css" />
+  <link rel="stylesheet" href="footer.css">
   <link rel="stylesheet" href="./Image-Gallery/style.css">
   <link rel="stylesheet" href="./Image-Gallery/stylecaptions.css">
   <link rel="stylesheet" href="explore.css">
@@ -1730,8 +1731,8 @@ <h4>Contact Us</h4>
           </div>
 
         </div>
-        <div style="padding: 32px; background-color: #9fbaff; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);">
-          <label for="google_translate_element" style="display: block; font-weight: bold; margin-bottom: 10px; font-size: 20px; color: #333;">Select Language:</label>
+        <div style="padding: 32px; background-color: transparent; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);">
+          <label for="google_translate_element" style="display: block; font-weight: bold; margin-bottom: 10px; font-size: 20px; color: white;">Select Language:</label>
           <div id="google_translate_element" style="display: inline-block; margin-top: 10px; padding: 20px; border: 1px solid #ff9fcf; border-radius: 5px; background-color: #fff;"></div>
       </div>