more

src/Components/Features/FeaturesPage.js

@@ -14,6 +14,9 @@ const FeaturesPage = () => {
     <>
       <div className="features-container">
         <div className="features-top-wrapper">
+          <div className="features-top-mobile-img">
+            <img className="features-image-one" src={legalTechFlip} />
+          </div>
           <div className="features-top-left">
             <FeaturesTop />
           </div>

src/styles/features.scss

@@ -78,20 +78,56 @@
   margin: 28px 0px;
 }
 
+.features-top-mobile-img {
+  display: none;
+}
+
 @media only screen and (max-width: 430px) {
   .features-top-wrapper {
     flex-direction: column;
   }
+
   .features-top-left {
     width: 100%;
   }
+
   .features-top-right {
     width: 100%;
   }
+
   .features-bottom-left {
     width: 100%;
   }
+
   .features-bottom-right {
     width: 100%;
   }
+
+  .features-header-text {
+    margin-top: -8px;
+  }
+
+  .features-list-item {
+    width: 98%;
+    text-align: justify;
+    font-size: 0.94rem;
+    margin: 6px 0px;
+  }
+
+  .features-top-right {
+    display: none;
+  }
+
+  .features-top-mobile-img {
+    display: flex;
+  }
+
+  .features-image-one {
+    display: flex;
+    flex-direction: column;
+    margin-right: 10px;
+    height: 300px;
+    float: right;
+    border-radius: 15px;
+  }
 }