portainer formatting

CSS/themes/portainer/portainer-base.css

@@ -1,4 +1,3 @@
-
 /*    dP   dP                                                                  dP        */
 /*    88   88                                                                  88        */
 /*  d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b.    88d888b. .d8888b. 88d888b. 88  .dP   */
@@ -11,13 +10,14 @@
 /*		   		        Made by @gilbN					 */
 /* 			      https://github.com/gilbN/theme.park			 */
 
-    /* Scrollbar */  
+/* Scrollbar */
-    @media only screen and (min-width: 768px) {  
+@media only screen and (min-width: 768px) {
     html {
         height: 100%;
         width: 100%;
         overflow: hidden;
     }
+
     body {
         overflow-y: auto;
         height: 100%;
@@ -30,29 +30,33 @@
         -moz-background-size: auto, cover;
         -o-background-size: auto, cover;
     }
-  }
+}
-      ::-webkit-scrollbar {
+
+::-webkit-scrollbar {
     width: 14px;
-      }
+}
-      ::-webkit-scrollbar-thumb {
+
+::-webkit-scrollbar-thumb {
     min-height: 50px;
     border: 3px solid transparent;
     border-radius: 8px;
-          background-color: hsla(0,0%,100%,.2);
+    background-color: hsla(0, 0%, 100%, .2);
     background-clip: padding-box;
-      }
+}
-      ::-webkit-scrollbar-track {
+
+::-webkit-scrollbar-track {
     background-color: transparent;
-      }
+}
-      ::-webkit-scrollbar-thumb:hover {
+
+::-webkit-scrollbar-thumb:hover {
     min-height: 50px;
     border: 3px solid transparent;
     border-radius: 8px;
-          background-color: hsla(0,0%,100%,.5);
+    background-color: hsla(0, 0%, 100%, .5);
     background-clip: padding-box;
-      } 
+}
 
-  body {
+body {
     background: var(--main-bg-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -62,94 +66,122 @@
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
     color: var(--text) !important;
-  }
+}
 
-  * {
+* {
     outline: none !important;
-  }
+}
 
-  h1,h2,h3,h4,h5,h6,label,legend,
+h1,
-  ul.sidebar .sidebar-title.endpoint-name {
+h2,
+h3,
+h4,
+h5,
+h6,
+label,
+legend,
+ul.sidebar .sidebar-title.endpoint-name {
     color: var(--text-hover);
-  }
+}
 
-  ul.sidebar .sidebar-list .sidebar-sublist a {
+ul.sidebar .sidebar-list .sidebar-sublist a {
     color: var(--text);
-  }
+}
-  a {
+
+a {
     color: var(--link-color);
-  }
+}
-  a:focus, a:hover {
+
+a:focus,
+a:hover {
     color: var(--link-color-hover);
     text-decoration: none;
-  }
+}
-  .text-danger {
+
+.text-danger {
     color: #f44336;
-  }
+}
-  .fa.red-icon {
+
+.fa.red-icon {
     color: #f44336;
-  }
+}
-  .text-muted {
+
+.text-muted {
     color: var(--text-muted);
-  }
+}
-  .form-section-title {
+
+.form-section-title {
     color: var(--text);
-  }
+}
-  ul.sidebar .sidebar-list a {
+
+ul.sidebar .sidebar-list a {
     color: var(--text);
-  }
+}
-  /* NEWS */
+
-  .motd-body {
+/* NEWS */
+.motd-body {
     background-color: rgba(255, 255, 255, 0.15) !important;
 }
-  /* LOGIN */
+
-  .panel-default {
+/* LOGIN */
+.panel-default {
     border-color: transparent;
 }
+
 .panel {
     background-color: transparent;
     border: 1px solid transparent;
     -webkit-box-shadow: none;
     box-shadow: none;
 }
+
 .panel-body {
     background-color: transparent;
 }
-  /* SIDEBAR */
+
-  #sidebar-wrapper {
+/* SIDEBAR */
-  background: rgba(0, 0, 0, 0.25) ;
+#sidebar-wrapper {
-  }
-  .sidebar-header {
     background: rgba(0, 0, 0, 0.25);
-  }
+}
-  ul.sidebar .sidebar-list a.active {
+
+.sidebar-header {
+    background: rgba(0, 0, 0, 0.25);
+}
+
+ul.sidebar .sidebar-list a.active {
     color: rgb(var(--accent-color));
     background: rgba(255, 255, 255, 0.1);
     border-left: 3px solid rgb(var(--accent-color));
-  }
+}
-  #page-wrapper:not(.open) ul.sidebar .sidebar-title.separator,
+
-  .sidebar-footer, ul.sidebar .sidebar-list a:hover:not(ul.sidebar .sidebar-list a.active),
+#page-wrapper:not(.open) ul.sidebar .sidebar-title.separator,
-  ul.sidebar .sidebar-main a {
+.sidebar-footer,
+ul.sidebar .sidebar-list a:hover:not(ul.sidebar .sidebar-list a.active),
+ul.sidebar .sidebar-main a {
     background: rgba(255, 255, 255, 0.15);
     color: var(--text-hover);
-  }
+}
-  ul.sidebar .sidebar-list a:hover,
+
-  #page-wrapper:not(.open) ul.sidebar .sidebar-list a:hover span {
+ul.sidebar .sidebar-list a:hover,
+#page-wrapper:not(.open) ul.sidebar .sidebar-list a:hover span {
     border-left: 3px solid rgb(var(--accent-color));
-  }
+}
 
-  ul.sidebar .sidebar-title {
+ul.sidebar .sidebar-title {
     color: rgb(var(--accent-color));
-  }
+}
-  ul.sidebar .sidebar-list .sidebar-sublist a.active {
+
+ul.sidebar .sidebar-list .sidebar-sublist a.active {
     border-left: 3px solid rgb(var(--accent-color));
     background: rgba(255, 255, 255, .08);
-  }
+}
-  ul.sidebar .sidebar-title {
+
+ul.sidebar .sidebar-title {
     color: var(--text-hover);
-  }
+}
-  /* Header */
+
-  .row.header {
+/* Header */
+.row.header {
     background: var(--main-bg-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -158,166 +190,265 @@
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-  }
+}
 
-  /* WIDGETS */
+/* WIDGETS */
-  .widget {
+.widget {
     background: rgba(0, 0, 0, 0.25);
     border-color: transparent;
-  }
+}
-  .widget .widget-body table thead {
+
+.widget .widget-body table thead {
     background: rgba(0, 0, 0, 0.25);
-  }
+}
-  .widget .widget-header {
+
+.widget .widget-header {
     color: var(--text-hover);
     background-color: rgba(0, 0, 0, .25);
     border-bottom: 1px solid transparent;
-  }
+}
 
-  /* DATATABLES */
+/* DATATABLES */
-  .datatable .toolBar {
+.datatable .toolBar {
     background: rgba(0, 0, 0, 0.25);
-  }
+}
-  .datatable .footer {
+
+.datatable .footer {
     background: rgba(0, 0, 0, 0.25);
     color: var(--text);
-  }
+}
-  .blocklist-item--selected, .blocklist-item:hover {
+
+.blocklist-item--selected,
+.blocklist-item:hover {
     background-color: rgba(255, 255, 255, 0.15);
     color: var(--text);
-  }
+}
-  .datatable .actionBar, .datatable .toolBar {
+
+.datatable .actionBar,
+.datatable .toolBar {
     color: var(--text);
-  }
+}
-  .datatable .searchIcon {
+
+.datatable .searchIcon {
     color: var(--text);
-  }
+}
 
 
-  /* TABLE */
+/* TABLE */
 
-  .table-hover>tbody>tr:hover, .table>tbody>tr.active>td, .table>tbody>tr.active>th, .table>tbody>tr>td.active, .table>tbody>tr>th.active, .table>tfoot>tr.active>td, .table>tfoot>tr.active>th, .table>tfoot>tr>td.active, .table>tfoot>tr>th.active, .table>thead>tr.active>td, .table>thead>tr.active>th, .table>thead>tr>td.active, .table>thead>tr>th.active {
+.table-hover>tbody>tr:hover,
+.table>tbody>tr.active>td,
+.table>tbody>tr.active>th,
+.table>tbody>tr>td.active,
+.table>tbody>tr>th.active,
+.table>tfoot>tr.active>td,
+.table>tfoot>tr.active>th,
+.table>tfoot>tr>td.active,
+.table>tfoot>tr>th.active,
+.table>thead>tr.active>td,
+.table>thead>tr.active>th,
+.table>thead>tr>td.active,
+.table>thead>tr>th.active {
     background-color: rgba(255, 255, 255, 0.1);
-  }
+}
-  .table-hover>tbody>tr.active:hover>td, .table-hover>tbody>tr.active:hover>th, .table-hover>tbody>tr:hover>.active, .table-hover>tbody>tr>td.active:hover, .table-hover>tbody>tr>th.active:hover {
+
+.table-hover>tbody>tr.active:hover>td,
+.table-hover>tbody>tr.active:hover>th,
+.table-hover>tbody>tr:hover>.active,
+.table-hover>tbody>tr>td.active:hover,
+.table-hover>tbody>tr>th.active:hover {
     background-color: rgba(255, 255, 255, 0.1);
-  }
+}
-  .table .table {
+
+.table .table {
     background-color: rgba(255, 255, 255, 0.08);
-  }
+}
-  .label-default {
+
+.label-default {
     color: var(--label-text-color);
     background-color: rgb(var(--accent-color));
-  }
+}
-  /* BUTTONS */
+
+/* BUTTONS */
 
 .btn-danger:hover {
     color: #fff !important;
     background-color: #c9302c !important;
     border-color: #ac2925 !important;
 }
-  .btn-primary, .btn-default {
+
+.btn-primary,
+.btn-default {
     color: var(--button-text);
     background-color: var(--button-color);
     border-color: var(--button-color);
-  }
+}
-  .btn-default.active, .btn-default:active, .open>.dropdown-toggle.btn-default,.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open>.dropdown-toggle.btn-default.focus, .open>.dropdown-toggle.btn-default:focus, .open>.dropdown-toggle.btn-default:hover {
+
+.btn-default.active,
+.btn-default:active,
+.open>.dropdown-toggle.btn-default,
+.btn-default.active.focus,
+.btn-default.active:focus,
+.btn-default.active:hover,
+.btn-default:active.focus,
+.btn-default:active:focus,
+.btn-default:active:hover,
+.open>.dropdown-toggle.btn-default.focus,
+.open>.dropdown-toggle.btn-default:focus,
+.open>.dropdown-toggle.btn-default:hover {
     color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     border-color: var(--button-color-hover);
-  }
+}
-  .btn-link {
+
+.btn-link {
     font-weight: 400;
     color: var(--button-color);
     border-radius: 0;
-  }
+}
-  .btn-primary:hover, .btn-default:hover {
+
+.btn-primary:hover,
+.btn-default:hover {
     color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     border-color: var(--button-color-hover);
-  }
+}
-  .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
+
+.btn.active.focus,
+.btn.active:focus,
+.btn.focus,
+.btn:active.focus,
+.btn:active:focus,
+.btn:focus {
     outline: none;
 }
-  .btn-primary.disabled.focus, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary[disabled].focus, .btn-primary[disabled]:focus, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary.focus, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:hover {
+
+.btn-primary.disabled.focus,
+.btn-primary.disabled:focus,
+.btn-primary.disabled:hover,
+.btn-primary[disabled].focus,
+.btn-primary[disabled]:focus,
+.btn-primary[disabled]:hover,
+fieldset[disabled] .btn-primary.focus,
+fieldset[disabled] .btn-primary:focus,
+fieldset[disabled] .btn-primary:hover {
     background-color: var(--button-color-hover);
     border-color: var(--button-color-hover);
-  }
+}
-  .bootbox-form .checkbox i, .switch i {
+
+.bootbox-form .checkbox i,
+.switch i {
     background: rgba(255, 255, 255, 0.15);
 }
-.btn.focus, .btn:focus, .btn:hover {
+
+.btn.focus,
+.btn:focus,
+.btn:hover {
     color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     border-color: var(--button-color-hover);
 }
-.btn-link:focus, .btn-link:hover {
+
+.btn-link:focus,
+.btn-link:hover {
     background: transparent;
     color: var(--button-color-hover);
     border-color: transparent;
 }
 
-.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open>.dropdown-toggle.btn-primary.focus, .open>.dropdown-toggle.btn-primary:focus, .open>.dropdown-toggle.btn-primary:hover {
+.btn-primary.active.focus,
+.btn-primary.active:focus,
+.btn-primary.active:hover,
+.btn-primary:active.focus,
+.btn-primary:active:focus,
+.btn-primary:active:hover,
+.open>.dropdown-toggle.btn-primary.focus,
+.open>.dropdown-toggle.btn-primary:focus,
+.open>.dropdown-toggle.btn-primary:hover {
     color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     border-color: var(--button-color-hover);
 }
-.ui-select-bootstrap>.ui-select-match>.btn:hover, .ui-select-bootstrap>.ui-select-match>.btn:focus {
+
-    text-align: left!important;
+.ui-select-bootstrap>.ui-select-match>.btn:hover,
+.ui-select-bootstrap>.ui-select-match>.btn:focus {
+    text-align: left !important;
     color: var(--button-text-hover);
     background-color: rgba(255, 255, 255, 0.25);
     border-color: #00000000;
 }
-  /* PAGINATION */
+
-  .pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover {
+/* PAGINATION */
+.pagination>.disabled>a,
+.pagination>.disabled>a:focus,
+.pagination>.disabled>a:hover,
+.pagination>.disabled>span,
+.pagination>.disabled>span:focus,
+.pagination>.disabled>span:hover {
     color: var(--text-muted);
     cursor: not-allowed;
     background-color: rgba(255, 255, 255, 0.1);
     border-color: transparent;
-  }
+}
-  .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
+
+.pagination>.active>a,
+.pagination>.active>a:focus,
+.pagination>.active>a:hover,
+.pagination>.active>span,
+.pagination>.active>span:focus,
+.pagination>.active>span:hover {
     z-index: 2;
     color: var(--button-text);
     cursor: default;
     background-color: var(--button-color-hover);
     border-color: var(--button-color-hover);
-  }
+}
-  .pagination>li>a, .pagination>li>span {
+
+.pagination>li>a,
+.pagination>li>span {
     text-decoration: none;
     color: var(--button-text);
     background-color: var(--button-color);
     border-color: var(--button-color);
-  }
+}
-  .pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover {
+
+.pagination>li>a:focus,
+.pagination>li>a:hover,
+.pagination>li>span:focus,
+.pagination>li>span:hover {
     color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     border-color: var(--button-color-hover);
 }
 
-  /* FORM CONTROL */
+/* FORM CONTROL */
 
-  .form-control {
+.form-control {
     background-color: rgba(255, 255, 255, 0.15);
     border: 1px solid transparent;
-  }
+}
 
-  .form-control:not([disabled]):not(select), output {
+.form-control:not([disabled]):not(select),
+output {
     color: var(--text-hover);
-  }
+}
-  .form-control:focus {
+
+.form-control:focus {
     border-color: rgb(var(--accent-color));
     outline: 0;
     -webkit-box-shadow: none;
     box-shadow: none;
-  }
+}
-  .input-group-addon {
+
+.input-group-addon {
     color: var(--button-text);
     background-color: rgba(255, 255, 255, 0.15);
     border: 1px solid transparent;
-  }
+}
-  /* DROPDOWN MENU */
 
-  .dropdown-menu {
+/* DROPDOWN MENU */
+
+.dropdown-menu {
     background: var(--drop-down-menu-bg);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -327,135 +458,174 @@
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
     color: var(--text);
-  }
+}
-  .dropdown-menu>li>a,
+
-  .ui-select-bootstrap .ui-select-choices-row>span  {
+.dropdown-menu>li>a,
+.ui-select-bootstrap .ui-select-choices-row>span {
     color: var(--text);
-  }
+}
-  .dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover,
+
-  .ui-select-bootstrap .ui-select-choices-row.active>span {
+.dropdown-menu>.active>a,
+.dropdown-menu>.active>a:focus,
+.dropdown-menu>.active>a:hover,
+.ui-select-bootstrap .ui-select-choices-row.active>span {
     background-color: rgba(0, 0, 0, 0.25);
-  }
+}
-  .ui-select-bootstrap .ui-select-choices-row>span:focus, .ui-select-bootstrap .ui-select-choices-row>span:hover,
+
-  .ui-select-choices-row:hover {
+.ui-select-bootstrap .ui-select-choices-row>span:focus,
+.ui-select-bootstrap .ui-select-choices-row>span:hover,
+.ui-select-choices-row:hover {
     color: var(--text-hover);
     background-color: rgba(255, 255, 255, 0.15);
 }
 
-  /* APP TEMPLATES */
+/* APP TEMPLATES */
 
-  .blocklist-item {
+.blocklist-item {
     border: 1px solid transparent;
     -webkit-box-shadow: 0 3px 10px -2px hsla(0, 0%, 0%, 0.5);
     box-shadow: 0 3px 10px -2px hsla(0, 0%, 0%, 0.5);
-  }
+}
 
-  /* ADD NETWORK */
+/* ADD NETWORK */
 
-  .boxselector_wrapper input[type=radio]:checked+label {
+.boxselector_wrapper input[type=radio]:checked+label {
     background: rgba(255, 255, 255, .15);
     color: var(--text-hover);
     border-color: transparent;
-  }
+}
 
-  .boxselector_wrapper label {
+.boxselector_wrapper label {
     -webkit-box-shadow: none;
     box-shadow: none;
     background: rgba(0, 0, 0, 0.15);
     border: 1px solid transparent;
-  }
+}
-  .boxselector_wrapper input[type=radio]:checked+label:after {
+
+.boxselector_wrapper input[type=radio]:checked+label:after {
     color: rgb(var(--accent-color));
     border: 2px solid rgb(var(--accent-color));
     background: var(--label-text-color);
 }
-  .bootbox-form .checkbox :checked~i, .switch :checked+i {
+
+.bootbox-form .checkbox :checked~i,
+.switch :checked+i {
     -webkit-box-shadow: inset 0 0 1px rgb(0 0 0 / 50%), inset 0 0 40px rgb(var(--accent-color));
     box-shadow: inset 0 0 1px rgb(0 0 0 / 50%), inset 0 0 40px rgb(var(--accent-color));
 }
+
 .md-checkbox input[type=checkbox]:checked+label:before {
     background: rgb(var(--accent-color));
     border: none;
 }
+
 .md-checkbox input[type=checkbox]:checked+label:after {
     border-color: var(--label-text-color);
 }
-.fa.blue-icon, .fab.blue-icon {
+
+.fa.blue-icon,
+.fab.blue-icon {
     color: rgb(var(--accent-color));
 }
-  /* PLACEHOLDER TEXT */
+
-  ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
+/* PLACEHOLDER TEXT */
+::-webkit-input-placeholder {
+    /* Chrome/Opera/Safari */
     color: #bbb;
-  }
+}
-  ::-moz-placeholder { /* Firefox 19+ */
+
+::-moz-placeholder {
+    /* Firefox 19+ */
     color: #bbb;
-  }
+}
-  :-ms-input-placeholder { /* IE 10+ */
+
+:-ms-input-placeholder {
+    /* IE 10+ */
     color: #bbb;
-  }
+}
-  :-moz-placeholder { /* Firefox 18- */
+
+:-moz-placeholder {
+    /* Firefox 18- */
     color: #bbb;
-  }
+}
-    /* STACKS */
+
-    .CodeMirror {
+/* STACKS */
+.CodeMirror {
     background: rgba(255, 255, 255, 0.10);
     color: white;
-    }
+}
-    .CodeMirror-gutters {
+
+.CodeMirror-gutters {
     border-right: 1px solid rgba(255, 255, 255, 0.25);
     background-color: rgba(0, 0, 0, 0.25);
     caret-color: white;
-    }
+}
-    .CodeMirror-linenumber {
+
+.CodeMirror-linenumber {
     color: rgb(var(--accent-color));
-    }
+}
-    .CodeMirror-line::selection, .CodeMirror-line>span::selection, .CodeMirror-line>span>span::selection {
+
+.CodeMirror-line::selection,
+.CodeMirror-line>span::selection,
+.CodeMirror-line>span>span::selection {
     background: #d7d4f0;
-    }
+}
-    .cm-s-default .cm-atom {
+
+.cm-s-default .cm-atom {
     color: rgb(var(--accent-color));
-    }
+}
-    /* NAVIGATION */
+
-    .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
+/* NAVIGATION */
+.nav-tabs>li.active>a,
+.nav-tabs>li.active>a:focus,
+.nav-tabs>li.active>a:hover {
     color: #fff;
     cursor: default;
     background-color: rgba(255, 255, 255, 0.15);
     border: 1px solid #ddd0;
     border-bottom-color: transparent;
-    }
+}
-    .nav-tabs>li>a:hover {
+
+.nav-tabs>li>a:hover {
     border-color: transparent;
-    }
+}
 
-    .nav>li>a:focus, .nav>li>a:hover {
+.nav>li>a:focus,
+.nav>li>a:hover {
     text-decoration: none;
     background-color: rgba(0, 0, 0, 0.25);
-    }
+}
-    .nav-tabs>li>a {
+
+.nav-tabs>li>a {
     border: 1px solid rgba(0, 0, 0, 0);
     background: rgba(0, 0, 0, 0.15);
-    }
+}
-    /* LOGS */
+
-    .log_viewer {
+/* LOGS */
+.log_viewer {
     color: #fff;
     background-color: rgba(255, 255, 255, 0.1);
     border: 1px solid transparent;
-    }
+}
-    /* JSON TREE */
+
-    json-tree {
+/* JSON TREE */
+json-tree {
     color: #eee;
-    }
+}
-    json-tree .key {
+
+json-tree .key {
     color: rgb(var(--accent-color));
     padding-right: 5px;
-    }
+}
-    pre {
+
+pre {
     color: #fff;
     background-color: rgba(255, 255, 255, .1);
     border: 1px solid transparent;
-    }
+}
-    /* MODAL */
+
-    .close {
+/* MODAL */
+.close {
     float: right;
     font-size: 21px;
     font-weight: 700;
@@ -464,15 +634,18 @@
     text-shadow: 0 1px 0 var(--text);
     filter: alpha(opacity=100);
     opacity: 1;
-    }
+}
-    .close:focus, .close:hover {
+
+.close:focus,
+.close:hover {
     color: var(--text-hover);
     text-decoration: none;
     cursor: pointer;
     filter: alpha(opacity=100);
     opacity: 1;
-    }
+}
-    .modal-content {
+
+.modal-content {
     background: var(--modal-bg-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -481,8 +654,9 @@
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    }
+}
-    .modal-header {
+
+.modal-header {
     background: var(--modal-header-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -492,8 +666,9 @@
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
     border-bottom: 1px solid rgb(var(--accent-color));
-    }
+}
-    .modal-footer {
+
+.modal-footer {
     background: var(--modal-footer-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -503,30 +678,35 @@
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
     border-top: 1px solid rgb(var(--accent-color));
-    }
+}
-    /* STACKS / SERVICES TABLES */
+
-    .widget .widget-body table tbody {
+/* STACKS / SERVICES TABLES */
-        background-color:transparent !important;
+.widget .widget-body table tbody {
-        background:transparent !important;
+    background-color: transparent !important;
-    }
+    background: transparent !important;
-    .widget .widget-body table .ng-scope tr {
+}
+
+.widget .widget-body table .ng-scope tr {
     background: rgba(0, 0, 0, .25) !important;
     background-color: rgba(0, 0, 0, .25) !important;
-    }
+}
-    .widget .widget-body table thead {
+
-        background-color:rgba(0, 0, 0, .25) !important;
+.widget .widget-body table thead {
-        background:rgba(0, 0, 0, .25) !important;
+    background-color: rgba(0, 0, 0, .25) !important;
-    }
+    background: rgba(0, 0, 0, .25) !important;
-    .widget .widget-body table tbody  .ng-isolate-scope  div {
+}
+
+.widget .widget-body table tbody .ng-isolate-scope div {
     background-color: rgba(0, 0, 0, .25) !important;
     background: rgba(0, 0, 0, 0) !important;
-    }
+}
-    .widget .widget-body table tbody tr:hover {
-        background-color:#0000 !important;
-        background:rgba(0, 0, 0, 0) !important;
-    }
-    .widget .widget-body table thead tr:hover {
-        background-color:rgba(0, 0, 0, .35) !important;
-        background:rgba(0, 0, 0, .35) !important;
-    }
 
+.widget .widget-body table tbody tr:hover {
+    background-color: #0000 !important;
+    background: rgba(0, 0, 0, 0) !important;
+}
+
+.widget .widget-body table thead tr:hover {
+    background-color: rgba(0, 0, 0, .35) !important;
+    background: rgba(0, 0, 0, .35) !important;
+}