slider section implemented

public/index.html

@@ -115,4 +115,8 @@
       s.parentNode.insertBefore(po, s);
     })();
   </script>
+
+  <!-- plugins js -->
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+
 </html>

public/manifest.json

@@ -6,16 +6,6 @@
       "src": "favicon.ico",
       "sizes": "64x64 32x32 24x24 16x16",
       "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
     }
   ],
   "start_url": ".",

src/assets/css/main.css

@@ -8602,7 +8602,9 @@ LND PAGE STYLE STARTS HERE
 /* interface wraper */
 .interface_section .screen_slider {
   margin-top: 35px;
-  min-height: 720px;
+  /* min-height: 520px; */
+  display: flex;
+  align-items: center;
 }
 
 /* interface images */
@@ -8612,10 +8614,12 @@ LND PAGE STYLE STARTS HERE
   border-radius: 20px;
   transition: 1s all;
   margin: 0 auto;
+  height: 520px;
+  width: auto;
 }
 
 .interface_section .owl-item.center .screen_frame_img img {
   transform: scale(1);
   border: 3px solid #000;
-
+  padding: 5px;
 }

src/components/HomeOne/FeaturedScreen.js

@@ -2,6 +2,9 @@ import React from 'react'
 import OwlCarousel from 'react-owl-carousel'
 import localImgLoad from '../../lib/localImgLoad'
 
+import 'owl.carousel/dist/assets/owl.carousel.css'
+import 'owl.carousel/dist/assets/owl.theme.default.css'
+
 export default function FeaturedScreen() {
   
     const screen_slider = {