2colunas.diff

diff --git a/src/components/dashboard.js b/src/components/dashboard.js
index dae02bb..70a88fa 100644
--- a/src/components/dashboard.js
+++ b/src/components/dashboard.js
@@ -41,9 +41,9 @@ class Dashboard {
         p.secondTableRowHeight = this.props.ui.screenHeight < 640 ?
                             smallerSecondTableRowHeight : secondTableRowHeight;
         p.tableWidth = p.ui.screenWidth;
-        p.tableContentWidth = p.columns.enabled.length * columnWidth;
+        p.tableContentWidth = (p.columns.enabled.length + 1) * columnWidth;
         p.columnWidth = p.tableContentWidth > p.tableWidth ? columnWidth :
-             Math.ceil((p.tableWidth) / (p.columns.enabled.length + 1));
+             Math.ceil((p.tableWidth) / (p.columns.enabled.length + 2));
         p.iconWidth = rowHeight - 2 * cellPadding;
         p.cellPadding = cellPadding;
 
diff --git a/src/templates/datatable.jsx b/src/templates/datatable.jsx
index f58bf06..8df58ec 100644
--- a/src/templates/datatable.jsx
+++ b/src/templates/datatable.jsx
@@ -91,7 +91,7 @@ export default (p, a) => {
         >
             <div
                 style={{
-                    width: p.columnWidth,
+                    width: (p.columnWidth * 2),
                     height: p.tableHeight,
                     overflow: 'hidden',
                     // backgroundColor: 'blue',
@@ -99,11 +99,10 @@ export default (p, a) => {
                 }}
             >
                 <div
-                    style={merge({
-
-                    },
+                    style={merge(
                     tableStyles(p).borderBottom,
-                    tableStyles(p).borderRight
+                    tableStyles(p).borderRight,
+                    { width: p.columnWidth * 2 }
                     )}
                 >
                     {firstCell}
diff --git a/src/templates/rowheaders.jsx b/src/templates/rowheaders.jsx
index 0694856..d7460f4 100644
--- a/src/templates/rowheaders.jsx
+++ b/src/templates/rowheaders.jsx
@@ -10,17 +10,17 @@ export default (p, a) => {
     id={p.rowHeadersElementId || 'row-headers'}
     style={{
         height: p.rows.type === 'secondary' ? p.tableHeight : p.tableHeight - p.rowHeight,
-        width: p.columnWidth,
+        width: (2 * p.columnWidth),
         // backgroundColor: 'orange',
         overflow: 'hidden'
     }}
 >
     <table
-        style={merge({
-            width: p.columnWidth,
+        style={merge(tableStyles(p).borderRight, {
+            width: (2 * p.columnWidth),
             textAlign: 'center',
             marginBottom: 100
-        }, tableStyles(p).borderRight)}
+        }}
     >
         <tbody key="tableheaders">
             {p.rows.headers.map((row, key) => rowRenderer(row, key, p, a))}
diff --git a/src/templates/tablecontent.jsx b/src/templates/tablecontent.jsx
index ae9d884..9608d56 100644
--- a/src/templates/tablecontent.jsx
+++ b/src/templates/tablecontent.jsx
@@ -7,7 +7,7 @@ export default (p, a) => {
                                                     p.tableHeight - p.rowHeight;
     p.rowHeight = p.rows.type === 'secondary' ? p.secondTableRowHeight : p.rowHeight;
     let style = {
-        width: p.tableWidth - p.columnWidth,
+        width: p.tableWidth - (2 * p.columnWidth),
         height: tableContentHeight
     };
     if (p.rows.type === 'detailed'){
diff --git a/src/templates/tableheader.jsx b/src/templates/tableheader.jsx
index 4cc223a..05da1bf 100644
--- a/src/templates/tableheader.jsx
+++ b/src/templates/tableheader.jsx
@@ -9,7 +9,7 @@ export default (p, a) => {
         <div
             id="table-headers"
             style={merge({
-            width: p.tableWidth - p.columnWidth,
+            width: p.tableWidth - (2 * p.columnWidth),
             overflow: 'hidden',
             // backgroundColor: 'green',
         }, tableStyles(p).borderBottom)}>

    <td key="first" style={merge(cellStyle, { width: p.columnWidth * 2 -1 })}></td>