diff --git a/src/Blashing.Core/Components/Clock/ClockWidget.razor.css b/src/Blashing.Core/Components/Clock/ClockWidget.razor.css
index e3a6262..c7dafce 100644
--- a/src/Blashing.Core/Components/Clock/ClockWidget.razor.css
+++ b/src/Blashing.Core/Components/Clock/ClockWidget.razor.css
@@ -2,12 +2,15 @@
     background-color: #dc5945;
     height: 100%;
     width: 100%;
-
     text-align: center;
-/*    width: inherit;*/
-/*    height: inherit;*/
-/*    display: table-cell;*/
+    /*    width: inherit;*/
+    /*    height: inherit;*/
+    /*    display: table-cell;*/
     vertical-align: middle;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    /*align-items: center;*/
 }
 
 h1, h2, h3, h4, h5, p {
diff --git a/src/Blashing.Core/Components/Comments/CommentsWidget.razor.css b/src/Blashing.Core/Components/Comments/CommentsWidget.razor.css
index 4be658f..ab16cb3 100644
--- a/src/Blashing.Core/Components/Comments/CommentsWidget.razor.css
+++ b/src/Blashing.Core/Components/Comments/CommentsWidget.razor.css
@@ -2,12 +2,15 @@
     background-color: #eb9c3c;
     height: 100%;
     width: 100%;
-
     text-align: center;
-/*    width: inherit;*/
-/*    height: inherit;*/
-/*    display: table-cell;*/
+    /*    width: inherit;*/
+    /*    height: inherit;*/
+    /*    display: table-cell;*/
     vertical-align: middle;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    /*align-items: center;*/
 }
 
 .title {
diff --git a/src/Blashing.Core/Components/Graph/GraphWidget.razor.css b/src/Blashing.Core/Components/Graph/GraphWidget.razor.css
index 7519433..d0f4332 100644
--- a/src/Blashing.Core/Components/Graph/GraphWidget.razor.css
+++ b/src/Blashing.Core/Components/Graph/GraphWidget.razor.css
@@ -1,14 +1,17 @@
 .widget-graph {
-    background-color: #dc5945;
+    background-color: #ff9618; /*#dc5945;*/
     position: relative;
     height: 100%;
     width: 100%;
-
     text-align: center;
-/*    width: inherit;*/
-/*    height: inherit;*/
-/*    display: table-cell;*/
+    /*    width: inherit;*/
+    /*    height: inherit;*/
+    /*    display: table-cell;*/
     vertical-align: middle;
+    /*display: flex;*/
+    /*flex-direction: column;*/
+    /*justify-content: center;*/
+    /*align-items: center;*/
 }
 
 svg {
diff --git a/src/Blashing.Core/Components/Image/ImageWidget.razor.css b/src/Blashing.Core/Components/Image/ImageWidget.razor.css
index 5706121..ef086a2 100644
--- a/src/Blashing.Core/Components/Image/ImageWidget.razor.css
+++ b/src/Blashing.Core/Components/Image/ImageWidget.razor.css
@@ -2,12 +2,15 @@
     background-color: #4b4b4b;
     height: 100%;
     width: 100%;
-
     text-align: center;
-/*    width: inherit;*/
-/*    height: inherit;*/
-/*    display: table-cell;*/
+    /*    width: inherit;*/
+    /*    height: inherit;*/
+    /*    display: table-cell;*/
     vertical-align: middle;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    /*align-items: center;*/
 }
 
 img {
diff --git a/src/Blashing.Core/Components/List/ListWidget.razor.css b/src/Blashing.Core/Components/List/ListWidget.razor.css
index 9ed1979..25dde9f 100644
--- a/src/Blashing.Core/Components/List/ListWidget.razor.css
+++ b/src/Blashing.Core/Components/List/ListWidget.razor.css
@@ -3,12 +3,17 @@
     vertical-align: top;
     height: 100%;
     width: 100%;
-
     text-align: center;
-/*    width: inherit;*/
-/*    height: inherit;*/
-/*    display: table-cell;*/
+    /*    width: inherit;*/
+    /*    height: inherit;*/
+    /*    display: table-cell;*/
     vertical-align: middle;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    /*align-items: center;*/
+
+    padding: 20px;
 }
 
 .title {
diff --git a/src/Blashing.Core/Components/Meter/MeterWidget.razor.css b/src/Blashing.Core/Components/Meter/MeterWidget.razor.css
index a4c8f7b..b292f62 100644
--- a/src/Blashing.Core/Components/Meter/MeterWidget.razor.css
+++ b/src/Blashing.Core/Components/Meter/MeterWidget.razor.css
@@ -2,12 +2,15 @@
     background-color: #9c4274;
     height: 100%;
     width: 100%;
-
     text-align: center;
-/*    width: inherit;*/
-/*    height: inherit;*/
-/*    display: table-cell;*/
+    /*    width: inherit;*/
+    /*    height: inherit;*/
+    /*    display: table-cell;*/
     vertical-align: middle;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    /*align-items: center;*/
 }
 
 input.meter {
diff --git a/src/Blashing.Core/Components/Number/NumberWidget.razor.css b/src/Blashing.Core/Components/Number/NumberWidget.razor.css
index 17d5e16..fae0b75 100644
--- a/src/Blashing.Core/Components/Number/NumberWidget.razor.css
+++ b/src/Blashing.Core/Components/Number/NumberWidget.razor.css
@@ -2,12 +2,14 @@
     background-color: #47bbb3;
     height: 100%;
     width: 100%;
-
     text-align: center;
-/*    width: inherit;*/
-/*    height: inherit;*/
-/*    display: table-cell;*/
-    vertical-align: middle;
+    /*width: inherit;*/
+    /*height: inherit;*/
+    /*display: table-cell;*/
+    /*vertical-align: middle;*/
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
 }
    
 .title {
diff --git a/src/Blashing.Core/Components/Text/TextWidget.razor.css b/src/Blashing.Core/Components/Text/TextWidget.razor.css
index 1a839cd..b8d4c49 100644
--- a/src/Blashing.Core/Components/Text/TextWidget.razor.css
+++ b/src/Blashing.Core/Components/Text/TextWidget.razor.css
@@ -2,12 +2,18 @@
     background-color: #ec663c;
     height: 100%;
     width: 100%;
-
     text-align: center;
-    /*    width: inherit;*/
-    /*    height: inherit;*/
-    /*    display: table-cell;*/
-    vertical-align: middle;
+    /*width: inherit;*/
+    /*height: inherit;*/
+    /*display: table-cell;*/ /* Parent: "display: table;" */
+    /*vertical-align: middle;*/
+    /*line-height: ;*/
+    /*display: flex;*/
+    /*align-items: center;*/
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    /*align-items: center;*/
 }
 
 .title {