IoBroker vis erstellen eines einfachen Menüs Teil 3

Jetzt wird es etwas schwieriger, um den MaterialDesign look zu bekommen müssen die Standard Widgets mit CSS bearbeitet werden, vorteil ist, wenn man die Farben oben als Variable anlegt, lässt sich das gesamte design ganz schnell ändern.

hier noch der CSS Code (Bitte bei local und nciht bei global eingeben):

:root {
--main-color: #1565c0;
--main-light: #5e92f3;
--main-dark: #003c8f;
--sec-color: #616161;
--sec-light: #8e8e8e;
--sec-dark: #373737;
--text-p: #ffffff;
--text-s: #ffffff;
}
.navbut{
background: var(--main-color) !important;
border: 1px solid var(--main-color) !important;
font-size: 1em !important;

}
.navbut:hover{
background: var(--main-dark) !important;
border: 1px solid var(--main-color) !important;

}
.navbut.ui-state-active{
background: var(--sec-dark) !important;
border: 1px solid var(--sec-dark) !important;

}