/*!
(C)2022-2025 by Don Stamey, MacWisdom Systems, http://www.macwisdom.com. All rights reserved.
This module may not be copied, modified, or used without written permission of the above owner.
*/
.cssmenubar {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
	line-height: 1.25;
	white-space: nowrap;
	letter-spacing: normal;
	font-family: "Trebuchet MS", Arial, Verdana, Helvetica, sans-serif;
	font-size: 1rem;
	font-weight: normal;
	color: #def; /*  789, ccf */
	background-color: transparent;

	--li-padding: .3em .4em;
	--hover-text-decoration: 1px underline double #888;
	--hover-background-color: transparent;
}
.cssmenubar ._curpage {
	text-decoration: 2px underline dotted;
	text-underline-position: under;
	text-decoration-color: inherit;
}
.cssmenubar li,
.cssmenubar ul {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}
.cssmenubar li {
	/* the link boxes; change appearance here; <a> inherits from this */
	border-radius: .4em;
	line-height: inherit;
	white-space: inherit;
	letter-spacing: normal;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
	background-color: inherit;
	-moz-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}
.cssmenubar > li {
	display: inline-block;
	letter-spacing: 1px;
}
.cssmenubar li > div,
.cssmenubar li[onclick] {
	padding: var(--li-padding);
	cursor: pointer;
}
.cssmenubar li:hover {
	z-index: 1000;
	position: relative;
}
.cssmenubar li:hover > ul {
	display: block;
}
.cssmenubar li > div,
.cssmenubar li a {
	display: block;
	padding: var(--li-padding);
	line-height: inherit;
	white-space: inherit;
	letter-spacing: inherit;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	text-decoration: none;
	color: inherit;
	background-color: inherit;
}
.cssmenubar li a:hover,
.cssmenubar li[onclick]:hover {
	/* alternates
	filter: brightness(75%);
	filter: drop-shadow(16px 16px 20px blue);
	filter: grayscale(50%);
	filter: saturate(30%);
	filter: sepia(60%);

	filter: invert(25%);
	filter: contrast(50%);
	filter: hue-rotate(180deg);
	filter: opacity(25%);
	filter: none;

	transform: scale(1.1);

	opacity: 75%;
	opacity: 50%;

	text-decoration: 1px underline double #888;
	text-underline-position: under;
	text-underline-offset: 0;

	color: var(--hover-color);
	outline: 1px solid #888;
	*/
	text-decoration: var(--hover-text-decoration);
	text-underline-position: under;
	text-underline-offset: 0;
	background-color: var(--hover-background-color);
}
.cssmenubar li > div::after {
	content: "\25BC";
	margin-left: .2em;
	font-size: 80%;
}
.cssmenubar ul {
	/* the pop-down menu container */
	display: none;
	z-index: 1000;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 5em;
	padding: 2px 1px;
	border: 1px solid #888;
	box-shadow: 3px 3px #888;
	text-align: left;
	color: #000;
	background-color: #fff;
}
.cssmenubar ul ul {
	top: 1px;
	left: 99%;
}
.cssmenubar ul._popDownToLeft {
	/* add this class to a popdown <ul> to make is pop-down to the left */
	left: auto;
	right: 0;
}
.cssmenubar ul li:empty {
	/* submenu divider line */
	line-height: 8px;
	margin: 2px 0 0 0;
	padding: 0;
	border-top: 1px solid #888;
}



.cssmenubar-mobile {
	margin: 0;
	padding: 1em;
	padding-top: .5em;
	line-height: 1.25;
	font-family: "Trebuchet MS", Arial, Verdana, Helvetica, sans-serif;
	font-size: 1.25rem;
	font-weight: normal;
	color: #000;
	background-color: #fff;
	letter-spacing: normal;
	list-style: none;
}
.cssmenubar-mobile li,
.cssmenubar-mobile ul {
	list-style: none;
}
.cssmenubar-mobile a {
	text-decoration: none;
	color: inherit;
}
.cssmenubar-mobile ._curpage {
	text-decoration: 2px underline dotted;
	text-underline-position: under;
	text-decoration-color: inherit;
}
.cssmenubar-mobile li > div,
.cssmenubar-mobile [onclick] {
	cursor: pointer;
}
.cssmenubar-mobile li,
.cssmenubar-mobile li > div,
.cssmenubar-mobile td[onclick] {
	display: block;
	border-radius: .4em;
	padding: .5em;
	letter-spacing: inherit;
	white-space: nowrap;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
	background-color: inherit;
	-moz-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}
.cssmenubar-mobile li a,
.cssmenubar-mobile li[onclick] {
	color: #00f;
}
.cssmenubar-mobile li a:hover,
.cssmenubar-mobile li[onclick]:hover {
	text-decoration: 1px double underline;
}
.cssmenubar-mobile li > div {
	padding: 0;
}
.cssmenubar-mobile li > div::after {
	margin-left: 5px;
	font-size: 80%;
	content: "\25BC";
}
.cssmenubar-mobile li > div[data-hide]::after {
	margin-left: 5px;
	font-size: 80%;
	content: "\25B6";
}
.cssmenubar-mobile ul {
	margin-top: 3px;
}
.cssmenubar-mobile li:empty {
	display: none;
}

.cssmenubar-mobile table {
	margin-left: 2em;
	margin-top: .5em;
}
.cssmenubar-mobile li kbd {
	display: none;
}
