added error 404 page

src/App.js

@@ -11,13 +11,14 @@ import ContactUs from "./Components/footer_section/ContactUs/contact_us";
 import Pricing from "./Components/footer_section/Pricing/pricing";
 import MyProjects from "./Components/menu_section/my_projects/MyProjects";
 import NewProject from "./Components/menu_section/new_project/NewProject";
-
+import Error from "./Components/404_page/Error";
 function App() {
   return (
     <Router>
       <div className="App">
         <div className="App-content"></div>
         <Routes>
+        <Route path="*" element={<Error />} />
           <Route path="/" element={<Container />} />
           <Route path="/settings" element={<Settings />} />
           <Route path="/about" element={<About_us />} />

src/Components/404_page/Error.css

@@ -0,0 +1,13 @@
+.prel{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 1rem;
+}
+.error{
+    padding: 0;
+}
+
+a:link{
+    text-decoration: none;
+}

src/Components/404_page/Error.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import pre from '../404_page/404.json'
+import Lottie from 'lottie-react';
+import Container from '../Container'
+import './Error.css'
+function Error() {
+    const home=()=>{
+        return (
+            <div> <Container/></div>
+        )      
+    }
+    return (
+        <div>
+            <div className='error'>
+                <div> <Lottie animationData={pre}/> </div>    
+                <div className='prel'>
+                   <a href='/'> <button className='homepage'>Return To Home Page</button> </a> 
+                </div>                
+            </div>
+        </div>
+    )
+}   
+export default Error;