diff --git a/website/pages/payments.html b/website/pages/payments.html
index 8cdb04c..9bb8a12 100644
--- a/website/pages/payments.html
+++ b/website/pages/payments.html
@@ -1,62 +1,80 @@
 <style>
-    #bottomNotes {
-        display: block;
-        padding-left: 18px;
-        padding-right: 18px;
-        padding-bottom: 18px;
-    }
-    #topPool {
-        padding-top: 18px;
-        padding-left: 18px;
-        padding-right: 18px;
-    }
-    #topPool > div > div > svg {
-        display: block;
-        height: 280px;
-    }
-    .poolWrapper {
-        border: solid 1px #c7c7c7;
-        border-radius: 5px;
-        padding: 5px;
-        margin-bottom: 18px;
-    }
-    .poolLabel {
-        font-size: 1.2em;
-        text-align: center;
-        padding: 4px;
-    }
-    .poolMinerTable {
+.container {
+  margin: 0 auto;
+  max-width: 1280px;
+  width: 90%;
+}
+@media only screen and (min-width: 601px)
+  .container {
+    width: 85%;
+}
+@media only screen and (min-width: 993px)
+  .container {
+    width: 80%;
+}
 
-    }
     table {
         width: 100%;
     }
 </style>
+<script type="text/javascript">
+  $(function () {
+    $(document).tooltip({
+        content: function () {
+            return $(this).prop('title');
+        },
+        show: null, 
+        close: function (event, ui) {
+            ui.tooltip.hover(
 
+            function () {
+                $(this).stop(true).fadeTo(400, 1);
+            },
+
+            function () {
+                $(this).fadeOut("400", function () {
+                    $(this).remove();
+                })
+            });
+        }
+    });
+});
+</script>
+
+{{ function readableDate(a){ return new Date(parseInt(a)).toString(); } }}
 {{ for(var pool in it.stats.pools) { }}
-<table>
-    <thead>
-    <tr>
-        <th>Blocks</th>
-        <th>Time</th>
-        <th>Miners</th>
-        <th>Shares</th>
-        <th>Amount</th>
-    </tr>
-    </thead>
+
+<div class="container">
+  <div class="row">
+    <div class="col s12">
+      <div class="card grey lighten-5">
+        <div class="card-content black-text center">
+    <table class="table bordered highlight">
+      <thead>
+      <tr>
+          <th>Block</th>
+          <th>Time</th>
+          <th>Miners</th>
+          <th>Shares</th>
+          <th>Amount</th>
+      </tr>
+      </thead>
       {{ for(var p in it.stats.pools[pool].payments) { }}
       <tr>
           <td>
+          {{if (String(it.stats.pools[pool].name).startsWith("zcash")) { }}
+          <a href="https://explorer.zcha.in/tx/{{=it.stats.pools[pool].payments[p].txid}}"  title="View transaction" target="_blank">{{=it.stats.pools[pool].payments[p].blocks}}</a>
+          {{ } else if (String(it.stats.pools[pool].name).startsWith("zclassic")) { }}
+            <a href="https://classic.zcha.in/tx/{{=it.stats.pools[pool].payments[p].txid}}"  title="View transaction" target="_blank">{{=it.stats.pools[pool].payments[p].blocks}}</a>
+          {{ } else if (String(it.stats.pools[pool].name).startsWith("hush")) { }}
+            <a href="https://explorer.myhush.org/tx/{{=it.stats.pools[pool].payments[p].txid}}"  title="View transaction" target="_blank">{{=it.stats.pools[pool].payments[p].blocks}}</a>
+          {{ } else if (String(it.stats.pools[pool].name).startsWith("zen")) { }}
+            <a href="http://node1.zenchain.info:8886/tx/{{=it.stats.pools[pool].payments[p].txid}}"  title="View transaction" target="_blank">{{=it.stats.pools[pool].payments[p].blocks}}</a>
+          {{ } else { }}
           {{=it.stats.pools[pool].payments[p].blocks}}
+          {{ } }}
           </td>
-          <td>
-          <script type="text/javascript">
-            var utcSeconds = {{=it.stats.pools[pool].payments[p].time}};
-            var d = new Date(0); // The 0 there is the key, which sets the date to the epoch
-            d.setUTCSeconds(utcSeconds);
-            document.write(d)
-          </script>
-          </td>
+          <td>{{=readableDate(it.stats.pools[pool].payments[p].time)}}</td>
           <td>{{=it.stats.pools[pool].payments[p].miners}}</td>
           <td>{{=Math.round(it.stats.pools[pool].payments[p].shares)}}</td>
           <td>{{=it.stats.pools[pool].payments[p].paid}} {{=it.stats.pools[pool].symbol}}</td>
@@ -64,4 +82,8 @@
       {{ } }}
   </table>
 </div>
+</div>
+</div>
+</div>
+</div>
 {{ } }}