src/assets/css/aboutapp.css

@@ -1,10 +1,11 @@
 @media screen and (max-width:1200px) {
+
   /* about app section */
   .about_app_section .about_text .app_statstic li {
     width: 210px;
     padding-left: 20px;
   }
-  
+
   .about_app_section .about_text .app_statstic li p:first-child {
     font-size: 30px;
   }
@@ -13,76 +14,84 @@
 
 
 @media screen and (max-width:992px) {
-  
-/* about app section */
-.about_app_section .row {
-  flex-direction: column-reverse;
-}
 
-.about_app_section .about_img {
-  justify-content: flex-start;
-  margin-top: 75px;
-  margin-left: 0;
-}
+  /* about app section */
+  .about_app_section .row {
+    flex-direction: column-reverse;
+  }
 
-.about_app_section .about_img::before {
-  left: 50%;
-}
+  .about_app_section .about_img {
+    justify-content: flex-start;
+    margin-top: 75px;
+    margin-left: 0;
+  }
 
-.about_app_section .about_img .screen_img {
-  margin-left: -170px;
-}
+  .about_app_section .about_img::before {
+    left: 50%;
+  }
 
-.about_app_section .about_text .app_statstic {
-  justify-content: flex-start;
-}
+  .about_app_section .about_img .screen_img {
+    margin-left: -170px;
+  }
 
-.about_app_section .about_text .app_statstic li {
-  width: 35%;
-  margin-right: 30px;
-}
+  .about_app_section .about_text .app_statstic {
+    justify-content: flex-start;
+  }
 
-.about_app_section .about_img::before {
-  left: 35%;
-}
+  .about_app_section .about_text .app_statstic li {
+    width: 35%;
+    margin-right: 30px;
+  }
+
+  .about_app_section .about_img::before {
+    left: 35%;
+  }
 }
 
 @media screen and (max-width:767px) {
-/* about app section */
-.about_app_section .about_text,
-.about_app_section .about_text .section_title {
-  text-align: center;
+
+  /* about app section */
+  .about_app_section .about_text,
+  .about_app_section .about_text .section_title {
+    text-align: center;
+  }
+
+  .about_app_section .about_text .app_statstic {
+    margin-top: 0;
+    justify-content: space-between;
+  }
+
+  .about_app_section .about_text .app_statstic li {
+    width: 48%;
+    margin-right: 0;
+  }
+
+  .about_app_section .about_text .app_statstic li p:first-child {
+    font-size: 18px;
+  }
+
+  .about_app_section .about_img {
+    margin: 0;
+    margin-top: 50px;
+    justify-content: center;
+  }
+
+  .about_app_section .about_img::before {
+    width: 350px;
+    height: 350px;
+  }
 }
 
-.about_app_section .about_text .app_statstic {
-  margin-top: 0;
-  justify-content: space-between;
-}
-
-.about_app_section .about_text .app_statstic li {
-  width: 48%;
-  margin-right: 0;
-}
-
-.about_app_section .about_text .app_statstic li p:first-child {
-  font-size: 18px;
-}
-
-.about_app_section .about_img {
-  margin: 0;
-  margin-top: 50px;
-  justify-content: center;
-}
-
-.about_app_section .about_img::before {
-  width: 350px;
-  height: 350px;
-}
+.row_am.about_app_section._ {
+  background: #fbf4fe;
 }
 
 @media screen and (max-width:479px) {
+
   /* about app section */
-  .about_app_section .about_img::before {left: 49%;}
+  .about_app_section .about_img::before {
+    left: 49%;
+  }
 }
 
 /* about app section */
@@ -153,7 +162,10 @@
 }
 
 .section_title h2 {
-  font-size: 40px;
+  font-size: 44px;
+  letter-spacing: 2px;
+  line-height: 54px;
+  text-shadow: 0 4px 10px #0000004d;
   font-weight: 700;
   color: #32236F;
 }
@@ -282,11 +294,27 @@
 }
 
 @media screen and (max-width:767px) {
+
   /* modern ui section */
-  .modern_ui_section .ui_images {margin-top: 10px;}
-  .modern_ui_section .section_title {text-align: center;}
-  .modern_ui_section .design_block li {padding-left: 0; margin-bottom: 30px;}
-  .modern_ui_section .design_block li::before {position: relative; left: auto; top: auto; display: inline-block;}
+  .modern_ui_section .ui_images {
+    margin-top: 10px;
+  }
+
+  .modern_ui_section .section_title {
+    text-align: center;
+  }
+
+  .modern_ui_section .design_block li {
+    padding-left: 0;
+    margin-bottom: 30px;
+  }
+
+  .modern_ui_section .design_block li::before {
+    position: relative;
+    left: auto;
+    top: auto;
+    display: inline-block;
+  }
 
 }
 
@@ -328,9 +356,12 @@
 }
 
 .modern_ui_section .design_block li h4 {
-  font-size: 20px;
+  font-size: 24px;
+  font-weight: 700;
+  padding-bottom: 7px;
+  text-shadow: 3px 4px 10px #0000004d;
+
   color: #32236F;
-  font-weight: 600;
   margin-bottom: 8px;
 }
 

src/assets/css/style.css

@@ -166,7 +166,7 @@
   transform: translate(-50%, -50%);
   width: 500px;
   height: 500px;
-  background-color: var(--bg-white);
+  background-color: #ffffff;
   border-radius: 100%;
   z-index: -1;
 }
@@ -195,7 +195,7 @@
 
 .about_app_section .about_text .app_statstic li {
   width: 248px;
-  background-color: var(--bg-white);
+  background-color: #fff;
   margin-bottom: 30px;
   display: flex;
   align-items: center;
@@ -212,7 +212,7 @@
 .about_app_section .about_text .app_statstic li p {
   margin-bottom: 0;
   line-height: 1;
-  color: var(--dark-purple);
+  color: #32236F;
 }
 
 .about_app_section .about_text .app_statstic li p:first-child {
@@ -229,3 +229,7 @@
   margin-top: 45px;
   margin-bottom: 45px;
 }
+
+.about_text{
+  margin-top: 2rem;
+}

src/components/lnd/LndParts/AboutApp/Main.js

@@ -10,7 +10,7 @@ import img4 from '../../../../assets/images/countries.png'
 const Main = ({ video, dark }) => {
   return (
     <>
-      <section className="row_am about_app_section">
+      <section className="row_am about_app_section _">
         <div className="container">
           <div className="row modern_ui_section">
             <div className="col-lg-6">