/* rMenu CC[BY:NC:SA] Jan Kaluza 2023 */
/* define the colours */
:root {
 --menu-bar: #ddc; /* #654;  #888;*/
 --menu-toggle: #333;
 --menu-item-bg: #444;
 --menu-item-fg: #eee;
 --menu-item-active-bg: #933; /* #399; */
 --menu-item-active-fg: #eee;
 --menu-item-hover-bg: #c93; /* #eee; */
 --menu-item-hover-fg: #444;
 --bread-fg: #000;
 --bread-bg: #fc9;
 --bread-ln: #333;
}
/* breadcrumb styling */
.bread { font-size: 80%; color: var(--bread-fg); float: right;
 background: var(--bread-bg); padding: 2px; border-radius:4px;
}
.bread a { color: var(--bread-ln); text-decoration: none; }
/* drop-dowm menu css */
#menu { font-family: sans; }
#menu ul { margin: 0; padding: 0; }
#menu .main-menu { display: none; }
#tm:checked + .main-menu { display: block; border-radius: 8px; }
#menu input[type="checkbox"], #menu ul span.drop-icon { display: none; }
#menu li,
#toggle-menu,
#menu .sub-menu {
 border-style: solid;
 border-color: rgba(0, 0, 0, .05);
 border-radius: 8px;
}
#menu li,
#toggle-menu {
 border-width: 0 0 1px;
 border-radius: 8px;
}
#menu .sub-menu {
 background-color: var(--menu-item-bg); /* #444; */
 border-width: 1px 1px 0;
 margin: 0 1em;
}
#menu .sub-menu li:last-child {
 border-width: 0;
}
#menu li,
#toggle-menu,
#menu a {
 position: relative;
 display: block;
 color: var(--menu-item-fg);
 background-color: var(--menu-item-bg);  /* #444; jk */
 text-shadow: 1px 1px 0 rgba(0, 0, 0, .125);
 border-radius: 8px;
}
#menu a.active {
 color: var(--menu-item-active-fg);
 background-color: var(--menu-item-active-bg);
}
#menu {
 background-color: var(--menu-bar); /* #09c; */
 min-height: 2.75em;
 border-radius: 8px;
}
#toggle-menu {
 background: var(--menu-toggle); /* #333;*/
}
#toggle-menu,
#menu a {
 padding: 1em 1.5em;
}
#menu a {
 transition: all .125s ease-in-out;
 -webkit-transition: all .125s ease-in-out;
}
#menu a:hover {
 background-color: var(--menu-item-hover-bg); /* white; */
 color: var(--menu-item-hover-fg); /* #333 -=- #09c; */
}
#menu .sub-menu {
 display: none;
}
#menu input[type="checkbox"]:checked + .sub-menu {
 display: block;
}
#menu .sub-menu a:hover {
 color: var(--menu-item-hover-fg); /* #444; */
}
#toggle-menu .drop-icon,
#menu li label.drop-icon {
 position: absolute;
 right: 0;
 top: 0;
}
#menu label.drop-icon, #toggle-menu span.drop-icon {
 padding: 1em;
 font-size: 1em;
 text-align: center;
 background-color: rgba(0, 0, 0, .125);
 text-shadow: 0 0 0 transparent;
 color: rgba(255, 255, 255, .75);
}

@media only screen and (min-width: 820px) { /*  1024px) { */
 #menu .main-menu { display: block; }
 #toggle-menu, #menu label.drop-icon { display: none; }
 #menu ul span.drop-icon { display: inline-block; }
 #menu li { float: left; border-width: 0 1px 0 0; }
 #menu .sub-menu li { float: none; }
 #menu .sub-menu { border-width: 0; margin: 0; position: absolute; top: 100%; left: 0; width: 12em; z-index: 5; }
 #menu .sub-menu, #menu input[type="checkbox"]:checked + .sub-menu { display: none; }
 #menu .sub-menu li { border-width: 0 0 1px; }
 #menu .sub-menu .sub-menu { top: 0; left: 100%; }
 #menu .sub-menu .drop-icon { position: absolute; top: 0; right: 0; padding: 1em; }
 #menu li:hover > input[type="checkbox"] + .sub-menu { display: block; }
}