Solved SyedImtiyaz-1#207

Author: aparna03dubey

backend/public/ourTeam/chatBot/style.css

@@ -37,16 +37,17 @@
         <div class="collapse navbar-collapse text-center " id="navbarSupportedContent">
           <ul class="navbar-nav me-auto mb-2 ml-auto mb-lg-0 headingStyle">
             <li class="nav-item">
-              <a class="nav-link active" aria-current="page" href="../../../index.html">Home</a>
+              <a class="nav-link active hoverprop " aria-current="page" href="../../../index.html">Home</a>
             </li>
-            <li class="nav-item ml-3">
-              <a class="nav-link active" aria-current="page" href="../index.html">Projects</a>
+            <li class="nav-item ml-3 ">
+              <a class="nav-link active hoverprop" aria-current="page" href="../index.html">Projects</a>
+              
             </li>
             <li class="nav-item ml-3">
-              <a class="nav-link active" aria-current="page" href="../../../index.html#contact">Contact</a>
+              <a class="nav-link active hoverprop" aria-current="page" href="../../../index.html#contact">Contact</a>
             </li>
             <li class="nav-item ml-3">
-              <a class="nav-link active" aria-current="page" href="">Login</a>
+              <a class="nav-link active hoverprop" aria-current="page" href="">Login</a>
             </li>
         </div>
       </div>

backend/public/ourTeam/index.html

@@ -168,7 +168,16 @@ section {
     font-weight: 400;
   }
 
+  .hoverprop{
+    border-radius: 8px;
 
+  }
+.hoverprop:hover{
+padding-bottom: 0;
+background-color: #c8e6f4;
+ border-bottom: 3px solid #47b2e4; /* Add a transparent underline */
+  
+}
   /* Media query to target mobile devices */
 @media (max-width: 768px) {
   .navbar-toggler.navbar-toggler-right {

backend/public/ourTeam/ourTeam.css

@@ -138,6 +138,7 @@ nav #login:hover{
 }
 .chatbot__textarea::placeholder {
   font-family: 'Poppins', sans-serif;
+  
 }
 .chatbot__input-box span {
   font-size: 2.5em;
@@ -150,7 +151,10 @@ nav #login:hover{
 .chatbot__textarea:valid ~ span {
   visibility: visible;
 }
+.hover__effect:hover{
+color: #721c24;
 
+}
 @media (max-width: 490px) {
   .chatbot__button {
     position: fixed;