diff --git a/src/app.php b/src/app.php
index 1933e8d..a7b6054 100644
--- a/src/app.php
+++ b/src/app.php
@@ -29,9 +29,57 @@ $app['twig'] = $app->extend('twig', function ($twig, $app) {
       }
     $out .= "</span>";
     return $out;
-    });
-    $twig->addFunction($displayRatio);
-    return $twig;
+  });
+
+  $displayTotal = new Twig_Function('displayTotal', function($rec) {
+    
+    $r_k = $rec['eb_r_k'] + $rec['rh_r_k'] + $rec['bh_r_k'] + $rec['gh_r_k'];
+    $r_d = $rec['eb_r_d'] + $rec['rh_r_d'] + $rec['bh_r_d'] + $rec['gh_r_d'];
+
+    $b_k = $rec['eb_b_k'] + $rec['rh_b_k'] + $rec['bh_b_k'] + $rec['gh_b_k'];
+    $b_d = $rec['eb_b_d'] + $rec['rh_b_d'] + $rec['bh_b_d'] + $rec['gh_b_d'];
+                
+    $g_k = $rec['eg_g_k'] + $rec['rh_g_k'] + $rec['bh_g_k'] + $rec['gh_g_k'];
+    $g_d = $rec['eg_g_d'] + $rec['rh_g_d'] + $rec['bh_g_d'] + $rec['gh_g_d'];
+
+    $out = "<span class='hint--rounded hint--right total-red' ";
+    if($r_d == 0 && $r_k == 0) {
+      $out .= ">0";
+    } else {
+      $sk = ($r_k>1)?"s":"";
+      $sd = ($r_d>1)?"s":"";
+      $out .= "aria-label='".$r_k." kill".$sk." | ".$r_d." death".$sd."'>".round($r_k/$r_d, 2);
+    }
+    $out .= "</span> / ";
+
+
+    $out .= "<span class='hint--rounded hint--bottom total-blue' ";
+    if($b_d == 0 && $b_k == 0) {
+        $out .= ">0";
+    } else {
+        $sk = ($b_k>1)?"s":"";
+          $sd = ($b_d>1)?"s":"";
+          $out .= "aria-label='".$b_k." kill".$sk." | ".$b_d." death".$sd."'>".round($b_k/$b_d, 2);
+    }
+    $out .= "</span> / ";
+
+    $out .= "<span class='hint--rounded hint--bottom total-green' ";
+    if($g_d == 0 && $g_k == 0) {
+        $out .= ">0";
+    } else {
+        $sk = ($g_k>1)?"s":"";
+          $sd = ($g_d>1)?"s":"";
+          $out .= "aria-label='".$g_k." kill".$sk." | ".$g_d." death".$sd."'>".round($g_k/$g_d, 2);
+    }
+    $out .= "</span>";
+
+
+    return $out;
+  });
+
+  $twig->addFunction($displayRatio);
+  $twig->addFunction($displayTotal);
+  return $twig;
 });
 
 return $app;
diff --git a/src/controllers.php b/src/controllers.php
index 138977b..a905a48 100644
--- a/src/controllers.php
+++ b/src/controllers.php
@@ -15,9 +15,14 @@ $app->get('/', function () use ($app) {
         'path' => $app['db_config']['path'],
       ),
     ));
+
     $sql = "SELECT * FROM ".$app['db_config']['diff_table']."";
     $diffs = $app['db']->fetchAll($sql);
-    return $app['twig']->render('index.html.twig', array("diffs" => $diffs));
+
+    $sql_rec = "SELECT * FROM ".$app['db_config']['records_table']." ORDER BY date DESC LIMIT 1";
+    $record = $app['db']->fetchAll($sql_rec);
+
+    return $app['twig']->render('index.html.twig', array("diffs" => $diffs, "record" => $record));
 })
 ->bind('homepage')
 ;
diff --git a/templates/index.html.twig b/templates/index.html.twig
index 8b18598..9291035 100644
--- a/templates/index.html.twig
+++ b/templates/index.html.twig
@@ -9,7 +9,7 @@
       <colgroup span="3"></colgroup>
       <thead>
       <tr>
-        <td rowpsan="2"></td>
+        <td rowpsan="2" class="totalRatio">{% for rec in record %}{{displayTotal(rec)|raw}}{% endfor %}</td>
         <th colspan="3" scope="colgroup">Eternal Battleground</th>
         <th colspan="3" scope="colgroup">Red Borderland</th>
         <th colspan="3" scope="colgroup">Blue Borderland</th>
@@ -32,6 +32,23 @@
       </tr>
       </thead>
       <tbody>
+      {% for rec in record %}
+      <tr>
+        <th scope="col" scope="row">TOTAL until {{rec.date|date("l H:i")}}</th>
+        <th scope="col" class="red">{{displayRatio(rec.eb_r_k, rec.eb_r_d)|raw}}</th>
+        <th scope="col" class="blue">{{displayRatio(rec.eb_b_k, rec.eb_b_d)|raw}}</th>
+        <th scope="col" class="green">{{displayRatio(rec.eb_g_k, rec.eb_g_d)|raw}}</th>
+        <th scope="col" class="red">{{displayRatio(rec.rh_r_k, rec.rh_r_d)|raw}}</th>
+        <th scope="col" class="blue">{{displayRatio(rec.rh_b_k, rec.rh_b_d)|raw}}</th>
+        <th scope="col" class="green">{{displayRatio(rec.rh_g_k, rec.rh_g_d)|raw}}</th>
+        <th scope="col" class="red">{{displayRatio(rec.bh_r_k, rec.bh_r_d)|raw}}</th>
+        <th scope="col" class="blue">{{displayRatio(rec.bh_b_k, rec.bh_b_d)|raw}}</th>
+        <th scope="col" class="green">{{displayRatio(rec.bh_g_k, rec.bh_g_d)|raw}}</th>
+        <th scope="col" class="red">{{displayRatio(rec.gh_r_k, rec.gh_r_d)|raw}}</th>
+        <th scope="col" class="blue">{{displayRatio(rec.gh_b_k, rec.gh_b_d)|raw}}</th>
+        <th scope="col" class="green">{{displayRatio(rec.gh_g_k, rec.gh_g_d)|raw}}</th>
+      </tr>
+      {% endfor %}
       {% for diff in diffs %}
       <tr>
         <th scope="row">{{diff.start|date("l H:i")}}</th>
diff --git a/templates/layout.html.twig b/templates/layout.html.twig
index 2d518a7..144894b 100644
--- a/templates/layout.html.twig
+++ b/templates/layout.html.twig
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
     <head>
-        <title>{% block title '' %}WvW skimrish stats</title>
+        <title>{% block title '' %}WvW Vabbi skirmish stats</title>
 
         <link href="{{ asset('css/main.css') }}" rel="stylesheet" type="text/css" />
         <link href="{{ asset('css/hint.min.css') }}" rel="stylesheet" type="text/css" />
diff --git a/web/css/main.css b/web/css/main.css
index c42343e..2acb52d 100644
--- a/web/css/main.css
+++ b/web/css/main.css
@@ -37,3 +37,12 @@ th {
 thead {
   border: thick solid;
 }
+
+.totalRatio {
+  font-weight: bold;
+  font-size: 120%;
+}
+
+.total-red {color:#bf5f5f;}
+.total-blue {color:#5f5fbf;}
+.total-green {color:#5fbf5f;}