diff --git a/src/BirdsiteLive/Views/Shared/Components/NodeInfo/Default.cshtml b/src/BirdsiteLive/Views/Shared/Components/NodeInfo/Default.cshtml
index 3c30c68..60a6be0 100644
--- a/src/BirdsiteLive/Views/Shared/Components/NodeInfo/Default.cshtml
+++ b/src/BirdsiteLive/Views/Shared/Components/NodeInfo/Default.cshtml
@@ -3,5 +3,13 @@
*@
diff --git a/src/BirdsiteLive/wwwroot/css/pattern.css b/src/BirdsiteLive/wwwroot/css/pattern.css
index 7816722..161c812 100644
--- a/src/BirdsiteLive/wwwroot/css/pattern.css
+++ b/src/BirdsiteLive/wwwroot/css/pattern.css
@@ -1,8 +1,57 @@
.container-nodeinfo {
line-height: 30px;
-
+ text-align: center;
}
.wrapper-nodeinfo {
border-bottom: 1px solid #dee2e6;
-}
\ No newline at end of file
+}
+
+
+
+@media (max-width: 767px) {
+ .node-progress-bar {
+ display: block;
+ width: 100%;
+ margin-bottom: 7px;
+ }
+
+ .node-progress-bar__label {
+ display: block;
+ font-size: 12px;
+ /*float: left;*/
+ padding: 0 5px 0 0;
+ /*height: 15px;*/
+ line-height: 15px;
+ }
+
+ .node-progress-bar__bar {
+ width: 80%;
+ margin: auto;
+ margin-top: 5px;
+ }
+}
+
+
+@media (min-width: 768px) {
+ .node-progress-bar {
+ display: inline-block;
+ width: 400px;
+ }
+
+ .node-progress-bar__label {
+ display: inline-block;
+ font-size: 12px;
+ float: left;
+ padding: 0 5px 0 0;
+ /*height: 15px;*/
+ line-height: 15px;
+ }
+
+ .node-progress-bar__bar {
+ width: 200px;
+ position: relative;
+ top: -1px;
+ }
+}
+