add new project + css fixes

index.html

@@ -161,10 +161,11 @@ <h1 class="sub-title">My Work</h1>
         <div class="work-list">
 
           <div class="work">
-            <img src="./images/surveilance-car.png" alt="home automation">
+            <img src="./images/self-driving-car.jpg" alt="home automation">
             <div class="layer">
-              <h3><strong>Surveillance Car</strong></h3>
-              <p>A surveillance car that can be controlled with phone or PC, equipped with a camera for monitoring.</p>
+              <h3><strong>Self Driving Car</strong></h3>
+              <p>The Self-Driving Car project is an autonomous vehicle equipped with sensors that scans the environment, detecting obstacles in the route.<br>
+                Through algorithms, it calculates the best direction to navigate, showcasing the basic fundamentals of self-driving technology.</p>
               <a href="#"></a>
             </div>
           </div>

style.css

@@ -237,30 +237,30 @@ nav ul li a:hover::after {
   margin-top: 50px;
 }
 .work {
-  border-radius: 10xp;
+  border-radius: 20px;
   position: relative;
   overflow: hidden;
 }
 .work img {
   width: 100%;
-  border-radius: 20px;
+  border-radius: inherit;
   display: block;
   height: 300px;
   object-fit: cover;
   transition: transform 0.5s;
-  margin-bottom: 30px;
+  /* margin-bottom: 30px; */
 }
 
 .work:hover .layer {
   height: 100%;
-  border-radius: 0 !important;
+  /* border-radius: 0 !important; */
 }
 
 .layer {
   width: 100%;
   height: 0;
   background: linear-gradient(blue, rgb(175, 68, 181), rgb(119, 30, 173));
-  border-radius: 10px;
+  border-radius: inherit;
   position: absolute;
   left: 0;
   bottom: 0;