diff --git a/client/src/App.js b/client/src/App.js
index 32497eb..8aebc6e 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -5,8 +5,10 @@ import Home from "./components/home/home";
 import NavBar from "./components/navbar/navbar";
 import Signup from "./components/signup/Signup";
 import Order from "./components/Order/Order";
-import Footer from "./components/Footer/Footer";
+import Footer from "./components/Footer";
+
 import Login from "./components/Login/Login";
+
 function App() {
   return (
     <>
@@ -19,8 +21,11 @@ function App() {
           <Route path='/order' component={Order}/>
           <Route path='/login' component={Login}/>
         </Switch>
+
         <Footer />
+
       </Router>
+      
     </>
   );
 }
diff --git a/client/src/components/Footer/Footer.jsx b/client/src/components/Footer/Footer.jsx
index 81da642..bebdf01 100644
--- a/client/src/components/Footer/Footer.jsx
+++ b/client/src/components/Footer/Footer.jsx
@@ -1,35 +1,44 @@
 import React from "react";
-import "./Footer.css";
-import "./svgicon.css"
-const Footer = () => {
-    return (
-        <footer className='foot-container'>
-            <div className="foot-logo">
-                Logo
-            </div>
-            <div className="foot-items-container">
-        <ul className="foot-items">
-                    
-                    <svg class="svg-icon" viewBox="0 0 20 20">
-							<path fill="none" d="M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z"></path>
-                    </svg>
-                    Facebook
-        </ul>
-                <ul className="foot-items">
-                    <svg class="svg-icon" viewBox="0 0 20 20">
-							<path fill="none" d="M14.467,6.707c-0.34,0.198-0.715,0.342-1.115,0.419c-0.318-0.335-0.775-0.545-1.279-0.545c-0.969,0-1.754,0.773-1.754,1.727c0,0.135,0.015,0.267,0.045,0.394C8.905,8.628,7.612,7.94,6.747,6.896C6.596,7.151,6.509,7.448,6.509,7.764c0,0.599,0.31,1.128,0.78,1.438C7.002,9.192,6.732,9.115,6.495,8.985c0,0.007,0,0.014,0,0.021c0,0.837,0.605,1.535,1.408,1.694c-0.147,0.04-0.302,0.06-0.462,0.06c-0.113,0-0.223-0.011-0.33-0.031c0.223,0.687,0.871,1.186,1.638,1.199c-0.6,0.464-1.356,0.739-2.179,0.739c-0.142,0-0.281-0.007-0.418-0.023c0.777,0.489,1.699,0.775,2.689,0.775c3.228,0,4.991-2.63,4.991-4.913c0-0.075-0.002-0.149-0.004-0.223c0.342-0.244,0.639-0.547,0.875-0.894c-0.316,0.137-0.652,0.23-1.008,0.272C14.057,7.448,14.336,7.11,14.467,6.707 M10,0.594c-5.195,0-9.406,4.211-9.406,9.406c0,5.195,4.211,9.406,9.406,9.406c5.196,0,9.407-4.211,9.407-9.406C19.406,4.805,15.195,0.594,10,0.594 M10,18.552c-4.723,0-8.551-3.829-8.551-8.552S5.277,1.449,10,1.449c4.723,0,8.551,3.829,8.551,8.551S14.723,18.552,10,18.552"></path>
-						</svg>
-          Twitter
-        </ul>
-                <ul className="foot-items">
-                    <svg class="svg-icon" viewBox="0 0 20 20">
-							<path fill="none" d="M9.969,0.594c-5.195,0-9.406,4.211-9.406,9.406c0,5.195,4.211,9.406,9.406,9.406c5.195,0,9.406-4.211,9.406-9.406C19.375,4.805,15.164,0.594,9.969,0.594 M9.969,18.552c-4.723,0-8.551-3.829-8.551-8.552s3.829-8.551,8.551-8.551S18.521,5.277,18.521,10S14.691,18.552,9.969,18.552 M12.534,5.724H7.403c-0.944,0-1.71,0.766-1.71,1.71v5.131c0,0.944,0.766,1.71,1.71,1.71h5.131c0.944,0,1.71-0.766,1.71-1.71V7.435C14.244,6.49,13.479,5.724,12.534,5.724M11.679,7.007h1.283V8.29h-1.283V7.007z M9.969,8.29c0.944,0,1.71,0.766,1.71,1.71s-0.766,1.71-1.71,1.71s-1.71-0.766-1.71-1.71S9.024,8.29,9.969,8.29 M13.39,12.565c0,0.472-0.384,0.854-0.855,0.854H7.403c-0.472,0-0.855-0.383-0.855-0.854V9.573h0.898C7.423,9.712,7.403,9.854,7.403,10c0,1.417,1.149,2.565,2.565,2.565c1.416,0,2.565-1.148,2.565-2.565c0-0.146-0.02-0.288-0.043-0.427h0.898V12.565z"></path>
-						</svg>
-          Instagram
-        </ul>
+import { MDBCol, MDBContainer, MDBRow, MDBFooter } from "mdbreact";
+
+const FooterPage = () => {
+  return (
+    <MDBFooter color="blue" className="font-small pt-4 mt-4">
+      <MDBContainer fluid className="text-center text-md-left">
+        <MDBRow>
+          <MDBCol md="6">
+            <h5 className="title">Footer Content</h5>
+            <p>
+              Here you can use rows and columns here to organize your footer
+              content.
+            </p>
+          </MDBCol>
+          <MDBCol md="6">
+            <h5 className="title">Links</h5>
+            <ul>
+              <li className="list-unstyled">
+                <a href="#!">Link 1</a>
+              </li>
+              <li className="list-unstyled">
+                <a href="#!">Link 2</a>
+              </li>
+              <li className="list-unstyled">
+                <a href="#!">Link 3</a>
+              </li>
+              <li className="list-unstyled">
+                <a href="#!">Link 4</a>
+              </li>
+            </ul>
+          </MDBCol>
+        </MDBRow>
+      </MDBContainer>
+      <div className="footer-copyright text-center py-3">
+        <MDBContainer fluid>
+          &copy; {new Date().getFullYear()} Copyright: <a href="https://www.mdbootstrap.com"> MDBootstrap.com </a>
+        </MDBContainer>
       </div>
-            </footer>
-    )
+    </MDBFooter>
+  );
 }
 
-export default Footer
\ No newline at end of file
+export default Footer;
diff --git a/client/src/components/Project - Shortcut.lnk b/client/src/components/Project - Shortcut.lnk
new file mode 100644
index 0000000..e650623
Binary files /dev/null and b/client/src/components/Project - Shortcut.lnk differ