diff --git a/static/css/main.css b/static/css/main.css
index fffcaa968fb..fd82e3f1c02 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -60,6 +60,9 @@ body {
 .bgStatus .currentDelta {
     font-size: 35%;
     text-decoration: line-through;
+    display: block;
+    position: relative;    
+    top: -20px;
 }
 .bgStatus.current .currentBG {
     text-decoration: none;
@@ -67,6 +70,9 @@ body {
 .bgStatus.current .currentDelta {
     font-size: 35%;
     text-decoration: none;
+    display: block;
+    position: relative;    
+    top: -20px;
 }
 .currentDirection {
     font-weight: normal;
diff --git a/static/index.html b/static/index.html
index 7adbe3ba61d..90af5eb0c6f 100644
--- a/static/index.html
+++ b/static/index.html
@@ -33,13 +33,14 @@ <h1 class="customTitle">Nightscout</h1>
                 <div class="bgStatus current">
                     <div id="noButton">
                         <span class="currentBG">---</span>
-                        <span class="currentDelta">--</span>
                         <span class="currentDirection">-</span>
+                        <span class="currentDelta">--</span>
+                        
                     </div>
                     <div id="bgButton" hidden="true">
                         <span class="currentBG">---</span>
-                        <span class="currentDelta">--</span>
                         <span class="currentDirection">-</span>
+                        <span class="currentDelta">--</span>
                     </div>
                     <ul class="dropdown-menu" id="silenceBtn">
                         <li><a href="#" data-snooze-time="1800000">Silence for 30 minutes</a></li>
diff --git a/static/js/client.js b/static/js/client.js
index 828475a5b32..2fafc0dfdd8 100644
--- a/static/js/client.js
+++ b/static/js/client.js
@@ -131,7 +131,6 @@
             return bg;
         }
     }
-
     // initial setup of chart when data is first made available
     function initializeCharts() {
 
@@ -298,7 +297,12 @@
                     $('.container .currentBG').text('HIGH');
                 else
                     $('.container .currentBG').text(focusPoint.sgv);
+                    
+                
                     var retroDelta = scaleBg(focusPoint.y) - scaleBg(prevfocusPoint.y);
+                 if (browserSettings.units == "mmol") {
+                retroDelta = retroDelta.toFixed(1);
+            }
                     if (retroDelta < 0) {
                         var retroDeltaString = retroDelta;
                     }
@@ -308,12 +312,18 @@
                     else {
                         var retroDeltaString = "+/-0";
                     }
+                    
+                    if (browserSettings.units == "mmol") {
+                   var retroDeltaString = retroDeltaString + " mmol/L"
+                   }
+                   else {
+                   var retroDeltaString = retroDeltaString + " mg/dL"
+                   }
                     $('.container .currentDelta').text(retroDeltaString);
 
                 $('.container .currentBG').css('text-decoration','line-through');
+                $('.container .currentDirection').html(focusPoint.direction)
                 $('.container .currentDelta').css('text-decoration','line-through');
-                $('.container .currentDirection')
-                    .html(focusPoint.direction)
             } else {
                 $('.container .currentBG')
                     .text("---")
@@ -385,6 +395,10 @@
                 else
                     $('.container .currentBG').text(scaleBg(latestSGV.y));
 		        var bgDelta = scaleBg(latestSGV.y) - scaleBg(prevSGV.y);
+                    if (browserSettings.units == "mmol") {
+                bgDelta = bgDelta.toFixed(1);
+            }
+                    
                     if (bgDelta < 0) {
                         var bgDeltaString = bgDelta;
                     }
@@ -394,12 +408,17 @@
                     else {
                         var bgDeltaString = "+/-0";
                     }
+                   if (browserSettings.units == "mmol") {
+                   var bgDeltaString = bgDeltaString + " mmol/L"
+                   }
+                   else {
+                   var bgDeltaString = bgDeltaString + " mg/dL"
+                   }
                     $('.container .currentDelta').text(bgDeltaString);
 
                 $('.container .currentBG').css('text-decoration', '');
+                $('.container .currentDirection').html(latestSGV.direction);
                 $('.container .currentDelta').css('text-decoration','');
-                $('.container .currentDirection')
-                    .html(latestSGV.direction);
 
                 var color = sgvToColor(latestSGV.y);
                 $('.container #noButton .currentBG').css({color: color});