:root { --menuBackground: rgb(130 0 130); --menuText: rgb(255 255 255); --menuBackgroundH: rgb(0, 133, 0); --menuTextH: rgb(255 255 255); --menuThis: rgb(0 0 0); --menuShadow: rgb(175 175 175); }
menu-frame { font-family: "Guttman Drogolin"; font-size: 16px; column-gap: 7px; margin-inline-start: 7px; padding-block: 1px 2px; user-select: none; }
menu-frame[data-type="upper"] { display: flex; justify-content: center; }
menu-frame[data-type="sider"] { display: inline-flex; flex-direction: column; line-height: 30px; }
menu-group { display: none; unicode-bidi: plaintext; max-height: calc(-150px + 100vh); overflow-x: hidden; font-family: inherit; background-color: var(--menuBackground); box-shadow: var(--menuShadow) 2px 2px 1px 1px; position: absolute; border-radius: 4px; padding-inline: 1px 15px; padding-block: 5px; }
html[lang|="he"] menu-group { text-align: right; }
html[lang|="en"] menu-group { text-align: left; }
menu-item { display: block; cursor: default; font-family: inherit; white-space: nowrap; padding-inline: 3px; border-radius: 4px; box-shadow: var(--menuShadow) 1px 1px 1px 1px; text-shadow: var(--menuShadow) 1px 1px 1px; color: var(--menuText); background-color: var(--menuBackground); margin-block: 2px; position: relative; inline-size: 92px; text-align: center; }
html[lang|="he"] menu-item:last-child > menu-group { left: 0px; }
html[lang|="en"] menu-item:last-child > menu-group { right: 0px; }
menu-item:hover { background-color: var(--menuBackgroundH); color: var(--menuTextH); }
menu-frame[data-type="upper"] menu-item:hover > menu-group { display: block; }
menu-frame[data-type="sider"] menu-item:hover > menu-group { display: inline-block; }
menu-inner { display: block; color: var(--menuText); inline-size: 100%; padding-inline: 3px 0px; border-radius: 4px; line-height: 22px; }
menu-inner:hover { background-color: var(--menuBackgroundH); color: var(--menuTextH); }
menu-frame a { line-height: 22px; padding-inline: 3px 0px; color: var(--menuText); text-decoration: none solid var(--menuText); unicode-bidi: plaintext; }
menu-frame a:hover { color: var(--menuTextH); }
menu-frame menu-group a:link { background-color: var(--menuBackground); color: var(--menuText); }
menu-frame menu-group a:visited { background-color: var(--menuBackground); color: var(--menuText); }
menu-frame menu-group a:hover { background-color: var(--menuBackgroundH); color: var(--menuTextH); }
menu-frame menu-group a { display: block; font-family: inherit; color: var(--menuText); inline-size: 100%; padding-inline: 3px 0px; border-radius: 4px; margin-block: 10px; }
menu-this { display: inline-block; background-color: var(--menuThis); inline-size: 100%; padding-inline: 3px 0px; border-radius: 4px; margin-block: 10px; }
html[lang|="en"] menu-item:has(a[href$="?lang=en&eng"]) { display: none; }
html[lang|="he"] menu-item:has(a[href$="?lang=he&key=home"]) { display: none; }