:root{
   /*COMMON*/
   --skin-bg: #106EBE;
   --skin-color: #106EBE;
   --skin-link: #106EBE;
   --skin-logo-natural: none;
   --skin-logo-invert: block;
   --skin-border: #106EBE;
   /*LOGIN*/
   --skin-login-color: #ffffff;
   --skin-login-link: #ffff00;
   --skin-login-btn: #343a40;
   --skin-login-btn-hover: #222222;
   --skin-login-btn-color: #efefef;
   --skin-login-btn-color-hover: #ffffff;
   /*ADMIN*/
   --skin-header-border: #343a40;
   --skin-header-color: #ffffff;
   --skin-header-color-hover: #ffffff;
   --skin-header-btn-hover: #10497C;
   --skin-header-btn-border: #005E98;
   --skin-header-toggle-menu: #222;
}

.skin-bg{
   background-color: var(--skin-bg);
}
.skin-bg-alt{
   background-color: var(--skin-header-btn-hover);
}
.skin-color{
   color: var(--skin-color);
}
.skin-color-alt{
   color: var(--skin-header-color);
}
.skin-color-alt-hover{
   color: var(--skin-header-color-hover);
}
.skin-link{
   color: var(--skin-link);
}
.skin-link:hover{
   text-decoration: underline;
   color: var(--skin-link);
}
.skin-border{
   border-color: var(--skin-border) !important;
}
.skin-border-alt{
   border-color: var(--skin-header-btn-border) !important;
}
.skin-login-color{
   color: var(--skin-login-color);
}
.css-load:after {
   border-color: --skin-bg;
}
/* LOGIN */
.login a,
.login a:hover{
   color: var(--skin-login-link);
}
.login-btn{
   color: var(--skin-login-btn-color);
   background-color: var(--skin-login-btn);
}
.login-btn:hover{
   color: var(--skin-login-btn-color-hover);
   background-color: var(--skin-login-btn-hover);
}
.logo-natural{
   display: var(--skin-logo-natural);
}
.logo-invert{
   display: var(--skin-logo-invert);
}

/* PANEL */
nav,
header{
   border-color: var(--skin-header-border);
}
header .dd-btn{
   color: var(--skin-header-color);
   border-color: var(--skin-header-btn-border);
}
header .dd-btn:hover{
   color: var(--skin-header-color-hover);
   background-color: var(--skin-header-btn-hover);
}
header #toggle-menu {
   background-color: var(--skin-header-toggle-menu);
}

/* PANEL */
.css-load:after {
   border-color: var(--skin-bg);
}