diff --git a/views/partials/_nav.ejs b/views/partials/_nav.ejs
index eca4906..6634258 100644
--- a/views/partials/_nav.ejs
+++ b/views/partials/_nav.ejs
@@ -8,15 +8,13 @@
             <!-- tarde byte heading -->
 
             <h1 class="font-bold uppercase p-4 border-b border-gray-100">
-                <a href="/"
-                    class="hover:text-gray-900 tracking-widest border-b-2 border-grey-100 text-3xl pb-2 pt-32">Tradebyte</a>
+                <a href="/" class="hover:text-gray-900 tracking-widest border-b-2 border-grey-100 text-3xl pb-2 pt-32">Tradebyte</a>
             </h1>
 
             <!-- burger icon for nav bar -->
 
             <div class="px-4 cursor-pointer md:hidden" id="burger">
-                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                    stroke="currentColor" viewBox="0 0 24 24">
+                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" stroke="currentColor" viewBox="0 0 24 24">
                     <path d="M4 6h16M4 12h16M4 18h16"></path>
                 </svg>
             </div>
@@ -42,8 +40,7 @@
                     <!-- trading status -->
 
                     <li class="pb-8 pt-4 py-1">
-                        <a href="# "
-                            class="block px-4 flex justify-center bg-green-200 rounded-full text-green-900 text-xl font-bold ml-2"><svg
+                        <a href="# " class="block px-4 flex justify-center bg-green-200 rounded-full text-green-900 text-xl font-bold ml-2"><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="M5 13l4 4L19 7"></path>
@@ -54,10 +51,8 @@
 
 
                     <li class="py-1 ">
-                        <a href="# "
-                            class="block px-4 flex justify-start border-l-4 border-tempc-400 text-xl font-bold ">
-                            <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 href="# " class="block px-4 flex justify-start border-l-4 border-tempc-400 text-xl font-bold ">
+                            <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 ">
@@ -71,8 +66,7 @@
 
                     <li class="py-1 ">
                         <a href="# " class="block px-4 flex justify-start border-l-4 border-white text-xl font-bold ">
-                            <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 ">
+                            <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>
                             <span>Market</span>
@@ -96,8 +90,7 @@
 
             <!-- log out button -->
 
-            <div
-                class="flex justify-center block px-4 ml-8 mr-12 flex bg-gray-200 rounded-md mt-4 text-tempc-400 text-2xl font-bold ml-2 align-bottom">
+            <div class="flex justify-center block px-4 ml-8 mr-12 flex bg-gray-200 rounded-md mt-4 text-tempc-400 text-2xl font-bold ml-2 align-bottom">
                 <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"
diff --git a/views/portfolio.ejs b/views/portfolio.ejs
index dc89b40..ac04aa6 100644
--- a/views/portfolio.ejs
+++ b/views/portfolio.ejs
@@ -1,7 +1,518 @@
-<h3>**Portfolio/Dashboard**</h3>
+<main class="relative px-16 py-6 md:col-span-4 bg-gray-300 ">
 
-<br />
+    <!-- header -->
 
-<a href="/auth/logout" class="" style="margin-top: 5px;">
-  <i class=""></i> Logout
-</a>
+    <header class="mt-4 absolute-center">
+        <h2 class="text-gray-700 text-6xl font-semibold leading-none tracking-wider">TradeByte</h2>
+    </header>
+
+    <!-- search box -->
+
+    <div>
+        <div class="relative text-gray-600 mt-12 shadow-md rounded-b-lg">
+            <input type="search" name="serch" placeholder="        Search Stocks" class="bg-transparent h-10 px-5 pr-10 rounded-full text-sm 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>
+
+        <div class="mt-8 grid lg:grid-cols-3 gap-10 ">
+
+
+            <!-- cards go here -->
+
+            <!-- card1 -->
+
+            <div class="card rounded-full 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="img/graph.jpeg " alt=" " />
+                </div>
+                <div class="font-bold text-2xl ml-3 ">
+                    <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>
+
+            <!-- card 2 -->
+
+            <div class="card rounded-full 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="img/graph.jpeg " alt=" " />
+                </div>
+                <div class="font-bold text-2xl ml-3 ">
+                    <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>
+
+            <!-- card 3 -->
+
+            <div class="card rounded-full 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="img/graph.jpeg " alt=" " />
+                </div>
+                <div class="font-bold text-2xl ml-3 ">
+                    <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>
+
+
+    <!-- overview heading -->
+
+    <h2 class="text-2xl font-bold leading-tight py-6 mt-6 ">Overview</h2>
+    <!-- graph card -->
+    <div class="card h-64 w-auto mb-10 shadow-2xl">
+
+    </div>
+
+
+    <!-- container for both tables -->
+
+
+    <div class="lg:grid lg:grid-cols-2 -mx-8">
+
+        <!-- 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-2xl font-bold leading-tight py-6 ">Trade History</h2>
+                <a href="#" class="mt-6 mr-6 font-bold text-tempc-400 ">View All <span class="font-extrabold">></span></a>
+
+            </div>
+
+            <!-- start of table -->
+
+            <div class="inline-block min-w-0 shadow-lg rounded-lg overflow-hidden ">
+                <table class="min-w-0 leading-normal ">
+                    <thead>
+                        <tr>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                date
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                platform
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                fair
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                action
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                amount
+                            </th>
+                        </tr>
+                    </thead>
+
+                    <!-- table body -->
+
+                    <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>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">btc/usd</p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <span class="relative inline-block px-3 py-1 font-semibold text-white leading-tight ">
+                          <span aria-hidden
+                              class="absolute inset-0 bg-tempc-500 rounded-full "></span>
+                                <span class="relative ">Sell</span>
+                                </span>
+                            </td>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap uppercase "><span class="text-tempc-500 ">+</span>0.230046</p>
+                            </td>
+                        </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>
+                            </td>
+                            <td class="px-5 py-5 border-b border-gray-200 text-sm ">
+                                <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 ">btc/usd</p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <span class="relative inline-block px-3 py-1 font-semibold text-white leading-tight ">
+                            <span aria-hidden class="absolute inset-0 bg-tempc-400 rounded-full "></span>
+                                <span class="relative ">Buy</span>
+                                </span>
+                            </td>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap uppercase "><span class="text-tempc-400 ">-</span>0.230046</p>
+                            </td>
+                        </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>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">btc/usd</p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <span class="relative inline-block px-3 py-1 font-semibold text-white leading-tight ">
+                            <span aria-hidden
+                            class="absolute inset-0 bg-tempc-500 rounded-full "></span>
+                                <span class="relative ">Sell</span>
+                                </span>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap uppercase "><span class="text-tempc-500 ">+</span>0.230046</p>
+                            </td>
+                        </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>
+                            </td>
+                            <td class="px-5 py-5 border-b border-gray-200 text-sm ">
+                                <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 ">btc/usd</p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <span class="relative inline-block px-3 py-1 font-semibold text-white leading-tight ">
+                        <span aria-hidden
+                        class="absolute inset-0 bg-tempc-400 rounded-full "></span>
+                                <span class="relative ">Buy</span>
+                                </span>
+                            </td>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap uppercase "><span class="text-tempc-400 ">-</span>0.230046</p>
+                            </td>
+                        </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>
+                            </td>
+                            <td class="px-5 py-5 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap ">
+                                    Gdax
+                                </p>
+                            </td>
+                            <td class="px-5 py-5 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap uppercase ">btc/usd</p>
+                            </td>
+
+                            <td class="px-5 py-5 border-b border-gray-200 text-sm ">
+                                <span class="relative inline-block px-3 py-1 font-semibold text-white leading-tight ">
+                            <span aria-hidden
+                            class="absolute inset-0 bg-tempc-500 rounded-full "></span>
+                                <span class="relative ">Sell</span>
+                                </span>
+                            </td>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap uppercase "><span class="text-tempc-500 ">+</span>0.230046</p>
+                            </td>
+                        </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>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">btc/usd</p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <span class="relative inline-block px-3 py-1 font-semibold text-white leading-tight ">
+                            <span aria-hidden
+                            class="absolute inset-0 bg-tempc-400 rounded-full "></span>
+                                <span class="relative ">Buy</span>
+                                </span>
+                            </td>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap uppercase "><span class="text-tempc-400 ">-</span>0.230046</p>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+
+
+        <!-- table component 2 -->
+
+
+        <div class="px-3 sm:px-8 py-4 overflow-hidden h-auto w-full ">
+
+            <!-- table name stocks status -->
+
+            <div class="flex justify-between">
+                <h2 class="text-2xl font-bold leading-tight py-6 ">Stock Status</h2>
+                <a href="#" class="mt-6 mr-6 font-bold text-tempc-400 ">View All <span class="font-extrabold">></span></a>
+            </div>
+
+            <!-- table start -->
+
+            <div class="inline-block min-w-0 shadow-lg rounded-lg overflow-hidden ">
+                <table class="min-w-0 leading-normal ">
+
+                    <!-- table head -->
+
+                    <thead>
+                        <tr>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                name
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                amount
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                current
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                status
+                            </th>
+                            <th class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider ">
+                                sell
+                            </th>
+                        </tr>
+                    </thead>
+
+                    <!-- table body -->
+
+                    <tbody>
+                        <tr class="bg-white">
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">
+                                    $11111
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="block px-4 flex">
+                                    <span>0.2334</span>
+                                    <svg class="w-6 h-4 text-tempc-400" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M8 7l4-4m0 0l4 4m-4-4v18"></path></svg>
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-tempc-400 whitespace-no-wrap ">
+                                    +639
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm text-tempc-400">
+                                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
+
+                            </td>
+                        </tr>
+                        <tr class="bg-gray-100">
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap ">
+                                    Gdax1
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-gray-900 whitespace-no-wrap ">
+                                    $11112
+                                </p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="block px-4 flex">
+                                    <span>0.2334</span>
+                                    <svg class="w-6 h-4 text-tempc-200" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M16 17l-4 4m0 0l-4-4m4 4V3"></path></svg>
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-tempc-200 whitespace-no-wrap ">
+                                    -639
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm text-tempc-400">
+                                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
+
+                            </td>
+                        </tr>
+                        <tr class="bg-white">
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">
+                                    $11111
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="block px-4 flex">
+                                    <span>0.2334</span>
+                                    <svg class="w-6 h-4 text-tempc-400" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M8 7l4-4m0 0l4 4m-4-4v18"></path></svg>
+                                </p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-tempc-400 whitespace-no-wrap ">
+                                    +639
+                                </p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm text-tempc-400">
+                                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
+
+                            </td>
+                        </tr>
+                        <tr class="bg-gray-100">
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">
+                                    $11111
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="block px-4 flex">
+                                    <span>0.2334</span>
+                                    <svg class="w-6 h-4 text-tempc-200" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M16 17l-4 4m0 0l-4-4m4 4V3"></path></svg>
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-tempc-200 whitespace-no-wrap ">
+                                    -119
+                                </p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm text-tempc-400">
+                                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
+
+                            </td>
+                        </tr>
+                        <tr class="bg-white">
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">
+                                    $11111
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="block px-4 flex">
+                                    <span>0.2334</span>
+                                    <svg class="w-6 h-4 text-tempc-400" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M8 7l4-4m0 0l4 4m-4-4v18"></path></svg>
+                                </p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-tempc-400 whitespace-no-wrap ">
+                                    +639
+                                </p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm text-tempc-400">
+                                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
+
+                            </td>
+                        </tr>
+                        <tr class="bg-gray-100">
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <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 ">
+                                    $11111
+                                </p>
+                            </td>
+
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="block px-4 flex">
+                                    <span>0.2334</span>
+                                    <svg class="w-6 h-4 text-tempc-200" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M16 17l-4 4m0 0l-4-4m4 4V3"></path></svg>
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm ">
+                                <p class="text-tempc-200 whitespace-no-wrap ">
+                                    -339
+                                </p>
+                            </td>
+                            <td class="px-3 py-3 border-b border-gray-200 text-sm text-tempc-400 pr-4">
+                                <svg class="w-6 h-6" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor"><path d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
+
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+
+            </div>
+        </div>
+
+    </div>
+    <!-- end of tables -->
+
+
+    <!-- lode more -->
+    <div class="mt-12 flex justify-center ">
+        <div class="btn bg-secondary-100 text-secondary-200 inline-block hover:shadow-inner transform hover:scale-125 hover:bg-opacity-50 transition ease-out duration-300 ">Load more</div>
+    </div>
+</main>
\ No newline at end of file