diff --git a/frontend/src/components/navbar/NavBar.jsx b/frontend/src/components/navbar/NavBar.jsx
index b06ae82..7a9c094 100644
--- a/frontend/src/components/navbar/NavBar.jsx
+++ b/frontend/src/components/navbar/NavBar.jsx
@@ -1,5 +1,5 @@
 import Box from "@mui/material/Box";
-import { useEffect, useState } from "react";
+import { useState, useEffect } from "react";
 import { FaBars, FaTimes } from "react-icons/fa";
 import { useDispatch, useSelector } from "react-redux";
 import { Link, useLocation, useNavigate } from "react-router-dom";
@@ -9,14 +9,12 @@ import { defaultState } from "../../redux/slices/AuthSlice";
 import "./NavBar.scss";
 
 const NavBar = () => {
-  // const { isLoading, error } = useAuth0();
-
   // Navbar Visibility
-  const [click, setClick] = useState(false);
-  const handleClick = () => {
-    setClick(!click);
+  const [isMenuOpen, setIsMenuOpen] = useState(false);
+  const handleMenuClick = () => {
+    setIsMenuOpen(!isMenuOpen);
   };
-  const [navVisibility, setNavVisibility] = useState(false);
+  const [isNavBarVisible, setIsNavBarVisible] = useState(false);
 
   const location = useLocation();
 
@@ -24,12 +22,12 @@ const NavBar = () => {
     const changeBackground = () => {
       if (location.pathname === "/") {
         if (window.scrollY >= 700) {
-          setNavVisibility(true);
+          setIsNavBarVisible(true);
         } else {
-          setNavVisibility(false);
+          setIsNavBarVisible(false);
         }
       } else {
-        setNavVisibility(true);
+        setIsNavBarVisible(true);
       }
     };
     changeBackground();
@@ -61,14 +59,14 @@ const NavBar = () => {
   };
 
   return (
-    <Box className={navVisibility ? "navbar_active" : "navbar"}>
+    <Box className={isNavBarVisible ? "navbar_active" : "navbar"}>
       <nav className="navbar_container">
         <Link to="/" className="navbar_logo">
           NOTEUPS
         </Link>
 
         <div className="nav_menu_container">
-          <ul className={click ? "nav_menu active" : "nav_menu"}>
+          <ul className={isMenuOpen ? "nav_menu active" : "nav_menu"}>
             <li className="nav_item">
               <Link to="/products" className="nav_links">
                 <i className="fas fa-list" /> Products
@@ -155,8 +153,8 @@ const NavBar = () => {
           )}
         </div> */}
 
-        <div className="hamburger" onClick={handleClick}>
-          {click ? (
+        <div className="hamburger" onClick={handleMenuClick}>
+          {isMenuOpen ? (
             <FaTimes className="hamburger_bars" size={20} />
           ) : (
             <FaBars className="hamburger_bars" size={20} />
diff --git a/frontend/src/components/navbar/NavBar.scss b/frontend/src/components/navbar/NavBar.scss
index 731236f..05d4e85 100644
--- a/frontend/src/components/navbar/NavBar.scss
+++ b/frontend/src/components/navbar/NavBar.scss
@@ -55,79 +55,70 @@
   }
 }
 
-/* Tablet
-@media (min-width: 768px) and (max-width: 1024px) {
-  .navbar {
-  }
-  .navbar_container {
-  }
-  .navbar_logo {
-  }
-  .nav_menu {
-  }
-  .nav_item {
-  }
-  .nav_links {
-  }
-} */
-
 .navbar_container {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  height: 80px;
+  height: auto;
 }
 .nav_menu {
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  justify-content: center;
 }
 .nav_item {
   display: flex;
   align-items: center;
-  margin: 0 2rem;
+  margin: 0.5rem 0.5rem;
 }
 
 .login_container {
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  justify-content: center;
 
   .logged_in_user {
     display: flex;
     align-items: center;
-    justify-content: space-between;
-    margin: 0 2rem;
+    justify-content: center;
+    margin: 0.5rem 0.5rem;
 
     h2 {
-      font-size: 1.5rem;
+      font-size: 0.75rem;
       font-weight: bold;
       text-decoration: none;
-      padding: 0.5rem;
+      padding: 0.25rem 0.25rem;
     }
   }
 
   .signin_button,
-  .signup_button,
-  .signout_button {
+  .signup_button {
     color: white;
     border: none;
     padding: 0.5rem 1rem;
-    margin: 0 1rem;
-    border-radius: 5px;
+    margin: 0.5rem 0.5rem;
+    border-radius: 1rem;
     font-size: 1.5rem;
-    font-weight: bold;
-    cursor: pointer;
   }
 
   .signin_button {
-    background-color: #dc15cb;
+    background-image: linear-gradient(
+      to right,
+      #00bfff,
+      #1e90ff,
+      #0000ff,
+      #4b0082
+    );
   }
+
   .signup_button {
-    background-color: #006aff;
-  }
-  .signout_button {
-    background-color: #dc15cb;
+    background-image: linear-gradient(
+      to right,
+      #e0b0ff,
+      #ff69b4,
+      #9370db,
+      #4b0082
+    );
   }
 }
 
@@ -146,8 +137,9 @@
   .navbar_container {
   }
   .navbar_logo {
-    font-size: 3rem;
+    font-size: 0.75rem;
   }
+
   .nav_menu {
     position: absolute;
     flex-direction: column;
@@ -161,63 +153,89 @@
     transition: 0.3s;
     background: rgba(0, 0, 0, 0.9);
     z-index: -1;
-  }
-  .nav_menu.active {
-    left: 0;
+    background-image: linear-gradient(
+      to right,
+      #e0b0ff,
+      #ff69b4,
+      #9370db,
+      #4b0082
+    );
+    opacity: 0.9;
+
+    &.active {
+      left: 0;
+    }
   }
 
   .nav_item {
-    padding: 1.5rem 0;
+    padding: 0.25rem 0.25rem;
   }
   .nav_links {
-    font-size: 3rem;
+    font-size: 0.75rem;
+    color: white;
   }
 
   .login_container {
     display: flex;
-    align-items: center;
-    justify-content: space-between;
-    position: absolute;
-    top: 0;
-    right: -100%;
-    width: 100%;
-    height: 100vh;
-    transition: 0.3s;
-    background: rgba(0, 0, 0, 0.9);
-    z-index: -1;
+  }
 
-    .signin_button,
-    .signup_button,
-    .signout_button {
-      color: white;
-      border: none;
-      padding: 0.5rem 1rem;
-      margin: 0 1rem;
-      border-radius: 5px;
-      font-size: 1.5rem;
-      font-weight: bold;
-      cursor: pointer;
-    }
+  .fas {
+    display: inline-block;
+  }
+
+  .hamburger {
+    display: block;
+    margin-right: 0.5rem;
+  }
+}
+
+@media (max-width: 560px) {
+  // The signin and signup buttons should disappear on mobile
+  .login_container {
+    display: none;
+  }
+
+  .navbar_logo {
+    font-size: 0.5rem;
+  }
+
+  .nav_links {
+    font-size: 0.5rem;
+  }
 
-    .signin_button {
-      background-color: #dc15cb;
+  .hamburger {
+    margin-right: 0.25rem;
+  }
+
+  .hamburger_bars {
+    font-size: 0.5rem;
+  }
+
+  .navbar_active {
+    .navbar_logo {
+      font-size: 0.5rem;
     }
 
-    .signup_button {
-      background-color: #006aff;
+    .nav_links {
+      font-size: 0.5rem;
     }
 
-    .signout_button {
-      background-color: #dc15cb;
+    .hamburger_bars {
+      font-size: 0.5rem;
     }
   }
 
-  .fas {
-    display: inline-block;
-  }
+  .navbar {
+    .navbar_logo {
+      font-size: 0.5rem;
+    }
 
-  .hamburger {
-    display: block;
-    margin: 0 2rem;
+    .nav_links {
+      font-size: 0.5rem;
+    }
+
+    .hamburger_bars {
+      font-size: 0.5rem;
+    }
   }
 }
diff --git a/frontend/src/pages/info/pricing/PricingPage.jsx b/frontend/src/pages/info/pricing/PricingPage.jsx
index e8e117e..273e6ab 100644
--- a/frontend/src/pages/info/pricing/PricingPage.jsx
+++ b/frontend/src/pages/info/pricing/PricingPage.jsx
@@ -1,16 +1,76 @@
-import React from "react";
+import React, { useState } from "react";
+import "./PricingPage.scss";
 
 const PricingPage = () => {
+  const [isAnnual, setIsAnnual] = useState(true);
+
+  const toggleSubscription = () => {
+    setIsAnnual(!isAnnual);
+  };
+
   return (
-    <div>
-      {/* apply margin top */}
-      <div className="mt-100">
-        <h1>Pricing</h1>
+    <div className="content">
+      <div className="header">
+        <h1 className="text-center my-5">Pricing</h1>
+        <p className="motto">Affordable prices for everyone</p>
+      </div>
+      <div className="toggle-container" onClick={toggleSubscription}>
+        <p className="toggle-label">{isAnnual ? "Annual" : "Monthly"}</p>
+        <div className={`slider ${isAnnual ? "" : "monthly"}`}></div>
+      </div>
+      <div className="d-flex justify-content-center">
+        <div className="card pricing-card engineering-card">
+          <div className="card-header">Engineering Bundle</div>
+          <div className="card-body">
+            <ul>
+              <li>Feature 1: Lorem ipsum dolor sit amet.</li>
+              <li>Feature 2: Consectetur adipiscing elit.</li>
+              <li>Feature 3: Sed do eiusmod tempor incididunt.</li>
+              <li>Feature 4: Ut labore et dolore magna aliqua.</li>
+            </ul>
+            <div className="price-add-to-cart">
+              <p>{isAnnual ? "$100/year" : "$10/month"}</p>
+              <button className="btn btn-primary add-to-cart-btn">
+                Add to Cart
+              </button>
+            </div>
+          </div>
+        </div>
+        <div className="card pricing-card arts-card">
+          <div className="card-header">Arts Bundle</div>
+          <div className="card-body">
+            <ul>
+              <li>Feature 1: Lorem ipsum dolor sit amet.</li>
+              <li>Feature 2: Consectetur adipiscing elit.</li>
+              <li>Feature 3: Sed do eiusmod tempor incididunt.</li>
+              <li>Feature 4: Ut labore et dolore magna aliqua.</li>
+            </ul>
+            <div className="price-add-to-cart">
+              <p>{isAnnual ? "$120/year" : "$12/month"}</p>
+              <button className="btn btn-primary add-to-cart-btn">
+                Add to Cart
+              </button>
+            </div>
+          </div>
+        </div>
+        <div className="card pricing-card commerce-card">
+          <div className="card-header">Commerce Bundle</div>
+          <div className="card-body">
+            <ul>
+              <li>Feature 1: Lorem ipsum dolor sit amet.</li>
+              <li>Feature 2: Consectetur adipiscing elit.</li>
+              <li>Feature 3: Sed do eiusmod tempor incididunt.</li>
+              <li>Feature 4: Ut labore et dolore magna aliqua.</li>
+            </ul>
+            <div className="price-add-to-cart">
+              <p>{isAnnual ? "$150/year" : "$15/month"}</p>
+              <button className="btn btn-primary add-to-cart-btn">
+                Add to Cart
+              </button>
+            </div>
+          </div>
+        </div>
       </div>
-      Pricing Page for Bundles of packages
-      <div>1) Engineering Bundle </div>
-      <div>2) Arts Bundle </div>
-      <div>3) Commerce Bundle </div>
     </div>
   );
 };
diff --git a/frontend/src/pages/info/pricing/PricingPage.scss b/frontend/src/pages/info/pricing/PricingPage.scss
index e69de29..5755240 100644
--- a/frontend/src/pages/info/pricing/PricingPage.scss
+++ b/frontend/src/pages/info/pricing/PricingPage.scss
@@ -0,0 +1,172 @@
+.content {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  margin-top: 80px;
+}
+
+.d-flex {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  align-items: center;
+  width: 85%;
+  height: 80vh;
+}
+.header {
+  text-align: center;
+
+  h1 {
+    font-size: 3rem;
+    margin-bottom: 0.5rem;
+  }
+
+  .motto {
+    font-size: 1.5rem;
+    font-style: italic;
+  }
+}
+
+.toggle-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 2rem;
+}
+
+.toggle-label {
+  font-size: 1.2rem;
+  margin-right: 1rem;
+}
+
+.slider {
+  position: relative;
+  width: 50px;
+  height: 25px;
+  border-radius: 50px;
+  background-color: #6a11cb;
+  cursor: pointer;
+
+  &::before {
+    content: "";
+    position: absolute;
+    top: 2px;
+    left: 2px;
+    width: 21px;
+    height: 21px;
+    border-radius: 50%;
+    background-color: #fff;
+    transition: 0.3s;
+  }
+
+  &.monthly {
+    background-color: #2575fc;
+
+    &::before {
+      transform: translateX(25px);
+    }
+  }
+}
+
+.pricing-card {
+  position: relative;
+  width: 80%;
+  height: 70%;
+  margin-bottom: 200px;
+  border-radius: 20px;
+  box-shadow: -8px -8px 16px rgba(255, 255, 255, 0.8),
+    inset -8px -8px 16px rgba(255, 255, 255, 0.5),
+    8px 8px 16px rgba(0, 0, 0, 0.1), inset 8px 8px 16px rgba(0, 0, 0, 0.1);
+
+  .card-header {
+    text-align: center;
+    font-size: 1.5rem;
+    font-weight: 600;
+    padding: 1rem;
+    color: #fff;
+  }
+
+  .card-body {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    align-items: center;
+    height: 100%;
+    border-radius: 20px;
+
+    ul {
+      flex-grow: 1;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      li {
+        list-style: none;
+
+        &:before {
+          content: "➤";
+          margin-right: 0.5rem;
+        }
+      }
+    }
+
+    .price-add-to-cart {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      width: 90%;
+
+      p {
+        margin-bottom: 0.5rem;
+      }
+
+      .add-to-cart-btn {
+        border-radius: 0.5rem;
+        position: relative;
+        bottom: 10px;
+        width: 100%;
+        height: 50px;
+        background-color: #0087f7;
+      }
+    }
+  }
+}
+
+.engineering-card {
+  box-shadow: -8px -8px 16px rgba(255, 255, 255, 0.8),
+    inset -8px -8px 16px rgba(255, 255, 255, 0.5),
+    inset -4px -4px 10px rgba(0, 0, 0, 0.05), -4px 4px 10px rgba(0, 0, 0, 0.05);
+  margin-right: -50px;
+}
+
+.arts-card {
+  box-shadow: -8px -8px 16px rgba(255, 255, 255, 0.8),
+    inset -8px -8px 16px rgba(255, 255, 255, 0.5),
+    inset -4px -4px 10px rgba(0, 0, 0, 0.05);
+  z-index: 1;
+}
+
+.commerce-card {
+  box-shadow: -8px -8px 16px rgba(255, 255, 255, 0.8),
+    inset -8px -8px 16px rgba(255, 255, 255, 0.5),
+    inset -4px -4px 10px rgba(0, 0, 0, 0.05), 4px 4px 10px rgba(0, 0, 0, 0.05);
+  margin-left: -50px;
+}
+
+.btn-primary {
+  background-image: linear-gradient(to right, #6a11cb, #2575fc);
+}
+
+.card-header {
+  background-image: linear-gradient(to right, #6a11cb, #2575fc);
+  border-top-left-radius: 20px;
+  border-top-right-radius: 20px;
+}
+
+.card-body {
+  background-image: linear-gradient(to bottom right, #f8f8f8, #e6e6e6);
+}
diff --git a/frontend/src/pages/landing/img3/apple-store.svg b/frontend/src/pages/landing/img3/apple-store.svg
new file mode 100644
index 0000000..ed1a7ef
--- /dev/null
+++ b/frontend/src/pages/landing/img3/apple-store.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8"?>
+
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 -189.93 539.856 539.856" xmlns="http://www.w3.org/2000/svg">
+
<g transform="scale(4.00216 4.0011)">
+
<path fill="#FFF" d="M134.032 35.268a3.83 3.83 0 0 1-3.834 3.83H4.729a3.835 3.835 0 0 1-3.839-3.83V4.725A3.84 3.84 0 0 1 4.729.89h125.468a3.834 3.834 0 0 1 3.834 3.835l.001 30.543z"/>
+
<path fill="#A6A6A6" d="M130.198 39.989H4.729A4.73 4.73 0 0 1 0 35.268V4.726A4.733 4.733 0 0 1 4.729 0h125.468a4.735 4.735 0 0 1 4.729 4.726v30.542c.002 2.604-2.123 4.721-4.728 4.721z"/>
+
<path d="M134.032 35.268a3.83 3.83 0 0 1-3.834 3.83H4.729a3.835 3.835 0 0 1-3.839-3.83V4.725A3.84 3.84 0 0 1 4.729.89h125.468a3.834 3.834 0 0 1 3.834 3.835l.001 30.543z"/>
+
<path fill="#FFF" d="M30.128 19.784c-.029-3.223 2.639-4.791 2.761-4.864-1.511-2.203-3.853-2.504-4.676-2.528-1.967-.207-3.875 1.177-4.877 1.177-1.022 0-2.565-1.157-4.228-1.123-2.14.033-4.142 1.272-5.24 3.196-2.266 3.923-.576 9.688 1.595 12.859 1.086 1.554 2.355 3.287 4.016 3.226 1.625-.066 2.232-1.035 4.193-1.035 1.943 0 2.513 1.035 4.207.996 1.744-.027 2.842-1.56 3.89-3.127 1.255-1.779 1.759-3.533 1.779-3.623-.04-.014-3.386-1.292-3.42-5.154zM26.928 10.306c.874-1.093 1.472-2.58 1.306-4.089-1.265.056-2.847.875-3.758 1.944-.806.942-1.526 2.486-1.34 3.938 1.421.106 2.88-.717 3.792-1.793z"/>
+
<linearGradient id="a" gradientUnits="userSpaceOnUse" x1="-23.235" y1="97.431" x2="-23.235" y2="61.386" gradientTransform="matrix(4.0022 0 0 4.0011 191.95 -349.736)">
+
<stop offset="0" stop-color="#1a1a1a" stop-opacity=".1"/>
+
<stop offset=".123" stop-color="#212121" stop-opacity=".151"/>
+
<stop offset=".308" stop-color="#353535" stop-opacity=".227"/>
+
<stop offset=".532" stop-color="#575757" stop-opacity=".318"/>
+
<stop offset=".783" stop-color="#858585" stop-opacity=".421"/>
+
<stop offset="1" stop-color="#b3b3b3" stop-opacity=".51"/>
+
</linearGradient>
+
<path fill="url(#a)" d="M130.198 0H62.993l26.323 39.989h40.882a4.733 4.733 0 0 0 4.729-4.724V4.726A4.734 4.734 0 0 0 130.198 0z"/>
+
<g fill="#FFF">
+
<path d="M53.665 31.504h-2.271l-1.244-3.909h-4.324l-1.185 3.909H42.43l4.285-13.308h2.646l4.304 13.308zm-3.89-5.549L48.65 22.48c-.119-.355-.343-1.191-.671-2.507h-.04c-.132.566-.343 1.402-.632 2.507l-1.106 3.475h3.574zM64.663 26.588c0 1.632-.443 2.922-1.33 3.869-.794.843-1.781 1.264-2.958 1.264-1.271 0-2.185-.453-2.74-1.361v5.035h-2.132V25.062c0-1.025-.027-2.076-.079-3.154h1.875l.119 1.521h.04c.711-1.146 1.79-1.719 3.238-1.719 1.132 0 2.077.447 2.833 1.342.755.897 1.134 2.075 1.134 3.536zm-2.172.078c0-.934-.21-1.704-.632-2.311-.461-.631-1.08-.947-1.856-.947-.526 0-1.004.176-1.431.523-.428.35-.708.807-.839 1.373a2.784 2.784 0 0 0-.099.649v1.601c0 .697.214 1.286.642 1.768.428.48.984.721 1.668.721.803 0 1.428-.311 1.875-.928.448-.619.672-1.435.672-2.449zM75.7 26.588c0 1.632-.443 2.922-1.33 3.869-.795.843-1.781 1.264-2.959 1.264-1.271 0-2.185-.453-2.74-1.361v5.035h-2.132V25.062c0-1.025-.027-2.076-.079-3.154h1.875l.119 1.521h.04c.71-1.146 1.789-1.719 3.238-1.719 1.131 0 2.076.447 2.834 1.342.754.897 1.134 2.075 1.134 3.536zm-2.173.078c0-.934-.211-1.704-.633-2.311-.461-.631-1.078-.947-1.854-.947-.526 0-1.004.176-1.433.523-.428.35-.707.807-.838 1.373-.065.264-.1.479-.1.649v1.601c0 .697.215 1.286.641 1.768.428.479.984.721 1.67.721.804 0 1.429-.311 1.875-.928.448-.619.672-1.435.672-2.449zM88.04 27.771c0 1.133-.396 2.054-1.183 2.765-.866.776-2.075 1.165-3.625 1.165-1.432 0-2.58-.276-3.446-.829l.493-1.777c.935.554 1.962.83 3.08.83.804 0 1.429-.182 1.875-.543.447-.362.673-.846.673-1.45 0-.541-.187-.994-.554-1.363-.369-.368-.979-.711-1.836-1.026-2.33-.869-3.496-2.14-3.496-3.812 0-1.092.412-1.986 1.234-2.685.822-.698 1.912-1.047 3.268-1.047 1.211 0 2.22.211 3.021.632l-.535 1.738c-.754-.408-1.605-.612-2.557-.612-.752 0-1.342.185-1.764.553-.355.329-.535.73-.535 1.206 0 .525.205.961.613 1.303.354.315 1 .658 1.934 1.026 1.146.462 1.988 1 2.527 1.618.543.618.813 1.389.813 2.308zM95.107 23.508h-2.35v4.659c0 1.185.414 1.776 1.244 1.776.381 0 .697-.032.947-.099l.059 1.619c-.42.157-.973.236-1.658.236-.842 0-1.5-.257-1.975-.771-.473-.514-.711-1.375-.711-2.587v-4.837h-1.4v-1.6h1.4v-1.757l2.094-.632v2.389h2.35v1.604zM105.689 26.627c0 1.475-.422 2.686-1.264 3.633-.881.975-2.053 1.461-3.514 1.461-1.41 0-2.531-.467-3.367-1.4-.836-.935-1.254-2.113-1.254-3.534 0-1.487.432-2.705 1.293-3.652.863-.948 2.025-1.422 3.486-1.422 1.408 0 2.539.468 3.395 1.402.818.906 1.225 2.076 1.225 3.512zm-2.21.049c0-.879-.19-1.633-.571-2.264-.447-.762-1.087-1.143-1.916-1.143-.854 0-1.509.381-1.955 1.143-.382.631-.572 1.398-.572 2.304 0 .88.19 1.636.572 2.265.461.762 1.104 1.143 1.937 1.143.815 0 1.454-.389 1.916-1.162.392-.646.589-1.405.589-2.286zM112.622 23.783a3.71 3.71 0 0 0-.672-.059c-.75 0-1.33.282-1.738.85-.354.5-.532 1.132-.532 1.895v5.035h-2.132V24.93a67.43 67.43 0 0 0-.062-3.021h1.857l.078 1.836h.059c.226-.631.58-1.14 1.066-1.521a2.578 2.578 0 0 1 1.541-.514c.197 0 .375.014.533.039l.002 2.034zM122.157 26.252a5 5 0 0 1-.078.967h-6.396c.024.948.334 1.674.928 2.174.539.446 1.236.67 2.092.67.947 0 1.811-.15 2.588-.453l.334 1.479c-.908.396-1.98.593-3.217.593-1.488 0-2.656-.438-3.506-1.312-.848-.875-1.273-2.051-1.273-3.524 0-1.446.395-2.651 1.186-3.612.828-1.026 1.947-1.539 3.355-1.539 1.383 0 2.43.513 3.141 1.539.563.813.846 1.821.846 3.018zm-2.033-.553c.015-.633-.125-1.178-.414-1.639-.369-.594-.937-.89-1.698-.89-.697 0-1.265.289-1.697.869-.355.461-.566 1.015-.631 1.658l4.44.002z"/>
+
</g>
+
<g fill="#FFF">
+
<path d="M45.211 13.491c-.593 0-1.106-.029-1.533-.078V6.979a11.606 11.606 0 0 1 1.805-.136c2.445 0 3.571 1.203 3.571 3.164 0 2.262-1.33 3.484-3.843 3.484zm.358-5.823c-.33 0-.611.02-.844.068v4.891c.126.02.368.029.708.029 1.602 0 2.514-.912 2.514-2.62 0-1.523-.825-2.368-2.378-2.368zM52.563 13.54c-1.378 0-2.271-1.029-2.271-2.426 0-1.456.912-2.494 2.349-2.494 1.358 0 2.271.98 2.271 2.417 0 1.474-.941 2.503-2.349 2.503zm.04-4.154c-.757 0-1.242.708-1.242 1.698 0 .971.495 1.679 1.232 1.679s1.232-.757 1.232-1.699c0-.96-.485-1.678-1.222-1.678zM62.77 8.717l-1.475 4.716h-.961l-.611-2.048a15.53 15.53 0 0 1-.379-1.523h-.02c-.077.514-.223 1.029-.378 1.523l-.65 2.048h-.971l-1.388-4.716h1.077l.534 2.242c.126.534.232 1.038.32 1.514h.02c.077-.397.203-.893.388-1.504l.67-2.251h.854l.641 2.203c.155.534.281 1.058.379 1.553h.028c.068-.485.175-1 .32-1.553l.573-2.203 1.029-.001zM68.2 13.433h-1.048v-2.708c0-.834-.32-1.252-.951-1.252-.621 0-1.048.534-1.048 1.155v2.805h-1.048v-3.368c0-.417-.01-.864-.039-1.349h.922l.049.728h.029c.282-.504.854-.824 1.495-.824.99 0 1.64.757 1.64 1.989l-.001 2.824zM71.09 13.433h-1.049v-6.88h1.049v6.88zM74.911 13.54c-1.377 0-2.271-1.029-2.271-2.426 0-1.456.912-2.494 2.348-2.494 1.359 0 2.271.98 2.271 2.417.001 1.474-.941 2.503-2.348 2.503zm.039-4.154c-.757 0-1.242.708-1.242 1.698 0 .971.496 1.679 1.231 1.679.738 0 1.232-.757 1.232-1.699.001-.96-.483-1.678-1.221-1.678zM81.391 13.433l-.076-.543h-.028c-.32.437-.787.65-1.379.65-.845 0-1.445-.592-1.445-1.388 0-1.164 1.009-1.766 2.756-1.766v-.087c0-.621-.329-.932-.979-.932-.465 0-.873.117-1.232.35l-.213-.689c.436-.272.98-.408 1.619-.408 1.232 0 1.854.65 1.854 1.951v1.737c0 .476.021.845.068 1.126l-.945-.001zm-.144-2.349c-1.164 0-1.748.282-1.748.951 0 .495.301.737.719.737.533 0 1.029-.407 1.029-.96v-.728zM87.357 13.433l-.049-.757h-.029c-.301.572-.807.864-1.514.864-1.137 0-1.979-1-1.979-2.407 0-1.475.873-2.514 2.065-2.514.631 0 1.078.213 1.33.641h.021V6.553h1.049v5.609c0 .456.011.883.039 1.271h-.933zm-.155-2.775c0-.66-.437-1.223-1.104-1.223-.777 0-1.252.689-1.252 1.659 0 .951.493 1.602 1.231 1.602.659 0 1.125-.573 1.125-1.252v-.786zM94.902 13.54c-1.377 0-2.27-1.029-2.27-2.426 0-1.456.912-2.494 2.348-2.494 1.359 0 2.271.98 2.271 2.417.001 1.474-.94 2.503-2.349 2.503zm.039-4.154c-.756 0-1.241.708-1.241 1.698 0 .971.495 1.679 1.231 1.679.738 0 1.232-.757 1.232-1.699.002-.96-.483-1.678-1.222-1.678zM102.887 13.433h-1.049v-2.708c0-.834-.32-1.252-.951-1.252-.621 0-1.047.534-1.047 1.155v2.805h-1.049v-3.368c0-.417-.01-.864-.039-1.349h.922l.049.728h.029c.281-.504.854-.825 1.494-.825.99 0 1.641.757 1.641 1.989v2.825zM109.938 9.503h-1.153v2.29c0 .583.202.874.61.874.185 0 .34-.02.465-.049l.029.796c-.203.078-.475.117-.813.117-.826 0-1.32-.456-1.32-1.65V9.503h-.688v-.786h.688v-.864l1.029-.311v1.174h1.153v.787zM115.486 13.433h-1.047v-2.688c0-.844-.319-1.271-.951-1.271-.543 0-1.049.369-1.049 1.116v2.843h-1.047v-6.88h1.047v2.833h.021c.33-.514.808-.767 1.418-.767.998 0 1.608.776 1.608 2.009v2.805zM121.17 11.327h-3.145c.02.893.611 1.397 1.486 1.397.465 0 .893-.078 1.271-.223l.163.728c-.446.194-.971.291-1.582.291-1.475 0-2.348-.932-2.348-2.377 0-1.446.894-2.533 2.23-2.533 1.205 0 1.961.893 1.961 2.242a2.02 2.02 0 0 1-.036.475zm-.961-.747c0-.728-.367-1.242-1.037-1.242-.602 0-1.078.524-1.146 1.242h2.183z"/>
+
</g>
+
</g>
+
</svg>
\ No newline at end of file
diff --git a/frontend/src/pages/landing/img3/google-play.svg b/frontend/src/pages/landing/img3/google-play.svg
new file mode 100644
index 0000000..7543126
--- /dev/null
+++ b/frontend/src/pages/landing/img3/google-play.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="800" width="1200" viewBox="-449.84925 -222.507 3898.6935 1335.042"><defs><linearGradient id="a" y2=".278" x2=".26" y1=".956" x1=".613"><stop offset="0%" stop-color="#00A0FF"/><stop offset=".657%" stop-color="#00A1FF"/><stop offset="26.01%" stop-color="#00BEFF"/><stop offset="51.22%" stop-color="#00D2FF"/><stop offset="76.04%" stop-color="#00DFFF"/><stop offset="100%" stop-color="#00E3FF"/></linearGradient><linearGradient id="b" y2=".509" x2="-1.305" y1=".509" x1="1.076"><stop offset="0%" stop-color="#FFE000"/><stop offset="40.87%" stop-color="#FFBD00"/><stop offset="77.54%" stop-color="orange"/><stop offset="100%" stop-color="#FF9C00"/></linearGradient><linearGradient id="c" y2="-.361" x2="-.505" y1=".691" x1=".867"><stop offset="0%" stop-color="#FF3A44"/><stop offset="100%" stop-color="#C31162"/></linearGradient><linearGradient id="d" y2=".649" x2=".418" y1="1.119" x1="-.193"><stop offset="0%" stop-color="#32A071"/><stop offset="6.85%" stop-color="#2DA771"/><stop offset="47.62%" stop-color="#15CF74"/><stop offset="80.09%" stop-color="#06E775"/><stop offset="100%" stop-color="#00F076"/></linearGradient><linearGradient id="e" y2="-.021" x2="-.501" y1=".695" x1=".862"><stop offset="0%" stop-color="#CC2E36"/><stop offset="100%" stop-color="#9C0E4E"/></linearGradient><linearGradient id="f" y2="4.496" x2="-.663" y1="15.318" x1="3.073"><stop offset="0%" stop-color="#008DE0"/><stop offset=".657%" stop-color="#008DE0"/><stop offset="26.01%" stop-color="#00A7E0"/><stop offset="51.22%" stop-color="#00B8E0"/><stop offset="76.04%" stop-color="#00C4E0"/><stop offset="100%" stop-color="#00C7E0"/></linearGradient><linearGradient id="g" y2="1" x2="-2.882" y1="1" x1="1.128"><stop offset="0%" stop-color="#E0C500"/><stop offset="40.87%" stop-color="#E0A600"/><stop offset="77.54%" stop-color="#E09100"/><stop offset="100%" stop-color="#E08900"/></linearGradient><linearGradient id="h" y2="0" x2="-2.882" y1="0" x1="1.128"><stop offset="0%" stop-color="#FFE840"/><stop offset="40.87%" stop-color="#FFCE40"/><stop offset="77.54%" stop-color="#FFBC40"/><stop offset="100%" stop-color="#FFB540"/></linearGradient><linearGradient id="i" y2="-10.098" x2="-.657" y1=".234" x1="3.061"><stop offset="0%" stop-color="#40B8FF"/><stop offset=".657%" stop-color="#40B9FF"/><stop offset="26.01%" stop-color="#40CEFF"/><stop offset="51.22%" stop-color="#40DDFF"/><stop offset="76.04%" stop-color="#40E7FF"/><stop offset="100%" stop-color="#40EAFF"/></linearGradient><linearGradient id="j" y2=".537" x2=".421" y1=".856" x1="-.188"><stop offset="0%" stop-color="#65B895"/><stop offset="6.85%" stop-color="#62BD95"/><stop offset="47.62%" stop-color="#50DB97"/><stop offset="80.09%" stop-color="#44ED98"/><stop offset="100%" stop-color="#40F498"/></linearGradient><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(.72167 1.38567)" y2="110.924" x2="103.763" y1="380.413" x1="243.89" id="k" xlink:href="#a"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(1.1083 .90228)" y2="104.456" x2="-265.185" y1="104.456" x1="219.82" id="l" xlink:href="#b"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(1.13894 .878)" y2="-116.045" x2="-162.26" y1="222.803" x1="279.815" id="m" xlink:href="#c"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(1.13896 .878)" y2="210.03" x2="134.984" y1="361.335" x1="-62.115" id="n" xlink:href="#d"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(1.38147 .72387)" y2="-4.388" x2="-133.972" y1="187.683" x1="231.994" id="o" xlink:href="#e"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(.58803 1.7006)" y2="91.69" x2="-13.255" y1="311.274" x1="62.549" id="p" xlink:href="#f"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(1.19442 .83723)" y2="112.451" x2="-322.924" y1="112.451" x1="127.112" id="q" xlink:href="#g"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(1.1944 .83724)" y2=".829" x2="-322.928" y1=".829" x1="127.114" id="r" xlink:href="#h"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(.58722 1.70294)" y2="-204.589" x2="-13.13" y1="4.878" x1="62.249" id="s" xlink:href="#i"/><linearGradient gradientUnits="userSpaceOnUse" gradientTransform="scale(1.38144 .72388)" y2="144.927" x2="113.528" y1="230.7" x1="-49.894" id="t" xlink:href="#j"/></defs><g fill="none"><path fill="#000" d="M2887.921 890.028H111.074C49.984 890.028 0 839.964 0 778.775V111.254C0 50.064 49.983 0 111.074 0H2887.92c61.09 0 111.074 50.064 111.074 111.254v667.52c0 61.19-49.983 111.254-111.074 111.254"/><path fill="#A6A6A6" d="M2887.921 0H111.074C49.984 0 0 50.064 0 111.254v667.52c0 61.19 49.983 111.254 111.074 111.254H2887.92c61.09 0 111.074-50.064 111.074-111.253V111.254C2998.995 50.064 2949.012 0 2887.92 0m0 17.8c51.45 0 93.302 41.93 93.302 93.454v667.52c0 51.534-41.853 93.463-93.302 93.463H111.074c-51.44 0-93.302-41.93-93.302-93.462V111.254c0-51.524 41.861-93.453 93.302-93.453H2887.92"/><path fill="#FFF" d="M1053.39 227.923c0 18.642-5.512 33.487-16.55 44.561-12.539 13.168-28.88 19.757-48.969 19.757-19.238 0-35.595-6.675-49.046-20.044-13.475-13.359-20.2-29.925-20.2-49.69 0-19.774 6.725-36.33 20.2-49.7 13.451-13.358 29.808-20.043 49.046-20.043 9.546 0 18.685 1.87 27.362 5.599 8.677 3.738 15.637 8.7 20.844 14.914l-11.716 11.742c-8.824-10.56-20.973-15.836-36.49-15.836-14.03 0-26.162 4.938-36.401 14.82-10.241 9.892-15.36 22.72-15.36 38.504 0 15.785 5.119 28.612 15.36 38.505 10.239 9.882 22.37 14.819 36.401 14.819 14.884 0 27.293-4.964 37.228-14.906 6.449-6.477 10.178-15.48 11.176-27.041H987.87v-16.036h64.59c.624 3.487.928 6.833.928 10.075"/><path fill="#FFF" d="M1053.39 227.923h-2.222c-.018 18.217-5.33 32.366-15.9 42.988l-.023.018-.01.018c-12.14 12.714-27.745 19.042-47.365 19.069-18.724-.027-34.397-6.424-47.484-19.392-13.058-12.994-19.515-28.857-19.54-48.117.025-19.269 6.482-35.123 19.54-48.108 13.087-12.977 28.76-19.383 47.484-19.41 9.26 0 18.077 1.81 26.485 5.416 8.417 3.634 15.066 8.396 20.02 14.308l1.701-1.436-1.57-1.573-11.716 11.75 1.57 1.565 1.711-1.424c-9.235-11.083-22.197-16.67-38.2-16.637-14.551-.018-27.351 5.19-37.939 15.447-10.69 10.29-16.061 23.84-16.043 40.102-.018 16.263 5.353 29.812 16.043 40.103 10.588 10.257 23.388 15.464 37.938 15.446 15.377.027 28.482-5.198 38.799-15.558 6.89-6.92 10.796-16.505 11.82-28.423l.207-2.416h-48.604v-11.586h62.368v-2.225l-2.188.391c.608 3.374.895 6.58.895 9.684h4.443c0-3.382-.313-6.858-.964-10.473l-.329-1.827H985.65v20.486h50.625v-2.225l-2.212-.191c-.98 11.196-4.539 19.627-10.535 25.66-9.545 9.525-21.26 14.226-35.657 14.253-13.51-.018-24.973-4.677-34.857-14.194-9.788-9.483-14.657-21.59-14.682-36.905.025-15.315 4.894-27.422 14.682-36.905 9.884-9.517 21.346-14.176 34.857-14.194 15.022.036 26.365 5.007 34.791 15.046l1.562 1.86 13.424-13.463 1.44-1.442-1.311-1.558c-5.458-6.517-12.73-11.69-21.668-15.53-8.955-3.852-18.405-5.782-28.238-5.782-19.749-.017-36.792 6.936-50.616 20.696-13.875 13.733-20.869 30.995-20.85 51.272-.019 20.268 6.975 37.54 20.859 51.281 13.815 13.751 30.858 20.696 50.607 20.678 20.567.018 37.628-6.824 50.575-20.444l-1.607-1.538 1.571 1.574c11.507-11.517 17.216-27.075 17.201-46.135h-2.222m102.395-55.767h-60.7v42.33h54.74v16.042h-54.74v42.33h60.7v16.401h-77.812V155.755h77.812v16.401"/><path fill="#FFF" d="M1155.784 172.156v-2.225h-62.921v46.78h54.739v11.586l-54.74.006v46.78h60.7v11.951h-73.368V157.98h73.368v14.176h2.222v-2.225 2.225h2.221V153.53h-82.254v137.954h82.254v-20.851h-60.7v-37.88h54.74v-20.492h-54.74v-37.88h60.7v-2.225h-2.221m72.224 117.104h-17.138V172.155h-37.228v-16.401h91.594v16.401h-37.228v117.103"/><path fill="#FFF" d="M1228.008 289.26v-2.226h-14.917V169.931h-37.227v-11.95h87.15v11.95h-37.227v119.328h2.221v-2.225 2.225h2.222V174.381h37.227V153.53h-96.036v20.85h37.227v117.103h21.582v-2.225h-2.222m103.499.002V155.754h17.121v133.504h-17.121"/><path fill="#FFF" d="M1331.507 289.26h2.222V157.98h12.677v129.054h-14.899v2.225h2.222-2.222v2.225h19.342V153.53h-21.563v137.954h2.221v-2.225m93.093.001h-17.138V172.155h-37.226v-16.401h91.592v16.401H1424.6v117.103"/><path fill="#FFF" d="M1424.6 289.26v-2.226h-14.917V169.931h-37.225v-11.95h87.148v11.95h-37.227v119.328h2.221v-2.225 2.225h2.222V174.381h37.227V153.53h-96.034v20.85h37.225v117.103h21.582v-2.225h-2.222m125.532-28.428c9.865 10.003 21.937 15 36.212 15 14.275 0 26.353-4.997 36.203-15 9.875-10.004 14.822-22.792 14.822-38.323 0-15.53-4.947-28.318-14.822-38.322-9.85-10.004-21.928-15.002-36.203-15.002-14.275 0-26.347 4.998-36.212 15.002-9.85 10.004-14.795 22.791-14.795 38.322 0 15.531 4.945 28.319 14.795 38.323zm85.084 11.176c-13.104 13.497-29.4 20.235-48.872 20.235-19.491 0-35.78-6.738-48.855-20.235-13.113-13.482-19.638-29.985-19.638-49.499 0-19.514 6.525-36.02 19.638-49.499 13.076-13.5 29.364-20.244 48.855-20.244 19.369 0 35.621 6.78 48.786 20.331 13.146 13.55 19.724 30.02 19.724 49.412 0 19.514-6.562 36.017-19.638 49.499z"/><path fill="#FFF" d="M1550.132 260.83l-1.58 1.564c10.232 10.404 22.997 15.689 37.792 15.662 14.786.027 27.568-5.258 37.783-15.662 10.299-10.414 15.479-23.886 15.463-39.887.015-16-5.164-29.473-15.463-39.887-10.215-10.404-22.997-15.688-37.783-15.662-14.795-.026-27.56 5.258-37.792 15.662-10.274 10.414-15.464 23.887-15.437 39.887-.027 16 5.163 29.473 15.437 39.887l1.58-1.564 1.58-1.565c-9.424-9.605-14.136-21.687-14.154-36.758.018-15.07 4.73-27.152 14.153-36.758 9.51-9.603 20.869-14.314 34.633-14.34 13.753.026 25.138 4.737 34.624 14.34 9.441 9.606 14.153 21.688 14.17 36.758-.017 15.07-4.729 27.153-14.17 36.758-9.486 9.604-20.87 14.314-34.624 14.34-13.764-.026-25.123-4.736-34.633-14.34zm85.084 11.176l-1.588-1.546c-12.738 13.072-28.315 19.53-47.284 19.556-18.978-.027-34.555-6.484-47.269-19.556l-.06-.07.06.07c-12.711-13.117-18.984-28.935-19.002-47.953.018-19.018 6.291-34.836 19.002-47.952 12.714-13.073 28.29-19.539 47.269-19.565 18.847.026 34.388 6.519 47.197 19.66 12.756 13.177 19.065 28.97 19.092 47.857-.027 19.018-6.318 34.836-19.005 47.953l1.588 1.546 1.598 1.546c13.466-13.853 20.277-31.037 20.262-51.045.016-19.894-6.822-37.043-20.351-50.958-13.536-13.97-30.492-21.034-50.381-21.01-19.993-.024-37.001 7.007-50.452 20.923v-.01c-13.493 13.863-20.28 31.047-20.262 51.055-.018 20.008 6.769 37.192 20.262 51.054l.06.063-.06-.072c13.451 13.916 30.459 20.932 50.452 20.914 19.984.018 36.992-6.998 50.47-20.914l-1.598-1.546zm43.674 17.254V155.754h20.845l64.778 103.857h.738l-.738-25.728v-78.129h17.139v133.504h-17.877l-67.772-108.89h-.738l.738 25.737v83.153h-17.112"/><path fill="#FFF" d="M1678.89 289.26h2.222V157.98h17.39l64.778 103.857h4.252l-.798-27.986v-75.87h12.696v129.053h-14.422l-67.772-108.89h-4.252l.797 27.998v80.892h-14.89v2.225h2.221-2.221v2.225h19.333v-85.413l-.737-25.762-2.222.06v2.225h.738v-2.225l-1.884 1.183 68.424 109.932h21.33V153.53h-21.581v80.38l.737 25.762 2.222-.06v-2.225h-.738v2.225l1.884-1.181-65.432-104.901h-24.295v137.954h2.222v-2.225m696.668 378.262h41.452v-278.16h-41.453zm373.363-177.96l-47.517 120.596h-1.422l-49.317-120.597h-44.652l73.953 168.556-42.163 93.758h43.252l113.962-262.314zm-235.077 146.367c-13.595 0-32.522-6.798-32.522-23.624 0-21.47 23.592-29.7 43.94-29.7 18.24 0 26.792 3.936 37.877 9.31-3.221 25.761-25.37 44.014-49.295 44.014zm4.999-152.453c-30.013 0-61.091 13.245-73.953 42.59l36.787 15.384c7.864-15.384 22.504-20.4 37.877-20.4 21.437 0 43.23 12.89 43.585 35.793v2.86c-7.509-4.295-23.57-10.735-43.23-10.735-39.653 0-80.04 21.824-80.04 62.623 0 37.219 32.523 61.198 68.955 61.198 27.88 0 43.23-12.525 52.893-27.195h1.422v21.468h40.009V560.413c0-49.376-36.788-76.938-84.305-76.938zm-256.181 39.946h-58.958v-95.346h58.958c30.99 0 48.584 25.7 48.584 47.672 0 21.556-17.595 47.674-48.584 47.674zm-1.066-134.06h-99.323v278.16h41.43V562.135h57.893c45.94 0 91.102-33.316 91.102-86.388 0-53.07-45.162-86.386-91.102-86.386zm-541.619 246.618c-28.637 0-52.613-24.015-52.613-57 0-33.331 23.976-57.712 52.613-57.712 28.273 0 50.461 24.38 50.461 57.712 0 32.985-22.188 57-50.46 57zm47.597-130.843h-1.432c-9.302-11.11-27.205-21.147-49.748-21.147-47.242 0-90.543 41.58-90.543 94.99 0 53.055 43.3 94.279 90.543 94.279 22.543 0 40.446-10.04 49.748-21.504h1.432v13.62c0 36.211-19.324 55.567-50.46 55.567-25.41 0-41.158-18.288-47.607-33.699l-36.14 15.055c10.378 25.092 37.937 55.923 83.747 55.923 48.672 0 89.83-28.684 89.83-98.582V489.725h-39.37zm67.998 162.385h41.515v-278.17h-41.515zm102.716-91.766c-1.075-36.567 28.273-55.202 49.386-55.202 16.474 0 30.425 8.24 35.068 20.08zm128.84-31.543c-7.865-21.156-31.857-60.223-80.887-60.223-48.672 0-89.11 38.355-89.11 94.634 0 53.055 40.082 94.635 93.762 94.635 43.312 0 68.37-26.528 78.745-41.939l-32.212-21.512c-10.73 15.776-25.413 26.172-46.533 26.172-21.113 0-36.141-9.682-45.81-28.675l126.332-52.34zm-1006.512-31.186v40.147h95.912c-2.863 22.582-10.379 39.07-21.833 50.542-13.953 13.985-35.785 29.396-74.08 29.396-59.053 0-105.217-47.675-105.217-106.822 0-59.146 46.164-106.827 105.218-106.827 31.854 0 55.11 12.549 72.291 28.68l28.273-28.316c-23.976-22.947-55.832-40.511-100.564-40.511-80.886 0-148.884 65.96-148.884 146.974 0 81.015 67.998 146.969 148.884 146.969 43.665 0 76.588-14.332 102.352-41.224 26.485-26.528 34.72-63.806 34.72-93.914 0-9.327-.713-17.923-2.153-25.094zm246.115 122.953c-28.637 0-53.333-23.66-53.333-57.356 0-34.055 24.696-57.356 53.333-57.356 28.626 0 53.322 23.301 53.322 57.356 0 33.697-24.696 57.356-53.322 57.356zm0-151.99c-52.258 0-94.848 39.788-94.848 94.634 0 54.488 42.59 94.635 94.848 94.635 52.247 0 94.837-40.147 94.837-94.635 0-54.846-42.59-94.634-94.837-94.634zm206.89 151.99c-28.625 0-53.324-23.66-53.324-57.356 0-34.055 24.699-57.356 53.325-57.356 28.628 0 53.324 23.301 53.324 57.356 0 33.697-24.696 57.356-53.324 57.356zm0-151.99c-52.255 0-94.836 39.788-94.836 94.634 0 54.488 42.581 94.635 94.837 94.635 52.249 0 94.84-40.147 94.84-94.635 0-54.846-42.591-94.634-94.84-94.634z"/><path fill="#00C1FF" d="M233.446 169.357c-7.455 6.737-11.905 17.974-11.905 32.89v-3.372 492.21-3.242c0 13.775 3.817 24.413 10.281 31.264l1.65 1.582v.007c5.232 4.729 11.941 7.24 19.63 7.232 7.513 0 15.966-2.399 24.887-7.465l322.452-183.508 110.76-63.041c14.067-8.004 21.964-18.33 23.284-28.848v-.043c-1.32-10.542-9.217-20.86-23.283-28.865l-110.77-63.033L277.99 169.617c-8.94-5.075-17.399-7.483-24.932-7.483-7.68 0-14.38 2.503-19.61 7.223z"/><path d="M12.047.234l-1.651 1.582C3.932 8.666.115 19.305.115 33.08v-3.242 492.088-3.25c0 14.916 4.45 26.153 11.905 32.89l275.237-275.675L12.047.234" fill="url(#k)" transform="matrix(1 0 0 -1 221.426 720.923)"/><path d="M92.444.738L.686 92.66l91.75 91.907 110.769-63.032c14.066-8.006 21.963-18.323 23.283-28.866v-.042c-1.32-10.518-9.217-20.845-23.283-28.848L92.445.739" fill="url(#l)" transform="matrix(1 0 0 -1 507.997 537.692)"/><path d="M20.068.12C12.38.113 5.671 2.625.44 7.353v.007l275.21 275.657 91.758-91.922L44.955 7.586C36.034 2.519 27.581.12 20.068.12" fill="url(#m)" transform="matrix(1 0 0 -1 233.034 728.048)"/><path d="M275.428.707L.19 276.382c5.232 4.72 11.932 7.223 19.611 7.223 7.533 0 15.993-2.407 24.932-7.483L367.177 92.614 275.427.707" fill="url(#n)" transform="matrix(1 0 0 -1 233.255 445.74)"/><path d="M22.077.861c-7.688 0-14.406 2.512-19.638 7.24l-.009-.008a.635.635 0 01-.069.06L.93 9.553c-.045.044-.087.095-.14.146l1.65 1.653c5.232-4.728 11.94-7.24 19.63-7.231 7.512 0 15.965 2.398 24.886 7.465l322.452 183.508 2.066-2.07-2.092-1.19L46.955 8.336C38.825 3.72 31.092 1.313 24.107.912a41.848 41.848 0 00-2.03-.05" fill="url(#o)" transform="matrix(1 0 0 -1 231.034 732.048)"/><path d="M10.396.799C3.932 7.649.115 18.279.115 32.063v3.242c0-13.775 3.817-24.413 10.281-31.264l1.65-1.582-1.65-1.66" fill="url(#p)" transform="matrix(1 0 0 -1 221.426 723.148)"/><path d="M2.708.169L.642 2.239l110.76 63.04c14.067 8.003 21.964 18.33 23.284 28.848 0-3.86-.86-7.719-2.568-11.475-3.446-7.57-10.352-14.723-20.715-20.624L2.708.168" fill="url(#q)" transform="matrix(1 0 0 -1 599.799 539.192)"/><path d="M134.686.716c-1.32 10.543-9.217 20.86-23.283 28.866L.633 92.614l2.066 2.07h.009l108.695-61.86c15.508-8.831 23.274-20.468 23.283-32.108" fill="url(#r)" transform="matrix(1 0 0 -1 599.799 445.74)"/><path d="M.115.234v3.4c0 1.226.033 2.425.096 3.589v.053c0 .016 0 .033.006.051v.131c.669 11.865 4.348 21.12 10.179 27.3l1.624-1.633C4.565 26.387.115 15.15.115.234" fill="url(#s)" transform="matrix(1 0 0 -1 221.426 202.481)"/><path d="M369.398.66L46.955 184.17c-8.939 5.075-17.398 7.482-24.931 7.482-7.68 0-14.38-2.503-19.611-7.223l-1.624 1.634a29.747 29.747 0 001.58 1.555c.017.018.044.036.061.053 5.19 4.684 11.819 7.187 19.43 7.232h.164c7.533 0 15.992-2.408 24.931-7.485L371.473 2.737l-.009-.007-2.066-2.07" fill="url(#t)" transform="matrix(1 0 0 -1 231.034 353.786)"/></g></svg>
\ No newline at end of file
diff --git a/frontend/src/pages/landing/landingcomponents/Footer.js b/frontend/src/pages/landing/landingcomponents/Footer.js
index 0a88fbf..b32693f 100755
--- a/frontend/src/pages/landing/landingcomponents/Footer.js
+++ b/frontend/src/pages/landing/landingcomponents/Footer.js
@@ -1,96 +1,149 @@
-import React from 'react';
-import styled from 'styled-components';
-import { InnerLayout } from '../styles/Layouts';
-import logo from '../img/logo.svg';
+import React from "react";
+import styled from "styled-components";
+import { InnerLayout } from "../styles/Layouts";
+import logo from "../img/logo.svg";
+import appleStore from "../img3/apple-store.svg";
+import googlePlay from "../img3/google-play.svg";
 
 function Footer() {
-    return (
-        <FooterStyled>
-            <InnerLayout>
-                <div className="footer-con">
-                    <div className="logo-con">
-                       <div className="logo-items">
-                        <img src={logo} alt="" />
-                            <p>
-                                Copyright @2021 LoremIpsum. <br />
-                                All rights reserved.
-                            </p>
-                       </div>
-                    </div>
-                    <ul className="botton-nav">
-                        <div className="links1">
-                            <li>
-                                <a href="/team">Team</a>
-                            </li>
-                            <li>
-                                <a href="/press">Press</a>
-                            </li>
-                            <li>
-                                <a href="/fees">Fees</a>
-                            </li>
-                        </div>
-                        <div className="links2">
-                            <li>
-                                <a href="/services">Services</a>
-                            </li>
-                            <li>
-                                <a href="/projects">Projects</a>
-                            </li>
-                            <li>
-                                <a href="/affiliate">Affiliate</a>
-                            </li>
-                        </div>
-                        <div className="links3">
-                            <li>
-                                <a href="/terms">Terms of use</a>
-                            </li>
-                            <li>
-                                <a href="/privacy">Privacy Policy</a>
-                            </li>
-                            <li>
-                                <a href="/contact">Contact us</a>
-                            </li>
-                        </div>
-                    </ul>
-                </div>
-            </InnerLayout>
-        </FooterStyled>
-    )
+  return (
+    <FooterStyled>
+      <InnerLayout>
+        <div className="footer-con">
+          <div className="logo-con">
+            <img src={logo} alt="" />
+            <div className="logo-items">
+              <p>
+                Copyright @2021 LoremIpsum. <br />
+                All rights reserved.
+              </p>
+            </div>
+          </div>
+          <ul className="botton-nav">
+            <div className="links1">
+              <li>
+                <a href="/team">Team</a>
+              </li>
+              <li>
+                <a href="/press">Press</a>
+              </li>
+              <li>
+                <a href="/fees">Fees</a>
+              </li>
+            </div>
+            <div className="links2">
+              <li>
+                <a href="/services">Services</a>
+              </li>
+              <li>
+                <a href="/projects">Projects</a>
+              </li>
+              <li>
+                <a href="/affiliate">Affiliate</a>
+              </li>
+            </div>
+            <div className="links3">
+              <li>
+                <a href="/terms">Terms of use</a>
+              </li>
+              <li>
+                <a href="/privacy">Privacy Policy</a>
+              </li>
+              <li>
+                <a href="/contact">Contact us</a>
+              </li>
+            </div>
+          </ul>
+
+          {/* Add office address */}
+          <address>
+            Kings & Queens Studio Rooms, Spice Garden, Marathahalli, Bengaluru,
+            Karnataka - 560037, India
+          </address>
+
+          {/* Add icons for downloading from Apple and Android stores */}
+          <div className="download-icons">
+            <img src={appleStore} alt="Download on the Apple Store" />
+            <img src={googlePlay} alt="Get it on Google Play" />
+          </div>
+        </div>
+      </InnerLayout>
+    </FooterStyled>
+  );
 }
 
 const FooterStyled = styled.footer`
-    padding: 0 18rem;
-    background-color: #DCE2F0;
-    @media screen and (max-width: 1347px){
-        padding: 5rem 14rem;
-    }
-    @media screen and (max-width: 1186px){
-        padding: 5rem 8rem;
-    }
-    @media screen and (max-width: 990px){
-        padding: 5rem 4rem;
-    }
-    .footer-con{
-        display: grid;
-        grid-template-columns: repeat(2, 1fr);
+  padding: 2rem 18rem;
+  background-color: #dce2f0;
+  background-image: linear-gradient(
+    to right,
+    #e0b0ff,
+    #ff69b4,
+    #9370db,
+    #4b0082
+  );
+  color: white;
+
+  @media screen and (max-width: 1347px) {
+    padding: 2rem 14rem;
+  }
+  @media screen and (max-width: 1186px) {
+    padding: 2rem 8rem;
+  }
+  @media screen and (max-width: 990px) {
+    padding: 2rem 4rem;
+  }
+
+  .footer-con {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    grid-gap: 2rem;
+    align-items: center;
+    justify-content: center;
+
+    .logo-con {
+      display: flex;
+      align-items: center;
+
+      img {
+        width: 90px;
+        margin-right: 0.5rem;
+      }
     }
 
-    .logo-con{
-        display: flex;
-        align-items: center;
-        img{
-            width: 90px;
+    .botton-nav {
+      display: flex;
+      justify-content: space-between;
+
+      li {
+        padding: 0.5rem 0.5rem;
+        color: white;
+
+        a {
+          color: white;
+          font-size: 1.2rem;
         }
+      }
     }
 
-    .botton-nav{
-        display: flex;
-        justify-content: space-between;
-        li{
-            padding: 2rem 0;
-            color: #16194F;
-        }
+    address {
+      font-style: normal;
+      text-align: center;
+      margin-top: 1rem;
+      font-size: 1.2rem;
+    }
+
+    .download-icons {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      img {
+        width: 100px;
+        margin: 0.5rem;
+      }
     }
+  }
 `;
 
-export default Footer
+export default Footer;