From d3dd309ff4071d2146ac3c4735f9ef693ccae3bc Mon Sep 17 00:00:00 2001
From: garimasingh22 <44470092+garimasingh22@users.noreply.github.com>
Date: Thu, 27 Aug 2020 13:27:19 +0530
Subject: [PATCH 1/7] edit page fornt end and backend

---
 app.js                  | 49 +++++++++++----------
 routes/api/edit.js      | 67 ++++++++++++++++++++++++++++
 views/edit.ejs          | 98 ++++++++++++++++++++++++++++++++++++++++-
 views/partials/_nav.ejs | 89 +++++++++++++++++++------------------
 4 files changed, 235 insertions(+), 68 deletions(-)

diff --git a/app.js b/app.js
index b2669f7..f795c00 100644
--- a/app.js
+++ b/app.js
@@ -41,19 +41,19 @@ app.use(express.json());
 
 // Method override
 app.use(
-  methodOverride(function (req, res) {
-    if (req.body && typeof req.body === "object" && "_method" in req.body) {
-      // look in urlencoded POST bodies and delete it
-      let method = req.body._method;
-      delete req.body._method;
-      return method;
-    }
-  })
+    methodOverride(function(req, res) {
+        if (req.body && typeof req.body === "object" && "_method" in req.body) {
+            // look in urlencoded POST bodies and delete it
+            let method = req.body._method;
+            delete req.body._method;
+            return method;
+        }
+    })
 );
 
 // Logging
 if (process.env.NODE_ENV === "development") {
-  app.use(morgan("dev"));
+    app.use(morgan("dev"));
 }
 
 // EJS
@@ -66,12 +66,12 @@ app.use(expressLayouts);
 
 // Sessions
 app.use(
-  session({
-    secret: "keyboard cat",
-    resave: false,
-    saveUninitialized: false,
-    store: new MongoStore({ mongooseConnection: mongoose.connection }),
-  })
+    session({
+        secret: "keyboard cat",
+        resave: false,
+        saveUninitialized: false,
+        store: new MongoStore({ mongooseConnection: mongoose.connection }),
+    })
 );
 
 // cookie middleware
@@ -85,12 +85,12 @@ app.use(passport.session());
 app.use(flash());
 
 // Set Global variables
-app.use(function (req, res, next) {
-  res.locals.user = req.user || null;
-  res.locals.success_msg = req.flash("success_msg");
-  res.locals.error_msg = req.flash("error_msg");
-  res.locals.error = req.flash("error");
-  next();
+app.use(function(req, res, next) {
+    res.locals.user = req.user || null;
+    res.locals.success_msg = req.flash("success_msg");
+    res.locals.error_msg = req.flash("error_msg");
+    res.locals.error = req.flash("error");
+    next();
 });
 
 // Static folder
@@ -108,12 +108,13 @@ app.use("/done", require("./routes/api/done"));
 app.use("/addBalance", require("./routes/api/addBalance"));
 app.use("/transaction", require("./routes/api/transaction"));
 app.use("/search", require("./routes/api/search"));
+app.use("/edit", require("./routes/api/edit"));
 
 // Port: Love You 3000
 const PORT = process.env.PORT || 3000;
 
 // Server Listening
 app.listen(
-  PORT,
-  console.log(`Server running in ${process.env.NODE_ENV} mode on port ${PORT}`)
-);
+    PORT,
+    console.log(`Server running in ${process.env.NODE_ENV} mode on port ${PORT}`)
+);
\ No newline at end of file
diff --git a/routes/api/edit.js b/routes/api/edit.js
index 685ea2f..eb4944e 100644
--- a/routes/api/edit.js
+++ b/routes/api/edit.js
@@ -1 +1,68 @@
 // Edit Profile Route
+const express = require('express')
+const router = express.Router()
+const { ensureAuth } = require('../../middleware/auth')
+
+const User = require('../../models/User.js');
+const { id } = require('date-fns/locale');
+const { last } = require('lodash');
+
+
+
+// @desc    Show edit page
+// @route   GET /edit/:id
+router.get("/:id", ensureAuth, (req, res) => {
+    let avatar = req.user.image;
+    let curruser = req.user;
+    let firstName = req.user.firstName;
+    let lastName = req.user.lastName;
+    let email = req.user.email;
+    let googleId = req.user.googleId;
+    let _id = req.user._id;
+
+    console.log(avatar);
+
+
+    res.status(200).render("edit", {
+        layout: "layouts/app",
+        avatar,
+        firstName,
+        lastName,
+        email,
+        googleId,
+        _id,
+        href: "/edit",
+    });
+});
+
+router.put("/:id", ensureAuth, async(req, res) => {
+    try {
+
+        let curruser1 = await User.findById(req.params.id).lean();
+
+        curruser1.firstName = req.body.firstName;
+        curruser1.lastName = req.body.lastName;
+        curruser1.email = req.body.email;
+        curruser1.displayName = curruser1.firstName + " " + curruser1.lastName
+
+        console.log(curruser1.firstName + "this is the first name");
+        console.log(curruser1.lastName + "this is the last name");
+        console.log(curruser1.displayName + "this is the disply name");
+        console.log(curruser1.email + "this is the email");
+        curruser1 = await User.findOneAndUpdate({ _id: req.params.id }, {
+            firstName: curruser1.firstName,
+            lastName: curruser1.lastName,
+            email: curruser1.email,
+            displayName: curruser1.displayName,
+        }, {
+            new: true, // it will create a new one, if it doesn't exist
+            runValidators: true, // it check weather the fields are valid or not
+        });
+        res.redirect("/portfolio");
+    } catch (err) {
+        console.error(err)
+        return res.render('error/500')
+    }
+});
+
+module.exports = router;
\ No newline at end of file
diff --git a/views/edit.ejs b/views/edit.ejs
index c5b1623..2b0d5c2 100644
--- a/views/edit.ejs
+++ b/views/edit.ejs
@@ -1 +1,97 @@
-<h1>Edit Profile</h1>
+<!-- <div class="m-auto">
+
+    <h3 class="m-auto">Edit Profile</h3>
+    <div class="row m-auto">
+        <form action="/edit/<%=_id%>" method="POST" class="col s12">
+            <input type="hidden" name="_method" value="PUT">
+            <h4>
+                USER-FIRSTNAME
+                <input type="text" name="firstName" value="<%=firstName%>" />
+            </h4>
+            <div class="row">
+                <div class="input-field">
+                    <input type="text" id="lastName" name="lastName" value="<%=lastName%>">
+                    <label for="lastName">lastName</label>
+                </div>
+            </div>
+
+            <div class="row">
+                <div class="input-field">
+                    <input type="email" id="email" name="email" value="<%=email%>">
+                    <label for="email">Email</label>
+                </div>
+            </div>
+            <div class="row">
+                <input type="submit" value="Save" class="btn">
+                <a href="/portfolio" class="btn orange">Cancel</a>
+            </div>
+        </form>
+    </div>
+</div> -->
+<main class="md:col-span-4 md:ml-56 lg:ml-64 md:pr-14 w-full">
+    <div class="container px-5 py-10 mx-auto md:px-auto ">
+        <!-- header -->
+
+        <header class="my-4 absolute-center">
+            <span class="text-gray-700 text-3xl font-semibold leading-none tracking-wider">Edit Profile</span
+      >
+    </header>
+
+    <hr class="line my-4" />
+
+   <!--form  -->
+
+
+        <form action="/edit/<%=_id%>" method="POST" class="w-full max-w-sm md:pl-48 m-auto">
+            <input type="hidden" name="_method" value="PUT">
+            <div class="md:flex md:items-center mb-6">
+                <div class="md:w-1/3">
+                    <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
+          First Name :
+        </label>
+                </div>
+                <div class="md:w-2/3">
+                    <input type="text" name="firstName" value="<%=firstName%>" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" />
+                    <!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
+                </div>
+            </div>
+            <div class="md:flex md:items-center mb-6">
+                <div class="md:w-1/3">
+                    <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
+          Last Name :
+        </label>
+                </div>
+                <div class="md:w-2/3">
+                    <input type="text" id="lastName" name="lastName" value="<%=lastName%>" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500">
+                    <!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
+                </div>
+            </div>
+            <div class="md:flex md:items-center mb-6">
+                <div class="md:w-1/3">
+                    <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
+          Email_____ <span class="mr-10">:</span>
+            </label>
+    </div>
+    <div class="md:w-2/3">
+        <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" type="email" id="email" name="email" value="<%=email%>">
+        <!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
+    </div>
+    </div>
+
+
+    <div class="md:flex md:items-center">
+        <div class="md:w-1/2">
+            <input type="submit" value="Save" class="btn mb-4 shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded">
+            <!-- <button class="shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button">
+                    Save
+                  </button> -->
+        </div>
+        <div class="md:w-1/2">
+            <button class="mb-4 shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button">
+          <a href="/portfolio">Cancel</a>
+        </button>
+        </div>
+    </div>
+    </form>
+    </div>
+</main>
\ No newline at end of file
diff --git a/views/partials/_nav.ejs b/views/partials/_nav.ejs
index 34738a9..912c2f7 100644
--- a/views/partials/_nav.ejs
+++ b/views/partials/_nav.ejs
@@ -1,18 +1,15 @@
 <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js" defer></script>
 
-<div @click.away="open = false"
-  class="flex flex-col w-full md:w-56 lg:w-64 text-gray-700 bg-white flex-shrink-0 md:h-screen  md:z-50 md:fixed md:left-0 md:top-0"
-  x-data="{ open: false }">
+<div @click.away="open = false" class="flex flex-col w-full md:w-56 lg:w-64 text-gray-700 bg-white flex-shrink-0 md:h-screen  md:z-50 md:fixed md:left-0 md:top-0" x-data="{ open: false }">
 
-  <div class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between">
-    <div class="flex-shrink-0 text-center">
-      <img class="h-8 w-8 tradebyte-logo " src="../images/TradeByte-Favicon.png" alt="Logo">
-    </div>
-    <h4 class="font-bold text-center pt-1">
-      <a href="/"
-        class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl tradebyte-logo">Tradebyte</a>
-    </h4>
-    <button class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline" @click="open = !open">
+    <div class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between">
+        <div class="flex-shrink-0 text-center">
+            <img class="h-8 w-8 tradebyte-logo " src="../images/TradeByte-Favicon.png" alt="Logo">
+        </div>
+        <h4 class="font-bold text-center pt-1">
+            <a href="/" class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl tradebyte-logo">Tradebyte</a>
+        </h4>
+        <button class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline" @click="open = !open">
       <svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6">
         <path x-show="!open" fill-rule="evenodd"
           d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z"
@@ -23,60 +20,66 @@
       </svg>
     </button>
 
-  </div>
+    </div>
 
 
-  <nav :class="{'block': open, 'hidden': !open}" class="flex-grow md:block px-4 pb-4 md:pb-0">
+    <nav :class="{'block': open, 'hidden': !open}" class="flex-grow md:block px-4 pb-4 md:pb-0">
 
-    <hr class="line mb-6">
+        <hr class="line mb-6">
 
-    <div class="flex justify-center align-center rounded-full">
-      <img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" />
-    </div>
+        <div class="flex justify-center align-center rounded-full">
+            <img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" />
+        </div>
 
-    <a class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background"
-      href="#">
-      <div class="tick mr-1">
-        <svg class="w-5 mr-1 " fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-          viewBox="0 0 24 24" stroke="currentColor">
+        <a class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background" href="#">
+            <div class="tick mr-1">
+                <svg class="w-5 mr-1 " fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor">
           <path d="M5 13l4 4L19 7"></path>
         </svg>
-      </div> Trading Active
-    </a>
+            </div> Trading Active
+        </a>
 
-    <div class="nav-box flex flex-col justify-start">
+        <div class="nav-box flex flex-col justify-start">
 
-      <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'border tab-color border-l-8': '' %>"
-        href="/portfolio">
-        <svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round " stroke-width="2 "
-          viewBox="0 0 24 24 " stroke="currentColor ">
+            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'border tab-color border-l-8': '' %>"
+                href="/portfolio">
+                <svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round " stroke-width="2 " viewBox="0 0 24 24 " stroke="currentColor ">
           <path
             d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4
         13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z ">
           </path>
         </svg>Dashboard</a>
 
-      <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/market' ? 'border tab-color border-l-8': '' %>"
-        href="/market"><svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round "
+            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/edit/user._id' ? 'border tab-color border-l-8': '' %>"
+                href="/edit/<%= user._id %>">
+                <svg class="w-5 ml-2 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
+          </svg> Edit Profile
+            </a>
+
+
+
+            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/market' ? 'border tab-color border-l-8': '' %>"
+                href="/market"><svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round "
           stroke-width="2 " viewBox="0 0 24 24 " stroke="currentColor ">
           <path d="M8 14v3m4-3v3m4-3v3M3 21h18M3 10h18M3 7l9-4 9 4M4 10h16v11H4V10z "></path>
         </svg>Market</a>
 
-      <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/addBalance' ? 'border tab-color border-l-8': '' %>"
-        href="/addBalance">+ Add Balance</a>
-      <!-- only for development purpose i added ADD BALANCE button here on navbar. -->
+            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/addBalance' ? 'border tab-color border-l-8': '' %>"
+                href="/addBalance">+ Add Balance</a>
+            <!-- only for development purpose i added ADD BALANCE button here on navbar. -->
 
-      <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/trasaction' ? 'border tab-color border-l-8': '' %>"
-        href="/transaction">$ Transactions History</a>
-      <!-- only for development purpose i added TRANSACTION HISTORY button here on navbar. -->
+            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/trasaction' ? 'border tab-color border-l-8': '' %>"
+                href="/transaction">$ Transactions History</a>
+            <!-- only for development purpose i added TRANSACTION HISTORY button here on navbar. -->
 
-      <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/auth/logout' ? 'border tab-color border-l-8': '' %>"
-        href="/auth/logout"><svg class="w-6 ml-2 mr-1" fill="currentColor" viewBox="0 0 20 20">
+            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/auth/logout' ? 'border tab-color border-l-8': '' %>"
+                href="/auth/logout"><svg class="w-6 ml-2 mr-1" fill="currentColor" viewBox="0 0 20 20">
           <path fill-rule="evenodd"
             d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
             clip-rule="evenodd"></path>
         </svg>Logout</a>
 
-    </div>
-  </nav>
-</div>
+        </div>
+    </nav>
+</div>
\ No newline at end of file

From b80c6acfc91a7272a6a666cf2f6ce2b3c509eadf Mon Sep 17 00:00:00 2001
From: Anjalikumari148 <anjalikumari6772@gmail.com>
Date: Thu, 27 Aug 2020 20:32:24 +0530
Subject: [PATCH 2/7] Fixed the frontend of error pages

---
 public/css/style.css |  2 +-
 views/error/404.ejs  | 55 ++++++++++++++++++++++++++++++++++-
 views/error/500.ejs  | 68 +++++++++++++++++++++++++++++++++++++++++++-
 3 files changed, 122 insertions(+), 3 deletions(-)

diff --git a/public/css/style.css b/public/css/style.css
index 8999bfa..894296a 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -1 +1 @@
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}body,html{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;box-sizing:border-box;background-color:#e2e8f0}.chartjs-container{position:relative;margin:auto;height:75vh;width:75vw}.tradebyte-logo{color:#1955e4;text-shadow:1px 2px 40px rgba(0,0,0,.5)}.line{border:1.5px solid #8e9aad}.user-profile{border-radius:100px;border:10px solid #1955e4;width:130px;height:130px}.tick{height:22px;width:22px;border-radius:50%;background-color:#38cda0;color:#fff}.tick-background{background:#a9f7e6;border-radius:29px;color:#1b9b7f}.tab-color{border-radius:10px;border-color:#1955e4}.tab-color,.view-link{color:#1955e4}.view-link:hover{color:#0d338a}.button{background-color:#1955e4}.button:hover{background-color:#0d338a}.table-content{overflow:scroll;overflow-x:scroll;overflow-y:auto}.transaction-companySymbol{color:#000;font-weight:700;font-size:1.1rem}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.symbolicon{font-size:72px;background:-webkit-linear-gradient(#eee,#333);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.min-w{min-width:400px}@media (max-width:400px){.min-w{min-width:300px}}.space-y-5>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--space-y-reverse)));margin-bottom:calc(1.25rem*var(--space-y-reverse))}.space-y-10>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(2.5rem*(1 - var(--space-y-reverse)));margin-bottom:calc(2.5rem*var(--space-y-reverse))}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.bg-transparent{background-color:transparent}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#edf2f7;background-color:rgba(237,242,247,var(--bg-opacity))}.bg-gray-300{--bg-opacity:1;background-color:#e2e8f0;background-color:rgba(226,232,240,var(--bg-opacity))}.bg-gray-700{--bg-opacity:1;background-color:#4a5568;background-color:rgba(74,85,104,var(--bg-opacity))}.bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.bg-red-200{--bg-opacity:1;background-color:#fed7d7;background-color:rgba(254,215,215,var(--bg-opacity))}.bg-red-900{--bg-opacity:1;background-color:#742a2a;background-color:rgba(116,42,42,var(--bg-opacity))}.bg-yellow-200{--bg-opacity:1;background-color:#fefcbf;background-color:rgba(254,252,191,var(--bg-opacity))}.bg-yellow-500{--bg-opacity:1;background-color:#ecc94b;background-color:rgba(236,201,75,var(--bg-opacity))}.bg-green-200{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.bg-teal-500{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.bg-blue-400{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#3182ce;background-color:rgba(49,130,206,var(--bg-opacity))}.bg-blue-800{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.bg-secondary-100{--bg-opacity:1;background-color:#e2e2d5;background-color:rgba(226,226,213,var(--bg-opacity))}.bg-tempc-400{--bg-opacity:1;background-color:#266fea;background-color:rgba(38,111,234,var(--bg-opacity))}.bg-tempc-500{--bg-opacity:1;background-color:#41d7aa;background-color:rgba(65,215,170,var(--bg-opacity))}.hover\:bg-white:hover{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.hover\:bg-red-400:hover{--bg-opacity:1;background-color:#fc8181;background-color:rgba(252,129,129,var(--bg-opacity))}.hover\:bg-yellow-600:hover{--bg-opacity:1;background-color:#d69e2e;background-color:rgba(214,158,46,var(--bg-opacity))}.hover\:bg-green-400:hover{--bg-opacity:1;background-color:#68d391;background-color:rgba(104,211,145,var(--bg-opacity))}.hover\:bg-teal-500:hover{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.hover\:bg-blue-100:hover{--bg-opacity:1;background-color:#ebf8ff;background-color:rgba(235,248,255,var(--bg-opacity))}.hover\:bg-blue-400:hover{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.hover\:bg-blue-500:hover{--bg-opacity:1;background-color:#4299e1;background-color:rgba(66,153,225,var(--bg-opacity))}.hover\:bg-blue-700:hover{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.hover\:bg-indigo-700:hover{--bg-opacity:1;background-color:#4c51bf;background-color:rgba(76,81,191,var(--bg-opacity))}.focus\:bg-blue-200:focus{--bg-opacity:1;background-color:#bee3f8;background-color:rgba(190,227,248,var(--bg-opacity))}.hover\:bg-opacity-50:hover{--bg-opacity:0.5}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.border-red-600{--border-opacity:1;border-color:#e53e3e;border-color:rgba(229,62,62,var(--border-opacity))}.border-yellow-600{--border-opacity:1;border-color:#d69e2e;border-color:rgba(214,158,46,var(--border-opacity))}.border-green-400{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.border-green-600{--border-opacity:1;border-color:#38a169;border-color:rgba(56,161,105,var(--border-opacity))}.border-teal-500{--border-opacity:1;border-color:#38b2ac;border-color:rgba(56,178,172,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#4299e1;border-color:rgba(66,153,225,var(--border-opacity))}.hover\:border-green-400:hover{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#3182ce;border-color:rgba(49,130,206,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.border-4{border-width:4px}.border-8{border-width:8px}.border{border-width:1px}.border-b-2{border-bottom-width:2px}.border-l-8{border-left-width:8px}.border-b{border-bottom-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-auto{flex:1 1 auto}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.leading-none{line-height:1}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.list-none{list-style-type:none}.m-4{margin:1rem}.m-8{margin:2rem}.-m-4{margin:-1rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mx-20{margin-left:5rem;margin-right:5rem}.my-64{margin-top:16rem;margin-bottom:16rem}.mx-auto{margin-left:auto;margin-right:auto}.-mx-8{margin-left:-2rem;margin-right:-2rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-6{margin-top:1.5rem}.mb-6{margin-bottom:1.5rem}.mt-8{margin-top:2rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.ml-10{margin-left:2.5rem}.mt-12{margin-top:3rem}.mb-24{margin-bottom:6rem}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-w-0{min-width:0}.object-cover{-o-object-fit:cover;object-fit:cover}.focus\:outline-none:focus,.outline-none{outline:0}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-10{padding:2.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.px-8{padding-left:2rem;padding-right:2rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.pb-4{padding-bottom:1rem}.pt-6{padding-top:1.5rem}.pb-8{padding-bottom:2rem}.pt-10{padding-top:2.5rem}.pb-10{padding-bottom:2.5rem}.pl-10{padding-left:2.5rem}.pt-20{padding-top:5rem}.placeholder-gray-400::-moz-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400:-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.hover\:shadow-inner:hover{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.06)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(66,153,225,.5)}.fill-current{fill:currentColor}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#2d3748;color:rgba(45,55,72,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e53e3e;color:rgba(229,62,62,var(--text-opacity))}.text-red-700{--text-opacity:1;color:#c53030;color:rgba(197,48,48,var(--text-opacity))}.text-yellow-700{--text-opacity:1;color:#b7791f;color:rgba(183,121,31,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#38a169;color:rgba(56,161,105,var(--text-opacity))}.text-green-700{--text-opacity:1;color:#2f855a;color:rgba(47,133,90,var(--text-opacity))}.text-green-900{--text-opacity:1;color:#22543d;color:rgba(34,84,61,var(--text-opacity))}.text-teal-500{--text-opacity:1;color:#38b2ac;color:rgba(56,178,172,var(--text-opacity))}.text-blue-200{--text-opacity:1;color:#bee3f8;color:rgba(190,227,248,var(--text-opacity))}.text-blue-700{--text-opacity:1;color:#2b6cb0;color:rgba(43,108,176,var(--text-opacity))}.text-secondary-200{--text-opacity:1;color:#888883;color:rgba(136,136,131,var(--text-opacity))}.text-tempc-400{--text-opacity:1;color:#266fea;color:rgba(38,111,234,var(--text-opacity))}.text-tempc-500{--text-opacity:1;color:#41d7aa;color:rgba(65,215,170,var(--text-opacity))}.hover\:text-black:hover{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.hover\:text-white:hover{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.hover\:text-red-500:hover{--text-opacity:1;color:#f56565;color:rgba(245,101,101,var(--text-opacity))}.hover\:text-yellow-500:hover{--text-opacity:1;color:#ecc94b;color:rgba(236,201,75,var(--text-opacity))}.hover\:text-green-500:hover{--text-opacity:1;color:#48bb78;color:rgba(72,187,120,var(--text-opacity))}.hover\:text-blue-800:hover{--text-opacity:1;color:#2c5282;color:rgba(44,82,130,var(--text-opacity))}.focus\:text-black:focus{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.focus\:text-blue-900:focus{--text-opacity:1;color:#2a4365;color:rgba(42,67,101,var(--text-opacity))}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.whitespace-no-wrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-16{width:4rem}.w-24{width:6rem}.w-32{width:8rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/3{width:66.666667%}.w-2\/5{width:40%}.w-4\/5{width:80%}.w-full{width:100%}.w-screen{width:100vw}.gap-4{grid-gap:1rem;gap:1rem}.gap-8{grid-gap:2rem;gap:2rem}.gap-10{grid-gap:2.5rem;gap:2.5rem}.grid-flow-col{grid-auto-flow:column}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.hover\:scale-125:hover{--transform-scale-x:1.25;--transform-scale-y:1.25}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@media (min-width:640px){.sm\:container{width:100%;max-width:640px}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:1024px){.sm\:container{max-width:1024px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}.sm\:h-20{height:5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width:768px){.md\:container{width:100%}@media (min-width:640px){.md\:container{max-width:640px}}@media (min-width:768px){.md\:container{max-width:768px}}@media (min-width:1024px){.md\:container{max-width:1024px}}@media (min-width:1280px){.md\:container{max-width:1280px}}.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-center{justify-content:center}.md\:h-screen{height:100vh}.md\:text-sm{font-size:.875rem}.md\:text-xl{font-size:1.25rem}.md\:text-2xl{font-size:1.5rem}.md\:text-3xl{font-size:1.875rem}.md\:mx-auto{margin-left:auto;margin-right:auto}.md\:ml-56{margin-left:14rem}.md\:ml-64{margin-left:16rem}.md\:ml-auto{margin-left:auto}.md\:px-2{padding-left:.5rem;padding-right:.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:px-10{padding-left:2.5rem;padding-right:2.5rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:pb-0{padding-bottom:0}.md\:fixed{position:fixed}.md\:top-0{top:0}.md\:left-0{left:0}.md\:break-all{word-break:break-all}.md\:w-56{width:14rem}.md\:w-1\/2{width:50%}.md\:w-4\/5{width:80%}.md\:z-50{z-index:50}.md\:gap-4{grid-gap:1rem;gap:1rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:col-span-4{grid-column:span 4/span 4}.md\:grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.md\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:container{width:100%}@media (min-width:640px){.lg\:container{max-width:640px}}@media (min-width:768px){.lg\:container{max-width:768px}}@media (min-width:1024px){.lg\:container{max-width:1024px}}@media (min-width:1280px){.lg\:container{max-width:1280px}}.lg\:block{display:block}.lg\:grid{display:grid}.lg\:items-start{align-items:flex-start}.lg\:items-center{align-items:center}.lg\:justify-center{justify-content:center}.lg\:text-sm{font-size:.875rem}.lg\:text-base{font-size:1rem}.lg\:text-lg{font-size:1.125rem}.lg\:text-3xl{font-size:1.875rem}.lg\:text-4xl{font-size:2.25rem}.lg\:text-5xl{font-size:3rem}.lg\:text-6xl{font-size:4rem}.lg\:ml-64{margin-left:16rem}.lg\:p-6{padding:1.5rem}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:text-center{text-align:center}.lg\:w-64{width:16rem}.lg\:w-1\/4{width:25%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.lg\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.lg\:row-span-2{grid-row:span 2/span 2}}@media (min-width:1280px){.xl\:container{width:100%}@media (min-width:640px){.xl\:container{max-width:640px}}@media (min-width:768px){.xl\:container{max-width:768px}}@media (min-width:1024px){.xl\:container{max-width:1024px}}@media (min-width:1280px){.xl\:container{max-width:1280px}}.xl\:text-2xl{font-size:1.5rem}}
\ No newline at end of file
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}body,html{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;box-sizing:border-box;background-color:#e2e8f0}.chartjs-container{position:relative;margin:auto;height:75vh;width:75vw}.tradebyte-logo{color:#1955e4;text-shadow:1px 2px 40px rgba(0,0,0,.5)}.line{border:1.5px solid #8e9aad}.user-profile{border-radius:100px;border:10px solid #1955e4;width:130px;height:130px}.tick{height:22px;width:22px;border-radius:50%;background-color:#38cda0;color:#fff}.tick-background{background:#a9f7e6;border-radius:29px;color:#1b9b7f}.tab-color{border-radius:10px;border-color:#1955e4}.tab-color,.view-link{color:#1955e4}.view-link:hover{color:#0d338a}.button{background-color:#1955e4}.button:hover{background-color:#0d338a}.table-content{overflow:scroll;overflow-x:scroll;overflow-y:auto}.transaction-companySymbol{color:#000;font-weight:700;font-size:1.1rem}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.symbolicon{font-size:72px;background:-webkit-linear-gradient(#eee,#333);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.min-w{min-width:400px}@media (max-width:400px){.min-w{min-width:300px}}.space-y-5>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--space-y-reverse)));margin-bottom:calc(1.25rem*var(--space-y-reverse))}.space-y-10>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(2.5rem*(1 - var(--space-y-reverse)));margin-bottom:calc(2.5rem*var(--space-y-reverse))}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.bg-transparent{background-color:transparent}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#edf2f7;background-color:rgba(237,242,247,var(--bg-opacity))}.bg-gray-300{--bg-opacity:1;background-color:#e2e8f0;background-color:rgba(226,232,240,var(--bg-opacity))}.bg-gray-700{--bg-opacity:1;background-color:#4a5568;background-color:rgba(74,85,104,var(--bg-opacity))}.bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.bg-red-200{--bg-opacity:1;background-color:#fed7d7;background-color:rgba(254,215,215,var(--bg-opacity))}.bg-red-900{--bg-opacity:1;background-color:#742a2a;background-color:rgba(116,42,42,var(--bg-opacity))}.bg-yellow-200{--bg-opacity:1;background-color:#fefcbf;background-color:rgba(254,252,191,var(--bg-opacity))}.bg-yellow-500{--bg-opacity:1;background-color:#ecc94b;background-color:rgba(236,201,75,var(--bg-opacity))}.bg-green-200{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.bg-teal-500{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.bg-blue-400{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#3182ce;background-color:rgba(49,130,206,var(--bg-opacity))}.bg-blue-800{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.bg-secondary-100{--bg-opacity:1;background-color:#e2e2d5;background-color:rgba(226,226,213,var(--bg-opacity))}.bg-tempc-400{--bg-opacity:1;background-color:#266fea;background-color:rgba(38,111,234,var(--bg-opacity))}.bg-tempc-500{--bg-opacity:1;background-color:#41d7aa;background-color:rgba(65,215,170,var(--bg-opacity))}.hover\:bg-white:hover{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.hover\:bg-red-400:hover{--bg-opacity:1;background-color:#fc8181;background-color:rgba(252,129,129,var(--bg-opacity))}.hover\:bg-yellow-600:hover{--bg-opacity:1;background-color:#d69e2e;background-color:rgba(214,158,46,var(--bg-opacity))}.hover\:bg-green-200:hover{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.hover\:bg-green-400:hover{--bg-opacity:1;background-color:#68d391;background-color:rgba(104,211,145,var(--bg-opacity))}.hover\:bg-teal-500:hover{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.hover\:bg-blue-100:hover{--bg-opacity:1;background-color:#ebf8ff;background-color:rgba(235,248,255,var(--bg-opacity))}.hover\:bg-blue-400:hover{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.hover\:bg-blue-500:hover{--bg-opacity:1;background-color:#4299e1;background-color:rgba(66,153,225,var(--bg-opacity))}.hover\:bg-blue-700:hover{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.hover\:bg-indigo-700:hover{--bg-opacity:1;background-color:#4c51bf;background-color:rgba(76,81,191,var(--bg-opacity))}.focus\:bg-blue-200:focus{--bg-opacity:1;background-color:#bee3f8;background-color:rgba(190,227,248,var(--bg-opacity))}.hover\:bg-opacity-50:hover{--bg-opacity:0.5}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.border-red-600{--border-opacity:1;border-color:#e53e3e;border-color:rgba(229,62,62,var(--border-opacity))}.border-yellow-600{--border-opacity:1;border-color:#d69e2e;border-color:rgba(214,158,46,var(--border-opacity))}.border-green-400{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.border-green-600{--border-opacity:1;border-color:#38a169;border-color:rgba(56,161,105,var(--border-opacity))}.border-teal-500{--border-opacity:1;border-color:#38b2ac;border-color:rgba(56,178,172,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#4299e1;border-color:rgba(66,153,225,var(--border-opacity))}.border-blue-700{--border-opacity:1;border-color:#2b6cb0;border-color:rgba(43,108,176,var(--border-opacity))}.hover\:border-green-400:hover{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#3182ce;border-color:rgba(49,130,206,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.border-4{border-width:4px}.border-8{border-width:8px}.border{border-width:1px}.border-b-2{border-bottom-width:2px}.border-l-8{border-left-width:8px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-auto{flex:1 1 auto}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.leading-none{line-height:1}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.list-none{list-style-type:none}.m-4{margin:1rem}.m-8{margin:2rem}.-m-4{margin:-1rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mx-20{margin-left:5rem;margin-right:5rem}.my-64{margin-top:16rem;margin-bottom:16rem}.mx-auto{margin-left:auto;margin-right:auto}.-mx-8{margin-left:-2rem;margin-right:-2rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-6{margin-top:1.5rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.mt-8{margin-top:2rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.ml-10{margin-left:2.5rem}.mt-12{margin-top:3rem}.mb-24{margin-bottom:6rem}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-w-0{min-width:0}.object-cover{-o-object-fit:cover;object-fit:cover}.focus\:outline-none:focus,.outline-none{outline:0}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-10{padding:2.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.px-8{padding-left:2rem;padding-right:2rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.pt-4{padding-top:1rem}.pb-4{padding-bottom:1rem}.pt-6{padding-top:1.5rem}.pb-8{padding-bottom:2rem}.pt-10{padding-top:2.5rem}.pb-10{padding-bottom:2.5rem}.pl-10{padding-left:2.5rem}.pt-20{padding-top:5rem}.placeholder-gray-400::-moz-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400:-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.hover\:shadow-inner:hover{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.06)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(66,153,225,.5)}.fill-current{fill:currentColor}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#2d3748;color:rgba(45,55,72,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e53e3e;color:rgba(229,62,62,var(--text-opacity))}.text-red-700{--text-opacity:1;color:#c53030;color:rgba(197,48,48,var(--text-opacity))}.text-yellow-700{--text-opacity:1;color:#b7791f;color:rgba(183,121,31,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#38a169;color:rgba(56,161,105,var(--text-opacity))}.text-green-700{--text-opacity:1;color:#2f855a;color:rgba(47,133,90,var(--text-opacity))}.text-green-900{--text-opacity:1;color:#22543d;color:rgba(34,84,61,var(--text-opacity))}.text-teal-500{--text-opacity:1;color:#38b2ac;color:rgba(56,178,172,var(--text-opacity))}.text-blue-200{--text-opacity:1;color:#bee3f8;color:rgba(190,227,248,var(--text-opacity))}.text-blue-700{--text-opacity:1;color:#2b6cb0;color:rgba(43,108,176,var(--text-opacity))}.text-secondary-200{--text-opacity:1;color:#888883;color:rgba(136,136,131,var(--text-opacity))}.text-tempc-400{--text-opacity:1;color:#266fea;color:rgba(38,111,234,var(--text-opacity))}.text-tempc-500{--text-opacity:1;color:#41d7aa;color:rgba(65,215,170,var(--text-opacity))}.hover\:text-black:hover{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.hover\:text-white:hover{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.hover\:text-red-500:hover{--text-opacity:1;color:#f56565;color:rgba(245,101,101,var(--text-opacity))}.hover\:text-yellow-500:hover{--text-opacity:1;color:#ecc94b;color:rgba(236,201,75,var(--text-opacity))}.hover\:text-green-500:hover{--text-opacity:1;color:#48bb78;color:rgba(72,187,120,var(--text-opacity))}.hover\:text-blue-800:hover{--text-opacity:1;color:#2c5282;color:rgba(44,82,130,var(--text-opacity))}.focus\:text-black:focus{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.focus\:text-blue-900:focus{--text-opacity:1;color:#2a4365;color:rgba(42,67,101,var(--text-opacity))}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.whitespace-no-wrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-16{width:4rem}.w-24{width:6rem}.w-32{width:8rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/3{width:66.666667%}.w-2\/5{width:40%}.w-full{width:100%}.w-screen{width:100vw}.gap-4{grid-gap:1rem;gap:1rem}.gap-8{grid-gap:2rem;gap:2rem}.gap-10{grid-gap:2.5rem;gap:2.5rem}.grid-flow-col{grid-auto-flow:column}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.hover\:scale-125:hover{--transform-scale-x:1.25;--transform-scale-y:1.25}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@media (min-width:640px){.sm\:container{width:100%;max-width:640px}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:1024px){.sm\:container{max-width:1024px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}.sm\:flex-col{flex-direction:column}.sm\:h-20{height:5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width:768px){.md\:container{width:100%}@media (min-width:640px){.md\:container{max-width:640px}}@media (min-width:768px){.md\:container{max-width:768px}}@media (min-width:1024px){.md\:container{max-width:1024px}}@media (min-width:1280px){.md\:container{max-width:1280px}}.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}.md\:items-center{align-items:center}.md\:justify-center{justify-content:center}.md\:h-screen{height:100vh}.md\:text-sm{font-size:.875rem}.md\:text-xl{font-size:1.25rem}.md\:text-2xl{font-size:1.5rem}.md\:text-3xl{font-size:1.875rem}.md\:mx-auto{margin-left:auto;margin-right:auto}.md\:ml-56{margin-left:14rem}.md\:ml-64{margin-left:16rem}.md\:ml-auto{margin-left:auto}.md\:px-2{padding-left:.5rem;padding-right:.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:px-10{padding-left:2.5rem;padding-right:2.5rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:pb-0{padding-bottom:0}.md\:fixed{position:fixed}.md\:top-0{top:0}.md\:left-0{left:0}.md\:break-all{word-break:break-all}.md\:w-56{width:14rem}.md\:w-1\/2{width:50%}.md\:w-4\/5{width:80%}.md\:z-50{z-index:50}.md\:gap-4{grid-gap:1rem;gap:1rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:col-span-4{grid-column:span 4/span 4}.md\:grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.md\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:container{width:100%}@media (min-width:640px){.lg\:container{max-width:640px}}@media (min-width:768px){.lg\:container{max-width:768px}}@media (min-width:1024px){.lg\:container{max-width:1024px}}@media (min-width:1280px){.lg\:container{max-width:1280px}}.lg\:border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.lg\:rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.lg\:rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.lg\:border-l-0{border-left-width:0}.lg\:border-t{border-top-width:1px}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:items-start{align-items:flex-start}.lg\:items-center{align-items:center}.lg\:justify-center{justify-content:center}.lg\:text-sm{font-size:.875rem}.lg\:text-base{font-size:1rem}.lg\:text-lg{font-size:1.125rem}.lg\:text-3xl{font-size:1.875rem}.lg\:text-4xl{font-size:2.25rem}.lg\:text-5xl{font-size:3rem}.lg\:text-6xl{font-size:4rem}.lg\:ml-64{margin-left:16rem}.lg\:max-w-full{max-width:100%}.lg\:p-6{padding:1.5rem}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:text-center{text-align:center}.lg\:w-64{width:16rem}.lg\:w-1\/4{width:25%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.lg\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.lg\:row-span-2{grid-row:span 2/span 2}}@media (min-width:1280px){.xl\:container{width:100%}@media (min-width:640px){.xl\:container{max-width:640px}}@media (min-width:768px){.xl\:container{max-width:768px}}@media (min-width:1024px){.xl\:container{max-width:1024px}}@media (min-width:1280px){.xl\:container{max-width:1280px}}.xl\:text-2xl{font-size:1.5rem}}
\ No newline at end of file
diff --git a/views/error/404.ejs b/views/error/404.ejs
index 2929a43..af904e4 100644
--- a/views/error/404.ejs
+++ b/views/error/404.ejs
@@ -1 +1,54 @@
-<h2>404</h2>
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>TradeByte</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/css/all.min.css" integrity="sha256-46r060N2LrChLLb5zowXQ72/iKKNiw/lAmygmHExk/o=" crossorigin="anonymous" />
+    <link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet" />
+    <link rel="stylesheet" href="css/style.css" />
+
+    <style>
+        #error {
+            color: #29c2c2;
+        }
+        
+        h1 {
+            font-weight: bold;
+        }
+        
+        h2 {
+            font-weight: bold;
+        }
+    </style>
+</head>
+
+<body style="display: flex; justify-content: center; align-items: center">
+    <div style="display: flex; justify-content: center; align-items: center" class="max-w-sm w-full lg:max-w-full lg:flex">
+        <div class="mt-10 border-r border-b border-l border-gray-400 lg:border-l-0 lg:border-t lg:border-gray-400 bg-white rounded-b lg:rounded-b-none lg:rounded-r p-4 flex flex-col shadow-lg">
+            <div class="mb-8">
+                <h1 class="text-center text-6xl">4 <i id="error" class="fas fa-frown"></i> 4</h1>
+                <h2 class="text-center text-black text-xl">PAGE NOT FOUND</h2>
+                <p class="text-black text-center mt-2 "> The page you are looking for was moved or doesn't exist</p>
+            </div>
+            <div>
+                <p class="text-black text-center">Let's get to back</p>
+            </div>
+            <div style="display: flex; justify-content: center;">
+                <button onclick="back()" class="bg-teal-400 hover:bg-gray-500 text-white font-bold py-2 px-4 mt-4 border border-blue-700 rounded">
+                    Go to Homepage
+                  </button>
+
+            </div>
+        </div>
+    </div>
+
+</body>
+
+</html>
+<script>
+    function back() {
+        window.location.href = "/";
+    }
+</script>
\ No newline at end of file
diff --git a/views/error/500.ejs b/views/error/500.ejs
index f4ac5b6..6750175 100644
--- a/views/error/500.ejs
+++ b/views/error/500.ejs
@@ -1 +1,67 @@
-<h2>500</h2>
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>TradeByte</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/css/all.min.css" integrity="sha256-46r060N2LrChLLb5zowXQ72/iKKNiw/lAmygmHExk/o=" crossorigin="anonymous" />
+    <link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet" />
+    <link rel="stylesheet" href="css/style.css" />
+
+    <style>
+        #error {
+            color: gray;
+        }
+        
+        #cogs {
+            color: teal;
+            display: flex;
+            justify-content: center;
+        }
+        
+        .container {
+            width: 450px;
+        }
+        
+        h1 {
+            font-size: 100px;
+            font-weight: bold;
+        }
+        
+        .para {
+            font-weight: bold;
+        }
+    </style>
+</head>
+
+<body style="display: flex; justify-content: center; align-items: center">
+    <div style="display: flex; justify-content: center; align-items: center" class="max-w-sm w-full lg:max-w-full lg:flex">
+        <div class=" container mt-10 border-r border-b border-l border-gray-400 lg:border-l-0 lg:border-t lg:border-gray-400 bg-white rounded-b lg:rounded-b-none lg:rounded-r p-4 flex flex-col shadow-lg ">
+            <div class="mb-8">
+
+                <h1 class="text-6xl text-center text-black">500</h1>
+                <p class=" para text-red-600 text-center"> Unexpected error :(</p>
+                <i id="cogs" class="fas fa-cogs fa-7x"></i>
+                <p class="text-black text-center mt-2">There seems to be a problem </p>
+                <p class="text-black text-center mt-4">Let's get to back</p>
+            </div>
+            <div>
+
+                <div style="display: flex; justify-content: center;">
+                    <button onclick="back()" class="bg-teal-500 hover:bg-gray-500 text-white font-bold py-2 px-4 border border-blue-700 rounded">
+                    Go to Homepage
+                  </button>
+                </div>
+            </div>
+        </div>
+    </div>
+
+</body>
+
+</html>
+<script>
+    function back() {
+        window.location.href = "/";
+    }
+</script>
\ No newline at end of file

From e33eff8def9dfe49981eae5c520f7b36ebfbfd98 Mon Sep 17 00:00:00 2001
From: garimasingh22 <44470092+garimasingh22@users.noreply.github.com>
Date: Thu, 27 Aug 2020 21:09:34 +0530
Subject: [PATCH 3/7] fixed bugs

---
 public/css/tailwind.css | 119 +++++++++++++++++++++++-----------------
 routes/api/edit.js      |  22 +++-----
 views/edit.ejs          |  51 +++--------------
 views/partials/_nav.ejs |  16 ++++--
 4 files changed, 98 insertions(+), 110 deletions(-)

diff --git a/public/css/tailwind.css b/public/css/tailwind.css
index 629c605..ae78dff 100644
--- a/public/css/tailwind.css
+++ b/public/css/tailwind.css
@@ -1,107 +1,124 @@
 @tailwind base;
+
 /* Custom CSS */
+
+
 /* Main CSS */
 
 html,
 body {
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  height: 100%;
-  overflow-x: hidden;
-  box-sizing: border-box;
-  background-color: rgb(226, 232, 240);
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+    box-sizing: border-box;
+    background-color: rgb(226, 232, 240);
 }
 
 .chartjs-container {
-  position: relative;
-  margin: auto;
-  height: 75vh;
-  width: 75vw;
+    position: relative;
+    margin: auto;
+    height: 75vh;
+    width: 75vw;
 }
 
 .tradebyte-logo {
-  color: #1955e4;
-  text-shadow: 1px 2px 40px rgba(0, 0, 0, 0.5);
+    color: #1955e4;
+    text-shadow: 1px 2px 40px rgba(0, 0, 0, 0.5);
 }
 
 .line {
-  border: 1.5px solid #8e9aad;
+    border: 1.5px solid #8e9aad;
 }
 
 .user-profile {
-  border-radius: 100px;
-  border: 10px solid #1955e4;
-  width: 130px;
-  height: 130px;
+    border-radius: 100px;
+    border: 10px solid #1955e4;
+    width: 130px;
+    height: 130px;
 }
 
 .tick {
-  height: 22px;
-  width: 22px;
-  border-radius: 50%;
-  background-color: #38cda0;
-  color: white;
+    height: 22px;
+    width: 22px;
+    border-radius: 50%;
+    background-color: #38cda0;
+    color: white;
 }
 
 .tick-background {
-  background: #a9f7e6;
-  border-radius: 29px;
-  color: #1b9b7f;
+    background: #a9f7e6;
+    border-radius: 29px;
+    color: #1b9b7f;
 }
 
 .tab-color {
-  border-radius: 10px;
-  border-color: #1955e4;
-  color: #1955e4;
+    border-radius: 10px;
+    border-color: #1955e4;
+    color: #1955e4;
 }
 
 .view-link {
-  color: #1955e4;
+    color: #1955e4;
 }
 
 .view-link:hover {
-  color: #0d338a;
+    color: #0d338a;
 }
 
 .button {
-  background-color: #1955e4;
+    background-color: #1955e4;
 }
 
 .button:hover {
-  background-color: #0d338a;
+    background-color: #0d338a;
 }
 
 .table-content {
-  overflow: scroll;
-  overflow-x: scroll;
-  overflow-y: auto;
+    overflow: scroll;
+    overflow-x: scroll;
+    overflow-y: auto;
 }
 
 .transaction-companySymbol {
-  color: rgb(0, 0, 0);
-  font-weight: 700;
-  font-size: 1.1rem;
+    color: rgb(0, 0, 0);
+    font-weight: 700;
+    font-size: 1.1rem;
 }
 
-@tailwind components;
-
 .symbolicon {
-  font-size: 72px;
-  background: -webkit-linear-gradient(#eee, #333);
-  background-clip: text;
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
+    font-size: 72px;
+    background: -webkit-linear-gradient(#eee, #333);
+    background-clip: text;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
 }
 
 .min-w {
-  min-width: 400px;
+    min-width: 400px;
+}
+
+.notification {
+    position: relative;
+    display: inline-block;
+}
+
+.notification .badge {
+    position: absolute;
+    top: -10px;
+    right: -10px;
+    padding: 5px 2px;
+    border-radius: 50%;
+    background-color: #1955e4;
+    color: white;
 }
 
 @media (max-width: 400px) {
-  .min-w {
-    min-width: 300px;
-  }
+    .min-w {
+        min-width: 300px;
+    }
 }
 
-@tailwind utilities;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/routes/api/edit.js b/routes/api/edit.js
index eb4944e..77162a7 100644
--- a/routes/api/edit.js
+++ b/routes/api/edit.js
@@ -11,14 +11,13 @@ const { last } = require('lodash');
 
 // @desc    Show edit page
 // @route   GET /edit/:id
-router.get("/:id", ensureAuth, (req, res) => {
+router.get("/", ensureAuth, (req, res) => {
     let avatar = req.user.image;
-    let curruser = req.user;
+
     let firstName = req.user.firstName;
     let lastName = req.user.lastName;
     let email = req.user.email;
-    let googleId = req.user.googleId;
-    let _id = req.user._id;
+
 
     console.log(avatar);
 
@@ -29,27 +28,23 @@ router.get("/:id", ensureAuth, (req, res) => {
         firstName,
         lastName,
         email,
-        googleId,
-        _id,
         href: "/edit",
     });
 });
 
-router.put("/:id", ensureAuth, async(req, res) => {
+router.put("/", ensureAuth, async(req, res) => {
     try {
 
-        let curruser1 = await User.findById(req.params.id).lean();
+
+        let curruser1 = await User.findById(req.user._id).lean();
+        console.log(curruser1);
 
         curruser1.firstName = req.body.firstName;
         curruser1.lastName = req.body.lastName;
         curruser1.email = req.body.email;
         curruser1.displayName = curruser1.firstName + " " + curruser1.lastName
 
-        console.log(curruser1.firstName + "this is the first name");
-        console.log(curruser1.lastName + "this is the last name");
-        console.log(curruser1.displayName + "this is the disply name");
-        console.log(curruser1.email + "this is the email");
-        curruser1 = await User.findOneAndUpdate({ _id: req.params.id }, {
+        curruser1 = await User.findOneAndUpdate({ _id: curruser1._id }, {
             firstName: curruser1.firstName,
             lastName: curruser1.lastName,
             email: curruser1.email,
@@ -58,6 +53,7 @@ router.put("/:id", ensureAuth, async(req, res) => {
             new: true, // it will create a new one, if it doesn't exist
             runValidators: true, // it check weather the fields are valid or not
         });
+
         res.redirect("/portfolio");
     } catch (err) {
         console.error(err)
diff --git a/views/edit.ejs b/views/edit.ejs
index 2b0d5c2..3f6dd06 100644
--- a/views/edit.ejs
+++ b/views/edit.ejs
@@ -1,33 +1,3 @@
-<!-- <div class="m-auto">
-
-    <h3 class="m-auto">Edit Profile</h3>
-    <div class="row m-auto">
-        <form action="/edit/<%=_id%>" method="POST" class="col s12">
-            <input type="hidden" name="_method" value="PUT">
-            <h4>
-                USER-FIRSTNAME
-                <input type="text" name="firstName" value="<%=firstName%>" />
-            </h4>
-            <div class="row">
-                <div class="input-field">
-                    <input type="text" id="lastName" name="lastName" value="<%=lastName%>">
-                    <label for="lastName">lastName</label>
-                </div>
-            </div>
-
-            <div class="row">
-                <div class="input-field">
-                    <input type="email" id="email" name="email" value="<%=email%>">
-                    <label for="email">Email</label>
-                </div>
-            </div>
-            <div class="row">
-                <input type="submit" value="Save" class="btn">
-                <a href="/portfolio" class="btn orange">Cancel</a>
-            </div>
-        </form>
-    </div>
-</div> -->
 <main class="md:col-span-4 md:ml-56 lg:ml-64 md:pr-14 w-full">
     <div class="container px-5 py-10 mx-auto md:px-auto ">
         <!-- header -->
@@ -42,7 +12,7 @@
    <!--form  -->
 
 
-        <form action="/edit/<%=_id%>" method="POST" class="w-full max-w-sm md:pl-48 m-auto">
+        <form action="/edit" method="POST" class="w-full max-w-sm m-auto">
             <input type="hidden" name="_method" value="PUT">
             <div class="md:flex md:items-center mb-6">
                 <div class="md:w-1/3">
@@ -69,7 +39,7 @@
             <div class="md:flex md:items-center mb-6">
                 <div class="md:w-1/3">
                     <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
-          Email_____ <span class="mr-10">:</span>
+          Email :
             </label>
     </div>
     <div class="md:w-2/3">
@@ -79,18 +49,15 @@
     </div>
 
 
-    <div class="md:flex md:items-center">
-        <div class="md:w-1/2">
-            <input type="submit" value="Save" class="btn mb-4 shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded">
-            <!-- <button class="shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button">
-                    Save
-                  </button> -->
-        </div>
-        <div class="md:w-1/2">
-            <button class="mb-4 shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button">
+    <div class="md:flex justify-center">
+        <!-- <div class="md:w-1/2"> -->
+            <input type="submit" value="Save" class="save_btn ml-6 cursor-pointer lg:ml-24 btn mb-4 shadow bg-blue-700 hover:bg-blue-800 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded">
+        <!-- </div> -->
+        <!-- <div class="md:w-1/2"> -->
+            <button class="mb-4 ml-6 shadow bg-yellow-500 hover:bg-yellow-600 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button" style="margin-left: 6px;">
           <a href="/portfolio">Cancel</a>
         </button>
-        </div>
+        <!-- </div> -->
     </div>
     </form>
     </div>
diff --git a/views/partials/_nav.ejs b/views/partials/_nav.ejs
index 912c2f7..2ffa725 100644
--- a/views/partials/_nav.ejs
+++ b/views/partials/_nav.ejs
@@ -28,7 +28,16 @@
         <hr class="line mb-6">
 
         <div class="flex justify-center align-center rounded-full">
-            <img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" />
+            <div class="notification">
+                <img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" />
+
+                <a href="/edit"><span class="badge">
+                    <svg class="w-5 ml-2 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
+                      </svg>
+                 </span>
+               </a>
+            </div>
         </div>
 
         <a class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background" href="#">
@@ -50,12 +59,11 @@
           </path>
         </svg>Dashboard</a>
 
-            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/edit/user._id' ? 'border tab-color border-l-8': '' %>"
-                href="/edit/<%= user._id %>">
+            <!-- <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/edit' ? 'border tab-color border-l-8': '' %>" href="/edit">
                 <svg class="w-5 ml-2 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
           </svg> Edit Profile
-            </a>
+            </a> -->
 
 
 

From f63134eace85558494b9b63c38ecc520f3429391 Mon Sep 17 00:00:00 2001
From: Pavan Gandhi <pavangandhi100@gmail.com>
Date: Fri, 28 Aug 2020 10:13:51 +0530
Subject: [PATCH 4/7] Error Pages Issues Solved

---
 public/css/style.css    |   2 +-
 public/css/tailwind.css | 117 +++++++++---------
 routes/api/view.js      |   2 +-
 views/addBalance.ejs    |  26 +---
 views/error/404.ejs     | 101 ++++++++-------
 views/error/500.ejs     | 122 ++++++++++--------
 views/partials/_nav.ejs | 265 ++++++++++++++++++++++++++++------------
 7 files changed, 375 insertions(+), 260 deletions(-)

diff --git a/public/css/style.css b/public/css/style.css
index 894296a..def094b 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -1 +1 @@
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}body,html{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;box-sizing:border-box;background-color:#e2e8f0}.chartjs-container{position:relative;margin:auto;height:75vh;width:75vw}.tradebyte-logo{color:#1955e4;text-shadow:1px 2px 40px rgba(0,0,0,.5)}.line{border:1.5px solid #8e9aad}.user-profile{border-radius:100px;border:10px solid #1955e4;width:130px;height:130px}.tick{height:22px;width:22px;border-radius:50%;background-color:#38cda0;color:#fff}.tick-background{background:#a9f7e6;border-radius:29px;color:#1b9b7f}.tab-color{border-radius:10px;border-color:#1955e4}.tab-color,.view-link{color:#1955e4}.view-link:hover{color:#0d338a}.button{background-color:#1955e4}.button:hover{background-color:#0d338a}.table-content{overflow:scroll;overflow-x:scroll;overflow-y:auto}.transaction-companySymbol{color:#000;font-weight:700;font-size:1.1rem}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.symbolicon{font-size:72px;background:-webkit-linear-gradient(#eee,#333);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.min-w{min-width:400px}@media (max-width:400px){.min-w{min-width:300px}}.space-y-5>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--space-y-reverse)));margin-bottom:calc(1.25rem*var(--space-y-reverse))}.space-y-10>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(2.5rem*(1 - var(--space-y-reverse)));margin-bottom:calc(2.5rem*var(--space-y-reverse))}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.bg-transparent{background-color:transparent}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#edf2f7;background-color:rgba(237,242,247,var(--bg-opacity))}.bg-gray-300{--bg-opacity:1;background-color:#e2e8f0;background-color:rgba(226,232,240,var(--bg-opacity))}.bg-gray-700{--bg-opacity:1;background-color:#4a5568;background-color:rgba(74,85,104,var(--bg-opacity))}.bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.bg-red-200{--bg-opacity:1;background-color:#fed7d7;background-color:rgba(254,215,215,var(--bg-opacity))}.bg-red-900{--bg-opacity:1;background-color:#742a2a;background-color:rgba(116,42,42,var(--bg-opacity))}.bg-yellow-200{--bg-opacity:1;background-color:#fefcbf;background-color:rgba(254,252,191,var(--bg-opacity))}.bg-yellow-500{--bg-opacity:1;background-color:#ecc94b;background-color:rgba(236,201,75,var(--bg-opacity))}.bg-green-200{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.bg-teal-500{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.bg-blue-400{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#3182ce;background-color:rgba(49,130,206,var(--bg-opacity))}.bg-blue-800{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.bg-secondary-100{--bg-opacity:1;background-color:#e2e2d5;background-color:rgba(226,226,213,var(--bg-opacity))}.bg-tempc-400{--bg-opacity:1;background-color:#266fea;background-color:rgba(38,111,234,var(--bg-opacity))}.bg-tempc-500{--bg-opacity:1;background-color:#41d7aa;background-color:rgba(65,215,170,var(--bg-opacity))}.hover\:bg-white:hover{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.hover\:bg-red-400:hover{--bg-opacity:1;background-color:#fc8181;background-color:rgba(252,129,129,var(--bg-opacity))}.hover\:bg-yellow-600:hover{--bg-opacity:1;background-color:#d69e2e;background-color:rgba(214,158,46,var(--bg-opacity))}.hover\:bg-green-200:hover{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.hover\:bg-green-400:hover{--bg-opacity:1;background-color:#68d391;background-color:rgba(104,211,145,var(--bg-opacity))}.hover\:bg-teal-500:hover{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.hover\:bg-blue-100:hover{--bg-opacity:1;background-color:#ebf8ff;background-color:rgba(235,248,255,var(--bg-opacity))}.hover\:bg-blue-400:hover{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.hover\:bg-blue-500:hover{--bg-opacity:1;background-color:#4299e1;background-color:rgba(66,153,225,var(--bg-opacity))}.hover\:bg-blue-700:hover{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.hover\:bg-indigo-700:hover{--bg-opacity:1;background-color:#4c51bf;background-color:rgba(76,81,191,var(--bg-opacity))}.focus\:bg-blue-200:focus{--bg-opacity:1;background-color:#bee3f8;background-color:rgba(190,227,248,var(--bg-opacity))}.hover\:bg-opacity-50:hover{--bg-opacity:0.5}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.border-red-600{--border-opacity:1;border-color:#e53e3e;border-color:rgba(229,62,62,var(--border-opacity))}.border-yellow-600{--border-opacity:1;border-color:#d69e2e;border-color:rgba(214,158,46,var(--border-opacity))}.border-green-400{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.border-green-600{--border-opacity:1;border-color:#38a169;border-color:rgba(56,161,105,var(--border-opacity))}.border-teal-500{--border-opacity:1;border-color:#38b2ac;border-color:rgba(56,178,172,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#4299e1;border-color:rgba(66,153,225,var(--border-opacity))}.border-blue-700{--border-opacity:1;border-color:#2b6cb0;border-color:rgba(43,108,176,var(--border-opacity))}.hover\:border-green-400:hover{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#3182ce;border-color:rgba(49,130,206,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.border-4{border-width:4px}.border-8{border-width:8px}.border{border-width:1px}.border-b-2{border-bottom-width:2px}.border-l-8{border-left-width:8px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-auto{flex:1 1 auto}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.leading-none{line-height:1}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.list-none{list-style-type:none}.m-4{margin:1rem}.m-8{margin:2rem}.-m-4{margin:-1rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mx-20{margin-left:5rem;margin-right:5rem}.my-64{margin-top:16rem;margin-bottom:16rem}.mx-auto{margin-left:auto;margin-right:auto}.-mx-8{margin-left:-2rem;margin-right:-2rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-6{margin-top:1.5rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.mt-8{margin-top:2rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.ml-10{margin-left:2.5rem}.mt-12{margin-top:3rem}.mb-24{margin-bottom:6rem}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-w-0{min-width:0}.object-cover{-o-object-fit:cover;object-fit:cover}.focus\:outline-none:focus,.outline-none{outline:0}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-10{padding:2.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.px-8{padding-left:2rem;padding-right:2rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.pt-4{padding-top:1rem}.pb-4{padding-bottom:1rem}.pt-6{padding-top:1.5rem}.pb-8{padding-bottom:2rem}.pt-10{padding-top:2.5rem}.pb-10{padding-bottom:2.5rem}.pl-10{padding-left:2.5rem}.pt-20{padding-top:5rem}.placeholder-gray-400::-moz-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400:-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.hover\:shadow-inner:hover{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.06)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(66,153,225,.5)}.fill-current{fill:currentColor}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#2d3748;color:rgba(45,55,72,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e53e3e;color:rgba(229,62,62,var(--text-opacity))}.text-red-700{--text-opacity:1;color:#c53030;color:rgba(197,48,48,var(--text-opacity))}.text-yellow-700{--text-opacity:1;color:#b7791f;color:rgba(183,121,31,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#38a169;color:rgba(56,161,105,var(--text-opacity))}.text-green-700{--text-opacity:1;color:#2f855a;color:rgba(47,133,90,var(--text-opacity))}.text-green-900{--text-opacity:1;color:#22543d;color:rgba(34,84,61,var(--text-opacity))}.text-teal-500{--text-opacity:1;color:#38b2ac;color:rgba(56,178,172,var(--text-opacity))}.text-blue-200{--text-opacity:1;color:#bee3f8;color:rgba(190,227,248,var(--text-opacity))}.text-blue-700{--text-opacity:1;color:#2b6cb0;color:rgba(43,108,176,var(--text-opacity))}.text-secondary-200{--text-opacity:1;color:#888883;color:rgba(136,136,131,var(--text-opacity))}.text-tempc-400{--text-opacity:1;color:#266fea;color:rgba(38,111,234,var(--text-opacity))}.text-tempc-500{--text-opacity:1;color:#41d7aa;color:rgba(65,215,170,var(--text-opacity))}.hover\:text-black:hover{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.hover\:text-white:hover{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.hover\:text-red-500:hover{--text-opacity:1;color:#f56565;color:rgba(245,101,101,var(--text-opacity))}.hover\:text-yellow-500:hover{--text-opacity:1;color:#ecc94b;color:rgba(236,201,75,var(--text-opacity))}.hover\:text-green-500:hover{--text-opacity:1;color:#48bb78;color:rgba(72,187,120,var(--text-opacity))}.hover\:text-blue-800:hover{--text-opacity:1;color:#2c5282;color:rgba(44,82,130,var(--text-opacity))}.focus\:text-black:focus{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.focus\:text-blue-900:focus{--text-opacity:1;color:#2a4365;color:rgba(42,67,101,var(--text-opacity))}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.whitespace-no-wrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-16{width:4rem}.w-24{width:6rem}.w-32{width:8rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/3{width:66.666667%}.w-2\/5{width:40%}.w-full{width:100%}.w-screen{width:100vw}.gap-4{grid-gap:1rem;gap:1rem}.gap-8{grid-gap:2rem;gap:2rem}.gap-10{grid-gap:2.5rem;gap:2.5rem}.grid-flow-col{grid-auto-flow:column}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.hover\:scale-125:hover{--transform-scale-x:1.25;--transform-scale-y:1.25}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@media (min-width:640px){.sm\:container{width:100%;max-width:640px}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:1024px){.sm\:container{max-width:1024px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}.sm\:flex-col{flex-direction:column}.sm\:h-20{height:5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width:768px){.md\:container{width:100%}@media (min-width:640px){.md\:container{max-width:640px}}@media (min-width:768px){.md\:container{max-width:768px}}@media (min-width:1024px){.md\:container{max-width:1024px}}@media (min-width:1280px){.md\:container{max-width:1280px}}.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}.md\:items-center{align-items:center}.md\:justify-center{justify-content:center}.md\:h-screen{height:100vh}.md\:text-sm{font-size:.875rem}.md\:text-xl{font-size:1.25rem}.md\:text-2xl{font-size:1.5rem}.md\:text-3xl{font-size:1.875rem}.md\:mx-auto{margin-left:auto;margin-right:auto}.md\:ml-56{margin-left:14rem}.md\:ml-64{margin-left:16rem}.md\:ml-auto{margin-left:auto}.md\:px-2{padding-left:.5rem;padding-right:.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:px-10{padding-left:2.5rem;padding-right:2.5rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:pb-0{padding-bottom:0}.md\:fixed{position:fixed}.md\:top-0{top:0}.md\:left-0{left:0}.md\:break-all{word-break:break-all}.md\:w-56{width:14rem}.md\:w-1\/2{width:50%}.md\:w-4\/5{width:80%}.md\:z-50{z-index:50}.md\:gap-4{grid-gap:1rem;gap:1rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:col-span-4{grid-column:span 4/span 4}.md\:grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.md\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:container{width:100%}@media (min-width:640px){.lg\:container{max-width:640px}}@media (min-width:768px){.lg\:container{max-width:768px}}@media (min-width:1024px){.lg\:container{max-width:1024px}}@media (min-width:1280px){.lg\:container{max-width:1280px}}.lg\:border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.lg\:rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.lg\:rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.lg\:border-l-0{border-left-width:0}.lg\:border-t{border-top-width:1px}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:items-start{align-items:flex-start}.lg\:items-center{align-items:center}.lg\:justify-center{justify-content:center}.lg\:text-sm{font-size:.875rem}.lg\:text-base{font-size:1rem}.lg\:text-lg{font-size:1.125rem}.lg\:text-3xl{font-size:1.875rem}.lg\:text-4xl{font-size:2.25rem}.lg\:text-5xl{font-size:3rem}.lg\:text-6xl{font-size:4rem}.lg\:ml-64{margin-left:16rem}.lg\:max-w-full{max-width:100%}.lg\:p-6{padding:1.5rem}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:text-center{text-align:center}.lg\:w-64{width:16rem}.lg\:w-1\/4{width:25%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.lg\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.lg\:row-span-2{grid-row:span 2/span 2}}@media (min-width:1280px){.xl\:container{width:100%}@media (min-width:640px){.xl\:container{max-width:640px}}@media (min-width:768px){.xl\:container{max-width:768px}}@media (min-width:1024px){.xl\:container{max-width:1024px}}@media (min-width:1280px){.xl\:container{max-width:1280px}}.xl\:text-2xl{font-size:1.5rem}}
\ No newline at end of file
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}body,html{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;box-sizing:border-box;background-color:#e2e8f0}.chartjs-container{position:relative;margin:auto;height:75vh;width:75vw}.tradebyte-logo{color:#1955e4;text-shadow:1px 2px 40px rgba(0,0,0,.5)}.line{border:1.5px solid #8e9aad}.user-profile{border-radius:100px;border:10px solid #1955e4;width:130px;height:130px}.tick{height:22px;width:22px;border-radius:50%;background-color:#38cda0;color:#fff}.tick-background{background:#a9f7e6;border-radius:29px;color:#1b9b7f}.tab-color{border-radius:10px;border-color:#1955e4}.tab-color,.view-link{color:#1955e4}.view-link:hover{color:#0d338a}.button{background-color:#1955e4}.button:hover{background-color:#0d338a}.table-content{overflow:scroll;overflow-x:scroll;overflow-y:auto}.transaction-companySymbol{color:#000;font-weight:700;font-size:1.1rem}.symbolicon{font-size:72px;background:-webkit-linear-gradient(#eee,#333);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.min-w{min-width:400px}.notification{position:relative;display:inline-block}.notification .badge{position:absolute;top:-10px;right:-10px;padding:5px 2px;border-radius:50%;background-color:#1955e4;color:#fff}@media (max-width:400px){.min-w{min-width:300px}}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.space-y-5>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--space-y-reverse)));margin-bottom:calc(1.25rem*var(--space-y-reverse))}.space-y-10>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(2.5rem*(1 - var(--space-y-reverse)));margin-bottom:calc(2.5rem*var(--space-y-reverse))}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.bg-transparent{background-color:transparent}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#edf2f7;background-color:rgba(237,242,247,var(--bg-opacity))}.bg-gray-300{--bg-opacity:1;background-color:#e2e8f0;background-color:rgba(226,232,240,var(--bg-opacity))}.bg-gray-700{--bg-opacity:1;background-color:#4a5568;background-color:rgba(74,85,104,var(--bg-opacity))}.bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.bg-red-200{--bg-opacity:1;background-color:#fed7d7;background-color:rgba(254,215,215,var(--bg-opacity))}.bg-red-900{--bg-opacity:1;background-color:#742a2a;background-color:rgba(116,42,42,var(--bg-opacity))}.bg-yellow-200{--bg-opacity:1;background-color:#fefcbf;background-color:rgba(254,252,191,var(--bg-opacity))}.bg-yellow-500{--bg-opacity:1;background-color:#ecc94b;background-color:rgba(236,201,75,var(--bg-opacity))}.bg-green-200{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.bg-teal-500{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.bg-blue-400{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#3182ce;background-color:rgba(49,130,206,var(--bg-opacity))}.bg-blue-700{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.bg-blue-800{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.bg-secondary-100{--bg-opacity:1;background-color:#e2e2d5;background-color:rgba(226,226,213,var(--bg-opacity))}.bg-tempc-400{--bg-opacity:1;background-color:#266fea;background-color:rgba(38,111,234,var(--bg-opacity))}.bg-tempc-500{--bg-opacity:1;background-color:#41d7aa;background-color:rgba(65,215,170,var(--bg-opacity))}.hover\:bg-white:hover{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.hover\:bg-gray-500:hover{--bg-opacity:1;background-color:#a0aec0;background-color:rgba(160,174,192,var(--bg-opacity))}.hover\:bg-red-400:hover{--bg-opacity:1;background-color:#fc8181;background-color:rgba(252,129,129,var(--bg-opacity))}.hover\:bg-yellow-600:hover{--bg-opacity:1;background-color:#d69e2e;background-color:rgba(214,158,46,var(--bg-opacity))}.hover\:bg-green-400:hover{--bg-opacity:1;background-color:#68d391;background-color:rgba(104,211,145,var(--bg-opacity))}.hover\:bg-teal-500:hover{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.hover\:bg-blue-100:hover{--bg-opacity:1;background-color:#ebf8ff;background-color:rgba(235,248,255,var(--bg-opacity))}.hover\:bg-blue-400:hover{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.hover\:bg-blue-500:hover{--bg-opacity:1;background-color:#4299e1;background-color:rgba(66,153,225,var(--bg-opacity))}.hover\:bg-blue-700:hover{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.hover\:bg-blue-800:hover{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.hover\:bg-indigo-700:hover{--bg-opacity:1;background-color:#4c51bf;background-color:rgba(76,81,191,var(--bg-opacity))}.focus\:bg-white:focus{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.focus\:bg-blue-200:focus{--bg-opacity:1;background-color:#bee3f8;background-color:rgba(190,227,248,var(--bg-opacity))}.hover\:bg-opacity-50:hover{--bg-opacity:0.5}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.border-red-600{--border-opacity:1;border-color:#e53e3e;border-color:rgba(229,62,62,var(--border-opacity))}.border-yellow-600{--border-opacity:1;border-color:#d69e2e;border-color:rgba(214,158,46,var(--border-opacity))}.border-green-400{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.border-green-600{--border-opacity:1;border-color:#38a169;border-color:rgba(56,161,105,var(--border-opacity))}.border-teal-500{--border-opacity:1;border-color:#38b2ac;border-color:rgba(56,178,172,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#4299e1;border-color:rgba(66,153,225,var(--border-opacity))}.border-blue-700{--border-opacity:1;border-color:#2b6cb0;border-color:rgba(43,108,176,var(--border-opacity))}.hover\:border-green-400:hover{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#3182ce;border-color:rgba(49,130,206,var(--border-opacity))}.focus\:border-purple-500:focus{--border-opacity:1;border-color:#9f7aea;border-color:rgba(159,122,234,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.border-2{border-width:2px}.border-4{border-width:4px}.border-8{border-width:8px}.border{border-width:1px}.border-b-2{border-bottom-width:2px}.border-l-8{border-left-width:8px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-auto{flex:1 1 auto}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.text-6xl{font-size:4rem}.leading-none{line-height:1}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.list-none{list-style-type:none}.m-4{margin:1rem}.m-8{margin:2rem}.m-auto{margin:auto}.-m-4{margin:-1rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mx-20{margin-left:5rem;margin-right:5rem}.my-64{margin-top:16rem;margin-bottom:16rem}.mx-auto{margin-left:auto;margin-right:auto}.-mx-8{margin-left:-2rem;margin-right:-2rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-6{margin-top:1.5rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.ml-6{margin-left:1.5rem}.mt-8{margin-top:2rem}.mb-8{margin-bottom:2rem}.mt-10{margin-top:2.5rem}.mb-10{margin-bottom:2.5rem}.ml-10{margin-left:2.5rem}.mt-12{margin-top:3rem}.mb-24{margin-bottom:6rem}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-w-0{min-width:0}.object-cover{-o-object-fit:cover;object-fit:cover}.focus\:outline-none:focus,.outline-none{outline:0}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-10{padding:2.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.px-8{padding-left:2rem;padding-right:2rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pt-6{padding-top:1.5rem}.pb-8{padding-bottom:2rem}.pt-10{padding-top:2.5rem}.pb-10{padding-bottom:2.5rem}.pl-10{padding-left:2.5rem}.pt-20{padding-top:5rem}.placeholder-gray-400::-moz-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400:-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.hover\:shadow-inner:hover{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.06)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(66,153,225,.5)}.fill-current{fill:currentColor}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#2d3748;color:rgba(45,55,72,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e53e3e;color:rgba(229,62,62,var(--text-opacity))}.text-red-700{--text-opacity:1;color:#c53030;color:rgba(197,48,48,var(--text-opacity))}.text-yellow-700{--text-opacity:1;color:#b7791f;color:rgba(183,121,31,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#38a169;color:rgba(56,161,105,var(--text-opacity))}.text-green-700{--text-opacity:1;color:#2f855a;color:rgba(47,133,90,var(--text-opacity))}.text-green-900{--text-opacity:1;color:#22543d;color:rgba(34,84,61,var(--text-opacity))}.text-teal-500{--text-opacity:1;color:#38b2ac;color:rgba(56,178,172,var(--text-opacity))}.text-blue-200{--text-opacity:1;color:#bee3f8;color:rgba(190,227,248,var(--text-opacity))}.text-blue-700{--text-opacity:1;color:#2b6cb0;color:rgba(43,108,176,var(--text-opacity))}.text-secondary-200{--text-opacity:1;color:#888883;color:rgba(136,136,131,var(--text-opacity))}.text-tempc-400{--text-opacity:1;color:#266fea;color:rgba(38,111,234,var(--text-opacity))}.text-tempc-500{--text-opacity:1;color:#41d7aa;color:rgba(65,215,170,var(--text-opacity))}.hover\:text-black:hover{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.hover\:text-white:hover{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.hover\:text-red-500:hover{--text-opacity:1;color:#f56565;color:rgba(245,101,101,var(--text-opacity))}.hover\:text-yellow-500:hover{--text-opacity:1;color:#ecc94b;color:rgba(236,201,75,var(--text-opacity))}.hover\:text-green-500:hover{--text-opacity:1;color:#48bb78;color:rgba(72,187,120,var(--text-opacity))}.hover\:text-blue-800:hover{--text-opacity:1;color:#2c5282;color:rgba(44,82,130,var(--text-opacity))}.focus\:text-black:focus{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.focus\:text-blue-900:focus{--text-opacity:1;color:#2a4365;color:rgba(42,67,101,var(--text-opacity))}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.whitespace-no-wrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-16{width:4rem}.w-24{width:6rem}.w-32{width:8rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/3{width:66.666667%}.w-2\/5{width:40%}.w-full{width:100%}.w-screen{width:100vw}.gap-4{grid-gap:1rem;gap:1rem}.gap-8{grid-gap:2rem;gap:2rem}.gap-10{grid-gap:2.5rem;gap:2.5rem}.grid-flow-col{grid-auto-flow:column}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.hover\:scale-125:hover{--transform-scale-x:1.25;--transform-scale-y:1.25}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@media (min-width:640px){.sm\:container{width:100%;max-width:640px}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:1024px){.sm\:container{max-width:1024px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}.sm\:flex-col{flex-direction:column}.sm\:h-20{height:5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width:768px){.md\:container{width:100%}@media (min-width:640px){.md\:container{max-width:640px}}@media (min-width:768px){.md\:container{max-width:768px}}@media (min-width:1024px){.md\:container{max-width:1024px}}@media (min-width:1280px){.md\:container{max-width:1280px}}.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}.md\:items-center{align-items:center}.md\:justify-center{justify-content:center}.md\:h-screen{height:100vh}.md\:text-sm{font-size:.875rem}.md\:text-xl{font-size:1.25rem}.md\:text-2xl{font-size:1.5rem}.md\:text-3xl{font-size:1.875rem}.md\:mx-auto{margin-left:auto;margin-right:auto}.md\:mb-0{margin-bottom:0}.md\:ml-56{margin-left:14rem}.md\:ml-64{margin-left:16rem}.md\:ml-auto{margin-left:auto}.md\:px-2{padding-left:.5rem;padding-right:.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:px-10{padding-left:2.5rem;padding-right:2.5rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:pb-0{padding-bottom:0}.md\:fixed{position:fixed}.md\:top-0{top:0}.md\:left-0{left:0}.md\:text-right{text-align:right}.md\:break-all{word-break:break-all}.md\:w-56{width:14rem}.md\:w-1\/2{width:50%}.md\:w-1\/3{width:33.333333%}.md\:w-2\/3{width:66.666667%}.md\:w-4\/5{width:80%}.md\:z-50{z-index:50}.md\:gap-4{grid-gap:1rem;gap:1rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:col-span-4{grid-column:span 4/span 4}.md\:grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.md\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:container{width:100%}@media (min-width:640px){.lg\:container{max-width:640px}}@media (min-width:768px){.lg\:container{max-width:768px}}@media (min-width:1024px){.lg\:container{max-width:1024px}}@media (min-width:1280px){.lg\:container{max-width:1280px}}.lg\:border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.lg\:rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.lg\:rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.lg\:border-l-0{border-left-width:0}.lg\:border-t{border-top-width:1px}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:items-start{align-items:flex-start}.lg\:items-center{align-items:center}.lg\:justify-center{justify-content:center}.lg\:text-sm{font-size:.875rem}.lg\:text-base{font-size:1rem}.lg\:text-lg{font-size:1.125rem}.lg\:text-3xl{font-size:1.875rem}.lg\:text-4xl{font-size:2.25rem}.lg\:text-5xl{font-size:3rem}.lg\:text-6xl{font-size:4rem}.lg\:ml-24{margin-left:6rem}.lg\:ml-64{margin-left:16rem}.lg\:max-w-full{max-width:100%}.lg\:p-6{padding:1.5rem}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:text-center{text-align:center}.lg\:w-64{width:16rem}.lg\:w-1\/4{width:25%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.lg\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.lg\:row-span-2{grid-row:span 2/span 2}}@media (min-width:1280px){.xl\:container{width:100%}@media (min-width:640px){.xl\:container{max-width:640px}}@media (min-width:768px){.xl\:container{max-width:768px}}@media (min-width:1024px){.xl\:container{max-width:1024px}}@media (min-width:1280px){.xl\:container{max-width:1280px}}.xl\:text-2xl{font-size:1.5rem}}
\ No newline at end of file
diff --git a/public/css/tailwind.css b/public/css/tailwind.css
index ae78dff..8645431 100644
--- a/public/css/tailwind.css
+++ b/public/css/tailwind.css
@@ -2,123 +2,122 @@
 
 /* Custom CSS */
 
-
 /* Main CSS */
 
 html,
 body {
-    margin: 0;
-    padding: 0;
-    width: 100%;
-    height: 100%;
-    overflow-x: hidden;
-    box-sizing: border-box;
-    background-color: rgb(226, 232, 240);
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  overflow-x: hidden;
+  box-sizing: border-box;
+  background-color: rgb(226, 232, 240);
 }
 
 .chartjs-container {
-    position: relative;
-    margin: auto;
-    height: 75vh;
-    width: 75vw;
+  position: relative;
+  margin: auto;
+  height: 75vh;
+  width: 75vw;
 }
 
 .tradebyte-logo {
-    color: #1955e4;
-    text-shadow: 1px 2px 40px rgba(0, 0, 0, 0.5);
+  color: #1955e4;
+  text-shadow: 1px 2px 40px rgba(0, 0, 0, 0.5);
 }
 
 .line {
-    border: 1.5px solid #8e9aad;
+  border: 1.5px solid #8e9aad;
 }
 
 .user-profile {
-    border-radius: 100px;
-    border: 10px solid #1955e4;
-    width: 130px;
-    height: 130px;
+  border-radius: 100px;
+  border: 10px solid #1955e4;
+  width: 130px;
+  height: 130px;
 }
 
 .tick {
-    height: 22px;
-    width: 22px;
-    border-radius: 50%;
-    background-color: #38cda0;
-    color: white;
+  height: 22px;
+  width: 22px;
+  border-radius: 50%;
+  background-color: #38cda0;
+  color: white;
 }
 
 .tick-background {
-    background: #a9f7e6;
-    border-radius: 29px;
-    color: #1b9b7f;
+  background: #a9f7e6;
+  border-radius: 29px;
+  color: #1b9b7f;
 }
 
 .tab-color {
-    border-radius: 10px;
-    border-color: #1955e4;
-    color: #1955e4;
+  border-radius: 10px;
+  border-color: #1955e4;
+  color: #1955e4;
 }
 
 .view-link {
-    color: #1955e4;
+  color: #1955e4;
 }
 
 .view-link:hover {
-    color: #0d338a;
+  color: #0d338a;
 }
 
 .button {
-    background-color: #1955e4;
+  background-color: #1955e4;
 }
 
 .button:hover {
-    background-color: #0d338a;
+  background-color: #0d338a;
 }
 
 .table-content {
-    overflow: scroll;
-    overflow-x: scroll;
-    overflow-y: auto;
+  overflow: scroll;
+  overflow-x: scroll;
+  overflow-y: auto;
 }
 
 .transaction-companySymbol {
-    color: rgb(0, 0, 0);
-    font-weight: 700;
-    font-size: 1.1rem;
+  color: rgb(0, 0, 0);
+  font-weight: 700;
+  font-size: 1.1rem;
 }
 
 .symbolicon {
-    font-size: 72px;
-    background: -webkit-linear-gradient(#eee, #333);
-    background-clip: text;
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
+  font-size: 72px;
+  background: -webkit-linear-gradient(#eee, #333);
+  background-clip: text;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
 }
 
 .min-w {
-    min-width: 400px;
+  min-width: 400px;
 }
 
 .notification {
-    position: relative;
-    display: inline-block;
+  position: relative;
+  display: inline-block;
 }
 
 .notification .badge {
-    position: absolute;
-    top: -10px;
-    right: -10px;
-    padding: 5px 2px;
-    border-radius: 50%;
-    background-color: #1955e4;
-    color: white;
+  position: absolute;
+  top: -10px;
+  right: -10px;
+  padding: 5px 2px;
+  border-radius: 50%;
+  background-color: #1955e4;
+  color: white;
 }
 
 @media (max-width: 400px) {
-    .min-w {
-        min-width: 300px;
-    }
+  .min-w {
+    min-width: 300px;
+  }
 }
 
 @tailwind components;
-@tailwind utilities;
\ No newline at end of file
+@tailwind utilities;
diff --git a/routes/api/view.js b/routes/api/view.js
index da88452..def71e8 100644
--- a/routes/api/view.js
+++ b/routes/api/view.js
@@ -105,7 +105,7 @@ router.get("/:symbol", ensureAuth, async (req, res) => {
     })
     .catch((err) => {
       console.error(err);
-      res.render("error/500");
+      res.render("error/404");
     });
 });
 
diff --git a/views/addBalance.ejs b/views/addBalance.ejs
index 8c24cb0..fc3ad38 100644
--- a/views/addBalance.ejs
+++ b/views/addBalance.ejs
@@ -46,8 +46,8 @@
         </div>
       </form>
 
-      <div class="card flex flex-wrap justify-around sm:flex-col md:flex-col">
-        <div class="max-w-sm bg-white my-4 rounded overflow-hidden shadow-lg">
+      <div class="card flex flex-wrap justify-around">
+        <div class="w-auto bg-white my-4 rounded overflow-hidden shadow-lg">
           <div class="px-6 py-4">
             <div class="font-bold text-xl mb-2">Test Card 1</div>
             <p class="text-gray-700 mb-6 text-base text-base">
@@ -65,7 +65,7 @@
             >
           </div>
         </div>
-        <div class="max-w-sm bg-white my-4 rounded overflow-hidden shadow-lg">
+        <div class="w-auto bg-white my-4 rounded overflow-hidden shadow-lg">
           <div class="px-6 py-4">
             <div class="font-bold text-xl mb-2">Test Card 2</div>
             <p class="text-gray-700 mb-6 text-base text-base">
@@ -83,7 +83,7 @@
             >
           </div>
         </div>
-        <div class="max-w-sm bg-white my-4 rounded overflow-hidden shadow-lg">
+        <div class="w-auto bg-white my-4 rounded overflow-hidden shadow-lg">
           <div class="px-6 py-4">
             <div class="font-bold text-xl mb-2">Test Card 3</div>
             <p class="text-gray-700 mb-6 text-base text-base">
@@ -101,24 +101,6 @@
             >
           </div>
         </div>
-        <div class="max-w-sm bg-white my-4 rounded overflow-hidden shadow-lg">
-          <div class="px-6 py-4">
-            <div class="font-bold text-xl mb-2">Test Card 4</div>
-            <p class="text-gray-700 mb-6 text-base text-base">
-              4000 0566 5566 5556
-            </p>
-          </div>
-          <div class="px-6 pt-4 pb-2">
-            <span
-              class="inline-block bg-gray-200 px-4 py-1 text-sm font-semibold text-gray-700 mr-6 mb-2"
-              >MM/YY : 10/40</span
-            >
-            <span
-              class="inline-block bg-gray-200 px-4 py-1 text-sm font-semibold text-gray-700 mr-6 mb-2"
-              >CVC : 999</span
-            >
-          </div>
-        </div>
       </div>
     </div>
   </div>
diff --git a/views/error/404.ejs b/views/error/404.ejs
index af904e4..02a2925 100644
--- a/views/error/404.ejs
+++ b/views/error/404.ejs
@@ -1,54 +1,71 @@
 <!DOCTYPE html>
 <html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>TradeByte</title>
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/css/all.min.css" integrity="sha256-46r060N2LrChLLb5zowXQ72/iKKNiw/lAmygmHExk/o=" crossorigin="anonymous" />
-    <link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet" />
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/css/all.min.css"
+      integrity="sha256-46r060N2LrChLLb5zowXQ72/iKKNiw/lAmygmHExk/o="
+      crossorigin="anonymous"
+    />
+    <link
+      href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
+      rel="stylesheet"
+    />
     <link rel="stylesheet" href="css/style.css" />
 
     <style>
-        #error {
-            color: #29c2c2;
-        }
-        
-        h1 {
-            font-weight: bold;
-        }
-        
-        h2 {
-            font-weight: bold;
-        }
-    </style>
-</head>
+      .error {
+        color: #3a7bd5;
+      }
 
-<body style="display: flex; justify-content: center; align-items: center">
-    <div style="display: flex; justify-content: center; align-items: center" class="max-w-sm w-full lg:max-w-full lg:flex">
-        <div class="mt-10 border-r border-b border-l border-gray-400 lg:border-l-0 lg:border-t lg:border-gray-400 bg-white rounded-b lg:rounded-b-none lg:rounded-r p-4 flex flex-col shadow-lg">
-            <div class="mb-8">
-                <h1 class="text-center text-6xl">4 <i id="error" class="fas fa-frown"></i> 4</h1>
-                <h2 class="text-center text-black text-xl">PAGE NOT FOUND</h2>
-                <p class="text-black text-center mt-2 "> The page you are looking for was moved or doesn't exist</p>
-            </div>
-            <div>
-                <p class="text-black text-center">Let's get to back</p>
-            </div>
-            <div style="display: flex; justify-content: center;">
-                <button onclick="back()" class="bg-teal-400 hover:bg-gray-500 text-white font-bold py-2 px-4 mt-4 border border-blue-700 rounded">
-                    Go to Homepage
-                  </button>
+      h1 {
+        font-weight: bold;
+      }
+
+      h2 {
+        font-weight: bold;
+      }
+    </style>
+  </head>
 
-            </div>
+  <body style="display: flex; justify-content: center; align-items: center">
+    <div
+      style="display: flex; justify-content: center; align-items: center"
+      class="max-w-sm w-full lg:max-w-full lg:flex"
+    >
+      <div
+        class="mt-10 border-r border-b border-l border-gray-400 lg:border-l-0 lg:border-t lg:border-gray-400 bg-white rounded-b lg:rounded-b-none lg:rounded-r p-6 flex flex-col shadow-lg"
+      >
+        <div class="mb-4">
+          <h1 class="text-center text-6xl">
+            4 <i class="error fas fa-frown"></i> 4
+          </h1>
+          <h2 class="text-center text-black text-2xl">PAGE NOT FOUND</h2>
+          <p class="text-black text-center px-2 text-xl mt-2">
+            The page/stock you are looking for <br />
+            was moved or doesn't exist
+          </p>
         </div>
+        <div>
+          <p class="text-black text-center text-xl">Let's get to back</p>
+        </div>
+        <div style="display: flex; justify-content: center">
+          <button
+            onclick="back()"
+            class="error hover:bg-blue-100 font-bold py-2 px-4 mt-4 border border-blue-700 rounded"
+          >
+            Go to Homepage
+          </button>
+        </div>
+      </div>
     </div>
-
-</body>
-
+  </body>
 </html>
 <script>
-    function back() {
-        window.location.href = "/";
-    }
-</script>
\ No newline at end of file
+  function back() {
+    window.location.href = "/";
+  }
+</script>
diff --git a/views/error/500.ejs b/views/error/500.ejs
index 6750175..9e72841 100644
--- a/views/error/500.ejs
+++ b/views/error/500.ejs
@@ -1,67 +1,81 @@
 <!DOCTYPE html>
 <html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>TradeByte</title>
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/css/all.min.css" integrity="sha256-46r060N2LrChLLb5zowXQ72/iKKNiw/lAmygmHExk/o=" crossorigin="anonymous" />
-    <link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet" />
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/css/all.min.css"
+      integrity="sha256-46r060N2LrChLLb5zowXQ72/iKKNiw/lAmygmHExk/o="
+      crossorigin="anonymous"
+    />
+    <link
+      href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
+      rel="stylesheet"
+    />
     <link rel="stylesheet" href="css/style.css" />
 
     <style>
-        #error {
-            color: gray;
-        }
-        
-        #cogs {
-            color: teal;
-            display: flex;
-            justify-content: center;
-        }
-        
-        .container {
-            width: 450px;
-        }
-        
-        h1 {
-            font-size: 100px;
-            font-weight: bold;
-        }
-        
-        .para {
-            font-weight: bold;
-        }
-    </style>
-</head>
+      #error {
+        color: gray;
+      }
 
-<body style="display: flex; justify-content: center; align-items: center">
-    <div style="display: flex; justify-content: center; align-items: center" class="max-w-sm w-full lg:max-w-full lg:flex">
-        <div class=" container mt-10 border-r border-b border-l border-gray-400 lg:border-l-0 lg:border-t lg:border-gray-400 bg-white rounded-b lg:rounded-b-none lg:rounded-r p-4 flex flex-col shadow-lg ">
-            <div class="mb-8">
+      #cogs {
+        display: flex;
+        justify-content: center;
+      }
+      .error {
+        color: #3a7bd5;
+      }
+      .container {
+        width: 450px;
+      }
 
-                <h1 class="text-6xl text-center text-black">500</h1>
-                <p class=" para text-red-600 text-center"> Unexpected error :(</p>
-                <i id="cogs" class="fas fa-cogs fa-7x"></i>
-                <p class="text-black text-center mt-2">There seems to be a problem </p>
-                <p class="text-black text-center mt-4">Let's get to back</p>
-            </div>
-            <div>
+      h1 {
+        font-size: 100px;
+        font-weight: bold;
+      }
+
+      .para {
+        font-weight: bold;
+      }
+    </style>
+  </head>
 
-                <div style="display: flex; justify-content: center;">
-                    <button onclick="back()" class="bg-teal-500 hover:bg-gray-500 text-white font-bold py-2 px-4 border border-blue-700 rounded">
-                    Go to Homepage
-                  </button>
-                </div>
-            </div>
+  <body style="display: flex; justify-content: center; align-items: center">
+    <div
+      style="display: flex; justify-content: center; align-items: center"
+      class="max-w-sm w-full lg:max-w-full lg:flex"
+    >
+      <div
+        class="container mt-10 border-r border-b border-l border-gray-400 lg:border-l-0 lg:border-t lg:border-gray-400 bg-white rounded-b lg:rounded-b-none lg:rounded-r p-6 flex flex-col shadow-lg"
+      >
+        <div class="mb-8">
+          <h1 class="text-4xl text-center text-black">ERROR 500</h1>
+          <p class="para text-red-600 text-center mb-2">Unexpected error :(</p>
+          <i id="cogs" class="fas fa-cogs fa-7x"></i>
+          <p class="text-black text-center text-xl mt-2">
+            There seems to be a problem
+          </p>
+          <p class="text-black text-center text-xl mt-2">Let's get to back</p>
         </div>
+        <div>
+          <div style="display: flex; justify-content: center">
+            <button
+              onclick="back()"
+              class="error hover:bg-blue-100 font-bold py-2 px-4 mb-2 border border-blue-700 rounded"
+            >
+              Go to Homepage
+            </button>
+          </div>
+        </div>
+      </div>
     </div>
-
-</body>
-
+  </body>
 </html>
 <script>
-    function back() {
-        window.location.href = "/";
-    }
-</script>
\ No newline at end of file
+  function back() {
+    window.location.href = "/";
+  }
+</script>
diff --git a/views/partials/_nav.ejs b/views/partials/_nav.ejs
index 2ffa725..bf7be0c 100644
--- a/views/partials/_nav.ejs
+++ b/views/partials/_nav.ejs
@@ -1,93 +1,196 @@
-<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js" defer></script>
-
-<div @click.away="open = false" class="flex flex-col w-full md:w-56 lg:w-64 text-gray-700 bg-white flex-shrink-0 md:h-screen  md:z-50 md:fixed md:left-0 md:top-0" x-data="{ open: false }">
-
-    <div class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between">
-        <div class="flex-shrink-0 text-center">
-            <img class="h-8 w-8 tradebyte-logo " src="../images/TradeByte-Favicon.png" alt="Logo">
-        </div>
-        <h4 class="font-bold text-center pt-1">
-            <a href="/" class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl tradebyte-logo">Tradebyte</a>
-        </h4>
-        <button class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline" @click="open = !open">
+<script
+  src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js"
+  defer
+></script>
+
+<div
+  @click.away="open = false"
+  class="flex flex-col w-full md:w-56 lg:w-64 text-gray-700 bg-white flex-shrink-0 md:h-screen md:z-50 md:fixed md:left-0 md:top-0"
+  x-data="{ open: false }"
+>
+  <div
+    class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between"
+  >
+    <div class="flex-shrink-0 text-center">
+      <img
+        class="h-8 w-8 tradebyte-logo"
+        src="../images/TradeByte-Favicon.png"
+        alt="Logo"
+      />
+    </div>
+    <h4 class="font-bold text-center pt-1">
+      <a
+        href="/"
+        class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl tradebyte-logo"
+        >Tradebyte</a
+      >
+    </h4>
+    <button
+      class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline"
+      @click="open = !open"
+    >
       <svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6">
-        <path x-show="!open" fill-rule="evenodd"
+        <path
+          x-show="!open"
+          fill-rule="evenodd"
           d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z"
-          clip-rule="evenodd"></path>
-        <path x-show="open" fill-rule="evenodd"
+          clip-rule="evenodd"
+        ></path>
+        <path
+          x-show="open"
+          fill-rule="evenodd"
           d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
-          clip-rule="evenodd"></path>
+          clip-rule="evenodd"
+        ></path>
       </svg>
     </button>
-
+  </div>
+
+  <nav
+    :class="{'block': open, 'hidden': !open}"
+    class="flex-grow md:block px-4 pb-4 md:pb-0"
+  >
+    <hr class="line mb-6" />
+
+    <div class="flex justify-center align-center rounded-full">
+      <div class="notification">
+        <img
+          class="h-16 w-16 border-8 user-profile box-1 rounded-full"
+          src="<%= user.image %>"
+          alt=""
+        />
+
+        <a href="/edit"
+          ><span class="badge">
+            <svg
+              class="w-5 ml-2 mr-1"
+              xmlns="http://www.w3.org/2000/svg"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke="currentColor"
+            >
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
+              />
+            </svg>
+          </span>
+        </a>
+      </div>
     </div>
 
-
-    <nav :class="{'block': open, 'hidden': !open}" class="flex-grow md:block px-4 pb-4 md:pb-0">
-
-        <hr class="line mb-6">
-
-        <div class="flex justify-center align-center rounded-full">
-            <div class="notification">
-                <img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" />
-
-                <a href="/edit"><span class="badge">
-                    <svg class="w-5 ml-2 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
-                      </svg>
-                 </span>
-               </a>
-            </div>
-        </div>
-
-        <a class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background" href="#">
-            <div class="tick mr-1">
-                <svg class="w-5 mr-1 " fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor">
+    <a
+      class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background"
+      href="#"
+    >
+      <div class="tick mr-1">
+        <svg
+          class="w-5 mr-1"
+          fill="none"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+        >
           <path d="M5 13l4 4L19 7"></path>
         </svg>
-            </div> Trading Active
-        </a>
-
-        <div class="nav-box flex flex-col justify-start">
-
-            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'border tab-color border-l-8': '' %>"
-                href="/portfolio">
-                <svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round " stroke-width="2 " viewBox="0 0 24 24 " stroke="currentColor ">
+      </div>
+      Trading Active
+    </a>
+
+    <div class="nav-box flex flex-col justify-start">
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'border tab-color border-l-8': '' %>"
+        href="/portfolio"
+      >
+        <svg
+          class="w-5 ml-2 mr-1"
+          fill="none "
+          stroke-linecap="round "
+          stroke-linejoin="round "
+          stroke-width="2 "
+          viewBox="0 0 24 24 "
+          stroke="currentColor "
+        >
           <path
             d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4
-        13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z ">
-          </path>
-        </svg>Dashboard</a>
-
-            <!-- <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/edit' ? 'border tab-color border-l-8': '' %>" href="/edit">
-                <svg class="w-5 ml-2 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
-          </svg> Edit Profile
-            </a> -->
-
-
-
-            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/market' ? 'border tab-color border-l-8': '' %>"
-                href="/market"><svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round "
-          stroke-width="2 " viewBox="0 0 24 24 " stroke="currentColor ">
-          <path d="M8 14v3m4-3v3m4-3v3M3 21h18M3 10h18M3 7l9-4 9 4M4 10h16v11H4V10z "></path>
-        </svg>Market</a>
-
-            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/addBalance' ? 'border tab-color border-l-8': '' %>"
-                href="/addBalance">+ Add Balance</a>
-            <!-- only for development purpose i added ADD BALANCE button here on navbar. -->
-
-            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/trasaction' ? 'border tab-color border-l-8': '' %>"
-                href="/transaction">$ Transactions History</a>
-            <!-- only for development purpose i added TRANSACTION HISTORY button here on navbar. -->
-
-            <a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/auth/logout' ? 'border tab-color border-l-8': '' %>"
-                href="/auth/logout"><svg class="w-6 ml-2 mr-1" fill="currentColor" viewBox="0 0 20 20">
-          <path fill-rule="evenodd"
+        13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z "
+          ></path></svg
+        >Dashboard</a
+      >
+
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/market' ? 'border tab-color border-l-8': '' %>"
+        href="/market"
+        ><svg
+          class="w-5 ml-2 mr-1"
+          fill="none "
+          stroke-linecap="round "
+          stroke-linejoin="round "
+          stroke-width="2 "
+          viewBox="0 0 24 24 "
+          stroke="currentColor "
+        >
+          <path
+            d="M8 14v3m4-3v3m4-3v3M3 21h18M3 10h18M3 7l9-4 9 4M4 10h16v11H4V10z "
+          ></path></svg
+        >Stock Market</a
+      >
+
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/addBalance' ? 'border tab-color border-l-8': '' %>"
+        href="/addBalance"
+      >
+        <svg
+          class="w-5 ml-2 mr-1"
+          fill="none "
+          stroke-linecap="round "
+          stroke-linejoin="round "
+          stroke-width="1 "
+          viewBox="0 0 24 24 "
+          stroke="currentColor "
+        >
+          <path
+            fill="none"
+            d="M4.423,9.141H3.565c-0.237,0-0.429,0.192-0.429,0.429s0.192,0.429,0.429,0.429h0.858c0.237,0,0.429-0.192,0.429-0.429S4.66,9.141,4.423,9.141 M6.997,16.861H6.139c-0.237,0-0.429,0.192-0.429,0.43s0.192,0.429,0.429,0.429h0.858c0.237,0,0.429-0.191,0.429-0.429S7.234,16.861,6.997,16.861 M4.423,16.861H3.565c-0.237,0-0.429,0.192-0.429,0.43s0.192,0.429,0.429,0.429h0.858c0.237,0,0.429-0.191,0.429-0.429S4.66,16.861,4.423,16.861M13.861,9.998h0.857c0.236,0,0.429-0.192,0.429-0.429s-0.192-0.429-0.429-0.429h-0.857c-0.237,0-0.43,0.192-0.43,0.429S13.624,9.998,13.861,9.998 M14.719,16.861h-0.857c-0.237,0-0.43,0.192-0.43,0.43s0.192,0.429,0.43,0.429h0.857c0.236,0,0.429-0.191,0.429-0.429S14.955,16.861,14.719,16.861 M15.576,13.001c-0.236,0-0.429,0.192-0.429,0.43c0,0.236,0.192,0.429,0.429,0.429c0.237,0,0.43-0.192,0.43-0.429C16.006,13.193,15.813,13.001,15.576,13.001 M6.997,9.141H6.139c-0.237,0-0.429,0.192-0.429,0.429s0.192,0.429,0.429,0.429h0.858c0.237,0,0.429-0.192,0.429-0.429S7.234,9.141,6.997,9.141M12.145,9.141h-0.857c-0.236,0-0.429,0.192-0.429,0.429s0.193,0.429,0.429,0.429h0.857c0.237,0,0.43-0.192,0.43-0.429S12.382,9.141,12.145,9.141 M17.722,10.856V7.424c0-0.948-0.769-1.716-1.716-1.716h-0.617l-1.038-3.873c-0.245-0.916-1.186-1.458-2.101-1.213L3.592,2.912C2.676,3.157,2.133,4.098,2.378,5.014l0.186,0.695H2.278c-0.947,0-1.716,0.768-1.716,1.716V17.72c0,0.947,0.769,1.716,1.716,1.716h13.728c0.947,0,1.716-0.769,1.716-1.716v-1.716c0.947,0,1.716-0.769,1.716-1.716v-1.716C19.438,11.624,18.669,10.856,17.722,10.856 M16.006,6.566c0.473,0,0.857,0.384,0.857,0.858v0.238c-0.253-0.146-0.544-0.238-0.857-0.238h-0.157l-0.229-0.858H16.006z M14.41,5.372l0.55,2.053H6.67L14.41,5.372z M3.814,3.741l8.657-2.29c0.458-0.123,0.928,0.149,1.051,0.607l0.222,0.828L3.43,5.621l-0.223-0.83C3.084,4.333,3.356,3.863,3.814,3.741M1.42,7.424c0-0.474,0.384-0.858,0.858-0.858h0.517l0.229,0.858H2.278c-0.314,0-0.605,0.091-0.858,0.238V7.424z M16.863,17.72c0,0.474-0.385,0.858-0.857,0.858H2.278c-0.474,0-0.858-0.385-0.858-0.858V9.141c0-0.474,0.384-0.858,0.858-0.858h13.728c0.473,0,0.857,0.384,0.857,0.858v1.715h-1.716c-0.947,0-1.716,0.768-1.716,1.716v1.716c0,0.947,0.769,1.716,1.716,1.716h1.716V17.72z M18.58,14.288c0,0.474-0.385,0.857-0.858,0.857h-2.574c-0.474,0-0.857-0.384-0.857-0.857v-1.716c0-0.474,0.384-0.858,0.857-0.858h2.574c0.474,0,0.858,0.385,0.858,0.858V14.288z M9.571,16.861H8.713c-0.237,0-0.429,0.192-0.429,0.43s0.192,0.429,0.429,0.429h0.858c0.236,0,0.429-0.191,0.429-0.429S9.808,16.861,9.571,16.861M12.145,16.861h-0.857c-0.236,0-0.429,0.192-0.429,0.43s0.193,0.429,0.429,0.429h0.857c0.237,0,0.43-0.191,0.43-0.429S12.382,16.861,12.145,16.861 M9.571,9.141H8.713c-0.237,0-0.429,0.192-0.429,0.429s0.192,0.429,0.429,0.429h0.858C9.808,9.998,10,9.806,10,9.569S9.808,9.141,9.571,9.141"
+          ></path></svg
+        >Add Balance</a
+      >
+      <!-- only for development purpose i added ADD BALANCE button here on navbar. -->
+
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/trasaction' ? 'border tab-color border-l-8': '' %>"
+        href="/transaction"
+        ><svg
+          class="w-5 ml-2 mr-1"
+          fill="none "
+          stroke-linecap="round "
+          stroke-linejoin="round "
+          stroke-width="1 "
+          viewBox="0 0 24 24 "
+          stroke="currentColor "
+        >
+          <path
+            fill="none"
+            d="M3.254,6.572c0.008,0.072,0.048,0.123,0.082,0.187c0.036,0.07,0.06,0.137,0.12,0.187C3.47,6.957,3.47,6.978,3.484,6.988c0.048,0.034,0.108,0.018,0.162,0.035c0.057,0.019,0.1,0.066,0.164,0.066c0.004,0,0.01,0,0.015,0l2.934-0.074c0.317-0.007,0.568-0.271,0.56-0.589C7.311,6.113,7.055,5.865,6.744,5.865c-0.005,0-0.01,0-0.015,0L5.074,5.907c2.146-2.118,5.604-2.634,7.971-1.007c2.775,1.912,3.48,5.726,1.57,8.501c-1.912,2.781-5.729,3.486-8.507,1.572c-0.259-0.18-0.618-0.119-0.799,0.146c-0.18,0.262-0.114,0.621,0.148,0.801c1.254,0.863,2.687,1.279,4.106,1.279c2.313,0,4.591-1.1,6.001-3.146c2.268-3.297,1.432-7.829-1.867-10.101c-2.781-1.913-6.816-1.36-9.351,1.058L4.309,3.567C4.303,3.252,4.036,3.069,3.72,3.007C3.402,3.015,3.151,3.279,3.16,3.597l0.075,2.932C3.234,6.547,3.251,6.556,3.254,6.572z"
+          ></path></svg
+        >Transactions History</a
+      >
+
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/auth/logout' ? 'border tab-color border-l-8': '' %>"
+        href="/auth/logout"
+        ><svg class="w-6 ml-2 mr-1" fill="currentColor" viewBox="0 0 20 20">
+          <path
+            fill-rule="evenodd"
             d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
-            clip-rule="evenodd"></path>
-        </svg>Logout</a>
-
-        </div>
-    </nav>
-</div>
\ No newline at end of file
+            clip-rule="evenodd"
+          ></path></svg
+        >Logout</a
+      >
+    </div>
+  </nav>
+</div>

From 182cb2751059b085751c2c70181a62ddcf9eb4c2 Mon Sep 17 00:00:00 2001
From: garimasingh22 <44470092+garimasingh22@users.noreply.github.com>
Date: Fri, 28 Aug 2020 12:04:52 +0530
Subject: [PATCH 5/7] #65 add searchbox in market

---
 views/market.ejs | 86 ++++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 83 insertions(+), 3 deletions(-)

diff --git a/views/market.ejs b/views/market.ejs
index ee4c282..8ad93f0 100644
--- a/views/market.ejs
+++ b/views/market.ejs
@@ -1,9 +1,45 @@
 <section class="text-gray-700 body-font md:ml-56 lg:ml-64 md:mx-auto md:pr-14 w-screen inline">
     <div class="container px-5 py-10 mx-auto md:px-auto">
-        <div class="my-4 absolute-center">
-            <h2 class="text-gray-700 lg:text-6xl text-5xl font-semibold leading-none tracking-wider px-5">Favorite Stocks</h2>
+        <div class="my-4 absolute-center md:flex">
+            <div class="md:w-1/2">
+
+                <h2 class="text-gray-700 lg:text-6xl text-5xl font-semibold leading-none tracking-wider px-5">Favorite Stocks</h2>
+            </div>
+
+            <!-- search box -->
+            <div class="md:w-1/2">
+                <div>
+                    <div class="relative text-gray-600 mt-4 mr-12 shadow-md rounded-b-lg">
+                        <input id="searchbar" type="search" name="serch" placeholder="Search Stocks by Symbols" class="bg-transparent h-10 px-5 pl-10 rounded-full text-lg focus:outline-none" />
+                        <button type="submit" class="absolute left-0 top-0 mt-3 ml-4">
+                    <svg
+                      class="h-4 w-4 fill-current"
+                      xmlns="http://www.w3.org/2000/svg"
+                      xmlns:xlink="http://www.w3.org/1999/xlink"
+                      version="1.1"
+                      id="Capa_1"
+                      x="0px"
+                      y="0px"
+                      viewBox="0 0 56.966 56.966"
+                      style="enable-background: new 0 0 56.966 56.966;"
+                      xml:space="preserve"
+                      width="512px"
+                      height="512px"
+                    >
+                      <path
+                        d="M55.146,51.887L41.588,37.786c3.486-4.144,5.396-9.358,5.396-14.786c0-12.682-10.318-23-23-23s-23,10.318-23,23  s10.318,23,23,23c4.761,0,9.298-1.436,13.177-4.162l13.661,14.208c0.571,0.593,1.339,0.92,2.162,0.92  c0.779,0,1.518-0.297,2.079-0.837C56.255,54.982,56.293,53.08,55.146,51.887z M23.984,6c9.374,0,17,7.626,17,17s-7.626,17-17,17  s-17-7.626-17-17S14.61,6,23.984,6z"
+                      />
+                    </svg>
+                  </button>
+                    </div>
+
+                    <ul id="search-result" style="height: 0px; overflow: hidden; white-space: pre;" class="text-lg p-5 ml-10 list-none mt-0 text-gray-700"></ul>
+
+                    <!-- end of search box -->
+                </div>
+            </div>
         </div>
-        <div class="container py-16 mx-auto">
+        <div class="container pb-16 pt-8 mx-auto">
 
             <div class="flex -m-4 inline-block overflow-x-auto whitespace-no-wrap">
                 <% for(var i=0; i < compactData.length; i++) { %>
@@ -141,3 +177,47 @@
         }
     }
 </script>
+
+<!-- script for search bar -->
+
+<script>
+    const inputField = document.getElementById('searchbar')
+    inputField.addEventListener('input', (event) => {
+        console.log(event.target.value)
+        const value = event.target.value
+            //sample data
+        const dataset = <%- JSON.stringify(totalData) %>;
+
+        // searching the symbol
+
+        let data = dataset.filter(function(el) {
+            return el.Symbol.includes(value.toUpperCase())
+        })
+
+        // when no symbol matched
+
+        if (data.length === 0) {
+
+            let data1 = dataset.filter(function(el) {
+                return (el["Company Name"].toLowerCase().includes(value.toLowerCase()))
+            })
+            data = data1;
+        }
+
+        let list = "";
+        if (value === "") {
+            list = "";
+            data = [];
+        }
+
+        let n = data.length
+
+        for (i = 0; i <= (n - 1); i++) {
+            let item = data[i];
+            list += `<li><a href='/view/${item.Symbol}'>${item.Symbol}</a></li>`
+        }
+        document.getElementById('search-result').innerHTML = list;
+
+        console.log(data)
+    })
+</script>
\ No newline at end of file

From 5bfc47fe855b0c4f6a694909502e84e6e521fd7e Mon Sep 17 00:00:00 2001
From: garimasingh22 <44470092+garimasingh22@users.noreply.github.com>
Date: Fri, 28 Aug 2020 12:27:05 +0530
Subject: [PATCH 6/7] portfolio search by company name

---
 views/portfolio.ejs | 77 ++++++++++++++++++++++++---------------------
 1 file changed, 41 insertions(+), 36 deletions(-)

diff --git a/views/portfolio.ejs b/views/portfolio.ejs
index 8f79d21..a5069d0 100644
--- a/views/portfolio.ejs
+++ b/views/portfolio.ejs
@@ -1,13 +1,11 @@
 <main class="md:col-span-4 md:ml-56 lg:ml-64 md:pr-14 w-full">
-  <div class="container px-5 py-10 mx-auto md:px-auto">
-    <!-- <div class="absolute-center mx-auto"> -->
+    <div class="container px-5 py-10 mx-auto md:px-auto">
+        <!-- <div class="absolute-center mx-auto"> -->
 
-    <!-- header -->
+        <!-- header -->
 
-    <header class="my-4 absolute-center">
-      <span
-        class="text-gray-700 text-3xl font-semibold leading-none tracking-wider"
-        >Hello,</span
+        <header class="my-4 absolute-center">
+            <span class="text-gray-700 text-3xl font-semibold leading-none tracking-wider">Hello,</span
       >
       <h2 class="text-gray-800 text-5xl leading-none tracking-wider view-link">
         <%= user.displayName%>.
@@ -71,41 +69,37 @@
               $40,342.04
             </p>
             <span class="block text-gray-500 text-sm">Total Portfolio</span>
-          </div>
-        </div>
+    </div>
+    </div>
 
-        <!-- card 2 -->
+    <!-- card 2 -->
 
-        <div
-          class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl"
-        >
-          <div class="flex-shrink-0 w-10 h-10">
+    <div class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl">
+        <div class="flex-shrink-0 w-10 h-10">
             <img class="w-full h-full" src="images/graph.jpeg " alt=" " />
-          </div>
-          <div class="font-bold text-xl xl:text-2xl ml-3 justify-center">
+        </div>
+        <div class="font-bold text-xl xl:text-2xl ml-3 justify-center">
             <p class="text-gray-900 whitespace-no-wrap">
-              $ 40,342.04
+                $ 40,342.04
             </p>
             <span class="block text-gray-500 text-sm">Profit / Loss</span>
-          </div>
         </div>
+    </div>
 
-        <!-- card 3 -->
+    <!-- card 3 -->
 
-        <div
-          class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl"
-        >
-          <div class="flex-shrink-0 w-10 h-10">
+    <div class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl">
+        <div class="flex-shrink-0 w-10 h-10">
             <img class="w-full h-full" src="images/graph.jpeg " alt=" " />
-          </div>
-          <div class="font-bold text-xl xl:text-2xl ml-3">
+        </div>
+        <div class="font-bold text-xl xl:text-2xl ml-3">
             <p class="text-gray-900 whitespace-no-wrap">
-              $40,342.04
+                $40,342.04
             </p>
             <span class="block text-gray-500 text-sm">$ Balance</span>
-          </div>
         </div>
-      </div>
+    </div>
+    </div>
     </div>
 
     <!-- overview heading -->
@@ -117,14 +111,13 @@
     <!-- container for both tables -->
 
     <div class="lg:grid lg:grid-cols-2 -mx-8">
-      <!-- table component 1 -->
+        <!-- table component 1 -->
 
-      <div class="px-3 sm:px-6 py-4 overflow-hidden h-auto w-full">
-        <div class="flex justify-between">
-          <!-- heading of table -->
-          <h2 class="text-lg font-bold leading-tight py-3">Trade History</h2>
-          <a href="#" class="mt-3 font-bold text-tempc-400"
-            >View All <span class="font-extrabold">></span></a
+        <div class="px-3 sm:px-6 py-4 overflow-hidden h-auto w-full">
+            <div class="flex justify-between">
+                <!-- heading of table -->
+                <h2 class="text-lg font-bold leading-tight py-3">Trade History</h2>
+                <a href="#" class="mt-3 font-bold text-tempc-400">View All <span class="font-extrabold">></span></a
           >
         </div>
 
@@ -542,10 +535,22 @@
           //sample data
       const dataset = <%- JSON.stringify(totalData) %>;
 
+// when symbol matches
+
       let data = dataset.filter(function(el) {
           return el.Symbol.includes(value.toUpperCase())
       })
 
+// when no symbol matches
+
+      if (data.length === 0) {
+
+let data1 = dataset.filter(function(el) {
+    return (el["Company Name"].toLowerCase().includes(value.toLowerCase()))
+})
+data = data1;
+}
+
       let list = "";
       if (value === "") {
           list = "";
@@ -555,4 +560,4 @@
       for (i = 0; i <= (n - 1); i++) {
           let item = data[i];
           list += `<li><a href='/view/${item.Symbol}'>${item.Symbol}</a></li>` } document.getElementById('search-result').innerHTML = list ;console.log(data) })
-</script>
+                </script>
\ No newline at end of file

From 51026300e2792d2c608e5c6276579f53dec0f6b8 Mon Sep 17 00:00:00 2001
From: Pavan Gandhi <pavangandhi100@gmail.com>
Date: Fri, 28 Aug 2020 14:04:20 +0530
Subject: [PATCH 7/7] Navbar Fixed

---
 config/data-compact.json |   6 +-
 public/css/style.css     |   2 +-
 public/css/tailwind.css  |   8 +-
 routes/api/edit.js       | 105 +++++----
 routes/api/market.js     |   8 +-
 views/edit.ejs           | 149 ++++++++-----
 views/market.ejs         | 445 ++++++++++++++++++++++-----------------
 views/partials/_nav.ejs  |   9 +-
 views/portfolio.ejs      | 195 ++++++++---------
 9 files changed, 500 insertions(+), 427 deletions(-)

diff --git a/config/data-compact.json b/config/data-compact.json
index eb88d39..1f86f4b 100644
--- a/config/data-compact.json
+++ b/config/data-compact.json
@@ -4,7 +4,7 @@
     "Symbol": "AAPL"
   },
   {
-    "Company Name": "Adobe Systems Incorporated",
+    "Company Name": "Adobe Systems",
     "Symbol": "ADBE"
   },
   {
@@ -12,7 +12,7 @@
     "Symbol": "ADVS"
   },
   {
-    "Company Name": "Advanced Micro Devices, Inc.",
+    "Company Name": "Advance Micro Devices",
     "Symbol": "AMD"
   },
   {
@@ -60,7 +60,7 @@
     "Symbol": "NVDA"
   },
   {
-    "Company Name": "QUALCOMM Incorporated",
+    "Company Name": "Qualcomm, Inc.",
     "Symbol": "QCOM"
   },
   {
diff --git a/public/css/style.css b/public/css/style.css
index def094b..fe43821 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -1 +1 @@
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}body,html{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;box-sizing:border-box;background-color:#e2e8f0}.chartjs-container{position:relative;margin:auto;height:75vh;width:75vw}.tradebyte-logo{color:#1955e4;text-shadow:1px 2px 40px rgba(0,0,0,.5)}.line{border:1.5px solid #8e9aad}.user-profile{border-radius:100px;border:10px solid #1955e4;width:130px;height:130px}.tick{height:22px;width:22px;border-radius:50%;background-color:#38cda0;color:#fff}.tick-background{background:#a9f7e6;border-radius:29px;color:#1b9b7f}.tab-color{border-radius:10px;border-color:#1955e4}.tab-color,.view-link{color:#1955e4}.view-link:hover{color:#0d338a}.button{background-color:#1955e4}.button:hover{background-color:#0d338a}.table-content{overflow:scroll;overflow-x:scroll;overflow-y:auto}.transaction-companySymbol{color:#000;font-weight:700;font-size:1.1rem}.symbolicon{font-size:72px;background:-webkit-linear-gradient(#eee,#333);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.min-w{min-width:400px}.notification{position:relative;display:inline-block}.notification .badge{position:absolute;top:-10px;right:-10px;padding:5px 2px;border-radius:50%;background-color:#1955e4;color:#fff}@media (max-width:400px){.min-w{min-width:300px}}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.space-y-5>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--space-y-reverse)));margin-bottom:calc(1.25rem*var(--space-y-reverse))}.space-y-10>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(2.5rem*(1 - var(--space-y-reverse)));margin-bottom:calc(2.5rem*var(--space-y-reverse))}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.bg-transparent{background-color:transparent}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#edf2f7;background-color:rgba(237,242,247,var(--bg-opacity))}.bg-gray-300{--bg-opacity:1;background-color:#e2e8f0;background-color:rgba(226,232,240,var(--bg-opacity))}.bg-gray-700{--bg-opacity:1;background-color:#4a5568;background-color:rgba(74,85,104,var(--bg-opacity))}.bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.bg-red-200{--bg-opacity:1;background-color:#fed7d7;background-color:rgba(254,215,215,var(--bg-opacity))}.bg-red-900{--bg-opacity:1;background-color:#742a2a;background-color:rgba(116,42,42,var(--bg-opacity))}.bg-yellow-200{--bg-opacity:1;background-color:#fefcbf;background-color:rgba(254,252,191,var(--bg-opacity))}.bg-yellow-500{--bg-opacity:1;background-color:#ecc94b;background-color:rgba(236,201,75,var(--bg-opacity))}.bg-green-200{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.bg-teal-500{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.bg-blue-400{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#3182ce;background-color:rgba(49,130,206,var(--bg-opacity))}.bg-blue-700{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.bg-blue-800{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.bg-secondary-100{--bg-opacity:1;background-color:#e2e2d5;background-color:rgba(226,226,213,var(--bg-opacity))}.bg-tempc-400{--bg-opacity:1;background-color:#266fea;background-color:rgba(38,111,234,var(--bg-opacity))}.bg-tempc-500{--bg-opacity:1;background-color:#41d7aa;background-color:rgba(65,215,170,var(--bg-opacity))}.hover\:bg-white:hover{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.hover\:bg-gray-500:hover{--bg-opacity:1;background-color:#a0aec0;background-color:rgba(160,174,192,var(--bg-opacity))}.hover\:bg-red-400:hover{--bg-opacity:1;background-color:#fc8181;background-color:rgba(252,129,129,var(--bg-opacity))}.hover\:bg-yellow-600:hover{--bg-opacity:1;background-color:#d69e2e;background-color:rgba(214,158,46,var(--bg-opacity))}.hover\:bg-green-400:hover{--bg-opacity:1;background-color:#68d391;background-color:rgba(104,211,145,var(--bg-opacity))}.hover\:bg-teal-500:hover{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.hover\:bg-blue-100:hover{--bg-opacity:1;background-color:#ebf8ff;background-color:rgba(235,248,255,var(--bg-opacity))}.hover\:bg-blue-400:hover{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.hover\:bg-blue-500:hover{--bg-opacity:1;background-color:#4299e1;background-color:rgba(66,153,225,var(--bg-opacity))}.hover\:bg-blue-700:hover{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.hover\:bg-blue-800:hover{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.hover\:bg-indigo-700:hover{--bg-opacity:1;background-color:#4c51bf;background-color:rgba(76,81,191,var(--bg-opacity))}.focus\:bg-white:focus{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.focus\:bg-blue-200:focus{--bg-opacity:1;background-color:#bee3f8;background-color:rgba(190,227,248,var(--bg-opacity))}.hover\:bg-opacity-50:hover{--bg-opacity:0.5}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.border-red-600{--border-opacity:1;border-color:#e53e3e;border-color:rgba(229,62,62,var(--border-opacity))}.border-yellow-600{--border-opacity:1;border-color:#d69e2e;border-color:rgba(214,158,46,var(--border-opacity))}.border-green-400{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.border-green-600{--border-opacity:1;border-color:#38a169;border-color:rgba(56,161,105,var(--border-opacity))}.border-teal-500{--border-opacity:1;border-color:#38b2ac;border-color:rgba(56,178,172,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#4299e1;border-color:rgba(66,153,225,var(--border-opacity))}.border-blue-700{--border-opacity:1;border-color:#2b6cb0;border-color:rgba(43,108,176,var(--border-opacity))}.hover\:border-green-400:hover{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#3182ce;border-color:rgba(49,130,206,var(--border-opacity))}.focus\:border-purple-500:focus{--border-opacity:1;border-color:#9f7aea;border-color:rgba(159,122,234,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.border-2{border-width:2px}.border-4{border-width:4px}.border-8{border-width:8px}.border{border-width:1px}.border-b-2{border-bottom-width:2px}.border-l-8{border-left-width:8px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-auto{flex:1 1 auto}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.text-6xl{font-size:4rem}.leading-none{line-height:1}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.list-none{list-style-type:none}.m-4{margin:1rem}.m-8{margin:2rem}.m-auto{margin:auto}.-m-4{margin:-1rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mx-20{margin-left:5rem;margin-right:5rem}.my-64{margin-top:16rem;margin-bottom:16rem}.mx-auto{margin-left:auto;margin-right:auto}.-mx-8{margin-left:-2rem;margin-right:-2rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-6{margin-top:1.5rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.ml-6{margin-left:1.5rem}.mt-8{margin-top:2rem}.mb-8{margin-bottom:2rem}.mt-10{margin-top:2.5rem}.mb-10{margin-bottom:2.5rem}.ml-10{margin-left:2.5rem}.mt-12{margin-top:3rem}.mb-24{margin-bottom:6rem}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-w-0{min-width:0}.object-cover{-o-object-fit:cover;object-fit:cover}.focus\:outline-none:focus,.outline-none{outline:0}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-10{padding:2.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.px-8{padding-left:2rem;padding-right:2rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pt-6{padding-top:1.5rem}.pb-8{padding-bottom:2rem}.pt-10{padding-top:2.5rem}.pb-10{padding-bottom:2.5rem}.pl-10{padding-left:2.5rem}.pt-20{padding-top:5rem}.placeholder-gray-400::-moz-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400:-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.hover\:shadow-inner:hover{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.06)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(66,153,225,.5)}.fill-current{fill:currentColor}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#2d3748;color:rgba(45,55,72,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e53e3e;color:rgba(229,62,62,var(--text-opacity))}.text-red-700{--text-opacity:1;color:#c53030;color:rgba(197,48,48,var(--text-opacity))}.text-yellow-700{--text-opacity:1;color:#b7791f;color:rgba(183,121,31,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#38a169;color:rgba(56,161,105,var(--text-opacity))}.text-green-700{--text-opacity:1;color:#2f855a;color:rgba(47,133,90,var(--text-opacity))}.text-green-900{--text-opacity:1;color:#22543d;color:rgba(34,84,61,var(--text-opacity))}.text-teal-500{--text-opacity:1;color:#38b2ac;color:rgba(56,178,172,var(--text-opacity))}.text-blue-200{--text-opacity:1;color:#bee3f8;color:rgba(190,227,248,var(--text-opacity))}.text-blue-700{--text-opacity:1;color:#2b6cb0;color:rgba(43,108,176,var(--text-opacity))}.text-secondary-200{--text-opacity:1;color:#888883;color:rgba(136,136,131,var(--text-opacity))}.text-tempc-400{--text-opacity:1;color:#266fea;color:rgba(38,111,234,var(--text-opacity))}.text-tempc-500{--text-opacity:1;color:#41d7aa;color:rgba(65,215,170,var(--text-opacity))}.hover\:text-black:hover{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.hover\:text-white:hover{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.hover\:text-red-500:hover{--text-opacity:1;color:#f56565;color:rgba(245,101,101,var(--text-opacity))}.hover\:text-yellow-500:hover{--text-opacity:1;color:#ecc94b;color:rgba(236,201,75,var(--text-opacity))}.hover\:text-green-500:hover{--text-opacity:1;color:#48bb78;color:rgba(72,187,120,var(--text-opacity))}.hover\:text-blue-800:hover{--text-opacity:1;color:#2c5282;color:rgba(44,82,130,var(--text-opacity))}.focus\:text-black:focus{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.focus\:text-blue-900:focus{--text-opacity:1;color:#2a4365;color:rgba(42,67,101,var(--text-opacity))}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.whitespace-no-wrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-16{width:4rem}.w-24{width:6rem}.w-32{width:8rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/3{width:66.666667%}.w-2\/5{width:40%}.w-full{width:100%}.w-screen{width:100vw}.gap-4{grid-gap:1rem;gap:1rem}.gap-8{grid-gap:2rem;gap:2rem}.gap-10{grid-gap:2.5rem;gap:2.5rem}.grid-flow-col{grid-auto-flow:column}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.hover\:scale-125:hover{--transform-scale-x:1.25;--transform-scale-y:1.25}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@media (min-width:640px){.sm\:container{width:100%;max-width:640px}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:1024px){.sm\:container{max-width:1024px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}.sm\:flex-col{flex-direction:column}.sm\:h-20{height:5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width:768px){.md\:container{width:100%}@media (min-width:640px){.md\:container{max-width:640px}}@media (min-width:768px){.md\:container{max-width:768px}}@media (min-width:1024px){.md\:container{max-width:1024px}}@media (min-width:1280px){.md\:container{max-width:1280px}}.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}.md\:items-center{align-items:center}.md\:justify-center{justify-content:center}.md\:h-screen{height:100vh}.md\:text-sm{font-size:.875rem}.md\:text-xl{font-size:1.25rem}.md\:text-2xl{font-size:1.5rem}.md\:text-3xl{font-size:1.875rem}.md\:mx-auto{margin-left:auto;margin-right:auto}.md\:mb-0{margin-bottom:0}.md\:ml-56{margin-left:14rem}.md\:ml-64{margin-left:16rem}.md\:ml-auto{margin-left:auto}.md\:px-2{padding-left:.5rem;padding-right:.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:px-10{padding-left:2.5rem;padding-right:2.5rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:pb-0{padding-bottom:0}.md\:fixed{position:fixed}.md\:top-0{top:0}.md\:left-0{left:0}.md\:text-right{text-align:right}.md\:break-all{word-break:break-all}.md\:w-56{width:14rem}.md\:w-1\/2{width:50%}.md\:w-1\/3{width:33.333333%}.md\:w-2\/3{width:66.666667%}.md\:w-4\/5{width:80%}.md\:z-50{z-index:50}.md\:gap-4{grid-gap:1rem;gap:1rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:col-span-4{grid-column:span 4/span 4}.md\:grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.md\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:container{width:100%}@media (min-width:640px){.lg\:container{max-width:640px}}@media (min-width:768px){.lg\:container{max-width:768px}}@media (min-width:1024px){.lg\:container{max-width:1024px}}@media (min-width:1280px){.lg\:container{max-width:1280px}}.lg\:border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.lg\:rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.lg\:rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.lg\:border-l-0{border-left-width:0}.lg\:border-t{border-top-width:1px}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:items-start{align-items:flex-start}.lg\:items-center{align-items:center}.lg\:justify-center{justify-content:center}.lg\:text-sm{font-size:.875rem}.lg\:text-base{font-size:1rem}.lg\:text-lg{font-size:1.125rem}.lg\:text-3xl{font-size:1.875rem}.lg\:text-4xl{font-size:2.25rem}.lg\:text-5xl{font-size:3rem}.lg\:text-6xl{font-size:4rem}.lg\:ml-24{margin-left:6rem}.lg\:ml-64{margin-left:16rem}.lg\:max-w-full{max-width:100%}.lg\:p-6{padding:1.5rem}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:text-center{text-align:center}.lg\:w-64{width:16rem}.lg\:w-1\/4{width:25%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.lg\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.lg\:row-span-2{grid-row:span 2/span 2}}@media (min-width:1280px){.xl\:container{width:100%}@media (min-width:640px){.xl\:container{max-width:640px}}@media (min-width:768px){.xl\:container{max-width:768px}}@media (min-width:1024px){.xl\:container{max-width:1024px}}@media (min-width:1280px){.xl\:container{max-width:1280px}}.xl\:text-2xl{font-size:1.5rem}}
\ No newline at end of file
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#a0aec0}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#a0aec0}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:#a0aec0}input::placeholder,textarea::placeholder{color:#a0aec0}[role=button],button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}body,html{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;box-sizing:border-box;background-color:#e2e8f0}.chartjs-container{position:relative;margin:auto;height:75vh;width:75vw}.tradebyte-logo{color:#1955e4;text-shadow:1px 2px 40px rgba(0,0,0,.5)}.line{border:1.5px solid #8e9aad}.user-profile{border-radius:100px;border:10px solid #1955e4}.tick{height:22px;width:22px;border-radius:50%;background-color:#38cda0;color:#fff}.tick-background{background:#a9f7e6;border-radius:29px;color:#1b9b7f}.tab-color{border-radius:10px;border-color:#1955e4}.tab-color,.view-link{color:#1955e4}.view-link:hover{color:#0d338a}.button{background-color:#1955e4}.button:hover{background-color:#0d338a}.table-content{overflow:scroll;overflow-x:scroll;overflow-y:auto}.transaction-companySymbol{color:#000;font-weight:700;font-size:1.1rem}.symbolicon{font-size:72px;background:-webkit-linear-gradient(#eee,#333);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.min-w{min-width:400px}.notification{position:relative;display:inline-block}.notification .badge{position:absolute;top:-5px;right:-5px;padding:5px 2px;border-radius:50%;background-color:#0072ff;color:#fff}@media (max-width:400px){.min-w{min-width:300px}}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}.space-y-5>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--space-y-reverse)));margin-bottom:calc(1.25rem*var(--space-y-reverse))}.space-y-10>:not(template)~:not(template){--space-y-reverse:0;margin-top:calc(2.5rem*(1 - var(--space-y-reverse)));margin-bottom:calc(2.5rem*var(--space-y-reverse))}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.bg-transparent{background-color:transparent}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.bg-gray-200{--bg-opacity:1;background-color:#edf2f7;background-color:rgba(237,242,247,var(--bg-opacity))}.bg-gray-300{--bg-opacity:1;background-color:#e2e8f0;background-color:rgba(226,232,240,var(--bg-opacity))}.bg-gray-700{--bg-opacity:1;background-color:#4a5568;background-color:rgba(74,85,104,var(--bg-opacity))}.bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.bg-red-200{--bg-opacity:1;background-color:#fed7d7;background-color:rgba(254,215,215,var(--bg-opacity))}.bg-red-900{--bg-opacity:1;background-color:#742a2a;background-color:rgba(116,42,42,var(--bg-opacity))}.bg-yellow-200{--bg-opacity:1;background-color:#fefcbf;background-color:rgba(254,252,191,var(--bg-opacity))}.bg-yellow-500{--bg-opacity:1;background-color:#ecc94b;background-color:rgba(236,201,75,var(--bg-opacity))}.bg-green-200{--bg-opacity:1;background-color:#c6f6d5;background-color:rgba(198,246,213,var(--bg-opacity))}.bg-teal-500{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.bg-blue-400{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.bg-blue-600{--bg-opacity:1;background-color:#3182ce;background-color:rgba(49,130,206,var(--bg-opacity))}.bg-blue-700{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.bg-blue-800{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.bg-secondary-100{--bg-opacity:1;background-color:#e2e2d5;background-color:rgba(226,226,213,var(--bg-opacity))}.bg-tempc-400{--bg-opacity:1;background-color:#266fea;background-color:rgba(38,111,234,var(--bg-opacity))}.bg-tempc-500{--bg-opacity:1;background-color:#41d7aa;background-color:rgba(65,215,170,var(--bg-opacity))}.hover\:bg-white:hover{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.hover\:bg-red-400:hover{--bg-opacity:1;background-color:#fc8181;background-color:rgba(252,129,129,var(--bg-opacity))}.hover\:bg-yellow-600:hover{--bg-opacity:1;background-color:#d69e2e;background-color:rgba(214,158,46,var(--bg-opacity))}.hover\:bg-green-400:hover{--bg-opacity:1;background-color:#68d391;background-color:rgba(104,211,145,var(--bg-opacity))}.hover\:bg-teal-500:hover{--bg-opacity:1;background-color:#38b2ac;background-color:rgba(56,178,172,var(--bg-opacity))}.hover\:bg-blue-100:hover{--bg-opacity:1;background-color:#ebf8ff;background-color:rgba(235,248,255,var(--bg-opacity))}.hover\:bg-blue-400:hover{--bg-opacity:1;background-color:#63b3ed;background-color:rgba(99,179,237,var(--bg-opacity))}.hover\:bg-blue-500:hover{--bg-opacity:1;background-color:#4299e1;background-color:rgba(66,153,225,var(--bg-opacity))}.hover\:bg-blue-700:hover{--bg-opacity:1;background-color:#2b6cb0;background-color:rgba(43,108,176,var(--bg-opacity))}.hover\:bg-blue-800:hover{--bg-opacity:1;background-color:#2c5282;background-color:rgba(44,82,130,var(--bg-opacity))}.hover\:bg-indigo-700:hover{--bg-opacity:1;background-color:#4c51bf;background-color:rgba(76,81,191,var(--bg-opacity))}.focus\:bg-white:focus{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.focus\:bg-blue-200:focus{--bg-opacity:1;background-color:#bee3f8;background-color:rgba(190,227,248,var(--bg-opacity))}.hover\:bg-opacity-50:hover{--bg-opacity:0.5}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.border-red-600{--border-opacity:1;border-color:#e53e3e;border-color:rgba(229,62,62,var(--border-opacity))}.border-yellow-600{--border-opacity:1;border-color:#d69e2e;border-color:rgba(214,158,46,var(--border-opacity))}.border-green-400{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.border-green-600{--border-opacity:1;border-color:#38a169;border-color:rgba(56,161,105,var(--border-opacity))}.border-teal-500{--border-opacity:1;border-color:#38b2ac;border-color:rgba(56,178,172,var(--border-opacity))}.border-blue-500{--border-opacity:1;border-color:#4299e1;border-color:rgba(66,153,225,var(--border-opacity))}.border-blue-700{--border-opacity:1;border-color:#2b6cb0;border-color:rgba(43,108,176,var(--border-opacity))}.hover\:border-green-400:hover{--border-opacity:1;border-color:#68d391;border-color:rgba(104,211,145,var(--border-opacity))}.hover\:border-blue-600:hover{--border-opacity:1;border-color:#3182ce;border-color:rgba(49,130,206,var(--border-opacity))}.focus\:border-purple-500:focus{--border-opacity:1;border-color:#9f7aea;border-color:rgba(159,122,234,var(--border-opacity))}.rounded-sm{border-radius:.125rem}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-full{border-radius:9999px}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.border-2{border-width:2px}.border-4{border-width:4px}.border-8{border-width:8px}.border{border-width:1px}.border-b-2{border-bottom-width:2px}.border-l-8{border-left-width:8px}.border-r{border-right-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.cursor-pointer{cursor:pointer}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-auto{flex:1 1 auto}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.text-6xl{font-size:4rem}.leading-none{line-height:1}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.list-none{list-style-type:none}.m-8{margin:2rem}.m-auto{margin:auto}.-m-4{margin:-1rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mx-20{margin-left:5rem;margin-right:5rem}.my-64{margin-top:16rem;margin-bottom:16rem}.mx-auto{margin-left:auto;margin-right:auto}.-mx-8{margin-left:-2rem;margin-right:-2rem}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mt-3{margin-top:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mt-6{margin-top:1.5rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.ml-6{margin-left:1.5rem}.mt-8{margin-top:2rem}.mb-8{margin-bottom:2rem}.mt-10{margin-top:2.5rem}.mb-10{margin-bottom:2.5rem}.ml-10{margin-left:2.5rem}.mt-12{margin-top:3rem}.mr-12{margin-right:3rem}.mb-24{margin-bottom:6rem}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.min-w-0{min-width:0}.object-cover{-o-object-fit:cover;object-fit:cover}.focus\:outline-none:focus,.outline-none{outline:0}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-10{padding:2.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.px-8{padding-left:2rem;padding-right:2rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}.pb-8{padding-bottom:2rem}.pt-10{padding-top:2.5rem}.pb-10{padding-bottom:2.5rem}.pl-10{padding-left:2.5rem}.pb-16{padding-bottom:4rem}.pt-20{padding-top:5rem}.placeholder-gray-400::-moz-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400:-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::-ms-input-placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.placeholder-gray-400::placeholder{--placeholder-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--placeholder-opacity))}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.hover\:shadow-inner:hover{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.06)}.focus\:shadow-outline:focus{box-shadow:0 0 0 3px rgba(66,153,225,.5)}.fill-current{fill:currentColor}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-black{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-800{--text-opacity:1;color:#2d3748;color:rgba(45,55,72,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.text-red-600{--text-opacity:1;color:#e53e3e;color:rgba(229,62,62,var(--text-opacity))}.text-red-700{--text-opacity:1;color:#c53030;color:rgba(197,48,48,var(--text-opacity))}.text-yellow-700{--text-opacity:1;color:#b7791f;color:rgba(183,121,31,var(--text-opacity))}.text-green-600{--text-opacity:1;color:#38a169;color:rgba(56,161,105,var(--text-opacity))}.text-green-700{--text-opacity:1;color:#2f855a;color:rgba(47,133,90,var(--text-opacity))}.text-green-900{--text-opacity:1;color:#22543d;color:rgba(34,84,61,var(--text-opacity))}.text-teal-500{--text-opacity:1;color:#38b2ac;color:rgba(56,178,172,var(--text-opacity))}.text-blue-200{--text-opacity:1;color:#bee3f8;color:rgba(190,227,248,var(--text-opacity))}.text-blue-700{--text-opacity:1;color:#2b6cb0;color:rgba(43,108,176,var(--text-opacity))}.text-secondary-200{--text-opacity:1;color:#888883;color:rgba(136,136,131,var(--text-opacity))}.text-tempc-400{--text-opacity:1;color:#266fea;color:rgba(38,111,234,var(--text-opacity))}.text-tempc-500{--text-opacity:1;color:#41d7aa;color:rgba(65,215,170,var(--text-opacity))}.hover\:text-black:hover{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.hover\:text-white:hover{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.hover\:text-gray-900:hover{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.hover\:text-red-500:hover{--text-opacity:1;color:#f56565;color:rgba(245,101,101,var(--text-opacity))}.hover\:text-yellow-500:hover{--text-opacity:1;color:#ecc94b;color:rgba(236,201,75,var(--text-opacity))}.hover\:text-green-500:hover{--text-opacity:1;color:#48bb78;color:rgba(72,187,120,var(--text-opacity))}.hover\:text-blue-800:hover{--text-opacity:1;color:#2c5282;color:rgba(44,82,130,var(--text-opacity))}.focus\:text-black:focus{--text-opacity:1;color:#000;color:rgba(0,0,0,var(--text-opacity))}.focus\:text-blue-900:focus{--text-opacity:1;color:#2a4365;color:rgba(42,67,101,var(--text-opacity))}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.whitespace-no-wrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-16{width:4rem}.w-20{width:5rem}.w-24{width:6rem}.w-32{width:8rem}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/3{width:66.666667%}.w-2\/5{width:40%}.w-full{width:100%}.w-screen{width:100vw}.gap-4{grid-gap:1rem;gap:1rem}.gap-8{grid-gap:2rem;gap:2rem}.gap-10{grid-gap:2.5rem;gap:2.5rem}.grid-flow-col{grid-auto-flow:column}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.transform{--transform-translate-x:0;--transform-translate-y:0;--transform-rotate:0;--transform-skew-x:0;--transform-skew-y:0;--transform-scale-x:1;--transform-scale-y:1;transform:translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))}.hover\:scale-125:hover{--transform-scale-x:1.25;--transform-scale-y:1.25}.transition{transition-property:background-color,border-color,color,fill,stroke,opacity,box-shadow,transform}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(2);opacity:0}}@-webkit-keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@media (min-width:640px){.sm\:container{width:100%;max-width:640px}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:1024px){.sm\:container{max-width:1024px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}.sm\:h-20{height:5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width:768px){.md\:container{width:100%}@media (min-width:640px){.md\:container{max-width:640px}}@media (min-width:768px){.md\:container{max-width:768px}}@media (min-width:1024px){.md\:container{max-width:1024px}}@media (min-width:1280px){.md\:container{max-width:1280px}}.md\:block{display:block}.md\:inline-block{display:inline-block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-center{justify-content:center}.md\:h-screen{height:100vh}.md\:text-sm{font-size:.875rem}.md\:text-xl{font-size:1.25rem}.md\:text-2xl{font-size:1.5rem}.md\:text-3xl{font-size:1.875rem}.md\:mx-auto{margin-left:auto;margin-right:auto}.md\:mb-0{margin-bottom:0}.md\:ml-56{margin-left:14rem}.md\:ml-64{margin-left:16rem}.md\:ml-auto{margin-left:auto}.md\:px-2{padding-left:.5rem;padding-right:.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:px-10{padding-left:2.5rem;padding-right:2.5rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:pb-0{padding-bottom:0}.md\:fixed{position:fixed}.md\:top-0{top:0}.md\:left-0{left:0}.md\:text-right{text-align:right}.md\:break-all{word-break:break-all}.md\:w-56{width:14rem}.md\:w-1\/2{width:50%}.md\:w-1\/3{width:33.333333%}.md\:w-2\/3{width:66.666667%}.md\:w-4\/5{width:80%}.md\:z-50{z-index:50}.md\:gap-4{grid-gap:1rem;gap:1rem}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:col-span-4{grid-column:span 4/span 4}.md\:grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.md\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.lg\:container{width:100%}@media (min-width:640px){.lg\:container{max-width:640px}}@media (min-width:768px){.lg\:container{max-width:768px}}@media (min-width:1024px){.lg\:container{max-width:1024px}}@media (min-width:1280px){.lg\:container{max-width:1280px}}.lg\:border-gray-400{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.lg\:rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.lg\:rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.lg\:border-l-0{border-left-width:0}.lg\:border-t{border-top-width:1px}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:items-start{align-items:flex-start}.lg\:items-center{align-items:center}.lg\:justify-center{justify-content:center}.lg\:text-sm{font-size:.875rem}.lg\:text-base{font-size:1rem}.lg\:text-lg{font-size:1.125rem}.lg\:text-3xl{font-size:1.875rem}.lg\:text-4xl{font-size:2.25rem}.lg\:text-5xl{font-size:3rem}.lg\:text-6xl{font-size:4rem}.lg\:ml-24{margin-left:6rem}.lg\:ml-64{margin-left:16rem}.lg\:max-w-full{max-width:100%}.lg\:p-6{padding:1.5rem}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:text-center{text-align:center}.lg\:w-64{width:16rem}.lg\:w-1\/4{width:25%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.lg\:grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.lg\:row-span-2{grid-row:span 2/span 2}}@media (min-width:1280px){.xl\:container{width:100%}@media (min-width:640px){.xl\:container{max-width:640px}}@media (min-width:768px){.xl\:container{max-width:768px}}@media (min-width:1024px){.xl\:container{max-width:1024px}}@media (min-width:1280px){.xl\:container{max-width:1280px}}.xl\:text-2xl{font-size:1.5rem}}
\ No newline at end of file
diff --git a/public/css/tailwind.css b/public/css/tailwind.css
index 8645431..0596c94 100644
--- a/public/css/tailwind.css
+++ b/public/css/tailwind.css
@@ -34,8 +34,6 @@ body {
 .user-profile {
   border-radius: 100px;
   border: 10px solid #1955e4;
-  width: 130px;
-  height: 130px;
 }
 
 .tick {
@@ -105,11 +103,11 @@ body {
 
 .notification .badge {
   position: absolute;
-  top: -10px;
-  right: -10px;
+  top: -5px;
+  right: -5px;
   padding: 5px 2px;
   border-radius: 50%;
-  background-color: #1955e4;
+  background-color: #0072ff;
   color: white;
 }
 
diff --git a/routes/api/edit.js b/routes/api/edit.js
index 77162a7..9cec1bd 100644
--- a/routes/api/edit.js
+++ b/routes/api/edit.js
@@ -1,64 +1,59 @@
 // Edit Profile Route
-const express = require('express')
-const router = express.Router()
-const { ensureAuth } = require('../../middleware/auth')
-
-const User = require('../../models/User.js');
-const { id } = require('date-fns/locale');
-const { last } = require('lodash');
-
+const express = require("express");
+const router = express.Router();
+const { ensureAuth } = require("../../middleware/auth");
 
+const User = require("../../models/User.js");
 
 // @desc    Show edit page
-// @route   GET /edit/:id
+// @route   GET /edit
 router.get("/", ensureAuth, (req, res) => {
-    let avatar = req.user.image;
-
-    let firstName = req.user.firstName;
-    let lastName = req.user.lastName;
-    let email = req.user.email;
-
-
-    console.log(avatar);
-
-
-    res.status(200).render("edit", {
-        layout: "layouts/app",
-        avatar,
-        firstName,
-        lastName,
-        email,
-        href: "/edit",
-    });
+  let avatar = req.user.image;
+
+  let displayName = req.user.displayName;
+  let firstName = req.user.firstName;
+  let lastName = req.user.lastName;
+  let email = req.user.email;
+
+  res.status(200).render("edit", {
+    layout: "layouts/app",
+    avatar,
+    displayName,
+    firstName,
+    lastName,
+    email,
+    href: "/edit",
+  });
 });
 
-router.put("/", ensureAuth, async(req, res) => {
-    try {
-
-
-        let curruser1 = await User.findById(req.user._id).lean();
-        console.log(curruser1);
-
-        curruser1.firstName = req.body.firstName;
-        curruser1.lastName = req.body.lastName;
-        curruser1.email = req.body.email;
-        curruser1.displayName = curruser1.firstName + " " + curruser1.lastName
-
-        curruser1 = await User.findOneAndUpdate({ _id: curruser1._id }, {
-            firstName: curruser1.firstName,
-            lastName: curruser1.lastName,
-            email: curruser1.email,
-            displayName: curruser1.displayName,
-        }, {
-            new: true, // it will create a new one, if it doesn't exist
-            runValidators: true, // it check weather the fields are valid or not
-        });
-
-        res.redirect("/portfolio");
-    } catch (err) {
-        console.error(err)
-        return res.render('error/500')
-    }
+router.put("/", ensureAuth, async (req, res) => {
+  try {
+    let curruser1 = await User.findById(req.user._id).lean();
+
+    curruser1.displayName = req.body.displayName;
+    curruser1.firstName = req.body.firstName;
+    curruser1.lastName = req.body.lastName;
+    curruser1.email = req.body.email;
+
+    curruser1 = await User.findOneAndUpdate(
+      { _id: curruser1._id },
+      {
+        firstName: curruser1.firstName,
+        lastName: curruser1.lastName,
+        email: curruser1.email,
+        displayName: curruser1.displayName,
+      },
+      {
+        new: true, // it will create a new one, if it doesn't exist
+        runValidators: true, // it check weather the fields are valid or not
+      }
+    );
+
+    res.redirect("/portfolio");
+  } catch (err) {
+    console.error(err);
+    return res.render("error/500");
+  }
 });
 
-module.exports = router;
\ No newline at end of file
+module.exports = router;
diff --git a/routes/api/market.js b/routes/api/market.js
index 37baa8e..3868b2e 100644
--- a/routes/api/market.js
+++ b/routes/api/market.js
@@ -16,7 +16,7 @@ const totalData = require("../../config/data-total.json");
 // @access   Private
 router.get("/", ensureAuth, async (req, res) => {
   let min = 0;
-  let max = 75;
+  let max = 50;
 
   res.status(200).render("market", {
     layout: "layouts/app",
@@ -34,10 +34,10 @@ router.get("/", ensureAuth, async (req, res) => {
 // @access   Private
 router.get("/:page", ensureAuth, async (req, res) => {
   let page = req.params.page - 1;
-  let min = page * 75;
-  let max = page * 75 + 75;
+  let min = page * 50;
+  let max = page * 50 + 50;
 
-  if (page <= 0 || page >= 39) {
+  if (page <= 0 || page >= 59) {
     res.status(200).redirect("/market");
   } else {
     res.status(200).render("market", {
diff --git a/views/edit.ejs b/views/edit.ejs
index 3f6dd06..77e01f5 100644
--- a/views/edit.ejs
+++ b/views/edit.ejs
@@ -1,64 +1,111 @@
 <main class="md:col-span-4 md:ml-56 lg:ml-64 md:pr-14 w-full">
-    <div class="container px-5 py-10 mx-auto md:px-auto ">
-        <!-- header -->
+  <div class="container px-5 py-10 mx-auto md:px-auto">
+    <!-- header -->
 
-        <header class="my-4 absolute-center">
-            <span class="text-gray-700 text-3xl font-semibold leading-none tracking-wider">Edit Profile</span
+    <header class="my-4 absolute-center">
+      <span
+        class="text-gray-700 text-3xl font-semibold leading-none tracking-wider"
+        >Edit Profile</span
       >
     </header>
 
     <hr class="line my-4" />
 
-   <!--form  -->
+    <!--form  -->
 
+    <form action="/edit" method="POST" class="w-full max-w-sm m-auto">
+      <input type="hidden" name="_method" value="PUT" />
+      <div class="md:flex md:items-center mb-6">
+        <div class="md:w-1/3">
+          <label
+            class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4"
+            for="inline-full-name"
+          >
+            Display :
+          </label>
+        </div>
+        <div class="md:w-2/3">
+          <input
+            type="text"
+            id="displayName"
+            name="displayName"
+            value="<%=displayName%>"
+            class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500"
+          />
+        </div>
+      </div>
+      <div class="md:flex md:items-center mb-6">
+        <div class="md:w-1/3">
+          <label
+            class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4"
+            for="inline-full-name"
+          >
+            First Name :
+          </label>
+        </div>
+        <div class="md:w-2/3">
+          <input
+            type="text"
+            name="firstName"
+            value="<%=firstName%>"
+            class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500"
+          />
+        </div>
+      </div>
+      <div class="md:flex md:items-center mb-6">
+        <div class="md:w-1/3">
+          <label
+            class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4"
+            for="inline-full-name"
+          >
+            Last Name :
+          </label>
+        </div>
+        <div class="md:w-2/3">
+          <input
+            type="text"
+            id="lastName"
+            name="lastName"
+            value="<%=lastName%>"
+            class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500"
+          />
+        </div>
+      </div>
+      <div class="md:flex md:items-center mb-6">
+        <div class="md:w-1/3">
+          <label
+            class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4"
+            for="inline-full-name"
+          >
+            Email :
+          </label>
+        </div>
+        <div class="md:w-2/3">
+          <input
+            class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500"
+            type="email"
+            id="email"
+            name="email"
+            value="<%=email%>"
+          />
+        </div>
+      </div>
 
-        <form action="/edit" method="POST" class="w-full max-w-sm m-auto">
-            <input type="hidden" name="_method" value="PUT">
-            <div class="md:flex md:items-center mb-6">
-                <div class="md:w-1/3">
-                    <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
-          First Name :
-        </label>
-                </div>
-                <div class="md:w-2/3">
-                    <input type="text" name="firstName" value="<%=firstName%>" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" />
-                    <!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
-                </div>
-            </div>
-            <div class="md:flex md:items-center mb-6">
-                <div class="md:w-1/3">
-                    <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
-          Last Name :
-        </label>
-                </div>
-                <div class="md:w-2/3">
-                    <input type="text" id="lastName" name="lastName" value="<%=lastName%>" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500">
-                    <!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
-                </div>
-            </div>
-            <div class="md:flex md:items-center mb-6">
-                <div class="md:w-1/3">
-                    <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
-          Email :
-            </label>
-    </div>
-    <div class="md:w-2/3">
-        <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" type="email" id="email" name="email" value="<%=email%>">
-        <!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
-    </div>
-    </div>
+      <div class="md:flex justify-center">
+        <input
+          type="submit"
+          value="Save"
+          class="save_btn ml-6 cursor-pointer lg:ml-24 btn mb-4 shadow bg-blue-700 hover:bg-blue-800 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded"
+        />
 
-
-    <div class="md:flex justify-center">
-        <!-- <div class="md:w-1/2"> -->
-            <input type="submit" value="Save" class="save_btn ml-6 cursor-pointer lg:ml-24 btn mb-4 shadow bg-blue-700 hover:bg-blue-800 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded">
-        <!-- </div> -->
-        <!-- <div class="md:w-1/2"> -->
-            <button class="mb-4 ml-6 shadow bg-yellow-500 hover:bg-yellow-600 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button" style="margin-left: 6px;">
+        <button
+          class="mb-4 ml-6 shadow bg-yellow-500 hover:bg-yellow-600 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded"
+          type="button"
+          style="margin-left: 6px"
+        >
           <a href="/portfolio">Cancel</a>
         </button>
-        <!-- </div> -->
-    </div>
+      </div>
     </form>
-    </div>
-</main>
\ No newline at end of file
+  </div>
+</main>
diff --git a/views/market.ejs b/views/market.ejs
index 8ad93f0..26347be 100644
--- a/views/market.ejs
+++ b/views/market.ejs
@@ -1,223 +1,280 @@
-<section class="text-gray-700 body-font md:ml-56 lg:ml-64 md:mx-auto md:pr-14 w-screen inline">
-    <div class="container px-5 py-10 mx-auto md:px-auto">
-        <div class="my-4 absolute-center md:flex">
-            <div class="md:w-1/2">
+<section
+  class="text-gray-700 body-font md:ml-56 lg:ml-64 md:mx-auto md:pr-14 w-screen inline"
+>
+  <div class="container px-5 py-10 mx-auto md:px-auto">
+    <div class="my-4 absolute-center md:flex">
+      <div class="md:w-1/2">
+        <h2
+          class="text-gray-700 lg:text-6xl text-5xl font-semibold leading-none tracking-wider px-5"
+        >
+          Favorite Stocks
+        </h2>
+      </div>
+
+      <!-- search box -->
+      <div class="md:w-1/2">
+        <div>
+          <div
+            class="relative bg-white text-gray-800 mt-4 mr-12 shadow-md rounded-lg"
+          >
+            <input
+              id="searchbar"
+              type="search"
+              name="serch"
+              placeholder="Search Stocks"
+              class="bg-transparent h-10 px-5 pl-10 rounded-full text-lg focus:outline-none"
+            />
+            <button type="submit" class="absolute left-0 top-0 mt-3 ml-4">
+              <svg
+                class="h-4 w-4 fill-current"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+                version="1.1"
+                id="Capa_1"
+                x="0px"
+                y="0px"
+                viewBox="0 0 56.966 56.966"
+                style="enable-background: new 0 0 56.966 56.966"
+                xml:space="preserve"
+                width="512px"
+                height="512px"
+              >
+                <path
+                  d="M55.146,51.887L41.588,37.786c3.486-4.144,5.396-9.358,5.396-14.786c0-12.682-10.318-23-23-23s-23,10.318-23,23  s10.318,23,23,23c4.761,0,9.298-1.436,13.177-4.162l13.661,14.208c0.571,0.593,1.339,0.92,2.162,0.92  c0.779,0,1.518-0.297,2.079-0.837C56.255,54.982,56.293,53.08,55.146,51.887z M23.984,6c9.374,0,17,7.626,17,17s-7.626,17-17,17  s-17-7.626-17-17S14.61,6,23.984,6z"
+                />
+              </svg>
+            </button>
+          </div>
 
-                <h2 class="text-gray-700 lg:text-6xl text-5xl font-semibold leading-none tracking-wider px-5">Favorite Stocks</h2>
-            </div>
+          <ul
+            id="search-result"
+            style="height: 0px; overflow: hidden; white-space: pre"
+            class="text-lg p-5 ml-10 list-none mt-0 text-gray-700"
+          ></ul>
 
-            <!-- search box -->
-            <div class="md:w-1/2">
-                <div>
-                    <div class="relative text-gray-600 mt-4 mr-12 shadow-md rounded-b-lg">
-                        <input id="searchbar" type="search" name="serch" placeholder="Search Stocks by Symbols" class="bg-transparent h-10 px-5 pl-10 rounded-full text-lg focus:outline-none" />
-                        <button type="submit" class="absolute left-0 top-0 mt-3 ml-4">
-                    <svg
-                      class="h-4 w-4 fill-current"
-                      xmlns="http://www.w3.org/2000/svg"
-                      xmlns:xlink="http://www.w3.org/1999/xlink"
-                      version="1.1"
-                      id="Capa_1"
-                      x="0px"
-                      y="0px"
-                      viewBox="0 0 56.966 56.966"
-                      style="enable-background: new 0 0 56.966 56.966;"
-                      xml:space="preserve"
-                      width="512px"
-                      height="512px"
-                    >
-                      <path
-                        d="M55.146,51.887L41.588,37.786c3.486-4.144,5.396-9.358,5.396-14.786c0-12.682-10.318-23-23-23s-23,10.318-23,23  s10.318,23,23,23c4.761,0,9.298-1.436,13.177-4.162l13.661,14.208c0.571,0.593,1.339,0.92,2.162,0.92  c0.779,0,1.518-0.297,2.079-0.837C56.255,54.982,56.293,53.08,55.146,51.887z M23.984,6c9.374,0,17,7.626,17,17s-7.626,17-17,17  s-17-7.626-17-17S14.61,6,23.984,6z"
-                      />
-                    </svg>
+          <!-- end of search box -->
+        </div>
+      </div>
+    </div>
+    <div class="container pb-16 pt-8 mx-auto">
+      <div class="flex -m-4 inline-block overflow-x-auto whitespace-no-wrap">
+        <% for(var i=0; i < compactData.length; i++) { %>
+
+        <div class="inline p-4 my-4 mx-2">
+          <div
+            class="py-6 w-full rounded overflow-hidden shadow-lg hover:bg-white transition duration-500 bg-white"
+          >
+            <div class="space-y-10">
+              <div class="py-2 px-10">
+                <div class="space-y-5">
+                  <div class="font-bold text-2xl text-center mb-2">
+                    <%- compactData[i]["Symbol"] %>
+                  </div>
+                  <p class="text-gray-700 break-words text-center text-base">
+                    <%- compactData[i]["Company Name"] %>
+                  </p>
+
+                  <button
+                    class="mr-1 w-14 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-blue-500 hover:border-blue-600 hover:bg-blue-500 hover:text-white shadow-md py-2 px-2 inline-flex items-center"
+                  >
+                    <span class="mx-auto"><a href="/view/<%- compactData[i]["Symbol"] %>">VIEW</a></span>
+                  </button>
+                  <button
+                    class="w-24 pl-2 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-green-400 hover:border-green-400 hover:bg-green-400 hover:text-white shadow-md py-2 px-2 inline-flex items-center"
+                  >
+                    <span class="mx-auto"><a href="/cart/<%- compactData[i]["Symbol"] %>">BUY</a></span>
                   </button>
-                    </div>
-
-                    <ul id="search-result" style="height: 0px; overflow: hidden; white-space: pre;" class="text-lg p-5 ml-10 list-none mt-0 text-gray-700"></ul>
-
-                    <!-- end of search box -->
                 </div>
+              </div>
             </div>
+          </div>
         </div>
-        <div class="container pb-16 pt-8 mx-auto">
-
-            <div class="flex -m-4 inline-block overflow-x-auto whitespace-no-wrap">
-                <% for(var i=0; i < compactData.length; i++) { %>
-
-                    <!-- <div class="lg:w-1/4 md:w-1/2 p-4 min-w-54 inline"> -->
-                    <div class="inline p-4 m-4">
-                        <div class="py-6 max-w-sm rounded overflow-hidden shadow-lg hover:bg-white transition duration-500 bg-white ">
-                            <div class="space-y-10">
-                                <div class="py-2 px-10">
-                                    <div class="space-y-5">
-                                        <div class="font-bold text-2xl text-center mb-2">
-                                            <%- compactData[i]["Symbol"] %>
-                                        </div>
-                                        <p class="text-gray-700 text-center text-base">
-                                            <%- compactData[i]["Company Name"] %>
-                                        </p>
-
-                                        <button class="w-14 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-blue-500 hover:border-blue-600 hover:bg-blue-500 hover:text-white shadow-md py-2 px-2 inline-flex items-center">
-                                        <span class="mx-auto"><a href="/view/<%- compactData[i]["Symbol"] %>">VIEW</a></span>
-                                      </button>
-
-                                        <button class="w-32 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-green-400 hover:border-green-400 hover:bg-green-400 hover:text-white shadow-md py-2 px-2 inline-flex items-center">
-                                        <span class="mx-auto"><a href="/cart/<%- compactData[i]["Symbol"] %>">BUY</a></span>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    </div>
-
-                    <% } %>
 
-            </div>
-
-
-
-            <!-- genral stocks section -->
-            <div class="px-auto">
-                <div class="my-4 absolute-center pt-20">
-                    <h2 class="text-gray-700 lg:text-6xl text-5xl font-semibold leading-none tracking-wider px-5">Trending Stocks</h2>
-                </div>
+        <% } %>
+      </div>
+
+      <!-- genral stocks section -->
+      <div class="px-auto">
+        <div class="my-4 absolute-center pt-20">
+          <h2
+            class="text-gray-700 lg:text-6xl text-5xl font-semibold leading-none tracking-wider px-5"
+          >
+            Trending Stocks
+          </h2>
+        </div>
 
-                <div class="md:flex -m-4 inline-block mx-auto w-full flex-wrap pt-10">
-                    <% for(var i=min; i < max; i++) { %>
-
-                        <div class="lg:w-1/4 md:w-1/2 p-4 w-54 flex justify-center">
-                                    <div class="flex items-center justify-center py-6 min-h-full w-full rounded overflow-hidden shadow-lg hover:bg-white transition duration-500 bg-white ">
-                                        <div class="space-y-10 w-full">
-                                            <div class="py-2 px-4 md:px-10">
-                                                <div class="space-y-5">
-                                                    <div class="font-bold text-2xl text-center mb-2">
-                                                        <%- totalData[i]["Symbol"] %>
-                                                    </div>
-                                                    <p class="text-gray-700 text-center text-base">
-                                                        <%- totalData[i]["Company Name"] %>
-                                                    </p>
-<div class="flex justify-around px-6 md:px-2 w-2/3 mx-auto">
-                                                    <button class="mr-1 w-14 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-blue-500 hover:border-blue-600 hover:bg-blue-500 hover:text-white shadow-md py-2 px-2 inline-flex items-center">
-                                                    <span class="mx-auto"><a href="/view/<%- totalData[i]["Symbol"] %>">VIEW</a></span>
-                                                  </button>
-
-                                        <button class="w-24 pl-2 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-green-400 hover:border-green-400 hover:bg-green-400 hover:text-white shadow-md py-2 px-2 inline-flex items-center">
-                                                    <span class="mx-auto"><a href="/cart/<%- totalData[i]["Symbol"] %>">BUY</a></span>
-                                        </button>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
+        <div class="md:flex -m-4 inline-block mx-auto w-full flex-wrap pt-10">
+          <% for(var i=min; i < max; i++) { %>
+
+          <div class="lg:w-1/4 md:w-1/2 p-4 w-54 flex justify-center">
+            <div
+              class="flex items-center justify-center py-6 min-h-full w-full rounded overflow-hidden shadow-lg hover:bg-white transition duration-500 bg-white"
+            >
+              <div class="space-y-10 w-full">
+                <div class="py-2 px-4 md:px-10">
+                  <div class="space-y-5">
+                    <div class="font-bold text-2xl text-center mb-2">
+                      <%- totalData[i]["Symbol"] %>
                     </div>
-
-
+                    <p class="text-gray-700 break-words text-center text-base">
+                      <%- totalData[i]["Company Name"] %>
+                    </p>
+                    <div class="flex justify-around px-6 md:px-2 w-2/3 mx-auto">
+                      <button
+                        class="w-20 mx-2 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-blue-500 hover:border-blue-600 hover:bg-blue-500 hover:text-white shadow-md py-2 px-2 inline-flex items-center"
+                      >
+                        <span class="mx-auto"><a href="/view/<%- totalData[i]["Symbol"] %>">VIEW</a></span>
+                      </button>
+
+                      <button
+                        class="w-32 mx-2 bg-white tracking-wide text-gray-700 font-bold rounded border-b-2 border-green-400 hover:border-green-400 hover:bg-green-400 hover:text-white shadow-md py-2 px-2 inline-flex items-center"
+                      >
+                        <span class="mx-auto"><a href="/cart/<%- totalData[i]["Symbol"] %>">BUY</a></span>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
             </div>
+          </div>
 
-
-            <% } %>
+          <% } %>
         </div>
 
-
         <!-- pagination element -->
         <div class="pt-10">
-            <div class="flex justify-between">
-                <button id="prev" class="prev border border-teal-500 text-teal-500 block rounded-sm font-bold py-4 px-6 mr-2 flex items-center hover:bg-teal-500 hover:text-white">
-                <svg class="h-5 w-5 mr-2 fill-current" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-49 141 512 512" style="enable-background:new -49 141 512 512;" xml:space="preserve">
-                    <path id="XMLID_10_" d="M438,372H36.355l72.822-72.822c9.763-9.763,9.763-25.592,0-35.355c-9.763-9.764-25.593-9.762-35.355,0 l-115.5,115.5C-46.366,384.01-49,390.369-49,397s2.634,12.989,7.322,17.678l115.5,115.5c9.763,9.762,25.593,9.763,35.355,0 c9.763-9.763,9.763-25.592,0-35.355L36.355,422H438c13.808,0,25-11.193,25-25S451.808,372,438,372z"></path>
-                </svg>
-                Previous page
+          <div class="flex justify-between">
+            <button
+              id="prev"
+              class="prev border border-teal-500 text-teal-500 block rounded-sm font-bold py-4 px-6 mr-2 flex items-center hover:bg-teal-500 hover:text-white"
+            >
+              <svg
+                class="h-5 w-5 mr-2 fill-current"
+                version="1.1"
+                id="Layer_1"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+                x="0px"
+                y="0px"
+                viewBox="-49 141 512 512"
+                style="enable-background: new -49 141 512 512"
+                xml:space="preserve"
+              >
+                <path
+                  id="XMLID_10_"
+                  d="M438,372H36.355l72.822-72.822c9.763-9.763,9.763-25.592,0-35.355c-9.763-9.764-25.593-9.762-35.355,0 l-115.5,115.5C-46.366,384.01-49,390.369-49,397s2.634,12.989,7.322,17.678l115.5,115.5c9.763,9.762,25.593,9.763,35.355,0 c9.763-9.763,9.763-25.592,0-35.355L36.355,422H438c13.808,0,25-11.193,25-25S451.808,372,438,372z"
+                ></path>
+              </svg>
+              Previous page
             </button>
-                <button id="next" class="next border border-teal-500 bg-teal-500 text-white block rounded-sm font-bold py-4 px-6 ml-2 flex items-center">
-                Next page
-                <svg class="h-5 w-5 ml-2 fill-current" clasversion="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-                     viewBox="-49 141 512 512" style="enable-background:new -49 141 512 512;" xml:space="preserve">
-                <path id="XMLID_11_" d="M-24,422h401.645l-72.822,72.822c-9.763,9.763-9.763,25.592,0,35.355c9.763,9.764,25.593,9.762,35.355,0
+            <button
+              id="next"
+              class="next border border-teal-500 bg-teal-500 text-white block rounded-sm font-bold py-4 px-6 ml-2 flex items-center"
+            >
+              Next page
+              <svg
+                class="h-5 w-5 ml-2 fill-current"
+                clasversion="1.1"
+                id="Layer_1"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+                x="0px"
+                y="0px"
+                viewBox="-49 141 512 512"
+                style="enable-background: new -49 141 512 512"
+                xml:space="preserve"
+              >
+                <path
+                  id="XMLID_11_"
+                  d="M-24,422h401.645l-72.822,72.822c-9.763,9.763-9.763,25.592,0,35.355c9.763,9.764,25.593,9.762,35.355,0
                     l115.5-115.5C460.366,409.989,463,403.63,463,397s-2.634-12.989-7.322-17.678l-115.5-115.5c-9.763-9.762-25.593-9.763-35.355,0
-                    c-9.763,9.763-9.763,25.592,0,35.355l72.822,72.822H-24c-13.808,0-25,11.193-25,25S-37.808,422-24,422z"/>
-                </svg>
+                    c-9.763,9.763-9.763,25.592,0,35.355l72.822,72.822H-24c-13.808,0-25,11.193-25,25S-37.808,422-24,422z"
+                />
+              </svg>
             </button>
-            </div>
+          </div>
         </div>
+      </div>
     </div>
-    </div>
-    </div>
-
+  </div>
 </section>
 <script>
-    var prev = document.getElementById("prev").addEventListener("click", prevPage);
-    var next = document.getElementById("next").addEventListener("click", nextPage);
-
-    function prevPage() {
-        var url = window.location.href;
-        var pageNo = url.slice(url.length - 1, url.length);
-        var pageUrl = url.slice(0, url.length - 1);
-
-        if (pageNo == "t") {
-
-        } else if (pageNo == "/") {
-
-        } else {
-            window.location.href = pageUrl + (parseInt(pageNo) - 1);
-        }
+  var prev = document
+    .getElementById("prev")
+    .addEventListener("click", prevPage);
+  var next = document
+    .getElementById("next")
+    .addEventListener("click", nextPage);
+
+  function prevPage() {
+    var url = window.location.href;
+    var pageNo = url.slice(url.length - 1, url.length);
+    var pageUrl = url.slice(0, url.length - 1);
+
+    if (pageNo == "t") {
+    } else if (pageNo == "/") {
+    } else {
+      window.location.href = pageUrl + (parseInt(pageNo) - 1);
     }
-
-    function nextPage() {
-
-        if (window.location.pathname !== "/market/39") {
-            var url = window.location.href;
-            var pageNo = url.slice(url.length - 1, url.length) || 0;
-            var pageUrl = url.slice(0, url.length - 1);
-
-            if (pageNo == "t") {
-                window.location.href = window.location.href + "/2"
-            } else if (pageNo == "/") {
-                window.location.href = window.location.href + "2"
-            } else {
-                window.location.href = pageUrl + (parseInt(pageNo) + 1);
-            }
-        }
+  }
+
+  function nextPage() {
+    if (window.location.pathname !== "/market/59") {
+      var url = window.location.href;
+      var pageNo = url.slice(url.length - 1, url.length) || 0;
+      var pageUrl = url.slice(0, url.length - 1);
+
+      if (pageNo == "t") {
+        window.location.href = window.location.href + "/2";
+      } else if (pageNo == "/") {
+        window.location.href = window.location.href + "2";
+      } else {
+        window.location.href = pageUrl + (parseInt(pageNo) + 1);
+      }
     }
+  }
 </script>
 
 <!-- script for search bar -->
 
 <script>
-    const inputField = document.getElementById('searchbar')
-    inputField.addEventListener('input', (event) => {
-        console.log(event.target.value)
-        const value = event.target.value
-            //sample data
-        const dataset = <%- JSON.stringify(totalData) %>;
-
-        // searching the symbol
-
-        let data = dataset.filter(function(el) {
-            return el.Symbol.includes(value.toUpperCase())
-        })
-
-        // when no symbol matched
-
-        if (data.length === 0) {
-
-            let data1 = dataset.filter(function(el) {
-                return (el["Company Name"].toLowerCase().includes(value.toLowerCase()))
-            })
-            data = data1;
-        }
-
-        let list = "";
-        if (value === "") {
-            list = "";
-            data = [];
-        }
-
-        let n = data.length
-
-        for (i = 0; i <= (n - 1); i++) {
-            let item = data[i];
-            list += `<li><a href='/view/${item.Symbol}'>${item.Symbol}</a></li>`
-        }
-        document.getElementById('search-result').innerHTML = list;
-
-        console.log(data)
-    })
-</script>
\ No newline at end of file
+  const inputField = document.getElementById('searchbar')
+  inputField.addEventListener('input', (event) => {
+      console.log(event.target.value)
+      const value = event.target.value
+          //sample data
+      const dataset = <%- JSON.stringify(totalData) %>;
+
+      // searching the symbol
+
+      let data = dataset.filter(function(el) {
+          return el.Symbol.includes(value.toUpperCase())
+      })
+
+      // when no symbol matched
+
+      if (data.length === 0) {
+
+          let data1 = dataset.filter(function(el) {
+              return (el["Company Name"].toLowerCase().includes(value.toLowerCase()))
+          })
+          data = data1;
+      }
+
+      let list = "";
+      if (value === "") {
+          list = "";
+          data = [];
+      }
+
+      let n = data.length
+
+      for (i = 0; i <= (n - 1); i++) {
+          let item = data[i];
+          list += `<li><a href='/view/${item.Symbol}'>${item.Symbol}</a></li>`
+      }
+      document.getElementById('search-result').innerHTML = list;
+
+      console.log(data)
+  })
+</script>
diff --git a/views/partials/_nav.ejs b/views/partials/_nav.ejs
index bf7be0c..c569168 100644
--- a/views/partials/_nav.ejs
+++ b/views/partials/_nav.ejs
@@ -15,7 +15,6 @@
       <img
         class="h-8 w-8 tradebyte-logo"
         src="../images/TradeByte-Favicon.png"
-        alt="Logo"
       />
     </div>
     <h4 class="font-bold text-center pt-1">
@@ -55,7 +54,7 @@
     <div class="flex justify-center align-center rounded-full">
       <div class="notification">
         <img
-          class="h-16 w-16 border-8 user-profile box-1 rounded-full"
+          class="w-24 border-8 user-profile box-1 rounded-full"
           src="<%= user.image %>"
           alt=""
         />
@@ -82,16 +81,16 @@
     </div>
 
     <a
-      class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background"
+      class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center items-center text-sm rounded-full text-green-900 font-bold tick-background"
       href="#"
     >
       <div class="tick mr-1">
         <svg
-          class="w-5 mr-1"
+          class="w-5"
           fill="none"
           stroke-linecap="round"
           stroke-linejoin="round"
-          stroke-width="2"
+          stroke-width="3"
           viewBox="0 0 24 24"
           stroke="currentColor"
         >
diff --git a/views/portfolio.ejs b/views/portfolio.ejs
index a5069d0..33f6769 100644
--- a/views/portfolio.ejs
+++ b/views/portfolio.ejs
@@ -1,11 +1,13 @@
 <main class="md:col-span-4 md:ml-56 lg:ml-64 md:pr-14 w-full">
-    <div class="container px-5 py-10 mx-auto md:px-auto">
-        <!-- <div class="absolute-center mx-auto"> -->
+  <div class="container px-5 py-10 mx-auto md:px-auto">
+    <!-- <div class="absolute-center mx-auto"> -->
 
-        <!-- header -->
+    <!-- header -->
 
-        <header class="my-4 absolute-center">
-            <span class="text-gray-700 text-3xl font-semibold leading-none tracking-wider">Hello,</span
+    <header class="my-4 absolute-center">
+      <span
+        class="text-gray-700 text-3xl font-semibold leading-none tracking-wider"
+        >Hello,</span
       >
       <h2 class="text-gray-800 text-5xl leading-none tracking-wider view-link">
         <%= user.displayName%>.
@@ -17,12 +19,12 @@
     <!-- search box -->
 
     <div>
-      <div class="relative text-gray-600 mt-12 shadow-md rounded-b-lg">
+      <div class="bg-white relative text-gray-800 mt-12 shadow-md rounded-lg">
         <input
           id="searchbar"
           type="search"
           name="serch"
-          placeholder="Search Stocks by Symbols"
+          placeholder="Search Stocks"
           class="bg-transparent h-10 px-5 pl-10 rounded-full text-lg focus:outline-none"
         />
         <button type="submit" class="absolute left-0 top-0 mt-3 ml-4">
@@ -35,7 +37,7 @@
             x="0px"
             y="0px"
             viewBox="0 0 56.966 56.966"
-            style="enable-background: new 0 0 56.966 56.966;"
+            style="enable-background: new 0 0 56.966 56.966"
             xml:space="preserve"
             width="512px"
             height="512px"
@@ -49,11 +51,11 @@
 
       <ul
         id="search-result"
-        style="height: 0px; overflow: hidden; white-space: pre;"
+        style="height: 0px; overflow: hidden; white-space: pre"
         class="text-lg p-5 ml-10 list-none mt-0 text-gray-700"
       ></ul>
 
-      <div class="mt-8 grid lg:grid-cols-3 gap-10">
+      <div class="mt-4 grid lg:grid-cols-3 gap-10">
         <!-- cards go here -->
 
         <!-- card1 -->
@@ -65,41 +67,39 @@
             <img class="w-full h-full" src="images/graph.jpeg" alt=" " />
           </div>
           <div class="font-bold text-xl xl:text-2xl ml-3">
-            <p class="text-gray-900 whitespace-no-wrap">
-              $40,342.04
-            </p>
+            <p class="text-gray-900 whitespace-no-wrap">$40,342.04</p>
             <span class="block text-gray-500 text-sm">Total Portfolio</span>
-    </div>
-    </div>
+          </div>
+        </div>
 
-    <!-- card 2 -->
+        <!-- card 2 -->
 
-    <div class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl">
-        <div class="flex-shrink-0 w-10 h-10">
+        <div
+          class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl"
+        >
+          <div class="flex-shrink-0 w-10 h-10">
             <img class="w-full h-full" src="images/graph.jpeg " alt=" " />
-        </div>
-        <div class="font-bold text-xl xl:text-2xl ml-3 justify-center">
-            <p class="text-gray-900 whitespace-no-wrap">
-                $ 40,342.04
-            </p>
+          </div>
+          <div class="font-bold text-xl xl:text-2xl ml-3 justify-center">
+            <p class="text-gray-900 whitespace-no-wrap">$ 40,342.04</p>
             <span class="block text-gray-500 text-sm">Profit / Loss</span>
+          </div>
         </div>
-    </div>
 
-    <!-- card 3 -->
+        <!-- card 3 -->
 
-    <div class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl">
-        <div class="flex-shrink-0 w-10 h-10">
+        <div
+          class="card rounded-xl flex items-center h-20 sm:h-20 w-full object-cover px-5 shadow-2xl"
+        >
+          <div class="flex-shrink-0 w-10 h-10">
             <img class="w-full h-full" src="images/graph.jpeg " alt=" " />
-        </div>
-        <div class="font-bold text-xl xl:text-2xl ml-3">
-            <p class="text-gray-900 whitespace-no-wrap">
-                $40,342.04
-            </p>
+          </div>
+          <div class="font-bold text-xl xl:text-2xl ml-3">
+            <p class="text-gray-900 whitespace-no-wrap">$40,342.04</p>
             <span class="block text-gray-500 text-sm">$ Balance</span>
+          </div>
         </div>
-    </div>
-    </div>
+      </div>
     </div>
 
     <!-- overview heading -->
@@ -111,13 +111,14 @@
     <!-- container for both tables -->
 
     <div class="lg:grid lg:grid-cols-2 -mx-8">
-        <!-- table component 1 -->
+      <!-- table component 1 -->
 
-        <div class="px-3 sm:px-6 py-4 overflow-hidden h-auto w-full">
-            <div class="flex justify-between">
-                <!-- heading of table -->
-                <h2 class="text-lg font-bold leading-tight py-3">Trade History</h2>
-                <a href="#" class="mt-3 font-bold text-tempc-400">View All <span class="font-extrabold">></span></a
+      <div class="px-3 sm:px-6 py-4 overflow-hidden h-auto w-full">
+        <div class="flex justify-between">
+          <!-- heading of table -->
+          <h2 class="text-lg font-bold leading-tight py-3">Trade History</h2>
+          <a href="#" class="mt-3 font-bold text-tempc-400"
+            >View All <span class="font-extrabold">></span></a
           >
         </div>
 
@@ -162,14 +163,10 @@
             <tbody>
               <tr class="bg-white">
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-600 whitespace-no-wrap">
-                    Jan 21, 2020
-                  </p>
+                  <p class="text-gray-600 whitespace-no-wrap">Jan 21, 2020</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-900 whitespace-no-wrap">
-                    Gdax
-                  </p>
+                  <p class="text-gray-900 whitespace-no-wrap">Gdax</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
                   <p class="text-gray-900 whitespace-no-wrap uppercase">
@@ -195,14 +192,10 @@
               </tr>
               <tr class="bg-gray-100">
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-600 whitespace-no-wrap">
-                    Jan 8, 2020
-                  </p>
+                  <p class="text-gray-600 whitespace-no-wrap">Jan 8, 2020</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-900 whitespace-no-wrap">
-                    Bitterx
-                  </p>
+                  <p class="text-gray-900 whitespace-no-wrap">Bitterx</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
                   <p class="text-gray-900 whitespace-no-wrap uppercase">
@@ -230,14 +223,10 @@
               </tr>
               <tr class="bg-white">
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-600 whitespace-no-wrap">
-                    Jan 21, 2020
-                  </p>
+                  <p class="text-gray-600 whitespace-no-wrap">Jan 21, 2020</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-900 whitespace-no-wrap">
-                    Gdax
-                  </p>
+                  <p class="text-gray-900 whitespace-no-wrap">Gdax</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
                   <p class="text-gray-900 whitespace-no-wrap uppercase">
@@ -264,14 +253,10 @@
               </tr>
               <tr class="bg-gray-100">
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-600 whitespace-no-wrap">
-                    Jan 8, 2020
-                  </p>
+                  <p class="text-gray-600 whitespace-no-wrap">Jan 8, 2020</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-900 whitespace-no-wrap">
-                    Bitterx
-                  </p>
+                  <p class="text-gray-900 whitespace-no-wrap">Bitterx</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
                   <p class="text-gray-900 whitespace-no-wrap uppercase">
@@ -299,14 +284,10 @@
               </tr>
               <tr class="bg-white">
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-600 whitespace-no-wrap">
-                    Jan 21, 2020
-                  </p>
+                  <p class="text-gray-600 whitespace-no-wrap">Jan 21, 2020</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-900 whitespace-no-wrap">
-                    Gdax
-                  </p>
+                  <p class="text-gray-900 whitespace-no-wrap">Gdax</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
                   <p class="text-gray-900 whitespace-no-wrap uppercase">
@@ -334,14 +315,10 @@
               </tr>
               <tr class="bg-gray-100">
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-600 whitespace-no-wrap">
-                    Jan 8, 2020
-                  </p>
+                  <p class="text-gray-600 whitespace-no-wrap">Jan 8, 2020</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
-                  <p class="text-gray-900 whitespace-no-wrap">
-                    Bitterx
-                  </p>
+                  <p class="text-gray-900 whitespace-no-wrap">Bitterx</p>
                 </td>
                 <td class="px-3 py-3 border-b border-gray-200 text-sm">
                   <p class="text-gray-900 whitespace-no-wrap uppercase">
@@ -528,36 +505,36 @@
 <!-- script for search bar -->
 
 <script>
-  const inputField = document.getElementById('searchbar')
-  inputField.addEventListener('input', (event) => {
-      console.log(event.target.value)
-      const value = event.target.value
-          //sample data
-      const dataset = <%- JSON.stringify(totalData) %>;
-
-// when symbol matches
-
-      let data = dataset.filter(function(el) {
-          return el.Symbol.includes(value.toUpperCase())
-      })
-
-// when no symbol matches
-
-      if (data.length === 0) {
-
-let data1 = dataset.filter(function(el) {
-    return (el["Company Name"].toLowerCase().includes(value.toLowerCase()))
-})
-data = data1;
-}
-
-      let list = "";
-      if (value === "") {
-          list = "";
-          data = [];
-      }
-      let n = data.length
-      for (i = 0; i <= (n - 1); i++) {
-          let item = data[i];
-          list += `<li><a href='/view/${item.Symbol}'>${item.Symbol}</a></li>` } document.getElementById('search-result').innerHTML = list ;console.log(data) })
-                </script>
\ No newline at end of file
+    const inputField = document.getElementById('searchbar')
+    inputField.addEventListener('input', (event) => {
+        console.log(event.target.value)
+        const value = event.target.value
+            //sample data
+        const dataset = <%- JSON.stringify(totalData) %>;
+
+  // when symbol matches
+
+        let data = dataset.filter(function(el) {
+            return el.Symbol.includes(value.toUpperCase())
+        })
+
+  // when no symbol matches
+
+        if (data.length === 0) {
+
+  let data1 = dataset.filter(function(el) {
+      return (el["Company Name"].toLowerCase().includes(value.toLowerCase()))
+  })
+  data = data1;
+  }
+
+        let list = "";
+        if (value === "") {
+            list = "";
+            data = [];
+        }
+        let n = data.length
+        for (i = 0; i <= (n - 1); i++) {
+            let item = data[i];
+            list += `<li><a href='/view/${item.Symbol}'>${item.Symbol}</a></li>` } document.getElementById('search-result').innerHTML = list ;console.log(data) })
+</script>