diff --git a/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.html b/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.html
index 6efe2a8e..56c97ff3 100644
--- a/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.html
+++ b/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.html
@@ -16,7 +16,7 @@
     <div class="card-body">
 
       <div class="row">
-        <div class="col-6">
+        <div class="col-12">
           <div class="table-responsive">
             <table class="table mg-b-0">
               <tbody>
@@ -94,14 +94,6 @@
                   <small class="tx-11 tx-gray-500">Records</small>
                 </td>
               </tr>
-              </tbody>
-            </table>
-          </div>
-        </div>
-        <div class="col-6">
-          <div class="table-responsive">
-            <table class="table mg-b-0">
-              <tbody>
               <tr>
                 <td>
                   <div class="az-img-user"><img src="assets/icons/healthgoals.svg" alt=""></div>
diff --git a/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.scss b/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.scss
index e69de29b..5687026f 100644
--- a/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.scss
+++ b/frontend/src/app/widgets/records-summary-widget/records-summary-widget.component.scss
@@ -0,0 +1,14 @@
+tbody {
+  display: grid;
+  grid-template-columns: repeat(2, auto);
+}
+
+/* Borders */
+/* The margin declarations are used to simulate border-collapse:collapse */
+tr {
+  margin: 0 0 -1px -1px;
+  //border: 1px solid black;
+}
+tbody:not(:empty) {
+  margin: 0 0 1px 1px;
+}