j1-template 2022.5.0 → 2022.5.1

data/assets/themes/j1/modules/mmenuLight/css/mmenu-light.css

@@ -1,13 +1,13 @@
 /*
  # -----------------------------------------------------------------------------
  #  ~/assets/themes/j1/modules/mmenu_light/css/mmenu.css
- #  Provides base styles for Mobile Menu light (v3.0.5)
+ #  Provides base styles for Mobile Menu light (v3.1.1, April 2022)
  #
  #  Product/Info:
  #  https://jekyll.one
  #  https://github.com/FrDH/mmenu-light
  #
- #  Copyright (C) 2020 Fred Heusschen
+ #  Copyright (C) 2022 Fred Heusschen
  #  Copyright (C) 2022 Juergen Adams
  #
  #  J1 Template is licensed under MIT License.
@@ -18,116 +18,104 @@
 */
 
 :root {
-  --mm-ocd-width: 80%;
-  --mm-ocd-min-width: 200px;
-  --mm-ocd-max-width: 440px
+	--mm-ocd-width: 80%;
+	--mm-ocd-min-width: 200px;
+	--mm-ocd-max-width: 440px
 }
 
 body.mm-ocd-opened {
-  overflow-y: hidden;
-  -ms-scroll-chaining: none;
-  overscroll-behavior: none
+	overflow-y: hidden;
+	-ms-scroll-chaining: none;
+	overscroll-behavior: none
 }
 
-/*
-  jadams, 2020-06-20: CSS/Offset to the NAV bar should be calculted
-  at runtime as a dyn style
-*/
 .mm-ocd {
-  position: fixed;
-  top: 80px; /* jadams, 2020-06-20: offset to the NAV bar */
-  right: 0;
-  bottom: 100%;
-  left: 0;
-  z-index: 9999;
-  overflow: hidden;
-  -ms-scroll-chaining: none;
-  overscroll-behavior: contain;
-  background: rgba(0, 0, 0, 0);
-  -webkit-transition-property: bottom, background-color;
-  -o-transition-property: bottom, background-color;
-  transition-property: bottom, background-color;
-  -webkit-transition-duration: 0s, .3s;
-  -o-transition-duration: 0s, .3s;
-  transition-duration: 0s, .3s;
-  -webkit-transition-timing-function: ease;
-  -o-transition-timing-function: ease;
-  transition-timing-function: ease;
-  -webkit-transition-delay: .45s, .15s;
-  -o-transition-delay: .45s, .15s;
-  transition-delay: .45s, .15s
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 100%;
+	left: 0;
+	z-index: 9999;
+	overflow: hidden;
+	-ms-scroll-chaining: none;
+	overscroll-behavior: contain;
+	background: rgba(0, 0, 0, 0);
+	-webkit-transition-property: bottom, background-color;
+	-o-transition-property: bottom, background-color;
+	transition-property: bottom, background-color;
+	-webkit-transition-duration: 0s, .3s;
+	-o-transition-duration: 0s, .3s;
+	transition-duration: 0s, .3s;
+	-webkit-transition-timing-function: ease;
+	-o-transition-timing-function: ease;
+	transition-timing-function: ease;
+	-webkit-transition-delay: .45s, .15s;
+	-o-transition-delay: .45s, .15s;
+	transition-delay: .45s, .15s
 }
 
 .mm-ocd--open {
-  bottom: 0;
-  background: rgba(0, 0, 0, .25);
-  -webkit-transition-delay: 0s;
-  -o-transition-delay: 0s;
-  transition-delay: 0s
+	bottom: 0;
+	background: rgba(0, 0, 0, .25);
+	-webkit-transition-delay: 0s;
+	-o-transition-delay: 0s;
+	transition-delay: 0s
 }
 
 .mm-ocd__content {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  z-index: 2;
-  width: 80%;
-  width: var(--mm-ocd-width);
-  min-width: 200px;
-  min-width: var(--mm-ocd-min-width);
-  max-width: 440px;
-  max-width: var(--mm-ocd-max-width);
-  background: #fff;
-  -webkit-transition-property: -webkit-transform;
-  transition-property: -webkit-transform;
-  -o-transition-property: transform;
-  transition-property: transform;
-  transition-property: transform, -webkit-transform;
-  -webkit-transition-duration: .3s;
-  -o-transition-duration: .3s;
-  transition-duration: .3s;
-  -webkit-transition-timing-function: ease;
-  -o-transition-timing-function: ease;
-  transition-timing-function: ease
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	z-index: 2;
+	width: var(--mm-ocd-width);
+	min-width: var(--mm-ocd-min-width);
+	max-width: var(--mm-ocd-max-width);
+	background: #fff;
+	-webkit-transition-property: -webkit-transform;
+	transition-property: -webkit-transform;
+	-o-transition-property: transform;
+	transition-property: transform;
+	transition-property: transform, -webkit-transform;
+	-webkit-transition-duration: .3s;
+	-o-transition-duration: .3s;
+	transition-duration: .3s;
+	-webkit-transition-timing-function: ease;
+	-o-transition-timing-function: ease;
+	transition-timing-function: ease
 }
 
 .mm-ocd--left .mm-ocd__content {
-  left: 0;
-  -webkit-transform: translate3d(-100%, 0, 0);
-  transform: translate3d(-100%, 0, 0)
+	left: 0;
+	-webkit-transform: translate3d(-100%, 0, 0);
+	transform: translate3d(-100%, 0, 0)
 }
 
 .mm-ocd--right .mm-ocd__content {
-  right: 0;
-  -webkit-transform: translate3d(100%, 0, 0);
-  transform: translate3d(100%, 0, 0)
+	right: 0;
+	-webkit-transform: translate3d(100%, 0, 0);
+	transform: translate3d(100%, 0, 0)
 }
 
 .mm-ocd--open .mm-ocd__content {
-  -webkit-transform: translate3d(0, 0, 0);
-  transform: translate3d(0, 0, 0)
+	-webkit-transform: translate3d(0, 0, 0);
+	transform: translate3d(0, 0, 0)
 }
 
 .mm-ocd__backdrop {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  z-index: 3;
-  width: calc(100% - 80%);
-  width: calc(100% - var(--mm-ocd-width));
-  min-width: calc(100% - 440px);
-  min-width: calc(100% - var(--mm-ocd-max-width));
-  max-width: calc(100% - 200px);
-  max-width: calc(100% - var(--mm-ocd-min-width));
-  background: rgba(3, 2, 1, 0)
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	z-index: 3;
+	width: clamp(calc(100% - var(--mm-ocd-max-width)), calc(100% - var(--mm-ocd-width)), calc(100% - var(--mm-ocd-min-width)));
+	background: rgba(3, 2, 1, 0)
 }
 
 .mm-ocd--left .mm-ocd__backdrop {
-  right: 0
+	right: 0
 }
 
 .mm-ocd--right .mm-ocd__backdrop {
-  left: 0
+	left: 0
 }
 
 .mm-spn,
@@ -135,259 +123,252 @@ body.mm-ocd-opened {
 .mm-spn li,
 .mm-spn span,
 .mm-spn ul {
-  display: block;
-  padding: 0;
-  margin: 0;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box
+	display: block;
+	padding: 0;
+	margin: 0;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box
 }
 
 :root {
-  --mm-spn-item-height: 50px;
-  --mm-spn-item-indent: 20px;
-  --mm-spn-line-height: 24px
+	--mm-spn-item-height: 50px;
+	--mm-spn-item-indent: 20px;
+	--mm-spn-line-height: 24px
 }
 
 .mm-spn {
-  width: 100%;
-  height: 100%;
-  -webkit-tap-highlight-color: transparent;
-  -webkit-overflow-scrolling: touch;
-  overflow: hidden;
-  -webkit-clip-path: inset(0 0 0 0);
-  clip-path: inset(0 0 0 0);
-  -webkit-transform: translateX(0);
-  -ms-transform: translateX(0);
-  transform: translateX(0)
+	width: 100%;
+	height: 100%;
+	-webkit-tap-highlight-color: transparent;
+	-webkit-overflow-scrolling: touch;
+	overflow: hidden;
+	-webkit-clip-path: inset(0 0 0 0);
+	clip-path: inset(0 0 0 0);
+	-webkit-transform: translateX(0);
+	-ms-transform: translateX(0);
+	transform: translateX(0)
 }
 
 .mm-spn ul {
-  -webkit-overflow-scrolling: touch;
-  position: fixed;
-  top: 0;
-  left: 100%;
-  bottom: 0;
-  z-index: 2;
-  width: 130%;
-  padding-right: 30%;
-  line-height: 24px;
-  line-height: var(--mm-spn-line-height);
-  overflow: visible;
-  overflow-y: auto;
-  background: inherit;
-  -webkit-transition: left .3s ease 0s;
-  -o-transition: left .3s ease 0s;
-  transition: left .3s ease 0s;
-  cursor: default
+	-webkit-overflow-scrolling: touch;
+	position: fixed;
+	top: 0;
+	left: 100%;
+	bottom: 0;
+	z-index: 2;
+	width: 130%;
+	padding-right: 30%;
+	line-height: var(--mm-spn-line-height);
+	overflow: visible;
+	overflow-y: auto;
+	background: inherit;
+	-webkit-transition: left .3s ease 0s;
+	-o-transition: left .3s ease 0s;
+	transition: left .3s ease 0s;
+	cursor: default
 }
 
 .mm-spn ul:after {
-  content: '';
-  display: block;
-  height: 50px;
-  height: var(--mm-spn-item-height)
+	content: "";
+	display: block;
+	height: var(--mm-spn-item-height)
 }
 
 .mm-spn>ul {
-  left: 0
+	left: 0
 }
 
 .mm-spn ul.mm-spn--open {
-  left: 0
+	left: 0
 }
 
+/*
 .mm-spn ul.mm-spn--parent {
-  left: -30%;
-  overflow-y: hidden
+	left: -30%;
+	overflow-y: hidden
 }
+*/
 
-.mm-spn li {
+/* jadams, 2022-08-13: enable scrolling like for TOCs */
+
+.mm-spn ul.mm-spn--parent {
+  left: -30%;
+  overflow-y: scroll;
   position: relative;
-  background: inherit;
-  cursor: pointer
+}
+.mm-spn li {
+	position: relative;
+	background: inherit;
+	cursor: pointer
 }
 
+/* jadams, 2022-08-13: highlight (opacity) the NEXT button element */
 .mm-spn li:before {
-  content: '';
-  display: block;
-  position: absolute;
-  top: 25px;
-  top: calc(var(--mm-spn-item-height)/ 2);
-  right: 25px;
-  right: calc(var(--mm-spn-item-height)/ 2);
-  z-index: 0;
-  width: 10px;
-  height: 10px;
-  border-top: 2px solid;
-  border-right: 2px solid;
-  -webkit-transform: rotate(45deg) translate(0, -50%);
-  -ms-transform: rotate(45deg) translate(0, -50%);
-  transform: rotate(45deg) translate(0, -50%);
-  opacity: .4
+	content: "";
+	display: block;
+	position: absolute;
+	top: calc(var(--mm-spn-item-height)/ 2);
+	right: calc(var(--mm-spn-item-height)/ 2);
+	z-index: 0;
+	width: 10px;
+	height: 10px;
+	border-top: 2px solid;
+	border-right: 2px solid;
+	-webkit-transform: rotate(45deg) translate(0, -50%);
+	-ms-transform: rotate(45deg) translate(0, -50%);
+	transform: rotate(45deg) translate(0, -50%);
+	opacity: 1.0;
 }
 
 .mm-spn li:after {
-  content: '';
-  display: block;
-  margin-left: 20px;
-  margin-left: var(--mm-spn-item-indent);
-  border-top: 1px solid;
-  opacity: .15
+	content: "";
+	display: block;
+	margin-left: var(--mm-spn-item-indent);
+	border-top: 1px solid;
+	opacity: .15
 }
 
 .mm-spn a,
 .mm-spn span {
-  position: relative;
-  z-index: 1;
-  padding: 13px 20px;
-  padding: calc((var(--mm-spn-item-height) - var(--mm-spn-line-height))/ 2) var(--mm-spn-item-indent)
+	position: relative;
+	z-index: 1;
+	padding: calc((var(--mm-spn-item-height) - var(--mm-spn-line-height))/ 2) var(--mm-spn-item-indent)
 }
 
 .mm-spn a {
-  background: inherit;
-  color: inherit;
-  text-decoration: none;
-  border-bottom: unset;                                                         /* jadams, 2022-05-06: remove dotted link decoration */
+	background: inherit;
+	color: inherit;
+	text-decoration: none
 }
 
 .mm-spn a:not(:last-child) {
-  width: calc(100% - 50px);
-  width: calc(100% - var(--mm-spn-item-height))
+	width: calc(100% - var(--mm-spn-item-height))
 }
 
 .mm-spn a:not(:last-child):after {
-  content: '';
-  display: block;
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  border-right: 1px solid;
-  opacity: .15
+	content: "";
+	display: block;
+	position: absolute;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	border-right: 1px solid;
+	opacity: .15
 }
 
 .mm-spn span {
-  background: 0 0
+	background: 0 0
 }
 
 .mm-spn.mm-spn--navbar {
-  cursor: pointer
+	cursor: pointer
 }
 
+/* jadams, 2022-08-13: highlight (opacity) the NEXT button element */
 .mm-spn.mm-spn--navbar:before {
-  content: '';
-  display: block;
-  position: absolute;
-  top: 25px;
-  top: calc(var(--mm-spn-item-height)/ 2);
-  left: 20px;
-  left: var(--mm-spn-item-indent);
-  width: 10px;
-  height: 10px;
-  margin-top: 2px;
-  border-top: 2px solid;
-  border-left: 2px solid;
-  -webkit-transform: rotate(-45deg) translate(50%, -50%);
-  -ms-transform: rotate(-45deg) translate(50%, -50%);
-  transform: rotate(-45deg) translate(50%, -50%);
-  opacity: .4
+	content: "";
+	display: block;
+	position: absolute;
+	top: calc(var(--mm-spn-item-height)/ 2);
+	left: var(--mm-spn-item-indent);
+	width: 10px;
+	height: 10px;
+	margin-top: 2px;
+	border-top: 2px solid;
+	border-left: 2px solid;
+	-webkit-transform: rotate(-45deg) translate(50%, -50%);
+	-ms-transform: rotate(-45deg) translate(50%, -50%);
+	transform: rotate(-45deg) translate(50%, -50%);
+	opacity: 1.0;
+}
+
+/* jadams, 2022-08-13: highlight (opacity) the NEXT button element */
+.mm-spn.mm-spn--navbar:after {
+	content: attr(data-mm-spn-title);
+	display: block;
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	height: var(--mm-spn-item-height);
+	padding: 0 calc(var(--mm-spn-item-indent) * 2);
+	line-height: var(--mm-spn-item-height);
+	text-align: center;
+	overflow: hidden;
+	white-space: nowrap;
+	-o-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+  opacity: 1.0;
 }
 
 .mm-spn.mm-spn--navbar.mm-spn--main {
-  cursor: default
+	cursor: default
 }
 
 .mm-spn.mm-spn--navbar.mm-spn--main:before {
-  content: none;
-  display: none
-}
-
-.mm-spn.mm-spn--navbar:after {
-  content: attr(data-mm-spn-title);
-  display: block;
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  height: 50px;
-  height: var(--mm-spn-item-height);
-  padding: 0 40px;
-  padding: 0 calc(var(--mm-spn-item-indent) * 2);
-  line-height: 50px;
-  line-height: var(--mm-spn-item-height);
-  opacity: .4;
-  text-align: left;  /* jadams, 2020-06-20: set menu title to the left */
-  overflow: hidden;
-  white-space: nowrap;
-  -o-text-overflow: ellipsis;
-  text-overflow: ellipsis;
-  font-size: x-large; /* jadams, 2020-06-20: increase size of the menu title */
+	content: none;
+	display: none
 }
 
 .mm-spn.mm-spn--navbar.mm-spn--main:after {
-  padding-left: 20px;
-  padding-left: var(--mm-spn-item-indent)
+	padding-left: var(--mm-spn-item-indent)
 }
 
 .mm-spn.mm-spn--navbar ul {
-  top: 51px;
-  top: calc(var(--mm-spn-item-height) + 1px)
+	top: calc(var(--mm-spn-item-height) + 1px)
 }
 
 .mm-spn.mm-spn--navbar ul:before {
-  content: '';
-  display: block;
-  position: fixed;
-  top: inherit;
-  z-index: 2;
-  width: 100%;
-  border-top: 1px solid currentColor;
-  opacity: .15
+	content: "";
+	display: block;
+	position: fixed;
+	top: inherit;
+	z-index: 2;
+	width: 100%;
+	border-top: 1px solid currentColor;
+	opacity: .15
 }
 
 .mm-spn.mm-spn--light {
-  color: #444;
-  background: #f3f3f3
+	color: #444;
+	background: #f3f3f3
 }
 
-/* jadams, 2020-06-20: set j1 template colors (dark theme) */
 .mm-spn.mm-spn--dark {
-  color: #e3e3e3;
-  background: #191919
+	color: #ddd;
+	background: #333
 }
 
 .mm-spn.mm-spn--vertical {
-  overflow-y: auto
+	overflow-y: auto
 }
 
 .mm-spn.mm-spn--vertical ul {
-  width: 100%;
-  padding-right: 0;
-  position: static
+	width: 100%;
+	padding-right: 0;
+	position: static
 }
 
 .mm-spn.mm-spn--vertical ul ul {
-  display: none;
-  padding-left: 20px;
-  padding-left: var(--mm-spn-item-indent)
+	display: none;
+	padding-left: var(--mm-spn-item-indent)
 }
 
 .mm-spn.mm-spn--vertical ul ul:after {
-  height: 25px;
-  height: calc(var(--mm-spn-item-height)/ 2)
+	height: calc(var(--mm-spn-item-height)/ 2)
 }
 
 .mm-spn.mm-spn--vertical ul.mm-spn--open {
-  display: block
+	display: block
 }
 
 .mm-spn.mm-spn--vertical li.mm-spn--open:before {
-  -webkit-transform: rotate(135deg) translate(-50%, 0);
-  -ms-transform: rotate(135deg) translate(-50%, 0);
-  transform: rotate(135deg) translate(-50%, 0)
+	-webkit-transform: rotate(135deg) translate(-50%, 0);
+	-ms-transform: rotate(135deg) translate(-50%, 0);
+	transform: rotate(135deg) translate(-50%, 0)
 }
 
 .mm-spn.mm-spn--vertical ul ul li:last-child:after {
-  content: none;
-  display: none
+	content: none;
+	display: none
 }

data/assets/themes/j1/modules/mmenuLight/css/mmenu-light.min.css

@@ -1,13 +1,13 @@
 /*
  # -----------------------------------------------------------------------------
  #  ~/assets/themes/j1/modules/mmenu_light/css/mmenu.min.css
- #  Provides base styles for mobile menu light
+ #  Provides base styles for Mobile Menu light (v3.1.1, April 2022)
  #
  #  Product/Info:
  #  https://jekyll.one
  #  https://github.com/FrDH/mmenu-light
  #
- #  Copyright (C) 2020 Fred Heusschen
+ #  Copyright (C) 2022 Fred Heusschen
  #  Copyright (C) 2022 Juergen Adams
  #
  #  J1 Template is licensed under MIT License.
@@ -17,4 +17,4 @@
  #
  # -----------------------------------------------------------------------------
 */
-:root{--mm-ocd-width:80%;--mm-ocd-min-width:200px;--mm-ocd-max-width:440px}body.mm-ocd-opened{overflow-y:hidden;-ms-scroll-chaining:none;overscroll-behavior:none}.mm-ocd{position:fixed;top:80px;right:0;bottom:100%;left:0;z-index:9999;overflow:hidden;-ms-scroll-chaining:none;overscroll-behavior:contain;background:rgba(0,0,0,0);-webkit-transition-property:bottom,background-color;-o-transition-property:bottom,background-color;transition-property:bottom,background-color;-webkit-transition-duration:0,.3s;-o-transition-duration:0,.3s;transition-duration:0,.3s;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease;-webkit-transition-delay:.45s,.15s;-o-transition-delay:.45s,.15s;transition-delay:.45s,.15s}.mm-ocd--open{bottom:0;background:rgba(0,0,0,.25);-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}.mm-ocd__content{position:absolute;top:0;bottom:0;z-index:2;width:80%;width:var(--mm-ocd-width);min-width:200px;min-width:var(--mm-ocd-min-width);max-width:440px;max-width:var(--mm-ocd-max-width);background:#fff;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.mm-ocd--left .mm-ocd__content{left:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.mm-ocd--right .mm-ocd__content{right:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.mm-ocd--open .mm-ocd__content{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.mm-ocd__backdrop{position:absolute;top:0;bottom:0;z-index:3;width:calc(100% - 80%);width:calc(100% - var(--mm-ocd-width));min-width:calc(100% - 440px);min-width:calc(100% - var(--mm-ocd-max-width));max-width:calc(100% - 200px);max-width:calc(100% - var(--mm-ocd-min-width));background:rgba(3,2,1,0)}.mm-ocd--left .mm-ocd__backdrop{right:0}.mm-ocd--right .mm-ocd__backdrop{left:0}.mm-spn,.mm-spn a,.mm-spn li,.mm-spn span,.mm-spn ul{display:block;padding:0;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box}:root{--mm-spn-item-height:50px;--mm-spn-item-indent:20px;--mm-spn-line-height:24px}.mm-spn{width:100%;height:100%;-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch;overflow:hidden;-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0);-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}.mm-spn ul{-webkit-overflow-scrolling:touch;position:fixed;top:0;left:100%;bottom:0;z-index:2;width:130%;padding-right:30%;line-height:24px;line-height:var(--mm-spn-line-height);overflow:visible;overflow-y:auto;background:inherit;-webkit-transition:left .3s ease 0;-o-transition:left .3s ease 0;transition:left .3s ease 0;cursor:default}.mm-spn ul:after{content:'';display:block;height:50px;height:var(--mm-spn-item-height)}.mm-spn>ul{left:0}.mm-spn ul.mm-spn--open{left:0}.mm-spn ul.mm-spn--parent{left:-30%;overflow-y:hidden}.mm-spn li{position:relative;background:inherit;cursor:pointer}.mm-spn li:before{content:'';display:block;position:absolute;top:25px;top:calc(var(--mm-spn-item-height)/ 2);right:25px;right:calc(var(--mm-spn-item-height)/ 2);z-index:0;width:10px;height:10px;border-top:2px solid;border-right:2px solid;-webkit-transform:rotate(45deg) translate(0,-50%);-ms-transform:rotate(45deg) translate(0,-50%);transform:rotate(45deg) translate(0,-50%);opacity:.4}.mm-spn li:after{content:'';display:block;margin-left:20px;margin-left:var(--mm-spn-item-indent);border-top:1px solid;opacity:.15}.mm-spn a,.mm-spn span{position:relative;z-index:1;padding:13px 20px;padding:calc((var(--mm-spn-item-height) - var(--mm-spn-line-height))/ 2) var(--mm-spn-item-indent)}.mm-spn a{background:inherit;color:inherit;text-decoration:none;border-bottom:unset}.mm-spn a:not(:last-child){width:calc(100% - 50px);width:calc(100% - var(--mm-spn-item-height))}.mm-spn a:not(:last-child):after{content:'';display:block;position:absolute;top:0;right:0;bottom:0;border-right:1px solid;opacity:.15}.mm-spn span{background:0}.mm-spn.mm-spn--navbar{cursor:pointer}.mm-spn.mm-spn--navbar:before{content:'';display:block;position:absolute;top:25px;top:calc(var(--mm-spn-item-height)/ 2);left:20px;left:var(--mm-spn-item-indent);width:10px;height:10px;margin-top:2px;border-top:2px solid;border-left:2px solid;-webkit-transform:rotate(-45deg) translate(50%,-50%);-ms-transform:rotate(-45deg) translate(50%,-50%);transform:rotate(-45deg) translate(50%,-50%);opacity:.4}.mm-spn.mm-spn--navbar.mm-spn--main{cursor:default}.mm-spn.mm-spn--navbar.mm-spn--main:before{content:none;display:none}.mm-spn.mm-spn--navbar:after{content:attr(data-mm-spn-title);display:block;position:absolute;top:0;left:0;right:0;height:50px;height:var(--mm-spn-item-height);padding:0 40px;padding:0 calc(var(--mm-spn-item-indent) * 2);line-height:50px;line-height:var(--mm-spn-item-height);opacity:.4;text-align:left;overflow:hidden;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;font-size:x-large}.mm-spn.mm-spn--navbar.mm-spn--main:after{padding-left:20px;padding-left:var(--mm-spn-item-indent)}.mm-spn.mm-spn--navbar ul{top:51px;top:calc(var(--mm-spn-item-height)+1px)}.mm-spn.mm-spn--navbar ul:before{content:'';display:block;position:fixed;top:inherit;z-index:2;width:100%;border-top:1px solid currentColor;opacity:.15}.mm-spn.mm-spn--light{color:#444;background:#f3f3f3}.mm-spn.mm-spn--dark{color:#e3e3e3;background:#191919}.mm-spn.mm-spn--vertical{overflow-y:auto}.mm-spn.mm-spn--vertical ul{width:100%;padding-right:0;position:static}.mm-spn.mm-spn--vertical ul ul{display:none;padding-left:20px;padding-left:var(--mm-spn-item-indent)}.mm-spn.mm-spn--vertical ul ul:after{height:25px;height:calc(var(--mm-spn-item-height)/ 2)}.mm-spn.mm-spn--vertical ul.mm-spn--open{display:block}.mm-spn.mm-spn--vertical li.mm-spn--open:before{-webkit-transform:rotate(135deg) translate(-50%,0);-ms-transform:rotate(135deg) translate(-50%,0);transform:rotate(135deg) translate(-50%,0)}.mm-spn.mm-spn--vertical ul ul li:last-child:after{content:none;display:none}
+:root {--mm-ocd-width: 80%;--mm-ocd-min-width: 200px;--mm-ocd-max-width: 440px }body.mm-ocd-opened {overflow-y: hidden;-ms-scroll-chaining: none;overscroll-behavior: none }.mm-ocd {position: fixed;top: 0;right: 0;bottom: 100%;left: 0;z-index: 9999;overflow: hidden;-ms-scroll-chaining: none;overscroll-behavior: contain;background: rgba(0, 0, 0, 0);-webkit-transition-property: bottom, background-color;-o-transition-property: bottom, background-color;transition-property: bottom, background-color;-webkit-transition-duration: 0s, .3s;-o-transition-duration: 0s, .3s;transition-duration: 0s, .3s;-webkit-transition-timing-function: ease;-o-transition-timing-function: ease;transition-timing-function: ease;-webkit-transition-delay: .45s, .15s;-o-transition-delay: .45s, .15s;transition-delay: .45s, .15s }.mm-ocd--open {bottom: 0;background: rgba(0, 0, 0, .25);-webkit-transition-delay: 0s;-o-transition-delay: 0s;transition-delay: 0s }.mm-ocd__content {position: absolute;top: 0;bottom: 0;z-index: 2;width: var(--mm-ocd-width);min-width: var(--mm-ocd-min-width);max-width: var(--mm-ocd-max-width);background: #fff;-webkit-transition-property: -webkit-transform;transition-property: -webkit-transform;-o-transition-property: transform;transition-property: transform;transition-property: transform, -webkit-transform;-webkit-transition-duration: .3s;-o-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: ease;-o-transition-timing-function: ease;transition-timing-function: ease }.mm-ocd--left .mm-ocd__content {left: 0;-webkit-transform: translate3d(-100%, 0, 0);transform: translate3d(-100%, 0, 0) }.mm-ocd--right .mm-ocd__content {right: 0;-webkit-transform: translate3d(100%, 0, 0);transform: translate3d(100%, 0, 0) }.mm-ocd--open .mm-ocd__content {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0) }.mm-ocd__backdrop {position: absolute;top: 0;bottom: 0;z-index: 3;width: clamp(calc(100% - var(--mm-ocd-max-width)), calc(100% - var(--mm-ocd-width)), calc(100% - var(--mm-ocd-min-width)));background: rgba(3, 2, 1, 0) }.mm-ocd--left .mm-ocd__backdrop {right: 0 }.mm-ocd--right .mm-ocd__backdrop {left: 0 }.mm-spn, .mm-spn a, .mm-spn li, .mm-spn span, .mm-spn ul {display: block;padding: 0;margin: 0;-webkit-box-sizing: border-box;box-sizing: border-box }:root {--mm-spn-item-height: 50px;--mm-spn-item-indent: 20px;--mm-spn-line-height: 24px }.mm-spn {width: 100%;height: 100%;-webkit-tap-highlight-color: transparent;-webkit-overflow-scrolling: touch;overflow: hidden;-webkit-clip-path: inset(0 0 0 0);clip-path: inset(0 0 0 0);-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0) }.mm-spn ul {-webkit-overflow-scrolling: touch;position: fixed;top: 0;left: 100%;bottom: 0;z-index: 2;width: 130%;padding-right: 30%;line-height: var(--mm-spn-line-height);overflow: visible;overflow-y: auto;background: inherit;-webkit-transition: left .3s ease 0s;-o-transition: left .3s ease 0s;transition: left .3s ease 0s;cursor: default }.mm-spn ul:after {content: "";display: block;height: var(--mm-spn-item-height) }.mm-spn>ul {left: 0 }.mm-spn ul.mm-spn--open {left: 0 }.mm-spn ul.mm-spn--parent {left: -30%;overflow-y: scroll;position: relative;}.mm-spn li {position: relative;background: inherit;cursor: pointer }.mm-spn li:before {content: "";display: block;position: absolute;top: calc(var(--mm-spn-item-height)/ 2);right: calc(var(--mm-spn-item-height)/ 2);z-index: 0;width: 10px;height: 10px;border-top: 2px solid;border-right: 2px solid;-webkit-transform: rotate(45deg) translate(0, -50%);-ms-transform: rotate(45deg) translate(0, -50%);transform: rotate(45deg) translate(0, -50%);opacity: 1.0;}.mm-spn li:after {content: "";display: block;margin-left: var(--mm-spn-item-indent);border-top: 1px solid;opacity: .15 }.mm-spn a, .mm-spn span {position: relative;z-index: 1;padding: calc((var(--mm-spn-item-height) - var(--mm-spn-line-height))/ 2) var(--mm-spn-item-indent) }.mm-spn a {background: inherit;color: inherit;text-decoration: none }.mm-spn a:not(:last-child) {width: calc(100% - var(--mm-spn-item-height)) }.mm-spn a:not(:last-child):after {content: "";display: block;position: absolute;top: 0;right: 0;bottom: 0;border-right: 1px solid;opacity: .15 }.mm-spn span {background: 0 0 }.mm-spn.mm-spn--navbar {cursor: pointer }.mm-spn.mm-spn--navbar:before {content: "";display: block;position: absolute;top: calc(var(--mm-spn-item-height)/ 2);left: var(--mm-spn-item-indent);width: 10px;height: 10px;margin-top: 2px;border-top: 2px solid;border-left: 2px solid;-webkit-transform: rotate(-45deg) translate(50%, -50%);-ms-transform: rotate(-45deg) translate(50%, -50%);transform: rotate(-45deg) translate(50%, -50%);opacity: 1.0;}.mm-spn.mm-spn--navbar:after {content: attr(data-mm-spn-title);display: block;position: absolute;top: 0;left: 0;right: 0;height: var(--mm-spn-item-height);padding: 0 calc(var(--mm-spn-item-indent) * 2);line-height: var(--mm-spn-item-height);text-align: center;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;opacity: 1.0;}.mm-spn.mm-spn--navbar.mm-spn--main {cursor: default }.mm-spn.mm-spn--navbar.mm-spn--main:before {content: none;display: none }.mm-spn.mm-spn--navbar.mm-spn--main:after {padding-left: var(--mm-spn-item-indent) }.mm-spn.mm-spn--navbar ul {top: calc(var(--mm-spn-item-height) + 1px) }.mm-spn.mm-spn--navbar ul:before {content: "";display: block;position: fixed;top: inherit;z-index: 2;width: 100%;border-top: 1px solid currentColor;opacity: .15 }.mm-spn.mm-spn--light {color: #444;background: #f3f3f3 }.mm-spn.mm-spn--dark {color: #ddd;background: #333 }.mm-spn.mm-spn--vertical {overflow-y: auto }.mm-spn.mm-spn--vertical ul {width: 100%;padding-right: 0;position: static }.mm-spn.mm-spn--vertical ul ul {display: none;padding-left: var(--mm-spn-item-indent) }.mm-spn.mm-spn--vertical ul ul:after {height: calc(var(--mm-spn-item-height)/ 2) }.mm-spn.mm-spn--vertical ul.mm-spn--open {display: block }.mm-spn.mm-spn--vertical li.mm-spn--open:before {-webkit-transform: rotate(135deg) translate(-50%, 0);-ms-transform: rotate(135deg) translate(-50%, 0);transform: rotate(135deg) translate(-50%, 0) }.mm-spn.mm-spn--vertical ul ul li:last-child:after {content: none;display: none }