@charset "UTF-8";

html {
	font-size: 62.5%;
}

body {
	font-family: 'Proza Libre', sans-serif;
	/* keep font-size to this base amount; other tags depend on it (e.g. p) (default for html webpages is 16px */
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.5;
	margin: 0;
	background: black;
}

/*
 * Scroll + modal (CSS only — page owns the gutter):
 *   html: scrollbar-gutter stable — reserved width from first paint.
 *   html:has(body.modal-open) overflow hidden — lock on same element as gutter (BS #40659).
 *   Bootstrap still adds padding-right on modal open; with stable gutter that is redundant
 *   and shifts the page. Restore each body class to its design padding — do not blanket zero.
 *   .modal* scrollbars hidden — modal still scrolls; no second visible track.
 */
@supports (scrollbar-gutter: stable) {
	html {
		scrollbar-gutter: stable;
	}

	body:not(.all-padded).modal-open {
		padding-right: 0 !important;
	}

	@media (min-width: 992px) {
		body.all-padded.modal-open {
			padding: 40px 30px !important;
		}
	}

	@media (max-width: 991.98px) {
		body.all-padded.modal-open {
			padding-right: 0 !important;
		}
	}

	body.modal-open .fixed-top,
	body.modal-open .fixed-bottom,
	body.modal-open .is-fixed,
	body.modal-open .sticky-top {
		padding-right: 0 !important;
		margin-right: 0 !important;
	}
}

body.modal-open {
	overflow: hidden;
}

html:has(body.modal-open) {
	overflow: hidden;
}

/* Modal layers scroll invisibly — wheel, touch, keyboard, JS unchanged */
.modal,
.modal-dialog,
.modal-content,
.modal-body,
.modal.simple .modalcontent>.scroll-wrap {
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.modal::-webkit-scrollbar,
.modal-dialog::-webkit-scrollbar,
.modal-content::-webkit-scrollbar,
.modal-body::-webkit-scrollbar,
.modal.simple .modalcontent>.scroll-wrap::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.inevma-container.inevma-modal-pinned {
	position: fixed;
	z-index: 1;
	pointer-events: none;
	margin: 0;
}

.inevma-container.inevma-modal-pinned .inevma {
	pointer-events: auto;
}

/* For touch devices to force iOS to treat taps as click events.*/
@media (hover: none),
(pointer: coarse) {
	body {
		cursor: pointer;
	}
}

@media (prefers-reduced-motion: no-preference) {
	:root {
		scroll-behavior: auto;
	}
}

/* Native thin scrollbars — page + panels (modals scroll invisibly; see scroll+modal block above) */
html,
body,
#mobileMenuContainer,
#admin-panel .admin-panel-wrap,
.select-dropdown {
	scrollbar-width: thin;
	scrollbar-color: var(--soi-native-scrollbar-thumb) var(--soi-native-scrollbar-track);
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
#mobileMenuContainer::-webkit-scrollbar,
#admin-panel .admin-panel-wrap::-webkit-scrollbar,
.select-dropdown::-webkit-scrollbar {
	width: var(--soi-native-scrollbar-size);
	height: var(--soi-native-scrollbar-size);
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
#mobileMenuContainer::-webkit-scrollbar-track,
#admin-panel .admin-panel-wrap::-webkit-scrollbar-track,
.select-dropdown::-webkit-scrollbar-track {
	background: transparent;
	border-radius: 2px;
	box-shadow: inset 0 0 6px var(--soi-native-scrollbar-track);
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
#mobileMenuContainer::-webkit-scrollbar-thumb,
#admin-panel .admin-panel-wrap::-webkit-scrollbar-thumb,
.select-dropdown::-webkit-scrollbar-thumb {
	background: linear-gradient(var(--soi-native-scrollbar-thumb) 0%,
			var(--soi-native-scrollbar-thumb) 35%,
			var(--soi-native-scrollbar-thumb-hover) 100%);
	border-radius: 2px;
	cursor: pointer;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
#mobileMenuContainer::-webkit-scrollbar-thumb:hover,
#admin-panel .admin-panel-wrap::-webkit-scrollbar-thumb:hover,
.select-dropdown::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(var(--soi-native-scrollbar-thumb-hover) 0%,
			var(--soi-native-scrollbar-thumb) 65%,
			var(--soi-native-scrollbar-thumb) 100%);
}

.dark {
	--soi-native-scrollbar-thumb: rgb(120 135 150);
	--soi-native-scrollbar-thumb-hover: rgb(165 180 195);
	--soi-native-scrollbar-track: rgb(0 0 0 / 25%);
}

/* =======================================
	DISABLED ELEMENTS
========================================== */
.disabled {
	filter: brightness(0.75);
	color: rgba(0, 0, 0, 0.30) !important;
}

.dark .disabled {
	filter: brightness(0.7);
	color: rgba(255, 255, 255, 0.60) !important;
}

[data-bs-toggle="popover"]::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 20px;
	bottom: -20px;
	left: 0;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

.center-vertical {
	position: absolute;
	bottom: 50%;
	transform: translateY(-50%);
}

.inserted-document .toggle {
	margin: 0 0 2.6em 0;
}

.inserted-document .toggle-header,
.inserted-document .accordion-header,
.inserted-document .toggle-header .heading,
.inserted-document .accordion-header .heading,
.inserted-document h3 {
	background: none !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0;
	margin: -0.5em 0 -0.9em 0;
	text-align: left;
	display: block;
	width: auto;
	text-transform: uppercase;
}

.inserted-document h3:not(.heading) {
	margin: 1.5em 0 0.9em 0 !important;
}

.inserted-document .toggle-content {
	display: block !important;
	padding: 0;
	margin-top: 1em;
}

.inserted-document .toggle-content .row:first-child {
	margin-top: 1.5em;
}

.inserted-document h3 i,
.inserted-document .view-more {
	display: none;
}

#dev-info {
	position: fixed;
	top: 2px;
	left: 10px;
	z-index: 3000;
	display: none;
}

.dev-info {
	position: absolute;
	top: 0;
	left: 0;
	padding: .2em .4em;
	margin: 2px 2px 0 1em;
	color: #913D00;
	border: 1px solid #913D00;
	background: #FDEBDC;

}

/* end temporary styles
-------------------------------------- */

#header,
#page-title,
#footer,
.sidenav,
.tblsort th {
	user-select: none;
	-webkit-user-select: none;
	/* Safari compatibility */
}

.smlmenu:not(#portfolio-sort):not(#portfolio-columns):not(#portfolio-filter):not(#portfolio-search):not(#textFilter):not(.innermenu):not(#pSections .smlmenu):not(#filterGroups .smlmenu):hover {
	background-color: var(--menu-hover-bg, rgba(0, 0, 0, 0.05));
	/* Or whatever hover background color your style uses */
}

h1,
h3,
h4,
h5,
ul[id$='fontSize'] li button,
ul[id$='fontSize'] li .button,
.textMatter ul,
.textMatter ol:not(.simple),
.tblsort h6,
.widget-title,
.smlmenu *:not(i),
.sidenav *:not(i),
.txtbox p,
.statement,
.highlight p,
#instructions *:not(i),
p.instruct,
button,
.button,
label,
.divlabel,
.nav-tree ul a,
.nav-tree ul ul a,
#footer .widget_links li a,
.subtitle,
#titleInContent div,
.readmodal .title span,
.question,
.comment,
scaps,
.scaps,
.sub-menu-container .menu-item>.menu-link,
.subt,
.news-entry,
.popover-body,
.news-countitems,
.inevma .txt,
#post_id h1+div p,
.news-column .tblsort .text-wrap *:not(i),
.news-column .news-date,
.news-column .title-wrap .stitle {
	font-family: 'Marcellus', sans-serif;
}

.h1,
mark,
.toggle-content .view-more>div {
	font-family: 'Marcellus SC', sans-serif;
}

body,
.see-through-background {
	background-repeat: repeat;
	background-attachment: fixed;
	background-image: url('../images/yim/body-common.gif');
}

p {
	margin: 0 0 1em 0;
	padding: 0;
	text-indent: 1em;
	text-align: justify;
}

p.yours-truly {
	margin: 0;
	padding: 0;
	text-align: right;
	text-indent: 0;
}

.text-content p.noindent,
.textMatter p.noindent,
p:not(.question p):not(aside p):first-of-type,
.noindent p:first-of-type,
.divider+p,
.divider+div+p,
.divider+figure+p,
h2+p,
#title+p,
h3+p,
h3+div+p,
h3+figure+p,
h3+.figtopspace+figure+p,
h3+div+div+p,
h3+blockquote+div+p,
h4+p,
h5+p,
h6+p,
p.drop,
p span,
/* NOTE: notextindent class is used for all paragraphs within a div or other container */
.notextindent p,
.qsource+p {
	text-indent: 0 !important;
}

p.indent-opt {
	text-indent: 1.2em;
}

ol,
ul {
	margin-top: -1px;
	margin-bottom: 0.5rem;
	list-style-type: none;
}

dl,
dt,
dd,
ol,
ul,
li,
.smllist li,
.news-column.clips .tblsort .clip-overlay {
	margin: 0;
	padding: 0;
}

hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 1px solid;
}

.clearboth {
	clear: both;
	display: block;
	height: 0px;
	width: 100%;
	overflow: hidden;
}

:active,
:focus {
	outline: none;
}

a {
	text-decoration: none;
	cursor: pointer;
}

a.anchor {
	padding-top: 110px;
	margin-top: -110px;
	padding-left: 2px;
	vertical-align: super;
}

a i,
a i::before {
	border: none !important;
}

img {
	max-width: 100%;
	border-radius: var(--yim-br);
}

#commentics iframe {
	width: 100%;
	border: 0;
	overflow: hidden;
	margin-bottom: -10px;
}

.wavylink a {
	text-decoration-line: underline;
	text-decoration-style: wavy;
}

.jsLink,
.jsLink i,
.hoverable,
.hoverable *,
.news-entry,
[data-rel] {
	cursor: pointer;
	text-decoration: none !important;
}

[class*="gutter-"] {
	--custom-gutter: var(--bs-gutter-x);
	margin-right: calc(var(--custom-gutter) / -2);
	margin-left: calc(var(--custom-gutter) / -2);
	margin-top: calc(var(--custom-gutter) * -1);
}

[class*="gutter-"]>.col,
[class*="gutter-"]>[class*="col-"] {
	padding-right: calc(var(--custom-gutter) / 2);
	padding-left: calc(var(--custom-gutter) / 2);
	margin-top: var(--custom-gutter);
}

.gutter-40 {
	--custom-gutter: 40px;
}

[class*="col-mb-"] {
	margin-bottom: calc(var(--col-mb) / -1);
}

[class*="col-mb-"]>.col,
[class*="col-mb-"]>[class*="col-"] {
	padding-bottom: var(--col-mb);
}

.col-mb-50 {
	--col-mb: 50px;
}

.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
	width: 100%;
	padding-right: var(--bs-gutter-x, 1.2rem);
	padding-left: var(--bs-gutter-x, 1.2rem);
	margin-right: auto;
	margin-left: auto;
}

button,
.button {
	display: inline-block;
	font-size: 14px;
	text-align: center;
	letter-spacing: 0.5px;
	font-weight: 400;
	padding: 8px;
	margin: auto;
	height: auto;
	max-height: 38px;
	text-transform: uppercase;
	cursor: pointer;
	outline: none;

	border-radius: var(--yim-br);

	white-space: nowrap;
	text-shadow: none;

}

.notextselection,
.notextselection *,
button,
.button {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

button.inline {
	padding: 3px 4px;
	font-size: inherit;
	color: inherit;
	line-height: 1.2em;
	font-family: inherit;
	text-transform: none;
}

/* ----------------------------------------------------------------
	Helper Classes
-----------------------------------------------------------------*/
.hide,
.hidden,
.nodisplay {
	display: none !important;
}

em,
span.italic,
div.italic p {
	font-family: 'Proza Libre', sans-serif !important;
	font-style: italic;
	font-weight: 400;
	font-size: inherit !important;
}

.sidenav em {
	font-weight: 400;
}

noital,
.noital {
	font-style: normal;
}

b,
.bold {
	font-weight: 600;
}

.semibold {
	font-weight: 400;
}

.lg115 {
	font-size: 115% !important;
}

.lg125 {
	font-size: 125% !important;
}

.lg150 {
	font-size: 150% !important;
}

.lg175 {
	font-size: 175% !important;
}

.lg200 {
	font-size: 200% !important;
}

.large {
	font-size: 150% !important;
}

.lrg,
.lrg p {
	font-size: 260% !important;
}

.smlr,
.smlr p {
	font-size: 90% !important;
}

sml,
.sml,
.sml p {
	font-size: 80% !important;
}

ssml,
.ssml,
.ssml p {
	font-size: 73% !important;
}

xsml,
.xsml,
.xsml p {
	font-size: 65% !important;
}

/* NOTE: aesthetic small space before certain punctuations (i.e., : ; ? !) */
.smlsp {
	font-size: 50% !important;
}

.xsmlsp {
	font-size: 12% !important;
}

caps,
.caps {
	text-transform: uppercase !important;
}

scaps,
mark {
	display: inline;
}

mark {
	font-family: 'Roboto', sans-serif;
	padding: 0;
	margin: 0;
	background-color: transparent;
	font-size: 82%;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

h1 mark {
	font-size: 86%;
}

.fscaps,
.scaps,
scaps {
	text-transform: uppercase;
	font-size: 72%;
	letter-spacing: 0.05em;
	font-weight: 600;
}

.dropit {
	font-family: 'Orvelian Brush Condensed', sans-serif;
	font-weight: 400;
	text-transform: uppercase;
	display: inline-flex;
	height: auto;
	width: auto;
	float: left;
	line-height: inherit;
	color: var(--light-col-drop);
}

.poem .dropit {
	font-family: 'Paprika', sans-serif;
}

.dropit.two {
	font-size: 330%;
	margin: 0.1em 0.1em -0.05em 0;
	line-height: 75%;
}

.dropit.three {
	font-size: 530%;
	margin: -0.32em 0.1em -0.5em 0;
}

.dropit+p {
	text-indent: 0 !important;
	margin-top: 0;
}

span.inheritcolor {
	color: inherit !important;
}

span.thinsp {
	font-size: 0.5em;
}

.uppercase {
	text-transform: uppercase !important;
}

.lowercase {
	text-transform: lowercase !important;
}

.nott {
	text-transform: none !important;
}

.tright,
div.tright p {
	text-align: right !important;
}

.tleft,
div.tleft p {
	text-align: left !important;
}

.tjust,
div.tjust p,
div.tjust li {
	text-align: justify !important;
}

.fright {
	float: right !important;
}

.fleft {
	float: left !important;
}

.fnone {
	float: none !important;
}

.ohidden {
	position: relative;
	overflow: hidden !important;
}

br.likep {
	content: "";
	display: block;
	margin-top: 0.6em;
}

br.likep-sm {
	content: "";
	display: block;
	margin-top: 0.3em;
}

.leftmargin {
	margin-left: 50px !important;
}

.topmargin {
	margin-top: 50px !important;
}

.bottommargin {
	margin-bottom: 50px !important;
}

.topmargin-sm {
	margin-top: 30px !important;
}

.topmargin-xsm {
	margin-top: 9px !important;
}

.bottommargin-sm {
	margin-bottom: 30px !important;
}

.bottommargin-xsm {
	margin-bottom: 12px !important;
}

.topmargin-lg {
	margin-top: 70px !important;
}

.bottommargin-lg {
	margin-bottom: 70px !important;
}

.nomargin {
	margin: 0 !important;
}

.norightmargin {
	margin-right: 0 !important;
}

.notopmargin {
	margin-top: 0 !important;
}

.nobottommargin {
	margin-bottom: 0 !important;
}

.noborder {
	border: none !important;
	box-shadow: none !important
}

.toppadding-lg {
	padding-top: 70px !important;
}

.nopadding {
	padding: 0 !important;
}

.notoppadding {
	padding-top: 0 !important;
}

.nobottompadding {
	padding-bottom: 0 !important;
}

.noleftpadding {
	padding-left: 0 !important;
}

.norightpadding {
	padding-right: 0 !important;
}

.noabsolute {
	position: relative !important;
}

.lineheightnormal {
	line-height: 1em !important;
}

nowrap,
.nowrap {
	white-space: nowrap;
}

sub,
sup {
	font-size: 83%;
	position: relative;
	line-height: 0;
	padding-left: 1px;
	vertical-align: baseline;
}

sup {
	top: -0.25em;
}

sub {
	bottom: 0;
}

.fraction sup,
.fraction sub {
	font-size: 60%;
}

.fraction sup {
	margin-right: -3px;
}

.fraction sub {
	margin-left: 1px;
}

.inline {
	display: inline;
}

.lh1,
.lh1 * {
	line-height: 1 !important;
}

.lh12,
.lh12 * {
	line-height: 1.2em !important;
}

.lh2,
.lh2 * {
	line-height: 2 !important;
}

/* NOTE: span within a paragraph which behaves like a real paragraph; useful for instance within a p.smaller boxed */
span.plike {
	display: block;
	margin-top: 0.5em;
	text-indent: 1.2em;
}

/* NOTE: the "inlist" class is a div used within ul or ol */
div.inlist {
	margin: 0.8em 0;
}

div.inlist div {
	text-indent: 0;
	margin: 0 0 0.35em 0;
}

div.inlist.bullet div {
	font-size: 0.8em;
	margin-left: 32px;
	text-indent: -10px;
}

i {
	text-indent: 0;
	display: inline;
}

.bullet div i {
	margin-right: 10px;
	font-size: 9px;
}

.inline-block {
	float: none !important;
	display: inline-block !important;
}

.tcenter,
.tcenter * {
	text-align: center !important;
	text-indent: 0 !important;
	margin: auto;
}

.divcenter {
	position: relative;
	float: none;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	text-indent: 0;
}

.nobg {
	background: none !important;
}

.noboxshadow {
	box-shadow: none;
}

.opaque {
	opacity: 1;
}

.invisible {
	visibility: hidden;
}

.btnswrap {
	position: relative;
	display: flex;
	justify-content: flex-end;
	width: 100%;
	clear: both;
	/* NOTE: buttons' max-height = 38px */
	height: 38px;

}

.nots {
	text-shadow: none !important;
}

.ls1,
ls1 {
	letter-spacing: 1px !important;
}

#page-title-hidden {
	display: none;
}

#page-title.slider:not(.col-slider) {
	padding: 0;
}

body:not(.side-nav) #page-title.slider .container {
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
	width: 100%;
	max-width: 100%;
}

/* ------------------------------------------------
	PAGE-TITLE
--------------------------------------------------- */

body:not(.clearview) #page-title h1,
#titleInContent h1 {
	font-weight: 600;
	display: inline-block;
	/* NOTE: line-height must be 1.3 to allow for certain letters (e.g., "Q") to NOT be trunkated at the bottom */
	line-height: 1.3;
	margin: 0;
}

body:not(.clearview) #page-title h1 {
	font-size: 44px;
	text-transform: uppercase;
}

body:not(.clearview) #page-title h1+div {
	font-size: 20px;
	line-height: 1.2;
	text-transform: uppercase;
}

#titleInContent h1+div {
	font-size: 18px;
	line-height: 1.2;
	text-transform: none;
}

.title-right::before,
.title-center::before {
	display: block;
}

.title-right::after {
	display: none;
}

.page-title-right {
	text-align: right;
}

.page-title-left {
	text-align: left;
}

.page-title-right div>span,
.page-title-left div>span {
	margin-top: 0;
}

body:not(.clearview) #page-title h1 scaps,
#titleInContent h1 scaps,
body:not(.clearview) #page-title h1 .scaps,
#titleInContent h1 .scaps {
	font-size: 80%;
	display: inline;
}

h1+span:not(.scaps) {
	display: inline-block;
	text-transform: uppercase;
	font-weight: 400;
	line-height: 1.3;
	font-size: 1em;
	margin-top: 0.5em;
}

/* NOTE: Important; this is the title that is used in Ulysses; should not be visible */
.dyncontent h1,
#modalReadContent h1,
.ulysses {
	display: none;
}

body.clearview #page-title:not(.full-slider) {
	height: 100svh;
	padding-bottom: env(safe-area-inset-bottom);
}

body.all-padded.clearview #page-title {
	height: 50svh;
}

/* ------------------------------------------------
	PAGE-TITLE SLIDESHOW (KENBURNS)
--------------------------------------------------- */
#slider-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* NOTE: to eliminate the thin black border at the top */
	margin-top: -1px;
	overflow: hidden;
}

#page-title.full-slider>figure,
body.clearview #page-title .slideshow-off {
	position: fixed;
}

body:not(.clearview) #page-title .slideshow-off {
	position: absolute;
}

body.clearview #clearviewBG {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}

body.clearview #clearviewBG div {
	content: "";
	display: block;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	max-width: 100%;
	height: 100vh;
	height: 100dvh;
	z-index: -10;
	background-size: cover;

	background-attachment: scroll;
	background-position: 0 0;
	background-repeat: no-repeat;

}

body.clearview #clearviewBG #bg1,
body.clearview #clearviewBG #bg2 {
	filter: brightness(1) !important;
}

body:not(.dark).clearview #clearviewBG #bg2 {
	display: none;
}

body.dark.clearview #clearviewBG #bg2 {
	z-index: -9;
	display: block;
}

#slidesContainer {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

#slideshow {
	filter: brightness(1);
	margin-top: -15px;
	height: calc(100% + 15px);
}

#slideshow .static-content {
	top: auto;
	left: auto;
	right: 10px;
	bottom: 10px;
	color: rgb(200 200 200 / 100%) !important;
}

#slideshow .slide {
	height: calc(100% + 15px);
}

/* ---------------------------------------------------------------
  YIM-FOOTER
------------------------------------------------------------------ */

#footer {
	position: relative;
}

.footer-widgets-wrap {
	position: relative;
	padding: 40px 20px;
}

#footer .widget {
	margin: 0 auto 30px;
}

#footer .widget-wrapper {
	padding: 12px;
	border-radius: var(--yim-br);
}

#geoLocation {
	text-align: center;
	padding: 20px;
	border-radius: 60px;
	max-width: 340px;
}

.widget-title {
	font-weight: 400;
	font-size: 1.5rem;
	text-transform: uppercase;
	margin-bottom: 0.3em;
	text-shadow: 1px 1px 1px rgb(0 0 0 / 10%);
}

#footerbottom {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 10%;
	clear: both;
	display: flex;
	align-items: flex-end;

	background: linear-gradient(rgb(62 68 70 / 0%) 0%, rgb(82 88 90 / 30%) 40%, rgb(169 189 196 / 40%) 80%, rgb(161 177 182 / 50%) 90%, rgb(134 153 171 / 60%) 99%, rgb(115 108 99 / 60%) 100%);

}

#yimJewels #dlNew {
	position: absolute;
	font-size: 24px;
	right: 0;
	bottom: -50px;
	width: 40px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	padding-bottom: 10px;

	color: var(--dark-col-btn);
	text-shadow: var(--dark-ts);

}

#yimJewels #dlNew:hover {
	color: var(--dark-col-hov);
	text-shadow: none;
}

.dark #yimJewels #dlNew * {
	color: var(--dark-col-head);
	text-shadow: var(--dark-ts);
}

#yimJewels #dlNew::after {
	content: 'NEW \A JEWEL';
	position: absolute;
	bottom: -5px;
	width: 100%;
	height: auto;
	font-size: 8px;
	line-height: 1.1;
	text-align: center;
	letter-spacing: 0.025em;
	text-indent: 0;
	padding: 0;
	cursor: pointer;
}

#yimJewels {
	text-align: center;
	position: relative;
	width: 100%;
	max-width: 340px;
	margin: 0 auto 2.5em auto;

	min-height: 300px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
}

#fJewels {
	position: relative;
	width: 100%;
	height: auto;
	margin: auto;
	line-height: 1.75;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-top: auto !important;
	font-size: 1.25em !important;
}

#footStyles {
	display: flex;
	flex-direction: column;
	flex-basis: fit-content;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 100%;
	max-width: 340px;
	margin: 0 auto;
	overflow: hidden;
	border-radius: 60px;
	padding: 20px;
}

#fJewels sm90 {
	font-size: 90%;
}

#fJewels sm80 {
	font-size: 80%;
}

#fJewels .source {
	font-size: 70%;
	margin-top: 6px;
	color: var(--dark-col-btn);
}

@supports (-webkit-overflow-scrolling: touch) {

	.news-column.scroll-padding {
		padding-right: 6px;
	}
}

#footStyles form {
	display: inherit;
	margin-bottom: 0;
}

#footer abbr {
	line-height: 1.75;
}

#footer address {
	margin-bottom: 10px;
}

#side-panel label,
#footer label {
	font-size: 1em;
}

#copyrights {
	padding: 20px 0;
	font-size: 12px;
	line-height: 3.5;
	text-align: center;
	white-space: nowrap;

	background: linear-gradient(rgb(0 0 0 / 0) 0%, rgb(0 0 0 / 35%) 50%, rgb(0 0 0 / 100%) 100%);
}

.footer-bottom {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 0 12px;
}

#shareLinks {
	display: flex;
	text-align: right;
	justify-content: flex-end;
	position: absolute;
	right: 72px;
}

.social-icon {
	text-align: center;
	float: none;
	border: none;
	overflow: hidden;
	border-radius: var(--yim-br);

	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 20px;
	margin: 0 6px;
}

.social-icon:last-child {
	margin-right: 0;
}

.social-icon i {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	padding: 9px;
}

.social-icon:hover i:first-child {
	margin-top: -40px;
}

.dark .social-icon.si-twitter:hover,
.dark .social-icon.si-facebook:hover,
.dark .social-icon.si-email:hover {
	color: rgb(255, 250, 250) !important;
	background-color: rgb(80, 87, 96) !important;
}

#gotoTop {
	display: none;
	z-index: 599;
	position: fixed;
	width: 40px;
	height: 40px;

	border-radius: var(--yim-br);

	font-size: 19px;
	font-weight: 600;
	line-height: 2.1;
	top: auto;
	left: auto;
	right: 20px;
	bottom: 20px;
	text-align: center;
	cursor: pointer;
}

@keyframes blinker {
	50% {
		opacity: 0;
	}
}

#gotoTop i.visible::after {
	opacity: 1;
}

#side-panel .switchstyle div {
	margin: 0;
}

.disabled,
.inactive .toggle-header,
.inactive .accordion-header,
.inserted-document .toggle-header,
.inserted-document .accordion-header {
	pointer-events: none;
	cursor: default;
}

.inactive .toggle-content,
.inactive .accordion-content,
.inserted-document .toggle-content,
.inserted-document .accordion-content {
	/* NOTE: by default toggle and accordion contents are NOT displayed;
	there are 2 ways to view such contents:
	1. set them all to block !important (as in below) or
	2. the attribute 'data-state' must be added to each 'toggle' and set to "open" (i.e., data-state="open") */
	display: block !important;
}

.yim-radio,
.yim-checkbox {
	opacity: 0;
	position: absolute;
}

.yim-radio,
.yim-checkbox,
.yim-radio-label,
.yim-checkbox-label {
	display: inline-block;
	vertical-align: middle;
	margin: 5px;
	cursor: pointer;
}

.yim-radio-label,
.yim-checkbox-label {
	position: relative;
}

.yim-radio-label::before {
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}

.yim-checkbox-label::before,
.yim-radio-label::before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	border: 2px solid;
	width: 24px;
	height: 24px;
	padding: 4px;
	margin-right: 10px;
	margin-top: -3px;
	line-height: 1;
	text-align: center;
}

.small .yim-checkbox-label::before,
.small .yim-radio-label::before {
	width: 16px;
	height: 16px;
	margin: -2px 8px 1px 0;
}

#side-panel form.switchstyle {
	margin-bottom: 0
}

/* ============================================
	TIPPY TOOLTIPS
=============================================== */

[data-tippy-root] {
	max-width: calc(100vw - 10px);
}

.tippy-box[data-animation='fade'][data-state='hidden'] {
	opacity: 0;
}

.tippy-box[data-theme~='soi-tooltip'] {
	position: relative;
	background-color: var(--tippy-bg-color);
	color: var(--tippy-text-color);
	border: 1px solid var(--tippy-border-color);
	box-shadow: var(--tippy-shadow);
	border-radius: 4px;
	font: var(--soi-tippy-font-size) / var(--soi-tippy-line-height) var(--soi-tippy-font-family);
	max-width: var(--soi-tippy-max-width);
}

.tippy-box[data-theme~='soi-tooltip'] .tippy-content {
	padding: var(--soi-tippy-padding);
}

.tippy-box[data-theme~='soi-tooltip'] .tippy-arrow {
	width: 16px;
	height: 16px;
	color: var(--tippy-bg-color);
}

.tippy-box[data-theme~='soi-tooltip'] .tippy-arrow::before {
	content: '';
	position: absolute;
	border-color: transparent;
	border-style: solid;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='top']>.tippy-arrow {
	bottom: 0;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='top']>.tippy-arrow::before {
	bottom: -7px;
	left: 0;
	border-width: 8px 8px 0;
	border-top-color: initial;
	transform-origin: center top;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='bottom']>.tippy-arrow {
	top: 0;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='bottom']>.tippy-arrow::before {
	top: -7px;
	left: 0;
	border-width: 0 8px 8px;
	border-bottom-color: initial;
	transform-origin: center bottom;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='left']>.tippy-arrow {
	right: 0;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='left']>.tippy-arrow::before {
	right: -7px;
	top: 0;
	border-width: 8px 0 8px 8px;
	border-left-color: initial;
	transform-origin: center left;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='right']>.tippy-arrow {
	left: 0;
}

.tippy-box[data-theme~='soi-tooltip'][data-placement^='right']>.tippy-arrow::before {
	left: -7px;
	top: 0;
	border-width: 8px 8px 8px 0;
	border-right-color: initial;
	transform-origin: center right;
}

body.dark {
	--tippy-bg-color: rgb(255 255 255 / 96%);
	--tippy-text-color: rgb(30 30 30);
	--tippy-border-color: rgb(0 0 0 / 12%);
	--tippy-shadow: 0 4px 14px rgb(0 0 0 / 14%);
}

body.theme-switching,
body.theme-switching * {
	transition: none !important;
}

/* ----------------------------------------------------------------
  Anim
------------------------------------------------------------------- */

.dimmed::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.3);
}

/* ----------------------------------------------------------------
	Logo / Footer logo
------------------------------------------------------------------- */

#logo {
	position: relative;
	z-index: 2;
	background-repeat: no-repeat;
	background-size: contain;
	padding-right: 0;
	display: flex;
	align-items: center;
	-ms-flex-align: center;
	margin-right: auto;
	max-height: 100px;
	border: none;
}

#logo img {
	display: block;
	max-width: 100%;
	max-height: 100%;
}

.header-size-sm #header-wrap #logo img {
	height: 60px;
}

.header-size-md #header-wrap #logo img {
	height: 80px;
}

.header-size-lg #header-wrap #logo img {
	height: 100px;
}

#footerlogo,
#footerlogo.dimmed::before {
	border-radius: 50%;
}

#footerlogo>a {
	z-index: 2;
	position: absolute;
}

#footerlogo .logo-back {
	position: relative;
	top: auto;
	width: 100%;
	height: 100%;
	margin: auto;
	background-size: cover;
}

#loaderImg {
	position: relative;
	top: auto;
	left: auto;
	display: block;
	width: 130px;
	/* height: 80px; */
	height: auto;
	margin: 0;
}

#footerlogo::after,
#loaderImg::after {
	content: url('../images/yim/logo/org.png');
	position: absolute;
	width: auto;
	height: auto;
	opacity: 0.92;
	transform: scale(0.5);
}

#loaderImg::after {
	display: inline;
	right: -42px;
	bottom: -3px;
	/* transform: scale(0.6); */
	/* opacity: 0.8; */
}

#footerlogo::after {
	right: -44px;
	bottom: -8px;
}

#logo::after {
	right: -48px;
	bottom: -10px;
	transform: scale(0.65);
}

#footerlogo {
	position: relative;
	margin: 50px auto 0;
	padding: 0;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100px;
	height: 77px;
	background-image: linear-gradient(to bottom, rgba(81, 96, 119, .5) 0%, rgba(146, 162, 168, .5) 59%, rgba(146, 162, 168, .5) 82%, rgba(136, 149, 153, .5) 90%, rgba(122, 127, 124, .5) 99%, rgba(102, 88, 81, .5) 100%);
}

body:not(.nologobg) #footerlogo .logo-back.day {
	background-image: url('../images/yim/logo/footer-sun.png');
}

body:not(.nologobg) #footerlogo .logo-back.night {
	background-image: url('../images/yim/logo/footer-moon.png');
	filter: brightness(0.75);
}

#logo.day::before {
	content: "";
	position: absolute;
	inset: 0;
	/* Stretches the layer to fill the parent perfectly */
	background-image: url('../images/yim/logo/header-sun.png');
	background-size: cover;
	background-position: center;
	z-index: -1;
	/* Pushes the image layer behind your text */
	opacity: 1;
	transition: opacity 0.5s ease-in-out;
}

#logo.night::before {
	content: "";
	position: absolute;
	inset: 0;
	/* Stretches the layer to fill the parent perfectly */
	background-image: url('../images/yim/logo/header-moon.png');
	background-size: cover;
	background-position: center;
	z-index: -1;
	/* Pushes the image layer behind your text */
	opacity: 1;
	transition: opacity 0.5s ease-in-out;
}

#logo.invisible-bg::before {
	opacity: 0;
}

#logo a.standard-logo,
#footerlogo a.standard-Logo {
	display: block;
}

#logo a.retina-logo,
#footerlogo a.retina-logo {
	display: none;
}

/* ----------------------------------------------------------------
	YIM-HEADER
-----------------------------------------------------------------*/

#wrapper {
	position: relative;
	float: none;
	width: 100%;
	margin: 0 auto;
	background-color: transparent;
	opacity: 0;
	transition: opacity 0.5s ease-in-out;
}

body.clearview:not(.stretched) #wrapper {
	box-shadow: 0 0 0 rgb(0 0 0 / 0%);
}

body.clearview #page-title {
	background-color: transparent;
	background-image: none;
	padding: 0;
	margin: 0;
	overflow-x: clip;
	max-width: 100%;
}

#header {
	position: relative;
	width: 100%;
	z-index: 100;
	background-color: transparent;
	border-bottom: none;
	transition: background-color 0.3s ease;
}

#header.is-sticky {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;

	width: inherit;
	margin-left: auto;
	margin-right: auto;

	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
	/* Optional modern shadow depth */
}

.header-size-sm {
	padding-bottom: 60px;
}

.header-size-md {
	padding-bottom: 80px;
}

.header-size-lg {
	padding-bottom: 100px;
}

#header.transparent-header {
	margin-bottom: 0px !important;
}

#header-wrap {
	position: relative;
	background-color: transparent;
	width: 100%;
	box-shadow: none;
}

.header-wrap-clone {
	display: none;
}

.header-row {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

body:not(.clearview) #header-wrap {
	background-color: transparent;
	background-image: linear-gradient(rgb(81, 96, 119) 0%, rgb(146, 162, 168) 59%, rgb(146, 162, 168) 82%, rgb(136, 149, 153) 90%, rgb(122, 127, 124) 96%, rgb(102, 88, 81) 100%);
}

#header-wrap .container {
	max-width: inherit;
	background: transparent;
}

#header.transparent-header.full-header.sticky-header:not(.sticky-header-shrink) #header-wrap {
	background-image: linear-gradient(rgba(81, 96, 119, .65) 0%, rgba(146, 162, 168, .65) 59%, rgba(146, 162, 168, .65) 82%, rgba(136, 149, 153, .65) 90%, rgba(122, 127, 124, .65) 96%, rgba(102, 88, 81, .65) 100%);

	background-color: transparent;
	width: 100%;
}

#header:not(.transparent-header):not(.sticky-header) #header-wrap,
body.device-touch:not(.clearview):not(.device-md):not(.device-lg):not(.device-xl) #header.transparent-header #header-wrap,
.sticky-header #header-wrap {
	background-image: linear-gradient(rgb(81, 96, 119) 0%, rgb(146, 162, 168) 59%, rgb(146, 162, 168) 82%, rgb(136, 149, 153) 90%, rgb(122, 127, 124) 96%, rgb(102, 88, 81) 100%);
}

/* ---------------------------------------------------------------
	YIM-PRIMARY-MENU
-----------------------------------------------------------------*/

.primary-menu {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	flex-basis: 100%;
	-ms-flex-positive: 1;
	flex-grow: 1;
	-ms-flex-align: center;
	align-items: center;
}

.menu-container {
	display: none;
	list-style: none;
	margin: 0;
	width: 100%;
}

.menu-link {
	display: block;
	line-height: 22px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.menu-link span {
	display: none;
}

.menu-item {
	position: relative;
	margin: 0;
	border: none;
}

.menu-item.help .menu-link {
	display: flex;
	justify-content: center;
	align-items: center;
}

.menu-item.help .menu-link i {
	width: auto;
	margin-right: 0;
	top: 2px;
}

.primary-menu>ul>li:not(.help)>a {
	font-family: 'Oswald', sans-serif !important;
}

.primary-menu>ul>li>a {
	font-weight: 400;
	font-size: 16px;
	letter-spacing: 0.5px;
	padding-left: 4px;
	padding-right: 4px;
}

.primary-menu>ul>li>.menu-link>div {
	position: relative;
	padding: 3px 6px;
	/* NOTE: max-height so that icons don't make div higher */
	max-height: 28px;

}

.sub-menu-container .sub-menu-trigger {
	font-size: 10px;
}

.sub-menu-container .menu-item .sub-menu-trigger {
	top: 6px;
}

.likemenu {
	padding: 0 7px;
	margin: 0;

	border-radius: var(--yim-br3);
	vertical-align: -2px;

	color: rgb(236 234 230 / 100%) !important;
	text-shadow: 2px 3px 3px rgb(0 0 0 / 35%);

}

.likemenu.intext {
	margin-right: 0;
	vertical-align: -1px;
}

#header.transparent-header:not(.sticky-header) .primary-menu>ul>li>.menu-link,
.likemenu {
	color: var(--dark-col-base) !important;
	text-shadow: 2px 3px 3px rgb(0 0 0 / 25%);
	background-color: transparent;
}

#header.sticky-header .primary-menu>ul>li>.menu-link {
	background: none;
	color: var(--dark-col-base) !important;
	text-shadow: 2px 3px 3px rgb(0 0 0 / 25%);
}

#header.header-size-lg .primary-menu>ul>li:hover>.menu-link,
#header.header-size-lg .primary-menu>ul>li.current>.menu-link {
	margin-top: 26px !important;
	margin-bottom: 10px !important;
}

#header.header-size-md .primary-menu>ul>li:hover>.menu-link,
#header.header-size-md .primary-menu>ul>li.current>.menu-link {
	margin-top: 16px !important;
	margin-bottom: 0px !important;
}

#header.header-size-sm .primary-menu>ul>li:hover>.menu-link,
#header.header-size-sm .primary-menu>ul>li.current>.menu-link {
	margin-top: 6px !important;
	margin-bottom: 0px !important;
}

#header .primary-menu>ul>li>.menu-link {
	border-radius: var(--yim-br);
	padding-top: 3px;
	padding-bottom: 3px;
}

body.device-touch #header .primary-menu>ul>li>.menu-link #header.sticky-header.sticky-header-shrink .primary-menu>ul>li>.menu-link {
	color: rgb(255, 253, 250) !important;
	text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.15);
}

#header:not(.transparent-header):not(.sticky-header):not(.sticky-header-shrink) .primary-menu>ul>li>.menu-link {
	color: rgb(255, 253, 250) !important;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}

#header:not(.transparent-header):not(.sticky-header):not(.sticky-header-shrink) .primary-menu>ul>li:hover>.menu-link,
#header:not(.transparent-header):not(.sticky-header):not(.sticky-header-shrink) .primary-menu>ul>li.current>.menu-link {

	background-color: transparent;

	background-image: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 59%, rgba(0, 0, 0, 0.1) 82%, rgba(0, 0, 0, 0.15) 100%);
}

#header.sticky-header.sticky-header-shrink .primary-menu>ul>li:hover>.menu-link>div,
#header.sticky-header.sticky-header-shrink .primary-menu>ul>li.current>.menu-link>div {
	background-color: rgba(0, 0, 0, 0);
}

/* NOTE: only text with likehover class */
#endNotes p span.likehover,
#sideLists i+span.likehover,
.mirza {
	font-family: 'Mirza';
	font-weight: 600;
	font-size: 0.95em;
	text-transform: lowercase;
	line-height: 0;
}

.exlink {
	font-family: 'Proza Libre', sans-serif;
	font-size: inherit;
	font-weight: 600;
	display: inline;
	margin: 0;
	padding: 1px 3px 0 3px;

	border-radius: 6px;
}

.sub-menu-container .menu-item>.menu-link {
	font-size: 14px;
}

.sub-menu-container .menu-link div {
	position: relative;
}

.one-page-arrow {
	position: fixed;
	z-index: 1;
	bottom: 0;
	left: 50%;
	margin-left: -25px;
	padding-top: 25px;
	width: 50px;
	height: 80px;
	font-size: 32px;
	text-align: center;
	text-shadow: none;
	cursor: pointer;
}

.one-page-arrow>i {
	color: rgb(255 250 245 / 100%);
}

body.all-padded .one-page-arrow {
	display: none;
}

.one-page-arrow i,
.native-pulse-arrow {
	display: inline-block !important;
	animation: nativeFadeInDown 2s infinite ease-in-out !important;
}

@keyframes nativeFadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-10px);
	}

	50% {
		opacity: 1;
		transform: translateY(4px);
	}

	100% {
		opacity: 0;
		transform: translateY(14px);
	}
}

h1,
h2,
h3,
h4,
h5 {
	font-weight: 400;
	margin: 0;
}

.statement {
	font-size: 1.375em;
	margin: auto;
	width: 76%;
	min-width: 240px;
	margin-top: 20px;
	margin-bottom: 20px;
}

h3+.statement {
	margin-top: 32px;
}

.statement p:not(.ssource) {
	text-indent: 0;
	text-align: left;
	margin: 0;
	line-height: 1.25;
	-ms-hyphens: none;
	hyphens: none;
}

.statement.sml {
	font-size: 1.25em;
}

.statement span {
	line-height: 2em;
}

.infomsg {
	background: inherit;
}

.infomsg p {
	margin: 0.75em 0;
}

.infomsg p:first-of-type {
	margin-top: 0;
}

.infomsg p:last-child {
	margin-bottom: 0;
}

.user-info {
	font-size: 16px;
	line-height: 1.3;
	margin: 0.5em;
	font-weight: 400;
}

.user-info:first-of-type i:first-child {
	font-size: 30px;
	font-weight: 300;
	margin: -16px 9.5px auto -39px;
}

h2,
#title,
.steptitle,
[id^='slide'] h5,
label:not(.simple),
.divlabel:not(.simple),
th.header,
#footer .widget_links li a {
	font-family: 'Arima Madurai', sans-serif !important;
}

blockquote,
.quotation,
.poem,
#fJewels {
	font-family: 'Paprika', sans-serif !important;
}

.quotation {
	margin-bottom: 1.76em;
	text-indent: 0 !important;
}

.quotation p {
	position: relative;
	width: 64%;
	min-width: 200px;
	margin: 0 auto 1em;
	text-align: justify;
}

.quotation p:first-child {
	margin-top: 4em !important;
}

.quotation p:first-child::before,
.quotation p:first-child::after {
	font-weight: bold;
	font-size: 900%;
	opacity: 0.25;
	position: absolute;
}

.quotation p:first-child::before {
	content: "\201C";
	line-height: 0;
	top: 0.35em;
	left: -0.776em;
}

.quotation p:first-child::after {
	content: "\201D";
	line-height: 0;
	bottom: -0.25em;
	right: -0.67em;
}

blockquote {
	text-indent: 0 !important;
	border: none;
	margin: 1.5em;
	padding: 0 1.2em;
	border-left: 12px solid;
}

.blockquote p {
	line-height: 1.7 !important;
	text-align: justify;
	margin-bottom: 24px;
}

blockquote>div p {
	margin-top: 0.6em !important;
}

blockquote+p {
	margin-top: 2em;
}

.hscroller {
	display: block;
	margin: auto;
	width: auto;
}

#hScroller {
	display: inline-block;
}

.hscroll .s {
	position: absolute;
	width: 26px;
	height: 25px;
	top: 28px;
	margin: 0;
	padding-top: 2px;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1;
	cursor: pointer;
	border: none !important;
}

.hscroll .scrollleft {
	left: 0;
	border-radius: var(--yim-br-left);
}

.hscroll .scrollright {
	right: 0;
	border-radius: var(--yim-br-right)
}

.hscroll .s i {
	font-size: 16px;
}

/* Small Menus / Vertical Menus
----------------------------------------------------------------- */

.smcontainer {
	position: relative;
	font-size: 16px;
	width: auto;
	height: auto;
	/* NOTE: min-height necessary to avoid vertical movement of elements on the page when hovering/selectin li (e.g., in-quest.html filter)*/
	min-height: 74px;
	padding-bottom: 10px;
}

.smcontainer#topMenu {
	margin: 40px 0;
}

.smcontainer.varheight {
	min-height: 40px;
}

.smcontainer.bottom {
	margin: 30px 0;
}

.modalcontent .smcontainer {
	margin-top: -30px;
}

ul[id$='fontSize'] {
	display: inline-flex;
	justify-content: space-evenly;
	margin: 0 0 15px;
	height: 12px;
}

ul[id$='fontSize'] li {
	display: inline-block;
	margin: 0 5px 0 0;
}

ul[id$='fontSize'] li:nth-child(3) {
	margin-right: 0;
}

/* NOTE: #fontSize on main pages; #mFontSize on readmodal; smFontSize on slidermodal */
ul[id$='fontSize'] li button,
ul[id$='fontSize'] li .button {
	line-height: 1;
	border-radius: var(--yim-br8-bottom);
}

ul[id$='fontSize'] li button div,
ul[id$='fontSize'] li .button div {
	display: inline;
	padding: 1px 0;
}

/* NOTE: this is for the fontSize widget in readModal (??)*/
#mfontSize li button,
#mfontSize li .button {
	margin: 0 2px 0 2px !important;
}

.flex-column {
	display: flex;
	flex-direction: column;
}

.flex-column.fleft {
	padding: 6px 14px 3px 0;
}

.flex-column.fright {
	padding: 6px 0 3px 14px;
}

#fsInfo {
	position: absolute;
	top: 0;
	right: 0;
	width: auto;
	height: auto;
	padding: 2px 8px;
	border-radius: var(--yim-br4);
	box-shadow: inset 0 0 2px rgb(0 0 0 / 30%);
}

#fsInfo i {
	vertical-align: 2px;
}

.smlmenu {
	display: inline-flex;
	justify-content: space-evenly;
	align-items: flex-start;
	position: relative;
	width: 100%;
	margin: 0;
	list-style: none;
	float: left;
	border: none;
	z-index: 1;
}

.smlmenu.sidenavsearch {
	width: 100%;
}

.smlmenu.mtop {
	margin-top: 29px;
}

.smlmenu.boxed {
	margin-right: 12px;
}

.smcontainer.mtop {
	margin-top: 18px;
}

.smcontainer.aside-sortli3 {
	/* NOTE: total width minus width of 3-item-wide sort menu */
	width: calc(100% - 119px);
}

.smcontainer.aside-sortli2 {
	/* NOTE: total width minus width of 2-item-wide sort menu */
	width: calc(100% - 82px);
}

#pgVertMenu {
	position: relative;
	width: 70%;
	margin: 65px auto 20px;
}

#pgVertMenu ol {
	display: block;
	position: relative;
	font-size: 17px;
	width: 100% !important;
	margin: 0 !important;
	padding: 10px 0 !important;
	border-radius: var(--yim-br10-bottom) !important;
}

#pgVertMenu ol>li,
#pgVertMenu ul>li {
	margin-left: 42px;
	text-align: left;
	line-height: 1.75;
}

#pgVertMenu ol ol,
#pgVertMenu ul ol {
	padding: 0 1.2em !important;
}

#pgVertMenu ol ol>li,
#pgVertMenu ul ol>li {
	margin-left: 0;
	counter-reset: nice-alpha !important;
	line-height: 1.65;
	font-size: 86% !important;
}

#pgVertMenu li>span:hover {
	transform: translateX(0.25em);
}

#pgVertMenu span {
	display: inline-block;
	transition: all 0.3s ease;
}

.return-to-vmenu {
	display: none;
}

.pg-section {
	display: inline;
	margin: 0;
	height: 0;
}

.vmheader,
.smheader,
.vmenu[data-title]::before,
.smlmenu[data-title]::before,
#sidenavContainer[data-title]::before {
	width: 100%;
	height: 26px;
	text-align: center;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 13px;
	padding: 6px 5px;
	cursor: default;
	border-radius: var(--yim-br10-top);

	content: attr(data-title);
	position: absolute;
	margin: -26px auto 0 auto;

	color: rgb(0 0 0 / 100%);
	background-color: rgba(0, 0, 60, 0.25);
	text-shadow: var(--light-ts);

	background: linear-gradient(rgb(100 115 145 / 50%) 0%, rgb(170 190 195 / 60%) 50%, rgb(170 190 195 / 70%) 82%, rgb(135 140 135 / 80%) 90%, rgb(115 110 100 / 90%) 92%, rgb(70 55 45 / 100%) 100%);

	background: linear-gradient(rgb(100 115 145 / 100%) 0%, rgb(170 190 195 / 100%) 50%, rgb(170 190 195 / 100%) 82%, rgb(135 140 135 / 100%) 90%, rgb(115 110 100 / 100%) 92%, rgb(70 55 45 / 100%) 100%);
}

*[data-title]::before {
	left: -1px;
	width: calc(100% + 2px) !important;
}

#pgVertMenu [data-title]::before {
	margin-top: -36px !important;
}

.vmheader,
.smheader {
	position: relative;
	top: 0;
	left: 0;
	margin: 0;
}

.smlmenu.fright {
	margin-right: 0;
	margin-left: auto;
}

#pfActions #triggerList li,
.smlmenu li {
	display: inline-flex;
	flex: auto;
	justify-content: space-evenly;
	float: left;
	position: relative;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
	line-height: 1;
	white-space: nowrap;

	padding: 6px 8px;
	margin: 0 2px 0 2px;
	width: auto;
	min-width: 32px;

	border-radius: var(--yim-br-bottom);

}

#pfActions #triggerList li,
.smlmenu li,
.smlmenu input {
	border-top: none !important;
}

#pfSynopsis {
	position: absolute;
	right: 0;
	bottom: 0;
	display: none;
}

.smlmenu li>span {
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 1.2;
}

.smlmenu li:first-child {
	margin-left: 0;
}

.smlmenu li:last-child,
#pfActions #triggerList li {
	margin-right: 0;
}

#pfActions #triggerList li:hover,
#pfActions #triggerList li.active,
.smlmenu li:hover,
.smlmenu .active,
.select-button:hover,
.active .select-button {
	padding-top: 12px;
	cursor: pointer;
}

.smlmenu .active,
.smlmenu .active .hoverable,
.smlmenu .active .hoverable * {
	cursor: default;
}

.cust-sel-menu select {
	appearance: none;
	width: 100%;
	padding: 0 5px;
	position: relative;
	cursor: pointer;
	border-radius: var(--yim-br-bottom);
	z-index: 1;
}

.cust-sel-menu .filter-list::before,
.cust-sel-menu .filter-list::after {
	--size: 5px;
	position: absolute;
	content: "";
	right: 7px;
	pointer-events: none;
	z-index: 2;
}

.cust-sel-menu .filter-list::before {
	border-left: var(--size) solid transparent;
	border-right: var(--size) solid transparent;
	border-bottom: var(--size) solid black;
	top: 25%;
}

.cust-sel-menu .filter-list::after {
	border-left: var(--size) solid transparent;
	border-right: var(--size) solid transparent;
	border-top: var(--size) solid black;
	top: 55%;
}

/* ************************************
	SPECIAL CUSTOM DROP-DOWN MENU
*************************************** */

.custom-select {
	position: relative;
	width: 400px;
	max-width: 100%;
	font-size: 1.15rem;
	width: 100%;

	position: absolute;
}

.select-button {
	width: 100%;
	font-size: 14px;
	padding: 6px 8px;
	line-height: 1;
	border-radius: var(--yim-br-bottom);
	text-transform: none;
	cursor: pointer;

	display: flex;
	justify-content: space-between;
	align-items: center;
}

.selected-value {
	text-align: left;
	width: 100%;
}

.custom-select .scroll-wrap {
	position: relative;
	width: 100%;
	border-radius: var(--yim-br);
	transition: .5s ease;
	margin: 10px 0 0 0;
	/* NOTE: padding-right (2px) moves the scrollbar 2px from the right edge */
	padding: 0 2px 6px 2px;
	z-index: 9;

	transform: scaleY(0);
	opacity: 0;
	visibility: hidden;
}

.select-dropdown-ctnr {
	position: relative;
	width: 100%;
	height: auto;
	max-height: 195px;
	overflow-y: scroll;
	/* NOTE: next is necessary for Firefox */
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.select-dropdown {
	position: relative;
	list-style: none;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 6px 0 0 0;
	border-radius: var(--yim-br);
	transition: 0.5s ease;
}

.select-dropdown:focus-within {
	box-shadow: 0 10px 25px rgba(94, 108, 233, 0.6);
}

.select-dropdown li {
	font-size: 16px;
	position: relative;
	cursor: pointer;
	display: flex;
	gap: 1rem;
	margin: 0;
	padding: 0 0 0 6px;
	align-items: center;
}

.select-dropdown li label {
	width: 100%;
	padding: 0;
	margin: 0;
	cursor: pointer;
	display: flex;
	gap: 1rem;
	align-items: center;
}

.select-dropdown li,
.select-dropdown li label,
.select-dropdown li input {
	background: transparent;
}

.select-dropdown input:focus~label {
	background-color: #dfdfdf;
}

.select-dropdown input[type="radio"] {
	position: absolute;
	left: 0;
	opacity: 0;
}

.custom-select.active .arrow {
	transform: rotate(180deg);
}

.custom-select.active .scroll-wrap {
	opacity: 1;
	visibility: visible;
	transform: scaleY(1);
}

/* ************************************
	SPECIAL CUSTOM DROP-DOWN MENU END
*************************************** */

#filterGroups {
	position: relative;
	height: 75px;
	width: auto;
	clear: both;
}

#pSections {
	min-height: 58px;
	margin-top: 30px;
}

#ceGroups,
#imGroups,
#iqGroups {
	position: absolute;
	width: 100%;
	height: auto;
	top: 30px;
	left: 0;
}

#pSections ul,
#ceGroups ul,
#imGroups ul,
#iqGroups ul {
	/* NOTE: important to keep list items on a horizontal */
	display: inline-flex;
}

.smcontainer.igroup li,
#pSections li {
	line-height: 1;
	font-size: 10px;
}

.smcontainer.igroup li {
	padding: 6px 0;
}

.smcontainer.igroup li[data-name$="all"] {
	padding: 4px 0 5px;
}

.smcontainer.igroup li:hover,
.smcontainer.igroup .current,
.smcontainer.igroup .active {
	padding: 13px 0 5px;
}

.smcontainer.igroup li[data-name$="all"]:hover,
.smcontainer.igroup li[data-name$="all"].active {
	padding: 10px 0 5px;
}

#pSections li {
	height: 100%;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
}

#pSections li[data-name="all"] {
	padding-top: 0;
	padding-bottom: 2px;
}

#pSections li[data-name="all"],
#ceGroups li[data-name$="all"],
#imGroups li[data-name$="all"],
#iqGroups li[data-name$="all"] {
	min-width: 30px;
	max-width: 40px;
	font-size: 13px;
	line-height: 1.2;
}

#pSections li[data-name="g0"] #pSections li[data-name="g1"],
#pSections li[data-name="g2"] {
	min-width: 40px;
}

#pSections li:hover,
#pSections li.current,
#pSections li.active {
	/* NOTE: '!important' is important; ensures that '.current' is set properly in in-quest.html on sidenav  */
	cursor: pointer;
	padding-top: 12px !important;
}

#pSections li[data-name="all"]:hover,
#pSections li[data-name="all"].current,
#pSections li[data-name="all"].active {
	padding-bottom: 7px;
	line-height: 0.5;
	padding-top: 3px !important;
}

#ceGroups li,
#imGroups li,
#iqGroups li {
	width: 100%;
	height: 100%;
}

#iqGroups li[data-name="in-quest-g0"],
#iqGroups li[data-name="in-quest-g1"] {
	min-width: 46px;
}

.hoverable,
.hoverable * {
	cursor: pointer;
}

.slides-pdf-btns {
	float: right;
	display: flex;
	flex-direction: column;
	padding-left: 6px
}

.slides-pdf-btns .slides {
	padding: 6px;
	width: 100%;
}

.slides-pdf-btns .slides a {
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	font-size: 16px;
}

.pdf-visible-only {
	display: none;
}

/* Animsition link-transition overlay only (not the boot page loader) */
.animsition-loading {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: grid;
	place-items: center;
	margin: 0;
	padding: 0;
	background-color: transparent;
	pointer-events: all;
	overflow: hidden;
	opacity: 1;
	box-sizing: border-box;
}

/* Page loader — shell tracks visual viewport (--soi-pl-* set in page-loader.js); stack centred inside */
.page-loader {
	position: fixed;
	top: var(--soi-pl-top, 0);
	left: var(--soi-pl-left, 0);
	width: var(--soi-pl-width, 100%);
	height: var(--soi-pl-height, 100%);
	right: auto;
	bottom: auto;
	z-index: 999999;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	pointer-events: none;
	opacity: 0;
	box-sizing: border-box;
}

.page-loader.page-loader--in {
	opacity: 1;
	transition: opacity var(--soi-loader-fade-ms, 400ms) ease;
}

.page-loader.page-loader--out {
	opacity: 0;
	transition: opacity var(--soi-loader-fade-ms, 400ms) ease;
}

#loaderImg img {
	display: block;
	width: 130px;
	height: auto;
}

.page-loader .page-loader-ellips {
	margin: 16px 0 0;
	font-size: var(--soi-loader-spinner-size);
	width: calc(3em + 2 * var(--soi-loader-spinner-gap));
	height: 1em;
	--soi-loader-dot-step: calc(1em + var(--soi-loader-spinner-gap));
}

.page-loader .page-loader-ellips .loader-ellips__dot {
	background: var(--soi-loader-spinner-color);
}

.page-loader .page-loader-ellips .loader-ellips__dot:nth-child(3) {
	left: var(--soi-loader-dot-step);
}

.page-loader .page-loader-ellips .loader-ellips__dot:nth-child(4) {
	left: calc(var(--soi-loader-dot-step) * 2);
}

.page-loader .page-loader-ellips .loader-ellips__dot:nth-child(2),
.page-loader .page-loader-ellips .loader-ellips__dot:nth-child(3) {
	animation-name: page-loader-ellips-slide;
}

@keyframes page-loader-ellips-slide {
	to {
		transform: translateX(var(--soi-loader-dot-step));
	}
}

body.page-loader-active {
	overscroll-behavior: none;
}

.css3-spinner {
	background-color: rgb(72, 84, 90);
}

.css3-spinner>div,
.css3-spinner-grid-pulse>div,
.css3-spinner-ball-rotate>div,
.css3-spinner-zig-zag>div,
.css3-spinner-ball-scale-multiple>div,
.css3-spinner-triangle-path>div,
.css3-spinner-ball-pulse-sync>div {
	background-color: rgb(176, 93, 48);
}

.css3-spinner-clip-rotate>div,
.css3-spinner-scale-ripple>div {
	border-color: rgb(176, 93, 48);
}

/* ======================================
	WEBKIT-SCROLLBARS (.scroll-container / .popover-body)
========================================= */

.popover-body::-webkit-scrollbar {
	/* NOTE: this makes the web kit scrollbar invisible */
	width: 0;

}

.scroll-container::-webkit-scrollbar {
	width: 0;
}

/* NOTE: For Firefox only */
.popover-body,
.scroll-container,
.horiz-scroll {
	scrollbar-width: none;
}

.scroll-container::-webkit-scrollbar-track,
.scroll-container::-webkit-scrollbar-thumb,
.popover-body::-webkit-scrollbar-track,
.popover-body::-webkit-scrollbar-thumb {
	border-radius: 2px;
	min-height: 60px;
}

.scroll-container::-webkit-scrollbar-track,
.popover-body::-webkit-scrollbar-track {
	margin-top: 5px;
	margin-bottom: 5px;

	box-shadow: inset 0 0 6px rgb(50 50 50 / 10%);
}

.scroll-container::-webkit-scrollbar-thumb,
.popover-body::-webkit-scrollbar-thumb,
.dynloader span {
	background: linear-gradient(rgb(149 169 176 / 100%) 0%, rgb(149 169 176 / 100%) 35%, rgb(99 117 147 / 100%) 100%);

	cursor: pointer;
}

.scroll-container::-webkit-scrollbar-thumb:hover,
.popover-body::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(rgb(99 117 147 / 100%) 0%, rgb(149 169 176 / 100%) 65%, rgb(149 169 176 / 100%) 100%);
	cursor: pointer;
}

.noscrollbar::-webkit-scrollbar,
body.device-touch .popover-body::-webkit-scrollbar {
	width: 0;
	display: none;
	background: transparent;
}

body.device-touch .scroll-container::-webkit-scrollbar,
body.device-touch .popover-body::-webkit-scrollbar,
.noscrollbar::-webkit-scrollbar-track {
	width: 0;
	display: none;
}

body.device-touch .scroll-container::-webkit-scrollbar-thumb,
body.device-touch .popover-body::-webkit-scrollbar-thumb,
.noscrollbar::-webkit-scrollbar-thumb {
	width: 0;
	display: none;
}

/* NOTE: .fade-scroll fades the -webkit-scrollbar after scrolling */
.fade-scroll {
	position: absolute;
	display: block;
	height: auto;
	width: 5px;
	top: 0;
	right: 2px;
	bottom: 0;
	margin: 7px 2px 7px 1px;
	z-index: 1;
	background-color: rgb(255 250 245 / 100%);
}

.modal.simple .modalcontent .fade-scroll {
	margin: 0 28px 0 0;
}

.scroll-wrap {
	width: 100%;
	height: 100%;
	padding: 0;
}

/* NOTE: for Articles & Anthology */
.entry-author {
	font-size: 1.3em;
	margin: 1.5em 0;
	display: none;
}

text-content.anthology entry-author {
	display: block;
}

#modalMakePDF {
	padding: 20px 0 0 0;
}

#modalMakePDF a {
	line-height: 1;
	font-size: 126%;
}

.entry-author p,
.entry-servings p {
	line-height: 1.2 !important;
	font-size: 16px !important;
	text-indent: 0 !important;
	margin: 0;
}

.entry-servings {
	width: calc(100% - 2.4em);
	margin: 1.5em auto 1.5em 1.2em;
}

.entry-servings strong {
	font-family: 'Proza Libre', sans-serif;
	font-weight: 500;
	font-size: inherit !important;
}

.entry-author .entry-date,
.entry-author .entry-source,
.entry-servings .entry-date {
	font-size: 0.68em;
	line-height: 1.2;
	margin-top: 0.35em;
}

/* ----------------------------------------------------------------
	FORMS
----------------------------------------------------------------- */

.g-recaptcha-inner {
	width: 154px;
	height: 82px;
	overflow: hidden;
	margin: 0 auto;
}

.g-recaptcha {
	position: relative;
	left: -2px;
	top: -1px;
}

.g-recaptcha-outer,
.turnstile-wrap {
	height: auto;
	margin-bottom: 12px;
	padding: 20px;
	font-size: 0.9em;
	text-align: center;
	max-width: 240px;
	background: transparent;
	box-shadow: none;
	border: none;
}

.turnstile-wrap {
	margin-left: auto;
	margin-right: auto;
}

/* NOTE: this will not work: determined by google */
.rc-anchor-light.rc-anchor-compact {
	background: transparent !important;
}

.forminput label.error {
	position: absolute;
	right: 0;
	margin-top: -2px;
	display: none;
}

.sm-form-control,
.g-recaptcha-outer {
	display: block;
	width: 100%;
	height: auto;
	padding: 5px 8px;
	margin-bottom: 6px;
	font-size: 15px;
	line-height: 1.42857143;
	background-image: none;

	border-radius: var(--yim-br);

}

.sm-form-control:focus {
	outline: 0;
	border: 1px solid;
	border-color: var(--light-border);
	background-color: rgb(250 200 0 / 6%);
}

.sm-form-control[disabled],
.sm-form-control[readonly],
fieldset[disabled] .sm-form-control {
	cursor: not-allowed;
	opacity: 1;
	background-color: rgb(238 238 238 / 100%);
}

.sm-form-control {
	height: auto;
	background-color: rgb(249 249 249 / 100%);
	box-shadow: inset 5px 0 16px 3px rgb(0 0 0 / 10%);
}

#comments .comment {
	border-color: rgb(210 200 190 / 50%);
}

#comments .comment>.img {
	border-color: rgb(210 200 190 / 50%);
	background: rgb(244 242 240 / 100%);
}

#comments .comment .con .name-date {
	background: rgb(0 0 0 / 5%);
}

.nocolor,
.lead {
	color: inherit;
}

.lead {
	font-size: 1.15rem;
	font-weight: 400;
}

.linetop::before {
	content: "";
	display: block;
	padding: 6px 0;
	line-height: 1;
	border-top: 2px solid;
}

.linebottom::after {
	content: "";
	display: block;
	padding: 3px 0;
	line-height: 1;
	border-bottom: 2px solid;
}

.red {
	color: rgb(160 60 60 / 100%);
}

.txtbox {
	position: relative;
}

:not(.boxed) .txtbox {
	padding: 1em 1.2em;
	width: auto;
	border-radius: var(--yim-br);
}

:not(.boxed) .txtbox:not(.legend):not(.tableft):not(.tabright):not(.infomsg) {
	margin: 2em 1.5em;
}

.question+.txtbox,
.step+.txtbox {
	margin-top: 12px;
}

.txtbox.infomsg {
	width: auto;
	margin: 2em 1.5em;
	padding: 0.5em 1.2em;
}

.txtbox.infomsg p {
	margin: 0.35em 0 !important;
}

.txtbox.tableft {
	width: 90%;
	margin: 25px 10% 25px 0;
}

.txtbox.tabright {
	width: 90%;
	margin: 25px 0 25px 10%;
}

.txtbox img {
	width: 100px;
	height: 120px;
	margin-top: -38px;
}

.txtbox h4 {
	text-align: left;
	margin-top: 0;
	margin-bottom: 0.5em;
	margin-left: 0.2em;
	padding: 0;
}

.txtbox h5 {
	text-align: center;
	margin: 0.85em auto 0.5em;
}

.txtbox h5:first-child {
	margin-top: 0;
}

.txtbox h6 {
	font-size: 1.1em;
	margin-top: 0;
	margin-bottom: 0.5em;
}

.txtbox:not(.tnormal) p:not(.instruct) {
	font-weight: 600;
	line-height: 1.5;
	margin: 0.85em auto;
}

.txtbox.tnormal h4 {
	font-size: larger !important;
}

.txtbox.tnormal p {
	font-size: large !important;
	font-weight: normal !important;
	line-height: normal !important;
}

.txtbox p:first-child {
	text-indent: 0;
	margin-top: 0;
}

.txtbox p:last-child {
	margin-bottom: 0;
}

.txtbox ul+p,
.txtbox ol+p {
	margin-top: 1em;
}

.txtbox.intention {
	border-radius: 60px;
	filter: sepia(15%);
	margin: 1.2em 12%;
}

.dark .txtbox.intention {
	filter: sepia(50%);
}

p.tab,
.tab p {
	text-indent: 0;
	margin: 0.5em 1.5em 0 1.5em;
}

.poem {
	margin: 1.5em 3.0em 0 3.0em;
}

.poem.fullwidth {
	margin: 1.5em 0 0;
}

body.home .poem.fullwidth {
	margin-top: 0;
}

body.home .poem.fullwidth p:first-child {
	margin-top: 36px;
}

.poem p {
	text-indent: 0;
	line-height: 1.7 !important;
}

.poem:not(.tjust) p {
	text-align: left;
}

.poem-indent p:not(:first-child) {
	text-indent: 1.2em !important;
}

/* NOTE: qsource for quotation & blockquote; ssource for statement; psource for poem; nsource for p (n:normal)*/
.qsource,
.ssource,
.psource,
.nsource {
	font-size: 0.8em;
	white-space: nowrap;
	font-style: normal;
}

.ssource {
	margin: 0 auto 1em auto;
}

.dyncontent .ssource {
	font-size: 1.3em !important;
}

.modalcontent .ssource {
	font-size: 1.1em !important
}

.qsource,
.ssource,
.nsource {
	text-align: right !important;
}

/* NOTE: for .poem */
.psource {
	text-align: left;
	margin: 0.5em 3.5em 2.5em 4.5em;
}

.quotation+.qsource {
	margin-top: 0 !important;
	margin-bottom: 3em !important;
	text-align: center !important;
	text-transform: uppercase;
}

blockquote+.qsource {
	margin: 1.5em 1.5em 1.75em 1.5em;
	text-align: right;
	padding-right: 1.8em;
	font-family: 'Paprika', sans-serif;
}

.qsource em {
	font-size: 100% !important;
	font-family: 'Paprika', sans-serif;
}

/* NOTE: for when source follows a regular paragraph (p) */
.nsource {
	margin: 1em 0 2.5em 1.5em;
}

.textMatter.readmodal ul:not(.smlmenu) {
	width: calc(100% - 2.5em);
}

/* --------------------------------------------------------------
	Side Navigation
--------------------------------------------------------------  */
.flag-french {
	position: relative;
	left: 0;
	top: 0;
	width: 23px;
	height: 15px;
	text-align: center;
	background-color: white;
	border-top: 5px solid blue;
	border-bottom: 5px solid red;
	outline-style: solid;
	outline-color: #999;
	outline-width: thin;
	margin: 10px;
}

figure.language {
	position: absolute;
	right: 0;
	bottom: 40px;
	width: 60px;
	height: 36px;
	cursor: pointer;
}

.flag {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.flag-fr {
	background: url('../images/yim/flag-fr.jpg');
	background-repeat: no-repeat;
	background-size: 100%;
}

.flag-uk {
	background-image: url('../images/yim/flag-uk.jpg');
	background-repeat: no-repeat;
	background-size: 100%;
}

#sideListsWrap[data-title]::before {
	/* NOTE: compensate for height of pseudo-header */
	margin: -34px 0 0 0;
}

#sidenavScroll,
#sideLists {
	position: relative;
	height: 250px;
	/* NOTE: 'max-height' necessary for when heading buttons are clicked */
	max-height: 250px;
	padding: 0;
	z-index: 1;
	border-radius: var(--yim-br);
	border-left: none !important;
	border-right: none !important;
	border-top-width: 2px !important;
	border-bottom-width: 2px !important;
	border-color: var(--light-border);

	overflow-y: scroll;

	/* NOTE: next is necessary for Firefox */
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

#sideListsWrap {
	position: relative;
	margin-bottom: 50px !important;
	margin-top: 0 !important;
	opacity: 1 !important;
}

#sideListsWrap h2 {
	margin-bottom: 0 !important;
}

#sideListsWrap h3,
#instructions h3 {
	text-align: center !important;
	text-transform: uppercase;
}

#sideListsWrap h3 {
	margin-bottom: 0 !important;
}

#sideLists h6 {
	font-size: 1.175em;
	font-weight: 600;
	line-height: 1.1;
	margin: 16px auto 12px;
	text-align: center;
}

#sideLists li.nobullet h6 {
	text-align: left;
}

#sideLists h6:first-child {
	margin-top: 16px;
}

#sideLists {
	height: auto;
	max-height: none;
	/* NOTE: to simply center buttons (e.g. button for basic ketogenic recipe) */
	text-align: center;
	/* NOTE: allow some space to the right to see box-shadow */
	padding-right: 4px;
}

#sideListsWrap div button {
	height: 38px;
	width: 48px;
	padding: 0 8px;
	font-size: 24px;
	line-height: 1.5em;
	margin: 18px 0 12px 8px;
}

/* NOTE: e.g., end Notes in recipes (e.g., curry vegetable lentil soup */
div ul.nobullet li i {
	display: none;
}

#titleInContent {
	position: relative;
	margin-bottom: 0;
	padding: 0 15%;
}

#titleInContent h1 {
	font-size: 36px;
	margin-bottom: 0.2em;
}

#titleInContent p {
	margin: 0;
}

#titleInContent.slides h1 {
	display: block;
	font-size: 2.1rem;
}

#titleContainer h1+div,
#titleContainer h1+span {
	line-height: 0.5;
}

.readmodal .title div {
	font-size: 50% !important;
	line-height: 1.3em;
	text-transform: none;
}

#thePicture {
	position: relative;
	min-height: 120px;
	margin-top: 48px;
}

/* NOTE: temporary: until good pictures are made */
#thePicture figure:first-child {
	margin: 20px;
}

#thePicture figure:first-child img {
	border-radius: 50%;
	width: 100%;
	max-width: 400px;
	padding: 3px;
	border: none;
}

/* NOTE: the caption for language (flag) */
#thePicture figure+figure figcaption {
	font-size: 0.7em;
	margin-top: 63%;
}

figure {
	text-align: center;
	margin: 0;
}

figure.fleft {
	margin-bottom: 0;
	padding: 6px 16px 12px 0;
}

figure+p {
	text-indent: 0 !important;
}

figure+p,
figure+ol,
figure+ul,
figure+div {
	margin-top: 1.3em !important;
}

figure.toptext {
	margin-top: 1em;
}

figcaption {
	font-size: 0.85em;
	line-height: 1.45;
	padding: 0.5em 0 1.2em;
}

.flex-column figcaption {
	margin: 0;
}

.full-slider .container {
	display: flex;
	justify-content: center;
	padding: 0;
	margin: 0;
	width: 100% !important;
	max-width: 100% !important;
}

.w20 {
	width: 20%;
	min-width: 90px;
}

.w25 {
	width: 25%;
	min-width: 110px;
}

.w30 {
	width: 30%;
	min-width: 110px;
}

.w33 {
	width: 33.333%;
	min-width: 110px;
}

.w45 {
	width: 45%;
}

.w50 {
	width: 50%;
}

img.fullwidth,
img.halffullwidth {
	width: 100%;
	margin: 16px auto 6px auto;
}

img.portrait {
	width: auto;
	margin: 16px auto 0 auto;
	max-height: 500px;
}

img.fullwidth+figcaption,
img.portrait+figcaption {
	min-width: 60%;
	max-width: 80%;
	margin: auto;
}

img.halffullwidth {
	width: 60%;
}

img.fleft {
	margin: 6px 12px 0 0;
}

img.fright {
	margin: 0 0 0 12px;
}

figure.fright {
	padding: 6px 0 12px 16px;
}

figure.fright img,
figure.fleft img {
	margin-bottom: 6px;
}

h3+figure img.fullwidth,
h3+figure img.halffullwidth {
	margin-top: 6px;
}

h4+figure img.fullwidth,
h4+figure img.halffullwidth {
	margin-top: 18px;
}

h3.linebottom+.figtopspace+figure.fleft+p {
	margin-top: 0;
}

h3.linebottom+.figtopspace+figure.fleft {
	padding-top: 0.5rem;
}

figure.tint {
	position: relative;
	float: left;
	cursor: pointer;

	border-radius: var(--yim-br);
}

figure.tint::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgb(255 251 247 / 50%);

}

figure.tint:hover::before {
	background: none;
}

figure.gs img {
	filter: grayscale(75%);
}

#sideLists .noticebox {
	border-radius: var(--yim-br);
	margin: 28px 0 0;
	line-height: 1.4;
}

#sideLists .noticebox h4 {
	display: block;
	font-size: 24px !important;
	margin-top: 0 !important;
	padding-top: 0 !important;
	line-height: 1.2;
}

#sideLists .noticebox p {
	line-height: 1.4 !important;
	margin-top: 8px !important;
	font-size: 13px !important;
	hyphens: none;
}

ol .smaller,
ul .smaller {
	margin: 1em 0;
}

.tblsort ol,
.tblsort ul,
#sideLists ol,
#sideLists ul {
	text-align: left;
}

.tblsort ol li,
.tblsort ul li,
#sideLists ol li,
#sideLists ul li {
	position: relative;
	margin-bottom: 0.2em;
}

#sideLists ol,
#sideLists ul {
	padding: 0.56em 0.75em 0.56em 2em !important;
}

strong {
	font-weight: 600;
	font-size: inherit !important;
}

.textMatter strong,
.table-display li strong:first-child,
aside strong,
.textMatter span b {
	font-family: 'Proza Libre', sans-serif;
	font-weight: 500;
	font-size: inherit !important;
}

.textMatter li.altli {
	font-size: 0.78em !important;
}

#instructions strong,
.textMatter .altli strong {
	font-family: 'Arima Madurai', sans-serif;
	font-weight: 700;
	font-size: 110% !important;
}

.likebul {
	font-family: 'Arima Madurai', sans-serif !important;
	font-weight: 900 !important;
}

/* **********************************************
	LISTS & TABLE > LIST (e.g., #instructions table td ol)
************************************************* */

p+ul,
p+ol {
	margin-top: 0.25em;
}

#sideLists ul {
	margin: 0 auto 1.5em auto !important;
	width: 100%;
}

.textMatter ul:not(.smlmenu):not(.media-pl),
.textMatter ol,
.ptxt ul,
.ptxt ol {
	width: auto;
	/* NOTE: top margin unnecessary; bottom margin provided by preceding paragraph */
	margin: 36px 20px;
	padding: 1em 1em 1em 2em;
	list-style-type: none;
	border-radius: var(--yim-br);
}

.textMatter .toggle ul:not(.smlmenu):not(.media-pl),
.textMatter .toggle ol {
	margin: 0 1em 1em;
}

.textMatter .txtbox ul,
.textMatter .txtbox ol {
	margin: 0;
	padding: 0 2.4em;
}

.txtbox ul {
	background: none !important;
	border: none !important;
	box-shadow: none !important;
	margin: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.textMatter ul:not(.smlmenu):not(.media-pl) li,
.textMatter ol li,
.ptxt ul li,
.ptxt ol li {
	font-size: 1em;
	position: relative;
	text-align: justify;
	list-style-type: none;
}

.textMatter ul:not(.smlmenu):not(.media-pl):last-child li:last-child,
.textMatter ol:last-child li:last-child {
	margin-bottom: 0;
}

#sidenLists ul li:not(.altli) {
	margin: 0.15em 0 0.35em 0.15em;
}

#sideLists ul li:first-child {
	margin-top: 0;
}

#sideLists ul li:last-child {
	margin-bottom: 0;
}

#sideLists ul li:not(.altli)+li.altli {
	margin: -0.3em 0 0.4em 0;
}

.textMatter ul:not(.smlmenu):not(.media-pl) li.altli,
.textMatter .instructions-note {
	line-height: 1.3;
	margin: 0.15em 0;
	text-align: left;
	font-size: 0.9em;
}

.textMatter ul:not(.smlmenu) li.altli:not(.push),
.textMatter ul:not(.smlmenu) li.altli.dontpush {

	padding-left: 0;
	margin-left: 0.25em;
	text-indent: -0.85em;
}

.textMatter ul:not(.smlmenu) li.altli.push,
.textMatter .instructions-note,
.textMatter ul:not(.smlmenu) li.altli.altern {
	padding-left: 1.72em;
	text-indent: -0.78em;
	line-height: 1.25;
}

/* NOTE:when altli is first-child li and is not pushed back (its bullet has class 'dontpush') */
.textMatter #sideLists ul li:first-child.altli {
	margin-bottom: 0.65em;
}

.textMatter ul:not(.smlmenu) li ol {
	padding-left: 1.2em;
	margin: 0;
}

ol ul li {
	margin-bottom: 0;
}

.textMatter ul:not(.smlmenu):not(.media-pl) li,
.textMatter ol li {
	margin-left: 0;
}

.textMatter ul:not(.smlmenu) li ol li:first-child,
.textMatter ol:not(.vmenu) li ul li:first-child {
	margin-top: 0.5em;
}

.textMatter ol>li ul {
	margin: 0 0 0 1em;
	padding: 0;
	border: none;
	background: none;
	box-shadow: none;
	list-style-type: none;
}

.textMatter ol>li ul>li {
	counter-increment: none !important;
	font-size: 90%;
	margin: 0;
	list-style: none;
}

.textMatter ol ol,
.textMatter ul ul,
.textMatter ul ol,
.textMatter ol ul {
	background: none !important;
	box-shadow: none !important;
	border: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

ol+.boxed,
ul+.boxed {
	margin: 1em 0 !important;
	padding: 0 !important;
}

ol+.txtbox,
ul+.txtbox {
	margin-top: 2.5em !important;
}

ol ul ol {
	padding: 0 1.5em 0 0 !important;
	margin: 0 0 0 1.5em !important;
}

ol ul>li {
	font-weight: 300 !important;
}

ol ol ol {
	counter-reset: none !important;
}

ol ul ol>li {
	counter-increment: none !important;
	margin-left: -1.5em !important;
	font-size: 92% !important;
}

ol ul ol>li:first-child {
	margin-top: 0.25em;
}

ol ul ol>li::before {
	content: none !important;
}

.textMatter ol>li:not(.altli) {
	counter-increment: nice-counter;
	list-style-type: none;
}

.textMatter ol>li.altli {
	counter-increment: none;
	list-style-type: none;
	padding-left: 20px;
}

/* NOTE: ul bullets using graphic */
.textMatter ul:not(.smlmenu):not(.media-pl)>li:not(.altli)::before,
.ptxt ul>li::before {
	content: '\f0c8';
	font-family: 'Font Awesome 6 Pro';
	font-weight: 900;
	font-size: 0.65em;
	top: 0.45em;
	display: block;
	position: absolute;
	top: 0.45em;
	left: -1.55em;
	vertical-align: middle;
	background: none !important;
}

.textMatter ol ul:not(.smlmenu):not(.media-pl)>li:not(.altli)::before,
.ptxt ol ul>li::before {
	content: '\f111';
	font-family: 'Font Awesome 6 Pro';
	font-size: 0.5em;
	font-weight: 900;
}

.textMatter ol>li:not(.altli)::before,
.textMatter td ol>li::before {
	content: counter(nice-counter, decimal);
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	position: absolute;
}

.textMatter ol ol>li:not(.altli)::before,
.textMatter td ol ol>li::before {
	content: counter(sub-counter, lower-alpha);
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	position: absolute;
}

.textMatter ol>li:not(.altli)::before {
	font-size: 0.425em;
	--size: 1.75em;
	left: calc(-1 * var(--size) - 1.5em);
	top: calc(-1 * var(--size) + 3em);
	line-height: var(--size);
	width: var(--size);
	height: var(--size);
	transform: rotate(-10deg);
	border-radius: 3px;
	text-align: center;
}

.textMatter ol ol {
	counter-reset: sub-counter;
}

.textMatter ol ol>li:not(.altli) {
	counter-increment: sub-counter;
	list-style-type: none;
}

.textMatter ol ol>li:not(.altli)::before {
	font-size: 0.525em;
	--size: 1.6em;
	left: calc(-1 * var(--size) - 1.2em);
	top: calc(-1 * var(--size) + 2.375em);
	line-height: var(--size);
	width: var(--size);
	height: var(--size);

	transform: rotate(0deg);
	border-radius: 50%;
	text-align: center;
	color: inherit !important;
}

.textMatter .vmenu>li::before {
	top: 1.2em;
}

.textMatter ol>li.altli::before {
	content: '\274D';
	font-size: inherit;
	line-height: 0;
	margin-left: -1.3em;
	margin-right: 0.4em;
}

.textMatter td ol>li::before {
	content: counter(nice-counter, decimal);
	font-family: 'Open Sans', sans-serif;
	font-size: 0.7em;
	font-weight: 700;
	/* NOTE: pixels allows for easier match with recipes.html (which sizes at 16px for some reason) */
	--size: 1.4em;
	top: 0.325em;
	left: -2.1em;
	width: var(--size);
	height: var(--size);
	transform: none;
	border: 1px solid var(--light-border-dark);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;

	background: transparent;
	box-shadow: var(--light-bs);
}

.textMatter .simple-ol ol {
	margin-left: 1.1em;
}

.textMatter .simple-ol td ol>li::before {
	content: counter(nice-counter, lower-alpha)'.';
	border: none;
	border-radius: unset;
	background: none;
	box-shadow: none;
	font-size: 0.86em;
	font-weight: 600;
	top: 0.15em;
	left: -1.45em;
}

#instructions td:first-child div,
.textMatter ol.simple>li:not(.altli)::before,
.textMatter ol:not(td ol)>li:not(.altli)::before {
	color: var(--dark-col-base) !important;
	text-shadow: var(--dark-ts);
}

/* **************************************************** */

#instructions h3 {
	text-align: center;
	margin-bottom: 15px;
}

#instructions table:not(.simple-ol) {
	margin: 0 auto 1em auto !important;
	border: 0 !important;
}

#instructions .divider {
	margin-bottom: 24px;
}

#instructions table thead {
	background-image: none;
	height: 0;
	padding: 0;
	margin: 0;
}

#instructions table th {
	font-family: 'Arima Madurai', sans-serif;
	font-weight: 900;
	font-size: 110%;
	padding: 0 0 6px 0;
	vertical-align: top;
	line-height: 1.4;
}

#instructions table td {
	padding: 0 0 0.5em 0.5em;
	vertical-align: top;
	line-height: 1.4;
	text-align: justify;
}

#instructions table td:first-child {
	padding-left: 0;
}

#instructions table thead:not(:first-child) tr th {
	padding-top: 12px;
}

#instructions table td:first-child div {
	vertical-align: top;
	font-size: 0.6em;
	font-weight: 600;
	position: static;
	--size: 1.5em;
	line-height: var(--size);
	width: var(--size);
	height: var(--size);
	transform: rotate(-10deg);
	border-radius: var(--yim-br3);
	text-align: center;
	margin-top: 0.5em;
}

.legend,
#endNotes {
	position: relative;
	width: 100%;
	left: 50%;
	transform: translateX(-50%);
	border-radius: var(--yim-br);
}

.legend {
	max-width: 340px;
	margin: auto;
}

#endNotes {
	margin: 36px auto;
	width: auto;
}

#endNotes[data-title]:not([data-title=""]) {
	padding: 1em 1.2em;
	margin-top: 48px !important;
	font-size: 86%;
}

#endNotes::before {
	content: attr(data-title);
	position: relative;
	display: flex;
	justify-content: center;
	width: 100%;
	height: auto;
	font-family: 'Arima Madurai', sans-serif;
	font-size: 135%;
	font-weight: 600;
}

#endNotes p {
	text-indent: 0;
	margin-bottom: 0.5em;
}

#endNotes p:last-child {
	margin-bottom: 0;
}

#endNotes p span:first-child.likehover {
	font-size: 120%;
	text-transform: uppercase;
	font-weight: 700;
}

#endNotes h4 {
	margin: 0.5em auto 0.35em;
}

#endNotes h4+p:first-child {
	margin-top: 0;
}

#endNotes h6 {
	text-align: center;
	margin: 0;
}

#endNotes h6+p {
	margin-top: 0 !important;
}

#endNotes.boxed,
#endNotes .boxed {
	padding: 0 12px 12px;
	width: 70%;
	margin: auto;
}

#endNotes p+.boxed {
	margin-top: 1em;
}

#endNotes table {
	margin: 0 auto 0 23.5% !important;
	width: 60%;
}

#endNotes table th {
	margin: 12px auto 3px auto;
	padding: 9px 0 0;
}

#endNotes table td {
	padding: 0;
}

#endNotes table td:first-child {
	padding-top: 0;
}

#endNotes table thead th:last-child,
#endNotes table td:nth-child(2) {
	text-align: center;
	white-space: nowrap;
}

#endNotes table thead th:first-child {
	text-align: left;
}

#endNotes table+p,
#endNotes table+div {
	margin-top: 0.6em !important;
}

#endNotes.boxed ul {
	list-style: none;
	margin: 1em !important;
	padding: 0;
}

#endNotes.boxed ul li,
#endNotes.boxed p {
	font-size: 80% !important;
}

#endNotes.boxed p,
#endNotes .boxed p {
	text-align: center;
	text-indent: 0;
	margin: 0;
	padding: 0;
}

#endNotes.boxed h4+div,
#endNotes.boxed p {
	line-height: 1.25;
}

#endNotes.boxed p:first-child {
	margin-top: 0.5em;
}

.alt {
	font-weight: 400;
	margin-left: -22px;
	margin-top: 6px;
}

.alt span,
#endNotes i span {
	font-weight: 600;
}

.alt .scaps,
.altli .scaps {
	display: inline;
	font-weight: 600;
	font-size: 118%;
	font-variant: small-caps;
}

.recipe {
	margin-top: -32px;
}

.recipe h3 {
	text-align: center;
}

.recipe:not(.modalcontent .recipe) h4 {
	margin-top: 1.8em;
	margin-bottom: 0.4em;
}

.modalcontent .recipe h4 {
	margin: 1em auto 0.5em 0;
	line-height: 1;
	font-size: 94%;
}

.img-fade-anim {
	position: relative;
	width: 100%;
	margin: 1.2em auto;
	max-width: 600px;
	border-radius: var(--yim-br);
	border: var(--light-border);
	box-shadow: var(--light-bs);
	height: 400px;
	/* Crucial for absolute positioning */
	overflow: hidden;
}

.dark .img-fade-anim {
	border: var(--dark-border);
	box-shadow: var(--dark-bs);
}

.img-fade-anim img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: var(--yim-br);
	opacity: 0;
	/* NOTE: fixed number of images (css only) */
	animation: fadeImages 12s infinite;
	animation-timing-function: ease-in-out;
	/* NOTE: any number of images using Vanilla js */
	/* NOTE: any number of images with jQuery*/
}

/* NOTE: for fixed number of images (css only) */
.img-fade-anim img:nth-child(1) {
	animation-delay: 0s;
}

.img-fade-anim img:nth-child(2) {
	animation-delay: 6s;
}

/* NOTE: for any number of images with jQuery */
/* NOTE: for fixed number of images or the Vanilla JS option */
@keyframes fadeImages {
	0% {
		opacity: 0;
	}

	20% {
		opacity: 1;
	}

	50% {
		opacity: 1;
	}

	80% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

.recipe h4:not(.center) span {
	font-size: 86%;
}

.nobullet i.icon-share.icon-flip-vertical {
	margin-right: 5px;
}

.toggle-container .toggle:last-child p:last-child {
	margin-bottom: 0;
}

.toggle-header,
.accordion-header {
	border: none;
	background-color: transparent;
	cursor: pointer;
}

.toggle-header .heading,
.accordion-header .heading,
h3.like-ch-heading {
	position: relative;
	padding: 6px 10px 6px 10px;
	width: calc(100% + 16px);
	/* NOTE: margin-bottom should be 0 (non) for the toggle to work without quirky movement of text when opening and closing: use margin-top instead */
	margin: 16px -8px 0;
	border-bottom: 1px solid;
	border-radius: var(--yim-br12-top);
}

h3.like-ch-heading {
	margin-top: 40px;
	line-height: 1.1;
}

h3.like-ch-heading span {
	text-transform: uppercase;
	font-weight: bold;
	margin-left: 1.6em;
}

.toggle {
	position: relative;
	margin: 1.5em 0;
}

.toggle-header .heading,
.accordion-header .heading {
	display: flex;
	align-items: center;
}

.toggle-header .heading i,
.accordion-header .heading i {
	position: absolute;
	right: 15px;
	font-size: 14px;
}

.toggle-header .heading i.icon-folder-open,
.accordion-header .heading i.icon-folder-open {
	right: 13px;
}

.toggle:not(.toggle-active)>.toggle-header .toggle-open,
.toggle-active>.toggle-header .toggle-closed {
	display: none;
}

.toggle-active>.toggle-header .toggle-open {
	display: inline-block;
}

.toggle-container.inactive h3 i .accordion.inactive h3 i {
	display: none;
}

.accordion-header,
.toggle-header {
	margin: 0;
}

.toggle-content {
	display: none;
	position: relative;
	height: auto;
	padding-bottom: 60px;
	max-height: 500px;
	overflow-y: hidden;
	transition: max-height 0.5s ease-in-out;
}

/* NOTE: add 'view-whole' class to toggles which is preferable seeing whole right away than by way of a 'view-more' button */
.toggle.view-whole .toggle-content,
.toggle-extended .toggle-content {
	max-height: none;
}

.toggle-content .view-more {
	position: absolute;
	right: 0;
	bottom: 0;
	height: 84px;
	width: 100%;
	z-index: 1;
	display: none;
}

.toggle-active .toggle-content .view-more {
	display: block;
}

.toggle.view-whole .toggle-content,
.toggle-container.short-contents .toggle-content,
.toggle-content.short-content {
	padding-bottom: 0;
	max-height: none;
}

.toggle-container.short-contents .view-more,
.toggle-content.short-content .view-more {
	display: none;
}

.accordion-button {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
	font-size: 20px;
	color: var(--bs-accordion-btn-color);
	text-align: left;
	background-color: var(--bs-accordion-btn-bg);
	border: 0;
	border-radius: 0;
	overflow-anchor: none;
	transition: var(--bs-accordion-transition);
}

.toggle-content .view-more>div {
	position: absolute;
	font-size: 16px;
	right: 0;
	bottom: 0;
	width: auto;
	height: auto;

	letter-spacing: 0.02em;
	text-align: right;
	cursor: pointer;
	padding: 0 6px 0 8px;
	border-radius: var(--yim-br);

	display: flex;
	justify-content: flex-end;
	/* NOTE: don't use align-items: center; need flexibility for the animation */
}

.toggle-content .view-more>div::after {
	overflow: hidden;
	display: inline-block;
	vertical-align: bottom;
	width: 12px;
	text-align: left;
	animation: dotty steps(1, end) 4s infinite;
	animation-fill-mode: both;
	content: '';
}

/* NOTE: space before dots is hair space (U+200A) */
@keyframes dotty {
	0% {
		content: ' ';
	}

	25% {
		content: ' .';
	}

	45% {
		content: ' ..';
	}

	65% {
		content: ' ...';
	}

	95% {
		content: ' ..';
	}

	97% {
		content: ' .';
	}

	100% {
		content: ' ';
	}
}

.toggle .boxed,
.accordion .boxed {
	margin: 1.5em 1.2em;
	position: relative;
}

.toggle .boxed p:first-child,
.accordion .boxed p:first-child {
	margin-top: 0;
	text-indent: 0;
}

#dynContent h1:first-child,
#titleInContent:not(.visible) {
	display: none;
}

#post_id {
	margin-bottom: 48px;
}

#post_id * {
	text-align: center;
	text-indent: 0;
}

#post_id h1 {
	font-size: 36px;
	margin-top: 0;
	margin-bottom: 8px;
	overflow-wrap: break-word;
	text-transform: uppercase;
	display: block !important;
}

#post_id h1+div,
#post_id h1+div p {
	font-size: 20px;
	margin: 0 auto 19px;
	line-height: 1.3;
	text-transform: uppercase;
}

#post_id h1+div>span {
	font-size: 80%;
	line-height: 2;
	white-space: nowrap;
	color: inherit;
}

#modalReadContent #post_id {
	display: none;
}

.readmodal .modal-header .modal-title h1,
.readmodal .modal-header .modal-title h1+div {
	display: block;
}

.modal {
	z-index: 1201;
}

.txtbox:not(.intention)::before,
.modalclose.top,
.divclose,
.button.divinfo {
	position: absolute;
	top: -18px;
	right: -18px;
	font-size: 32px;
	padding: 0;
	width: 36px;
	height: 36px;
	font-weight: normal;

	display: flex;
	justify-content: center;
	align-items: center;

	border-radius: 50%;
	z-index: 1;
	cursor: pointer;

	appearance: none !important;
}

.button.divinfo {
	font-size: 16px;
	right: auto;
	left: -18px;
	pointer-events: none;
	border-width: 2px;
    cursor: default;
}

div[class^="content"] .txtbox.infomsg .button.divinfo {
	font-size: 13px;
    right: auto;
    left: -13px;
    top: -13px;
    width: 26px;
    height: 26px;
	border-width: 2px;
}

.txtbox.infomsg .button.divinfo {
	left: auto;
	right: -18px;
}

.button.divinfo:hover {
	color: var(--primary-col);
}

.page-number {
	display: none;
}

.modal .modalclose.bottom {
	position: relative;
	width: auto;
	height: auto;
	float: right;
}

.modal-header,
.modal-footer {
	display: block;
	background: rgb(0 0 0 / 6%);
	height: auto;
	padding: 20px;
}

.modal-header {
	border-radius: var(--yim-br10-top);
}

/* NOTE: this neutralizes bootstrap setting */
.modal-footer>* {
	margin: 0;
}

.modal-footer {
	border-radius: var(--yim-br10-bottom);
}

.modal-title {
	line-height: 1.5;
}

.modal-title * {
	display: block;
	text-transform: uppercase;
	line-height: 1.2;
	text-align: center;
	margin: 0;
}

.webpage .modal-header * {
	align-items: right !important;
}

.webpage .modal-title * {
	text-align: right !important;
}

.modal-title h1+div p {
	line-height: 1.3;
	margin: 0.35em 0 0;
	text-transform: uppercase;
	font-size: 1.3em !important;
	text-align: center;

}

.modal-title.sm h1 {
	font-size: 1.9rem;
}

.modal-title h1>span:first-of-type {
	font-size: 0.75em;
}

.modal-title h1>span:nth-of-type(2) {
	font-size: 0.5em;
}

.modal-title h1+span {
	font-size: 0.85em;
}

.modal-title h1>div {
	font-size: 0.5em;
	line-height: 1.5;
}

.simple .modal-title {
	margin-left: 0;
}

.simple .modal-header h4 {
	margin-top: 6px;
}

.simple .modal-body .modalclose {
	display: none;
}

.simple .modal-body .scroll-container {
	margin-top: 6px;
}

#readModal .modal-body {
	padding: 0 28px;
}

#contactModal .modal-body,
#sliderModal .modal-body {
	padding: 20px;
}

#contactModal .modal-header,
#sliderModal .modal-header,
#plyrModal .modal-header,
#contactModal .modal-footer {
	display: none;
}

#contactModal .modal-footer {
	padding: 10px;
}

#readModal.simple .modal-body {
	padding: 0 8px 0 20px;
}

#contactModal h4 {
	text-align: center;
	margin: 0 0 0.8em 0;
}

#contactModal .form-widget {
	position: relative;
}

#contactModal .form-result {
	display: none;
	margin: 0 0 1.2em 0;
	padding: 0.8em 1em;
	border-radius: var(--yim-br, 4px);
}

.modal:not(.plyrmodal):not(.lotusmodal) .modal-dialog {

	/* NOTE: the extensive bottom margin allows for better functioning of toggles/accordions;
	this ensure that the heading (h3) will scroll to the top of the page */
	margin: 96px auto calc(100vh - 80px) auto;
	border-radius: var(--yim-br12);
	box-shadow: none;
}

.modal .modal-dialog {
	cursor: auto;
}

.modal-footer> :not(:first-child) {
	margin-left: 0.5em;
	margin-right: 0;
}

.modal .modal-content {
	border: none;
	background: transparent;

	box-shadow: none;
}

.readmodal.modal.fullwidth .modal-dialog {
	width: 96%;
	max-width: 1112px !important;
	margin-left: auto;
	margin-right: auto;
}

.readmodal.modal.image .modal-dialog img {
	width: 100%;
	height: auto;
	border: 1px solid;
}

.readmodal.modal.movie p:first-of-type {
	margin-top: 1.5em;
}

.modal-dialog.maxwidth {
	width: 92%;
	max-width: 1600px;
	margin-left: auto;
	margin-right: auto;
}

.pg-youtube {
	display: block;
	width: 90%;
	margin: 1.6em auto 0 auto;
	padding: 6px 6px 6px 6px;
	border-radius: var(--yim-br);
}

.ytwrapper {
	position: relative;
	padding-bottom: 52.5%;
	padding-top: 25px;
	height: 0;
}

.ytwrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.icon-ellipsis-horizontal:before {
	content: "\e7dd";
	vertical-align: -0.16em;
}

h3.step {
	display: inline-block;
	font-size: 2em;
	width: 100%;
	margin: 0 auto 0.5em !important;
}

h3.mtop {
	margin-top: 12px;
}

.question,
.answer {
	position: relative;
}

.question {
	margin: 0.5em 0 0.5% 4%;
	font-size: 1.25em;
}

.answer {
	margin: 0.5em 0 5% 8%;
}

.question p,
.answer p {
	text-align: left;
	text-indent: 0;
	text-transform: none;
	line-height: 1.45;
	margin: 0;
}

aside {
	position: relative;
	margin: 1em 0;
}

.question p abbr {
	padding-left: 12px;
}

.question p abbr i span {
	font-family: sans-serif;
	font-size: 10px;
	font-weight: bold;
}

.question-iow p,
p.iow {
	text-align: left;
	text-indent: 0;
	margin: 0 0 0.5em 0;
	line-height: 1.5;
}

.popover-body .question-iow:not(.leave-p1-alone) p,
.popover-body p.iow {
	margin-left: 1.2em;
	text-align: left;
}

.question-iow p:not(:last-of-type)::after,
p.iow:not(:last-of-type)::after {
	display: block;
	position: relative;
	border-bottom: 1px solid;
	content: '';
	margin: 0.6em 0.5em 0.4em 0;
}

.question-iow ul,
ul.iow {
	margin-left: 2.25em;
}

.question-iow ul li,
ul.iow li {
	margin-left: 0;
	list-style-type: none;
}

/* NOTE: used only in in-quest.html for detailed step-commented processes (e.g., text/pf/slides/iq-essential) */
.step .boxed .question>.steptitle,
.step .boxed .question>.steptitle+br {
	display: none;
}

.boxed+h5 {
	text-align: left;
}

.comment {
	text-align: left;
	text-transform: none;
	margin: -0.5em 0 0.5em 1.3em;
	line-height: 1.2;
}

span.hsml {
	font-size: 0.7em;
	text-transform: uppercase;
	display: inline;
}

.highlight {
	margin: 0 auto 0.75em auto;
	padding: 0;
	background-color: transparent;
	font-weight: 400;
	display: inline-block;
}

.highlight p,
.boxed {
	border-radius: var(--yim-br);
}

.highlight p {
	padding: 5px 10px;
}

.boxed {
	padding: 0.75em 1.2em;
	margin: 1em 1.5em;
}

.boxed p:last-child {
	margin-bottom: 0;
}

.boxed h3.step {
	margin-top: 0.15em;
}

.boxed .question {
	margin-top: 0.3em;
}

.boxed .answer {
	margin-bottom: 0.4em;
}

p.instruct {
	font-size: 1.1em;
	text-indent: 0;
	line-height: 1.575em;
	margin: 0 6px 1em 6px;
}

p.instruct:last-child {
	margin-bottom: 0;
}

.question+p.instruct {
	margin-top: 1em;
}

i.infobox {
	position: absolute;
	left: -16px;
	top: 0;
}

.divider i.fa-feather::before {
	font-size: 0.8em;
	vertical-align: 1px;
}

.fillit,
.popit {
	white-space: nowrap;
	border-radius: 4px;
}

.fillit {
	padding: 0.05em 0.25em 0.1em;
	font-size: 80%;
	font-weight: 400;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.fillit p {
	text-align: left;
	text-indent: 0;
	margin: 0;
}

.answer .fillit {
	font-size: 76%;
}

/* NOTE: only divs in text */
.dyncontent div.fillit {
	width: fit-content;
	margin-top: 1.2em;
}

.question-iow .iow .fillit {
	font-size: 70%;
}

/* NOTE: for when refering to a part of large file
and want to show it in a modal window */
#readModal .extract h3,
#readModal .extract h4,
#readModal .extract h5 {
	text-align: center;
	text-indent: 0;
	clear: both;
	margin: 1.5em auto;
	text-transform: uppercase;
	font-size: 1.5rem !important;
}

.popit {
	border: none;
	font-weight: 500;
	text-decoration: none !important;
	position: relative;
	padding: 0 5px 1px 5px;
	cursor: pointer;
}

.popit:not(.nocolor)::after {
	content: '';
	width: calc(100% - 10px);
	position: absolute;
	left: 5px;
	bottom: 0;
	border-width: 0 0 1px;
	border-style: dotted;
}

abbr.nocolor {
	border-bottom: none;
	cursor: pointer;
}

/* NOTE: is abbr and reference note (e.g., [1]) */
abbr.likefn {
	font-size: 14px;
	vertical-align: super;
	letter-spacing: 0.06em;
}

.option {
	font-weight: 600;
	text-indent: 0 !important;
	font-size: 1.1em !important;
	margin: 0.5em 0 0.5em 1.2em !important;
}

[data-bs-toggle="popover"] {
	cursor: pointer;
}

.popover {

	display: block;
	pointer-events: auto !important;
	/* Change to 'none' ONLY if you don't have links inside */

	/* NOTE: font-size must be set here, i.e., for the whole content of popovers */
	/* NOTE: with base 16px, 13.5px = 0.8439em */
	font-size: 0.8439em;
	line-height: 1.4;

	z-index: 3000;
	border: none !important;

	position: absolute;
	top: 0;
	left: 0;

	min-width: 276px;
	max-width: 276px;

	padding: 2px;
	letter-spacing: normal;
	line-break: auto;
	text-align: start;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	white-space: normal;
	word-break: normal;
	word-spacing: normal;
	word-wrap: normal;

	border-radius: 18px 18px 6px 6px;

	box-shadow: 12px 12px 20px 0px rgb(0 0 0 / 10%);
	/* NOTE: cursor:auto important; else in modals the light colour X to close the modal appears */
	cursor: auto;

}

.popover .popover-arrow {
	position: absolute;
	display: block;
	width: 1rem;
	height: 0.5rem;
}

.popover .popover-arrow::before,
.popover .popover-arrow::after {
	position: absolute;
	display: block;
	content: "";
	border-color: transparent;
	border-style: solid;
}

.bs-popover-top>.popover-arrow,
.bs-popover-auto[data-popper-placement^=top]>.popover-arrow {
	bottom: calc(-0.5rem - 1px);
}

.bs-popover-top>.popover-arrow::before,
.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before {
	bottom: 0;
	border-width: 0.5rem 0.5rem 0;
}

.bs-popover-top>.popover-arrow::after,
.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after {
	bottom: 1px;
	border-width: 0.5rem 0.5rem 0;
}

.bs-popover-end>.popover-arrow,
.bs-popover-auto[data-popper-placement^=right]>.popover-arrow {
	left: calc(-0.5rem - 1px);
	width: 0.5rem;
	height: 1rem;
}

.bs-popover-end>.popover-arrow::before,
.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before {
	left: 0;
	border-width: 0.5rem 0.5rem 0.5rem 0;
}

.bs-popover-end>.popover-arrow::after,
.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after {
	left: 1px;
	border-width: 0.5rem 0.5rem 0.5rem 0;
}

.bs-popover-bottom>.popover-arrow,
.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow {
	top: calc(-0.5rem - 1px);
}

.bs-popover-bottom>.popover-arrow::before,
.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before {
	top: 0;
	border-width: 0 0.5rem 0.5rem 0.5rem;
}

.bs-popover-bottom>.popover-arrow::after,
.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after {
	top: 1px;
	border-width: 0 0.5rem 0.5rem 0.5rem;
}

.bs-popover-bottom .popover-header::before,
.bs-popover-auto[data-popper-placement^=bottom] .popover-header::before {
	position: absolute;
	top: 0;
	left: 50%;
	display: block;
	width: 1rem;
	margin-left: -0.5rem;
	content: "";
	border-bottom: 1px solid transparent;
}

.bs-popover-start>.popover-arrow,
.bs-popover-auto[data-popper-placement^=left]>.popover-arrow {
	right: calc(-0.5rem - 1px);
	width: 0.5rem;
	height: 1rem;
}

.bs-popover-start>.popover-arrow::before,
.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before {
	right: 0;
	border-width: 0.5rem 0 0.5rem 0.5rem;
}

.bs-popover-start>.popover-arrow::after,
.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after {
	right: 1px;
	border-width: 0.5rem 0 0.5rem 0.5rem;
}

.popover-body {

	font-weight: 400;
	padding: 6px;

	border-radius: var(--yim-br-bottom);

	overflow: hidden;
	overflow-y: auto;
}

.popover-header {
	font-size: 1.3em;
	font-weight: 800;
	letter-spacing: 1px;
	text-transform: none;
	line-height: 1.2;

	padding: 8px 6px 6px 6px;
	margin: 0;
	text-align: center;
	text-indent: 0;

	border-radius: 16px 16px 0 0;
}

.popover-body p {
	text-align: justify;
	margin: 0 0 0.2em 0;
	line-height: 1.25;
}

.popover-body .leave-p1-alone p {
	text-align: left;
}

.popover-header,
.popover-body p>strong {
	font-weight: 700;
	font-size: inherit !important;
	font-family: 'Arima Madurai', 'Open Sans', sans-serif;
	color: var(--light-col-hov);
}

.popover-body p:first-child {
	margin-top: 0;
}

.popover-body p.noindent,
.popover-body p:first-child {
	text-indent: 0;
}

.popover .question p,
.popover .answer p {
	font-size: 1.1em;
	margin-top: 0;
	margin-bottom: 0.5em;
	line-height: 1.8em;
	text-align: left;
}

.popover .answer {
	font-size: 1em;
	line-height: 1.75em;
}

.popover,
.chevron::before,
.chevron::after {
	background: var(--light-border);
}

.po_readmore {
	font-size: 1.1em;
	font-weight: 400;
	text-align: right !important;
	margin: 10px 0 5px !important;
	cursor: pointer;
}

.modal button.close {
	/* NOTE: don't display the default bootsrap modal close button
	I will deal with this myself */
	display: none;
}

.noticebox {
	margin: 2em 15% 2em;
	padding: 16px;
	border-radius: var(--yim-br);

	background-color: rgb(245 200 80 / 20%);

	box-shadow: 1px 2px 6px 0px rgb(0 0 0 / 25%);

}

.noticebox i::before {
	position: absolute;
	margin-left: 16px;
	margin-top: -40px;
	color: rgb(176, 93, 48);
}

.noticebox p {
	font-size: 1.2em !important;
	font-weight: 400;
	letter-spacing: 1px;
	text-indent: 0 !important;
	text-align: justify;
	margin: 0;
	color: inherit;
	hyphens: none;

}

.smllist {
	list-style-type: disc;
	margin: 0 0 6px 29px;
	font-weight: 400;
}

.tinynote {
	font-size: 0.8em !important;
	text-align: left !important;
	font-weight: 400 !important;
	text-indent: 0 !important;
	line-height: 1.4;
	margin: 0;
}

/* NOTE: tinynotes containers */
.tinynote.admin-panel-intro,
#side-panel .tnc {
	margin: 8px 0 12px;
}

ol.tinynote,
ul.tinynote {
	margin: 5px 0 0 10px;
}

ul.tinynote {
	list-style-type: none;
}

ul.tinynote li {
	margin-left: 0.5em;
	text-indent: -0.75em;
}

.tinynote>li i[class^="fa-"]:first-child {
	position: relative;
	font-size: 0.8em;
	left: 0;
	margin-right: 0.75em;
	text-align: left;
}

.tinynote .fillit {
	padding: 0 3px;
}

.normal-ol,
.normal-ul {
	margin: 21px 0 11px;
}

.normal-ol li,
.normal-ul li {
	margin: 0 0 10px 2.3em;
	text-align: justify;
}

.btn-close i {
	color: rgb(238, 238, 238) !important;
}

img.border {
	border: medium double;
}

.news-container {
	position: relative;
	border-radius: var(--yim-br);

}

/* IMPORTANT: to systematically show summaries in their fullest height (whether through the side-panel or invididually) maintain the '!important' part of this style so as to prevent pf.js from having any action on them (show/hide); .scroll-more divs are only useful/functional if the summaries height (actually 'scroll-wrap') is set to other than 100% or auto (e.g. '247px') */
.scroll-container {
	position: relative;
	height: auto;
	width: auto;
	width: 100%;
	height: 100%;
	padding: 0;
	overflow-y: scroll;
	/* NOTE: next is necessary for Firefox */
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.scroll-more {

	padding: 0;
	margin: auto;

	position: absolute;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 36px;
	border-radius: var(--yim-br-bottom);
	z-index: 1;
}

.portfolio.no-scroll-more .scroll-more,
.plyr-container.no-scroll-more .scroll-more {
	display: none !important;
}

.scroll-more::before {
	content: 'SCROLL';
	position: absolute;
	display: block;
	right: 25px;
	bottom: 2px;
	width: auto;
	white-space: nowrap;
	letter-spacing: 0;
	font-size: 7.25px;
}

.scroll-more::after {
	font-size: 8px;
	font-weight: bold;
	position: absolute;
	display: inline;
	white-space: nowrap;
	right: 3px;
	bottom: 0;
	width: 22px;
	letter-spacing: 3px;
	content: '';
	animation: ellipsis steps(1, end) 3s;
	animation-iteration-count: infinite;
	animation-delay: 0.25s;
	animation-fill-mode: both;
}

.scroll-more::before,
.scroll-more::after {
	padding-bottom: 2px;
}

.portfolio:not(.imgitems).txtitems .portfolio-item .scroll-more {
	display: none !important;
}

.media-pl .title-wrap::before,
.news-column:not(.clips) .tblsort .title-wrap::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: -1;
	/* Place it behind the content but above the base background */
	opacity: 0;

}

.news-column:not(.clips) .tblsort .title-wrap::before {
	border-radius: 3px 3px 0 0;
}

.media-pl li:hover .title-wrap::before,
.media-pl li.active .title-wrap::before,
.news-column:not(.clips) .tblsort.active .title-wrap::before,
.news-column:not(.clips) .tblsort:hover .title-wrap::before {
	opacity: 1;
}

/* NOTE: space before dots is hair space (U+200A) */
@keyframes ellipsis {
	0% {
		content: ' ';
	}

	25% {
		content: ' •';
	}

	45% {
		content: ' ••';
	}

	65% {
		content: ' •••';
	}

	97% {
		content: ' ••';
	}

	99% {
		content: ' •';
	}

	100% {
		content: ' ';
	}
}

.news-column .title {
	font-family: 'Teko';
	font-weight: 400;
	letter-spacing: 0.3px;
	font-size: 18px;
	margin: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* NOTE: important: .tblsort must come before .port-folio-item; otherwise portfolio-4 won't work */
.tblsort,
.tblsort .clip-overlay {
	position: relative;
	padding-top: 0;
	width: 100%;
	cursor: pointer;

	border-radius: var(--yim-br);

}

.tblsort {
	margin: 3px 0 4px 0;
	min-height: 138px;
}

.countitems {
	position: relative;
	text-transform: uppercase;
	font-weight: 400;
	text-align: right;
	font-size: 10px;
	bottom: 17px;
	height: 0;
	width: calc(100% - 10px);
	color: var(--light-col-box);
}

.dark .countitems,
#footNews .countitems {
	color: var(--dark-col-box);
}

.news-column.clips .tblsort {
	padding: 0
}

.news-column .tblsort:first-child,
.news-column .tblsort.active {
	margin-top: 0;
}

.news-column .tblsort:last-child {
	margin-bottom: 3px;
}

.news-column .title {
	white-space: normal;
	line-height: 1;
	letter-spacing: 0.25px;
}

.news-column .title-wrap,
.modal .miscTitle {
	font-size: 24px;
	font-weight: normal;
	margin: 0;
	text-transform: uppercase;
	text-indent: 0 !important;
	word-wrap: break-word;
}

.news-column .title-wrap {
	position: relative;
	padding: 6px;
	height: auto;
	min-height: 48px;
	margin-bottom: 0;
	border-radius: 5px 5px 0 0;
	z-index: 1;
}

.sorttitle,
.sortdate {
	display: none;
}

/* NOTE: don't know where or why this following class ; don't add ':hover' as this will inactivate searchboxes (in Safari and iOS at least); maybe '.hover' is actually not needed */
.hover {
	user-select: none;
	-webkit-touch-callout: none;
}

table {
	width: 100%;
	max-width: 100%;
	margin: 0 0 48px 0 !important;
	border-collapse: separate;
	border-spacing: 0;

	border-radius: var(--yim-br);

}

table td ol {
	margin: 0 0 0 1.6em;
}

table caption {
	margin: 24px auto 12px;
	font-size: 0.86em !important;
	font-weight: bold;
}

table>thead>tr>th {
	text-transform: uppercase;
	font-size: 14px !important;
	font-weight: 600;
	vertical-align: bottom;
	color: var(--light-col-base);
	text-shadow: var(--light-ts);
	line-height: 1.15;
}

table>thead>tr>th,
table>tbody>tr>th,
table>tfoot>tr>th,
table>thead>tr>td,
table>tbody>tr>td,
table>tfoot>tr>td {
	padding: 6px;

}

table:not(.lh1)>tbody>tr>td {
	line-height: 1.42857143;
	vertical-align: top;
}

table.valign-middle th,
table.valign-middle td {
	vertical-align: middle;
	/* NOTE: necessary relative position so as to enable absolute elements within */
	position: relative;
}

table.valign-middle>tbody>tr>th,
table.valign-middle>tbody>tr>td {
	vertical-align: middle;
}

table.first-col-right>thead>tr>th:first-child,
table.first-col-right>tbody>tr>td:first-child {
	text-align: right;
}

table.first-col-left>thead>tr>th:first-child,
table.first-col-left>tbody>tr>td:first-child {
	text-align: left;
}

table.first-col-bold>tbody>tr>td:first-child {
	font-weight: 600;
}

table>thead>tr>th:first-child {
	border-radius: var(--yim-br5-top-left);
}

table>thead>tr>th:last-child {
	border-radius: var(--yim-br5-top-right);
}

table>tbody>tr:last-child>td:first-child {
	border-radius: var(--yim-br5-bottom-left);
}

table>tbody>tr:last-child>td:last-child {
	border-radius: var(--yim-br5-bottom-right);
}

table.table-condensed>thead>tr>th,
table.table-condensed>tbody>tr>th,
table.table-condensed>tfoot>tr>th,
table.table-condensed>thead>tr>td,
table.table-condensed>tbody>tr>td,
table.table-condensed>tfoot>tr>td {
	padding: 0 5px;
}

table col[class*="col-"] {
	position: static;
	float: none;
	display: table-column;
}

table td[class*="col-"],
table th[class*="col-"] {
	position: static;
	float: none;
	display: table-cell;
}

[class^='tbl-'] {
	margin: 1.5em auto;
	padding: 0;

	border-radius: 7px;
}

[class^='tbl-'] .row {
	padding: 8px;
	margin: 0;
}

[class^='tbl-'] h6 {
	white-space: nowrap;
	margin: 0 !important;
}

[class^='tbl-'] p {
	margin: 0 !important;
}

.tcaption {
	font-size: 1rem;
	text-align: center;
	margin: 12px auto 0;
	text-transform: uppercase;
}

.tcaption+[class^='tbl-'] {
	margin-top: 6px;
}

/* **************************************
	ALL TABLES (and some LISTS)
***************************************** */

.table-wrap {
	margin: 1em 0;
	padding: 0;
}

.table-wrap.xlg,
.textMatter div.xlg {
	margin-left: 1.2em;
	margin-right: 1.2em;
	width: calc(100% - 2.4em);
	padding: 0;
}

.table-wrap.lg,
.textMatter div.lg {
	margin-left: 10%;
	margin-right: 10%;
	width: 80%;
	padding: 0;
}

.table-wrap.md,
.textMatter div.md {
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	padding: 0;
}

.table-wrap.sm,
.textMatter div.sm {
	margin-left: 20%;
	margin-right: 20%;
	width: 60%;
}

.table-wrap.ssm,
.textMatter div.ssm {
	margin-left: 25%;
	margin-right: 25%;
	width: 50%;
}

.table-wrap.xsm,
.textMatter div.xsm {
	margin-left: 30%;
	margin-right: 30%;
	width: 40%;
}

.thlh1 th,
.tdlh1 td {
	line-height: 1;
}

.thlh2 th,
.tdlh2 td {
	line-height: inherit;
}

.textMatter .xlg>ul,
.textMatter .xlg>ol,
.textMatter .lg>ul,
.textMatter .lg>ol,
.textMatter .md>ul,
.textMatter .md>ol,
.textMatter .sm>ul,
.textMatter .sm>ol,
.textMatter .ssm>ul,
.textMatter .ssm>ol,
.textMatter .xsm>ul,
.textMatter .xsm>ol {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.textMatter .naked-list ul,
.textMatter .naked-list ol,
.textBox ul,
.textBox ol,
.ptxt ul,
.ptxt ol {
	border: none !important;
	background: none !important;
	box-shadow: none !important;
}

.step .boxed,
div[class^="content"] .txtbox:not(.intention) {
	margin: 1.5em 0.6em !important;
}

.boxed .txtbox p:not(:first-child) {
	margin-top: 0.65em;
}

div[class^='content'] .boxed .txtbox {
	margin: 0 !important;
	border: none !important;
	background: none !important;
	box-shadow: none !important;
}

.ptxt ul,
.ptxt ol {
	margin: 0 !important;
	padding-top: 0 !important;
}

.table-td-border table tbody td {
	border-top: none !important;
	border-left: none !important;
}

.table-td-border table tbody tr:last-child td {
	border-bottom: none !important;
}

.table-td-border table tbody td:last-child {
	border-right: none !important;
}

.table-left-col-bold table tbody td:first-child {
	font-weight: bold;
}

.table-thead-bold table thead th {
	font-weight: bold;
}

.table-cols-align-center table * {
	text-align: center;
}

.table-cols-align-right table * {
	text-align: right;
}

.table-cols-align-left table * {
	text-align: left;
}

.table-left-col-align-left table thead th:first-child,
.table-left-col-align-left table tbody td:first-child,
.table-right-col-align-left table thead th:last-child,
.table-right-col-align-left table tbody td:last-child {
	text-align: left;
}

.table-left-col-align-right table thead th:first-child,
.table-left-col-align-right table tbody td:first-child,
.table-right-col-align-right table thead th:last-child,
.table-right-col-align-right table tbody td:last-child {
	text-align: right;
}

/* ==========================================
============================================= */

#content {
	position: relative;
	z-index: 1;
}

.content-wrap {
	position: relative;
}

#content>.container {
	position: relative;
	min-height: 312px;
}

#content>p {
	line-height: 1.6;
}

.row {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	margin-top: calc(-1 * var(--bs-gutter-y));
	margin-right: calc(-0.5 * var(--bs-gutter-x));
	margin-left: calc(-0.5 * var(--bs-gutter-x));
}

.row>* {
	flex-shrink: 0;
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x) * 0.5);
	padding-left: calc(var(--bs-gutter-x) * 0.5);
	margin-top: var(--bs-gutter-y);
}

/* ==========================================
============================================= */

#page-title.full-slider>figure,
#page-title #slider-wrapper figure,
#page-title.slideshow #slider-wrapper figure,
#slider .swiper-slide-bg,
#clearviewBG div:last-child {
	filter: brightness(1);
}

#comments-container {
	display: none;
}

body.commented #comments-container {
	display: block;
}

#commentics {
	position: relative;
	inset: 0;
	opacity: 0;
	z-index: 1;
}

#content .content-wrap {
	padding-right: 10px;
	padding-left: 10px;
}

/* NOTE: portfolio pages — footer gap is on #content .content-wrap (--soi-content-footer-gap) */
body.all-padded:not(.side-nav) #content .content-wrap {
	padding-top: 60px;
}

body.all-padded:not(.side-nav) #comments-container .content-wrap {
	padding: 0;
}

/* NOTE: pages with side navigation */
body.all-padded.side-nav #content .content-wrap {
	padding-top: 40px;
}

body.clearview:not(.slides):not(.articles):not(.hatha) #content .content-wrap {
	padding-top: 180px;
}

/* NOTE: blog.html */
body.stretched:not(.slides) #comments-container .content-wrap {
	padding: 20px 10px 40px;
}

/* NOTE: slides.html*/
body.stretched.slides #content .content-wrap {
	padding-top: 0;
	padding-right: 0;
	padding-left: 0;
}

body.stretched.slides #content .content-wrap [class*='gutter-']>[class*='col-'] {
	margin-top: 0;
}

.section-top,
.section-bottom {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100px;
}

.section-top {
	top: 0;
	z-index: 0;
}

.section-bottom {
	bottom: 0;
	z-index: -1;
}

#page-title .section-top {
	height: 100%;
}

#page-title.slideshow+#content .content-wrap {
	padding-top: 60px;
}

#page-title.page-title-right+#content .section-top {
	display: none;
}

/* ----------------------------------------------------------------
	PAGE-TITLE
-----------------------------------------------------------------*/
#page-title {
	position: relative;
	border-bottom: none;
	font-size: 16px;
}

body:not(.clearview) #page-title:not(.parallaxed):not(.slideshow):not(.full-slider) {
	padding: 48px var(--bs-gutter-x, 1.2rem) 24px 0;
	height: auto;
}

body.clearview {
	overflow-x: clip;
	max-width: 100%;
}

html:has(body.clearview) {
	overflow-x: clip;
	max-width: 100%;
}

#lCol {
	margin-top: 0;
}

#lCol,
#rCol,
.postcontent {
	z-index: 1;
	padding-top: 0;
	margin-top: 0;
	position: relative;
}

#rCol .col-12,
#rCol h4 {
	max-width: 350px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

#rCol h4 {
	margin-bottom: 20px;
	padding: 0;
	line-height: 1;
}

#rCol.clips {
	max-width: 321px;
	margin: 0 auto;
	padding-bottom: 0;
}

#rCol .news-column {
	height: auto;
}

#rCol .news-column .scroll-container {
	min-height: 554px;
	max-height: 1600px;
}

/* all news columns (home, video clips, footer, articles)
NOTE: for clipDescription (videoclips.html) see yim-plyr.css */
.news-column .scroll-content {
	padding: 0 3px;
}

#rCol.articles {
	position: relative;
	margin-top: 0;
}

#rCol.articles .news-column {
	opacity: 0;
}

#rCol.none,
#newsBloc.none,
#lotusBloc.none {
	display: none;
}

body.lotus-menu-hidden ul.pages li.lotus,
body.lotus-menu-hidden li.menu-item.lotus {
	display: none !important;
}

.news-entry {
	position: relative;
	width: 100%;
	margin: 6px 0 4px auto;
	padding: 0 6px;
	text-align: right;
	text-transform: uppercase;
	font-size: 12px;
	border: none !important;
}

.news-entry * {
	white-space: nowrap;
	line-height: 1;
	padding: 2px 0 0 5px;
	border: none !important;
}

.news-entry a i {
	padding-right: 0;
	font-size: 16px;
}

.news-column .image,
#readModal .miscImg {
	vertical-align: top;
	float: left;
	margin: 0.25em 0.76em 0.05em 0;
	border-radius: var(--yim-br);
}

#newsColumn .tblsort.active .news-entry {
	display: none;
}

#newsColumn .image {
	float: right;
	width: 68px;
	height: 68px;
	margin: 0 0 3px 6px;
}

#footerNewsColumn .image {
	float: left;
	margin: 0 6px 2px 0;
	width: 60px;
	height: 72px;
}

#newsColumn .tblsort p {
	font-size: 0.85em;
}

#footerNewsColumn .tblsort p {
	font-size: 0.85em
}

.tblsort .rating,
.rating {
	position: relative;
	width: auto;
	height: auto;
	margin-top: 0;
	margin-bottom: 0.9em;
	margin-right: 0;
	text-transform: uppercase;

}

.tblsort .rating div,
.rating div {
	display: inline-block;
	vertical-align: middle;
}

.tblsort .rating div i .rating div i {
	font-size: larger;
	position: relative;
	padding: 0 1px;
}

.tblsort .rating div i.icon-star-empty,
.rating div i.icon-star-empty {
	opacity: 0.6;
}

.news-column {
	position: relative;
	width: 100%;
	clear: both;
	margin: auto;
}

#footNews {
	padding-bottom: 20px;
}

#footNews .news-column {
	height: 660px;
}

#footNews .scroll-wrap {
	padding-bottom: 4px;
}

.news-column .scroll-container {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 3px 0 3px 0;
	margin-bottom: 5px;
	overflow-y: scroll;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.tblsort p {
	margin: 0;
}

.news-column .tblsort .text-wrap {
	margin: 0;
	padding-top: 4px;
	border-radius: 0 0 5px 5px;
}

.news-column .tblsort p {
	text-align: justify;
	line-height: 1.4;
	padding: 0.12em 6px;
}

.news-column .news-date {

	position: absolute;
	right: 6px;
	bottom: 6px;
	font-size: 0.375em;
	line-height: 1;
	margin: 0;
}

.news-column .divider {
	line-height: 0.7em;
	margin: 5px 24%;
	width: 52%;
}

.news-column .divider i {
	top: -0.9px;
}

.tblsort:not(.active) .clip-overlay {
	cursor: pointer;
}

.tblsort p button {
	margin: 8px 0 0 6px;
}

.tblsort th {
	cursor: pointer;
	padding: 0;
}

.tblsort tbody tr {
	border-bottom: 1px solid;
}

.tblsort tbody td {
	padding-top: 8px;
	padding-bottom: 8px;
}

.tblsort th div {
	font-size: 0.9em;
	line-height: 100%;
	margin: auto;
	letter-spacing: 1px;
	font-weight: normal;
}

.tblsort th .rowsort {
	height: 100%;
	width: 100%;
	padding: 8px 6px;

	border-radius: var(--yim-br);
}

.tblsort .sortbtns {
	position: absolute;
	top: 2px;
	right: 0;
	margin: 8px 6px;
}

.tblsort th .rowsort .sortasc,
.tblsort th .rowsort .sortdesc {
	position: absolute;
	right: 0;
	top: 0;
	margin: auto;
	width: 92px;
	height: auto;
}

.tblsort th .rowsort .sortasc i,
.tblsort th .rowsort .sortdesc i {
	font-size: 20px;
	float: right;
	margin-top: -1px;
}

.tblsort th.headerSortDown .sortasc {
	display: block;
}

.tblsort th .sortdesc,
.tblsort th.headerSortDown .sortdesc {
	display: none;
}

.tblsort th.headerSortUp .sortasc {
	display: none;
}

.tblsort th.headerSortUp .sortdesc {
	display: block;
}

.tblsort th .rowcount {
	margin: auto;
	width: 100px;
	height: auto;
	text-align: center;
}

.news-column:not(.clips) .title-wrap {
	height: 56px;
}

.tblsort .miscTitle span {
	font-size: smaller;
}

.news-column .title-wrap .stitle {
	font-size: 12px;
	text-transform: lowercase;
	line-height: 1;
	text-shadow: none;
}

.tblsort .sortentry {
	display: none;
}

.sidebar {
	will-change: min-height;
}

/* NOTE: clear the space for pdfPrint button when no plyr is inserted */
#modalReadContent p:first-child {
	clear: both;
}

.table-display .row div[class^='col-'] ul,
.table-display .row div[class^='col-'] ol {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;

}

.table-display .row div[class^='col-'] ul {
	margin: 0.5em 0 0 1.1em !important;
}

.table-display .row div[class^='col-'] ol {
	margin: 0.5em 0 0 1.35em !important;
}

.table-display.indented-col .col-lg-8 p:not(:first-child) {
	text-indent: 1.1em;
}

.table-display .row {
	margin: 1.5em 0 1em 0;
}

h3.like-ch-heading+p,
.toggle-content p:not(.txtbox p):not([class^='col-'] p):first-child,
.accordion-content p:not(.txtbox p):not([class^='col-'] p):first-child,
.inserted-document .toggle p:not(.txtbox p):not([class^='col-'] p):first-child {
	margin-top: 1.2em;
}

.table-display aside p {
	text-align: left;
	font-size: 0.933333em;

	margin-top: 0.5em !important;
	margin-left: 1.5em !important;
	font-family: 'Proza Libre', sans-serif;
	font-weight: 400;
	text-transform: lowercase;
}

.table-display aside:last-child p {
	margin-bottom: 0 !important;
}

.table-display aside.notopmargin p,
.table-display .row ul.naked+aside:not(.inlist) p {
	margin-top: 0;
}

.table-display aside.inlist {
	margin: 0 0 0 1.3em;
}

.table-display .smaller {
	margin-top: 3px !important;
}

.table-display h4:not(.steptitle) {
	margin: 0 0 0.6em 0;
	padding: 0;
	font-family: 'Lora', sans-serif !important;
	font-weight: 300 !important;
	font-style: italic;
	text-align: center;
}

.table-display .row h4 {
	text-transform: lowercase;
	text-align: left;
}

.table-display .span p {
	text-align: right !important;
}

.table-display [class^='col-lg-8'],
.table-display [class^='col-lg-9'],
.table-display [class^='col-lg-3'].span,
.table-display [class^='col-lg-4'].span {
	border-radius: var(--yim-br);
}

.table-display [class^='col-lg-8'] h4,
.table-display [class^='col-lg-9'] h4 {
	margin: 0 !important;
}

.table-display [class^='col-lg-3'].span,
.table-display [class^='col-lg-4'].span {
	padding: 0 1em;
}

.table-display [class^='col-'] {
	padding: 0.5em 0.75em;
}

.table-display [class^='col-'] p:last-child {
	margin-bottom: 0.15em !important;
}

.table-display .row p {
	text-indent: 0;
}

.table-display .row ul+p {
	margin-top: 0.5em;
}

.table-display .row p,
.table-display .row ul li,
.table-display .row ol li {
	line-height: 1.36;
	margin-bottom: 0.5em;
}

.table-display .row ul:last-child li:last-child,
.table-display .row ol:last-child li:last-child {
	margin-bottom: 0;
}

.table-display .row ul,
.table-display .row ol {
	padding: 0 0 0.3em 1.25em;
	margin: 0;
	width: auto;
}

.table-display .row ul.naked:last-child,
.table-display .row ol.naked:last-child {
	padding-bottom: 0;
}

.table-display .row p+ul.naked {
	margin: 0.5em 0 0;
}

.table-display .row p+ol.naked {
	margin: 0.5em 0 0 1.2em;
}

.tblsort span i {
	line-height: 1em;
	vertical-align: -26%;
}

h1 {
	font-size: 36px;
	line-height: 1.3;
}

h2 {
	font-size: 32px;
	margin-top: 1.5em;
	margin-bottom: 0.5em;
	text-align: center;
	text-transform: uppercase;
}

h2.heading {
	text-align: left;
	font-size: 1.8rem;
}

.readmodal h2.title,
.readmodal #title.title {
	margin-top: 1em;
	clear: both;
}

.readmodal h2.title span,
.readmodal #title.title span {
	font-size: 60% !important;
}

h2.mtop,
#title.mtop {
	margin-top: 0;
}

.readmodal h3 {
	font-size: 24px;
}

.readmodal h4 {
	font-weight: normal;
	font-size: 20px;
}

/* NOTE: e.g. .title in pf.html */
:not(#sideLists):not(#instructions):not(.food-data) h3:not(.title):not(.heading):not(.popover-header):not(.highlight):not(.like-ch-heading):not(.linetop):not(.food-data h3) {
	text-align: left;
	margin: 1.2em auto;
}

:not(#sideLists):not(#instructions):not(.food-data) h3:not(.title):not(.heading):not(.popover-header):not(.highlight):not(.like-ch-heading):not(.linetop):first-child {
	margin: 0.75em 0 0 0;
}

h2+h3:not(.title):not(.heading):not(.popover-header):not(.highlight) {
	margin-top: 0;
}

h2+h3:not(.title):not(.heading):not(.popover-header):not(.highlight).linebottom {
	margin: 0 0 0.2em 0;
}

h3 {
	font-size: 24px;
	margin: 1.5em auto 0.5em;
}

h1+h3 {
	margin-top: 0 !important;
}

h3.linetop {
	margin: 2em 0 0.75em 0;
}

.toggle-header h3,
.accordion-header h3 {
	margin-bottom: 0;
}

h3.linetop+h4 {
	margin-top: 0;
}

h3:not(.highlight):not(.center):not(.linetop)+p:first-child,
h3:not(.highlight):not(.center):not(.linetop)+.nodrop>p:first-child,
h4:not(.highlight):not(.center):not(.miscTitle):not(#side-panel h4)+p,
h5:not(.question)+p {
	margin-top: 0.5em !important;
	text-indent: 0;
}

h4 {
	font-size: 1.5em;
	font-weight: 600;
	text-transform: none;
	text-align: left;
	padding-top: 15px;
}

#footer h4 {
	font-size: 20px;
	font-weight: 400;
	width: 100%;
	margin: 0 0 16px 0;
	padding: 4px;
	text-transform: uppercase;
	text-align: center;
}

body.clearview #footer h4 {
	border-radius: var(--yim-br);
}

h6+p:not(.statement):not(.quotation) {
	text-indent: 0;
	margin-top: 0.5em !important;
}

[class^='content'] h4.steptitle.ntm {
	margin-top: 1.8em;
	margin-bottom: 0.5em;
}

[class^='content'] h3+h4.steptitle,
[class^='content'] h4.stm,
[class='boxed'] h4.steptitle {
	margin-top: 0.25em;
}

h4.miscTitle {
	margin-top: 0;
	padding-top: 0;
}

h5 {
	font-size: 1.3rem;
	text-align: center;
	text-transform: uppercase;
	margin-top: 1.2em;
}

[id^='slide'] h5 {
	font-size: 2rem;
}

.modal.simple h5 {
	font-size: 1.2em;
}

.modal.simple h5+[class^='tbl-'] {
	margin-top: 1.3em;
}

h6 {
	font-weight: 400;
	font-size: 1.2em;
	text-align: left;
	text-transform: uppercase;
	margin: 15px 0 3px 0;
	-webkit-column-break-after: avoid;
}

.question,
.comment {
	letter-spacing: normal;
}

h5.comment {
	font-size: 1.2rem;
}

.steptitle {
	font-size: 132.8%;
	font-weight: 600;
	padding: 0;
	text-transform: uppercase;
}

.steptitle b,
h5 b {
	font-size: larger;
	font-weight: 400;
}

label,
.divlabel {
	display: inline-block;
	text-transform: none;
	letter-spacing: 1px;
	margin-bottom: 3px;
	cursor: default;
	white-space: nowrap;
}

label.label-muted {
	font-weight: 300;
}

/* **************************************
	FOOTNOTES (Will appear in PDF files)
***************************************** */

.text-has-footnotes {
	counter-reset: footnotes;
}

/* NOTE: traditional footnotes only appear in PDF files; on text-content pages abbr popovers are used instead  */
#pdfFootnotes {
	display: none;
	position: relative;
}

#pdfFootnotes::before {

	content: "";
	display: block;
	width: 50%;
	height: 1px;
	border-top: 1px solid var(--light-border);
	margin: 2em auto 1em 0;
}

#pdfFootnotes ol {
	margin: 0;
}

#pdfFootnotes li {
	font-size: 80% !important;
	line-height: 1.3;
	margin-bottom: 0.35em;
}

/**
 * Inline footnotes references
 * 1. Increment the counter at each new reference
 * 2. Reset link styles to make it appear like regular text
 */
[aria-describedby="fn-label"] {
	counter-increment: footnotes;
	text-decoration: none;
	cursor: default;
	outline: none;
}

/**
 * Actual numbered references
 * 1. Display the current state of the counter (e.g. [1]; NOTE: a 'hair space' (  / U + 200A) sits between the number and the brackets )
 * 2. Align text as superscript
 * 3. Make the number smaller (since it's superscript)
 * 4. Slightly offset the number from the text
 * 5. Reset link styles on the number to show it's usable
 */
[aria-describedby="fn-label"]::after {
	content: '[' counter(footnotes)']';
	vertical-align: 0.25em;
	font-size: 0.8em;
	letter-spacing: 0.09em;
	text-decoration: none;
	cursor: pointer;
}

[aria-label="back to fnref"] {
	font-size: 1.2em;
	vertical-align: -0.15em;
	line-height: 1;
	padding-left: 0.2em;
}

/* NOTE: used strictly to style footnotes in pdf documents */
.fn-pdf {
	display: none;
}

div.part,
#title.part {
	display: block;
	padding: 1em;
	border-radius: var(--yim-br);
}

div.part {
	margin: 2em auto 1.2em auto;
	max-width: 75%;
}

#title.part {
	margin: 0.3em auto;
}

div.part *,
#title.part {
	font-size: 2.0rem !important;
	text-align: center !important;

	text-indent: 0 !important;
	text-transform: uppercase;
	line-height: 1.3em;
	margin: 0;

}

div.part span {
	font-size: 80% !important;
}

.accordion div.part *,
.accordion #title.part {
	margin: 1em 0 0.2em 0;
}

h2 .subtitle,
h2+.subtitle {
	font-size: 0.55em;
	font-weight: 400;
	line-height: 1.2em;
	text-indent: 0 !important;
	text-transform: uppercase;
	margin-top: 1.2em;
}

h3 .subtitle,
h3+.subtitle {
	font-size: 0.7em;
	font-weight: 400;
	text-align: left !important;
	text-indent: 0 !important;
	text-transform: uppercase;
	margin: 0 0 0.2em 0;
}

h3+.subtitle {
	margin-top: -1.2em;
}

h3+.subtitle p {
	text-align: left;
	text-indent: 0;
	font-size: 100%;
}

h5 .subtitle,
h5+.subtitle {
	font-size: smaller;
	line-height: 1.4em;
}

h2 div {
	line-height: 1.3em;
	text-transform: uppercase;
}

h3.linetop .subtitle {
	margin-left: 1.3em;
	margin-bottom: 1em;
}

#cover {
	display: none;
}

/* NOTE: these are for dialogues, interviews mostly in anthology */
person,
question,
answer {
	font-weight: 600;
	font-family: 'Open Sans', sans-serif;
}

question+em {
	font-weight: 500;
	font-size: 106%;
	line-height: 1.4;
}

.modalcontent p:not(:first-of-type):not(.tleft):not(.tright):not(.noindent):not(.qsource) {
	text-align: justify !important;
	text-indent: 1.2em;
}

body:not(.device-xs):not(.device-sm) .modal.modal-vcenter {
	text-align: center;
	padding: 0 !important;
}

body:not(.device-xs):not(.device-sm) .modal.modal-vcenter::before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -4px;
}

body:not(.device-xs):not(.device-sm) .modal.modal-vcenter .modal-dialog {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}

body:not(.device-xs):not(.device-sm) .modal.simple .modalcontent>.scroll-wrap {
	position: relative;
	left: 0;
	top: 0;
	height: 236px;
	width: auto;
	overflow-y: auto;
}

body:not(.device-xs):not(.device-sm) .modal.simple .modalcontent .scroll-container {
	position: relative;
	margin-bottom: 6px;
	/* NOTE: experimental: to make it appear there is no right padding*/
	width: 100%;
	height: 100%;
}

.modal.simple .modal-footer {
	padding: 10px;
}

.modal.simple .modalclose.bottom,
.modal.image .modalclose.bottom {
	display: none;
}

.modal.simple .divider {
	margin: 16px auto 0;
}

.modal.simple .modalcontent .scroll-container p {
	font-size: 1.05em !important;
	/* NOTE: padding to leave room for the overlayScrollbar */
	padding: 0 10px 0 0;
}

.modal.simple .modalcontent .scroll-container p:first-child {
	margin-top: 0;
}

/* ------------------------------------------------------
	Awesome Fonts as Pseudo-element
--------------------------------------------------------- */

.finaldotnext>p::after,
.textMatter ul:not(.smlmenu) li:not(.push).altli::before,
.textMatter ul:not(.smlmenu) li.altli.push::before,
.textMatter .instructions-note::before,
.textMatter ul:not(.smlmenu) li.altli.altern::before,
.ptxt ul li::before,
.watch-modal::before,
.video-show-clipXX::before,
.show-modal::before,
.answer p::before,
.table-display aside p:first-child::before {
	font-family: 'Font Awesome 6 Pro';
	font-weight: 900;
	/* Required for solid icons */
	display: inline-block;
	/* Recommended for proper rendering */
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
}

.question p::before {
	font-family: 'Font Awesome 6 Brands';
	content: '\f2c4';
	display: inline-block;
	/* Recommended for proper rendering */
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	position: absolute;
	left: -4.25%;
	font-size: 120%;
	top: -2px;
}

.question-iow:not(.leave-p1-alone) p::before,
.question-iow ul li::before,
p.iow::before,
ul.iow li::before {
	font-family: 'Font Awesome 6 Brands';
	content: '\f2c4';
	display: inline-block;
	/* Recommended for proper rendering */
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-size: 86%;
	font-weight: bold;
	height: 1em;
	width: 0;
	padding-right: 1.2em;
	margin-left: -1.2em;
	vertical-align: -1px;
}

.finaldotnext>p::after {
	content: '\f0c8';
	font-size: 70%;
	vertical-align: -0.5px;
	text-indent: 0;
	padding-left: 0.5em;
	color: currentColor;
}

.textMatter ul:not(.smlmenu) li:not(.push).altli::before {
	font-size: 1.25em;
	line-height: 0;
	margin: 0 0.325em 0 0;
	vertical-align: -0.15em;
}

.textMatter ul:not(.smlmenu) li.altli::before,
.textMatter .instructions-note::before {
	content: '\f0a4';
	display: inline-block;
	font-size: 1.1em;
	line-height: 1;
	margin: 0 0.325em 0 0;
	padding: 0;
	vertical-align: -0.1em;
}

.textMatter ul:not(.smlmenu) li.altli.altern::before {
	content: '\f14d';
	display: inline-block;
	font-size: 1.25em;
	line-height: 0;
	margin: 0 0.325em 0 0;
	padding: 0;
	vertical-align: -0.3em;

}

.question-iow.leave-p1-alone p:first-of-type::after {
	border-bottom: none;
}

.svg-icon {
	width: 1em;
	height: 1em;
	fill: currentColor;
	display: inline-block;
	vertical-align: -0.125em;
	/* Matches Bootstrap's alignment */
}

.svg-icon.svg-icon-md {
	width: 1.5em;
	height: 1.5em;
}

.svg-icon.svg-icon-lg {
	width: 2em;
	height: 2em;
}

.svg-icon.icon-leafs {
	color: forestgreen;
	filter: drop-shadow(1px 1px 1px rgb(0 0 0 / 30%));
}

.dark .svg-icon.icon-leafs {
	filter: drop-shadow(1px 1px 1px rgb(0 0 0 / 50%));
}

.answer p::before,
.table-display aside p:first-child::before {
	position: absolute;
	left: -4.25%;
	content: '\f064';
	font-size: 100%;
	transform: rotateX(180deg);
}

.table-display aside p:first-child::before {
	left: 0;
	top: -1px;
	font-style: normal !important;
}

/* ------------------------------------------------------
	PRINT-PDF
--------------------------------------------------------- */

.printpdf {
	width: auto;
	min-width: 100px;
	height: 38px;
	float: right;
	margin-right: 0;
}

.modal .printpdf {
	/* NOTE: leaves space for potential close modal button */
	margin-left: 8px;
}

.printpdf:not(.bottom) {
	margin-bottom: 32px;
}

/* NOTE: specifically for in-quest process pages */
.printpdf[class*="content"]:not(.bottom) {
	margin-bottom: 72px;
}

.printpdf+.divider {
	margin-top: 90px;
}

.modalcontent .printpdf:not(.bottom) {
	margin: 20px 0 12px auto;
	float: none;
	text-align: right;
}

#lCol .printpdf.bottom {
	bottom: 24px;
	right: 0;
	position: relative;
	margin-right: 0;
}

/* ------------------------------------------------------
	Divider
--------------------------------------------------------- */

.divider {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	overflow: hidden;
	margin: 1em auto;
	width: 100%;
	clear: both;
}

.divider.divider-end {
	margin: 3em auto;
}

.indented-col .divider-sm {
	margin: 42px auto 30px;
}

.divider img.leafs {
	width: 6%;
	height: auto;
}

.divider::after,
.divider::before {
	content: '';
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
	height: 1px;
	background-color: #EEE;
}

.divider::before {
	display: none;
	margin-right: 0.5rem;
}

.divider::after {
	margin-left: 0.5rem;
}

.divider.divider-center::before {
	display: block;
}

.divider.divider-margin-sm {
	margin: 0 auto;
}

.divider.divider-sm {
	width: 55%;
}

.divider.divider-md {
	width: 75%;
}

#clipDesctription .divider {
	width: 100%;
	margin-right: 3px;
}

/* --------------------------------------------------------------- */

.sidenav {
	width: 100%;
	margin: 0;
	background: transparent;
	list-style-type: none !important;
	font-weight: 400;

	border-radius: var(--yim-br);
}

#sidenavScroller {
	position: relative;
	width: 100%;
	height: 40px;
	margin: 0 auto;

	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;

	border-top: none !important;
	border-left: none !important;
	border-right: none !important;

	border-bottom-width: 3px !important;

	-webkit-border-bottom-right-radius: 6px;
	-webkit-border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
}

#sidenavScroller div:not(.inview):not(.total) {
	position: absolute;
	height: auto;
	width: 34px;
	padding: 0;
	margin: 2px auto 0;
	text-align: center;
}

#sidenavScroller .scrollUp {
	left: 0;
	top: 6px;
	display: none;
	z-index: 1;
}

#sidenavScroller .scrollDn {
	right: 0;
	z-index: 1;
}

#sidenavScroller i {
	font-size: 26px;
	line-height: 1;
}

#sidenavScroller .hoverable:hover i {
	transform: scale(1.5);
}

#sidenavScroller #topicCount {
	position: relative;
	font-size: 14px;
	width: auto;
	height: 100%;
	margin: auto;

	display: flex;
	justify-content: space-between;
	align-items: center;

	border-radius: var(--yim-br);
}

#sidenavScroller.searching #topicCount {
	display: block;
	padding-top: 7px;
}

#sidenavScroller .inview,
#sidenavScroller .total {
	white-space: nowrap;
}

#sidenavScroller .inview {
	text-align: right;
	padding-right: 8px;
}

#sidenavScroller .total {
	text-align: left;
	padding-left: 7px;
}

#sidenavScroller .btnshowall {
	display: none;
	height: auto;
	font-size: 0.9em;
	white-space: nowrap;
	right: -22%;
	margin-top: 0;
}

.sidenav li {
	position: relative;
	display: block;
	margin: 0 !important;
	font-size: 16px;
	line-height: 16px;
	height: 50px;
	padding: 10px 6px;

}

.sidenav li:not([id$='0']),
.sidenav>li a {
	cursor: pointer;
	border-radius: var(--yim-br);

}

.sidenav li.ui-tabs-active,
.sidenav li.ui-tabs-active a {
	cursor: default;
}

.sidenav>li:first-child,
.sidenav>li:first-child a {

	border-radius: var(--yim-br);
}

.sidenav>li:last-child,
.sidenav>li:last-child a {
	border-radius: var(--yim-br);
}

.sidenav>li:last-child {
	border-bottom-width: 2px;
}

.sidenav li[id$='0'],
.sidenav li.sn-heading {
	position: relative;
	display: block;
	font-size: 16px;
	text-align: center;
	line-height: 17px;
	padding: 8px 0;
	cursor: default;
	border: none;
	border-radius: 0;
}

.sidenav li[id$='0'] span,
.sidenav li.sn-heading span {
	font-size: 14px;
}

.sidenav.items3 li,
.sidenav.twolines li {
	line-height: 1.165;
	font-size: 18px;
	height: 84.5px !important;
	padding: 23px 10px 0;
}

.sidenav.items4 li {
	line-height: 1;
	font-size: 16px;
	height: 74.5px !important;
	padding: 20px 10px 0;
}

.sidenav li span {
	font-size: 11px;
}

body.slides .sidenav:not(.practice) li span {
	font-size: 13px;
}

.sidenav li i {
	position: absolute;
	width: 14px;
	height: 14px;
	top: 50%;
	left: auto;
	right: 12px;
	margin-top: -7px;
	margin-right: -2px;
	opacity: 0;
	font-size: 12px !important;
}

.sidenav li:hover i {
	opacity: .7;
	right: 4px;
}

.sidenav .ui-tabs-active i,
.sidenav .ui-tabs-active li:hover i {
	opacity: 1;
	right: 4px;
}

.sidenav img {
	display: inline;
	margin-right: 4px;
	border-radius: var(--yim-br5);
}

/* ======================================================
	SIDE NAVIGATION WEDNESDAY, JUNE 17, 2026 AT 21:16:00
========================================================= */

/* 🚀 THE STRUCURAL TRACK FIX:
   Forces the row container to keep the sidebar column stretched to
   the exact same height as your long text content column. */
#content .container .row {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}

/* 🚀 THE COLLAPSE PREVENTION FIX:
   Guarantees your content area can never flatten to 0px while AJAX is thinking */
#content .content-wrap {
	min-height: 100vh;
	padding-bottom: var(--soi-content-footer-gap);
}

#sidebarWrapper {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 100vh;
	left: 0;
	top: 0;
	margin: 0;
	padding: 0;

	/* 🛑 LOWER BOUNDARY CONTROL:
	   Increase this pixel value to force the menu to stop HIGHER up
	   and stay further away from your footer layout. */
	padding-bottom: 40px;
}

.sidebar-sticky-panel {
	position: relative;
	top: auto;
	width: auto;
}

@media (min-width: 992px) {
	.sidebar-sticky-panel {
		position: -webkit-sticky;
		position: sticky;

		/* 🚀 DYNAMIC CSS ONLY CENTERING:
		   Uses the --panel-height variable (defaulting to 264px).
		   Dividing by 2 perfectly replaces our manual math! */
		top: calc(50vh - (var(--panel-height, 264px) / 2));

		width: 100%;
		display: block;

		/* 🏎️ THE JITTER FIX (HARDWARE ACCELERATION): */
		will-change: transform, top;
	}
}

.sidebar-sticky-panel.is-tall-menu {
	--panel-height: 420px;
	/* Swap 420px with the actual height of this specific tall menu */
}

.sidebar-sticky-panel.is-extra-tall-menu {
	--panel-height: 550px;
	/* Swap 550px with the actual height of this extra tall menu */
}

/* --------------------------------------------------------------
	Search Box
--------------------------------------------------------------  */

.searchbox {
	width: 100%;
	margin: 0;
	padding: 4px;
	font-size: 15px;

	border-radius: var(--yim-br-bottom);
}

.searchbox[data-title]::before {
	width: 303px !important;
}

.cancelsearch {
	position: absolute;
	top: 3px;
	right: 0;
	width: 28px;
	height: 28px;
	font-size: 18px;
	text-align: center;
	cursor: pointer;
	z-index: 1;
	display: none;
}

.no-result-found {
	display: none;
}

.sub-menu-container {
	border-radius: 3% 3% var(--yim-br-bottom) var(--yim-br-bottom);
	width: 200px !important;
	margin: 15px 0 0 0;
	list-style: none;
}

.sub-menu-container .menu-item:last-child,
.sub-menu-container .menu-item:last-child>a {
	border-radius: var(--yim-br5-bottom);
}

.menu-item .sub-menu-trigger {
	display: block;
	position: absolute;
	cursor: pointer;
	outline: none;
	border: none;
	background: none;
	padding: 0;
	top: 9px;
	right: 0;
	width: 32px;
	height: 32px;
	font-size: 12px;
	line-height: 32px;
	text-align: center;
	transition: transform .3s ease;
}

/* ********************************** */

/* ************************************* */

.ytlink {
	padding-bottom: 2px;
	padding-right: 3px;
	white-space: nowrap;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	/* NOTE: height double the content line-height */
	height: 28.8px;
	margin-top: 14.4px;
	margin-bottom: 20px;
	font-weight: normal;
	border: none !important;
	cursor: pointer;

}

.ytlink i {
	font-size: 24px;
	margin: 0;
	padding-right: 5px;
	opacity: 0.85;
	border: none;
}

.ytlink span {
	vertical-align: 5px;
}

.portfolio-item .scroll-content .ytlink>*,
.media-pl .desc .ytlink>* {
	line-height: 1.5;
	white-space: nowrap;
	display: flex;
	justify-content: center;
	align-items: center;
}

.ytlink:hover i {
	opacity: 1;
	color: var(--color-yt-red-hov) !important;
}

.ytlink i::before {
	background: -webkit-radial-gradient(center, ellipse cover, white 0%, white 40%, transparent 40%, transparent 100%);
	background: radial-gradient(ellipse at center, white 0%, white 40%, transparent 40%, transparent 100%);
	background-size: 24px 24px;
	background-repeat: no-repeat;
	background-position-y: center;
}

/* ----------------------------------------------------------------
	Side Panel
-----------------------------------------------------------------*/

#side-panel {
	position: fixed;
	font-size: 16px;
	top: 0;
	right: -320px;
	z-index: 1302;
	width: 320px;
	height: 100%;
	overflow: hidden;
	backface-visibility: hidden;

}

body.side-panel-left #side-panel {
	left: -320px;
	right: auto;
}

#side-panel .side-panel-wrap {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	padding: 50px 30px 80px 30px;
	/* NOTE: next required for Firefox */
	scrollbar-width: none;
}

body.device-touch #side-panel .side-panel-wrap {
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}

#side-panel .widget {
	margin-top: 20px;
	padding-top: 20px;
}

#side-panel .widget:first-child {
	border-top: none;
	margin: 0;
}

body.side-panel-open #side-panel {
	left: 0;
}

body.side-panel-left.side-panel-open #side-panel {
	right: auto;
}

/* ----------------------------------------------------------------
	Admin panel — layout only (colours/typography: light.css / dark.css)
-----------------------------------------------------------------*/

#admin-panel {
	position: fixed;
	top: 0;
	right: -400px;
	z-index: 1303;
	width: 400px;
	max-width: 100%;
	height: 100%;
	overflow: hidden;
	backface-visibility: hidden;
	transition: right .35s ease;
}

body.admin-panel-open #admin-panel {
	right: 0;
}

#admin-panel .admin-panel-wrap {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 48px 16px 24px;
	overflow-y: auto;
}

#admin-panel .admin-panel-close,
#btnCloseAdminPanel.admin-panel-close {
	position: absolute;
	left: 10px;
	right: auto;
	top: 10px;
	z-index: 2;
}

#admin-panel .admin-features-grid.row,
#readModal.admin-features .admin-features-grid.row {
	margin: 6px 0 12px 0;
}

#admin-panel .admin-features-grid.row .admin-feature-col.col-md-6:first-child,
#readModal.admin-features .admin-features-grid.row .admin-feature-col.col-md-6:first-child {
	padding-left: 0 !important;
	margin-top: 0 !important;
}

#admin-panel .admin-features-grid.row .admin-feature-col.col-md-6:last-child,
#readModal.admin-features .admin-features-grid.row .admin-feature-col.col-md-6:last-child {
	padding-right: 0 !important;
	margin-top: 0 !important;
}

#admin-panel .admin-feature-table,
#readModal.admin-features .admin-feature-table {
	margin-top: 16px;
}

#admin-panel .admin-row-tablehead,
#admin-panel .admin-row,
#readModal.admin-features .admin-row-tablehead,
#readModal.admin-features .admin-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 72px 72px;
	gap: 8px 10px;
	align-items: center;
}

#admin-panel .admin-row-tablehead,
#readModal.admin-features .admin-row-tablehead {
	margin-bottom: 6px;
	padding-bottom: 6px;
}

#admin-panel .admin-label,
#readModal.admin-features .admin-label {
	display: block;
	line-height: 1.35;
	padding-right: 4px;
}

#admin-panel .admin-lvl-1 .admin-label,
#readModal.admin-features .admin-lvl-1 .admin-label {
	padding-left: 16px;
}

#admin-panel .admin-lvl-2 .admin-label,
#readModal.admin-features .admin-lvl-2 .admin-label {
	padding-left: 32px;
}

#admin-panel .admin-row-news .admin-label,
#readModal.admin-features .admin-row-news .admin-label {
	padding-left: 16px;
}

#admin-panel .admin-lvl-2.admin-row-news .admin-label,
#readModal.admin-features .admin-lvl-2.admin-row-news .admin-label {
	padding-left: 32px;
}

#admin-panel .admin-col-toggle,
#readModal.admin-features .admin-col-toggle {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

#admin-panel .admin-actions,
#readModal.admin-features .admin-actions {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 18px;
}

#admin-panel .admin-button,
#readModal.admin-features .admin-button {
	width: 100%;
}

#admin-panel .admin-save-status,
#readModal.admin-features .admin-save-status {
	margin: 0;
}

#admin-panel .yim-switch.admin-switch,
#readModal.admin-features .yim-switch.admin-switch {
	width: 44px;
	height: 26px;
}

#admin-panel .yim-switch.admin-switch .switch-slider::before,
#readModal.admin-features .yim-switch.admin-switch .switch-slider::before {
	height: 22px;
	width: 22px;
	left: 1px;
	bottom: 1px;
}

#admin-panel .yim-switch.admin-switch input:checked+.switch-slider::before,
#readModal.admin-features .yim-switch.admin-switch input:checked+.switch-slider::before {
	-webkit-transform: translateX(18px);
	-ms-transform: translateX(18px);
	transform: translateX(18px);
}

#admin-panel .yim-switch.admin-switch .switch-slider.round,
#readModal.admin-features .yim-switch.admin-switch .switch-slider.round {
	border-radius: 26px;
}

#admin-panel .yim-switch.admin-switch .switch-slider.round::before,
#readModal.admin-features .yim-switch.admin-switch .switch-slider.round::before {
	border-radius: 50%;
}

#rightSideLinks {
	position: fixed;
	top: 15vh;
	right: 0;
	z-index: 1200;
	list-style: none;
	margin: 0;
	padding: 0;
	z-index: 1301;
}

#rightSideLinks li {
	margin: 0;
	padding: 5px 2px 5px 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border-radius: 9px 0 0 9px;
	border-right: none;
}

#rightSideLinks li:hover {
	opacity: 1;
}

body.admin-panel-open .body-overlay {
	opacity: 1;
	z-index: 1300;
	pointer-events: auto;
}

#side-panel .divider {
	margin: 12px 0;
}

#side-panel h4 {
	margin: 0;
	padding: 0;
	font-size: 18px;
	font-weight: 400;
	text-transform: uppercase;
}

#side-panel .fillit {
	font-size: 14px;
}

.flex-horiz-space-between {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}

#side-panel .switch-container {
	margin: 16px 0;
}

#side-panel .switch-container .lbl-desc div,
#side-panel .switch-container .lbl-tt div {
	display: none;
}

.yim-switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

.yim-switch .fillit {
	position: relative;
	display: inline-block;
	padding: 5px 0 0;
	line-height: 1.3;
	text-align: center;
	border-radius: 6px;
	font-weight: bold;
	min-width: 36px;
}

.yim-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.switch-slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.switch-slider::before {
	position: absolute;
	content: "";
	height: 27px;
	width: 27px;
	left: 3px;
	bottom: 2px;
}

.yim-switch input:checked+.switch-slider::before {
	-webkit-transform: translateX(25px);
	-ms-transform: translateX(25px);
	transform: translateX(26px);
}

.switch-slider.round {
	border-radius: 34px;
}

.switch-slider.round::before {
	border-radius: 50%;
}

input:disabled+.switch-slider {
	background-color: #ccc;
	cursor: not-allowed;
	opacity: 0.35;
}

input:disabled+.switch-slider:before {
	background-color: #999;
}

#leftSideLinks {
	position: fixed;
	top: 15vh;
	left: -60px;
	width: 53px;
	height: auto;
	margin: 0;
	/* NOTE: one more than plyrmodal; above side-panel overlay (1299) */
	z-index: 1301;
}

#leftSideLinks li {
	font-size: 18px;
	margin: 0 0 6px;
	width: 43px;
	height: 36px;
	cursor: pointer;

	display: flex;
	justify-content: center;
	align-items: center;
	padding-left: 8px;

	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;

}

#leftSideLinks a {
	width: 100%;
	height: 100%;
	margin-left: 10px;
}

#leftSideLinks #tSidePanel {
	padding-bottom: 0px;
	padding-left: 9px;
}

#leftSideLinks #tShareEmail>a {
	margin-left: 8px;
	padding-top: 5px;
}

#leftSideLinks #tShareFacebook>a {
	padding-top: 4px;
}

#leftSideLinks #tShareTwitter {
	padding-left: 9px;
}

#leftSideLinks #tMakePDF>a {
	margin-left: 8px;
	padding-top: 3px;
}

/* for pages where the choice is given to view/print slides only, text only or slides and text
   this (for the time being) includes in-quest.html, integral.html and kosmic-play.html only */
body.slides:not(.in-modal) #leftSideLinks #tMakePDF {
	/* NOTE: position relative needed to hide and show it in slides pages (e.g., integral.html) */
	position: relative;
	left: -35px;
}

body.slides:not(.in-modal) #leftSideLinks #tMakePDF.shown {
	left: 0;
}

body:not(.device-touch) #leftSideLinks li:hover {
	margin-left: 8px;
}

#side-panel-trigger-close a {
	display: none;
}

#btnClosePanel {
	position: absolute;
	right: 10px;
	top: 10px;
	z-index: 1;
	cursor: pointer;
}

.body-overlay {
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: -1;
	pointer-events: none;
	backface-visibility: hidden;
	-webkit-transition: opacity var(--soi-side-panel-duration) var(--soi-side-panel-easing);
	-o-transition: opacity var(--soi-side-panel-duration) var(--soi-side-panel-easing);
	transition: opacity var(--soi-side-panel-duration) var(--soi-side-panel-easing);
}

body.side-panel-open .body-overlay,
body.mobile-menu-open .body-overlay {
	opacity: 1;
	/* NOTE: one more than plyrmodal */
	z-index: 1299;
	pointer-events: auto;
}

body.mobile-menu-open {
	overflow: hidden;
}

html:has(body.mobile-menu-open) {
	overflow: hidden;
}

body.side-panel-open:not(.device-xs):not(.device-sm):not(.device-md) .body-overlay:hover,
body.mobile-menu-open:not(.device-xs):not(.device-sm):not(.device-md) .body-overlay:hover,
body.modal-open:not(.device-xs):not(.device-sm):not(.device-md) {
	cursor: url('../images/yim/icons/close-light-sml.png') 15 15, default;
}

/* ----------------------------------------------------------------
	22. NAVIGATION TREE
----------------------------------------------------------------- */

.nav-tree {
	position: relative;
}

.nav-tree ul {
	margin: 0;
	width: 100%;
	list-style: none;
	font-size: 16px;
}

.nav-tree ul ul {
	margin-left: 10px;
	width: calc(100% - 10px);
	display: none;
}

.nav-tree li {
	position: relative;
	margin: 8px 0;
}

.nav-tree ul li.sub-menu ul li {
	font-size: 14px;
}

.nav-tree li.current>ul {
	display: block;
}

.nav-tree li.sub-menu>a {
	padding-left: 8px;
	border-bottom: 1px solid;

	-webkit-border-top-left-radius: 12px;
	-webkit-border-top-right-radius: 12px;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
}

.nav-tree li a {
	display: inline-block;
	padding: 8px 5px 8px 8px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	width: 100%;
	margin-left: 0;
}

.nav-tree li:not(.sub-menu) a {
	padding: 0 5px 0 8px;
}

.nav-tree ul li i:first-child {
	position: relative;
	font-size: 16px;
	width: 24px;
}

.nav-tree li i:nth-child(2) {
	position: absolute;
	right: 0;
	margin-right: 8px;
	font-size: 13px;
	line-height: 2;
}

.nav-tree ul li i.fa-text-file {
	padding-left: 0.25em;
}

.clearview #footer .navtree,
.clearview #footStyles,
.clearview #geoLocation,
.clearview #footerlogo,
.clearview #footerNewsContainer,
.clearview #footer .searchbox {
	background: rgba(0, 0, 0, 0.35) !important;
	border: 1px solid var(--dark-border) !important;
	box-shadow: none !important;
}

.clearview #footer .tblsort,
.clearview #footer .tblsort .text-wrap {
	background: transparent !important;
}

.clearview #footer .divider::before,
.clearview #footer .divider::after {
	background: none !important;
	border: 0.5px solid var(--dark-border) !important;
}

/* Mobile menu — modal shell: fixed viewport layer, always flex-centred (never toggled on close). */
#mobileMenuContainer {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: safe center;
	overflow-x: hidden;
	overflow-y: auto;
	z-index: -1;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	transition:
		opacity var(--soi-side-panel-duration) var(--soi-side-panel-easing),
		visibility 0s linear var(--soi-side-panel-duration),
		z-index 0s linear var(--soi-side-panel-duration);
}

body.mobile-menu-open #mobileMenuContainer {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	z-index: 1300;
	transition:
		opacity var(--soi-side-panel-duration) var(--soi-side-panel-easing),
		visibility 0s,
		z-index 0s;
}

#mobileMenuWrap {
	position: relative;
	width: 100%;
	max-width: var(--soi-overlay-max-width);
	height: auto;
	margin: 0;
	padding: max(24px, env(safe-area-inset-top, 0px)) var(--soi-overlay-edge-inset) max(12px, env(safe-area-inset-bottom, 0px));
	z-index: 1;
	flex: 0 0 auto;
	box-sizing: border-box;
	pointer-events: none;
}

body.mobile-menu-open #mobileMenuWrap {
	pointer-events: auto;
}

/* Panel fade — same contract as Bootstrap .modal.fade .modal-dialog */
#mobileMenu {
	max-width: var(--soi-overlay-max-width);
	width: 100%;
	position: relative;
	margin: 0 auto;
	opacity: 0;
	transform: translate(0, -50px);
	transition: opacity 0.3s ease-out, transform 0.3s ease-out;
	border-radius: var(--yim-br12);
	box-sizing: border-box;
	pointer-events: auto;
}

body.mobile-menu-open #mobileMenu {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	#mobileMenu {
		transition: none;
	}
}

#mobileMenu .nav-tree {
	padding: 12px 20px;
}

/* Small viewports — all modals share mobile-menu edge inset + max-width (variables.css --soi-overlay-*) */
@media (max-width: 991.98px) {
	.modal.fade .modal-dialog,
	.modal.fade .modal-dialog.maxwidth,
	.readmodal.modal.fullwidth .modal-dialog {
		width: calc(100vw - (2 * var(--soi-overlay-edge-inset))) !important;
		max-width: calc(var(--soi-overlay-max-width) - (2 * var(--soi-overlay-edge-inset))) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		left: auto;
	}
}

.rotated-X {
	display: inline-block;
	transform: scaleX(-1);
}

.rotated-Y {
	display: inline-block;
	transform: scaleY(-1);
}

/* ----------------------------------------------------------------
	Preloaders
-----------------------------------------------------------------*/

.preloader,
.preloader2,
.form-process {
	display: block;
	width: 100%;
	height: 100%;
}

.form-process {
	display: none;
	position: absolute;
	z-index: 3;
}

/* loader-ellips: USED FOR PORTOFOLIO INFINITE-SCROLL
=================================================== */
.loader-ellips {
	font-size: 12px;
	position: relative;
	width: 4em;
	height: 1em;
	margin: 3px auto 6px;
}

/* dynLOADER: CUBES FALLING (Name: "More Loading")
==================================== */
#commentsLoader.dynloader {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 9;
}

#commentsLoaderText {
	position: absolute;
	margin-top: 30px;
	left: 5px;
}

#commentsLoader,
#commentsLoaderText {
	display: none;
}

.loader-ellips__dot {
	display: block;
	width: 1em;
	height: 1em;
	border-radius: 0.5em;
	position: absolute;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}

.loader-ellips__dot:nth-child(1),
.loader-ellips__dot:nth-child(2) {
	left: 0;
}

.loader-ellips__dot:nth-child(3) {
	left: 1.5em;
}

.loader-ellips__dot:nth-child(4) {
	left: 3em;
	animation-name: reveal;
	animation-direction: reverse;
}

@keyframes reveal {
	from {
		transform: scale(0.001);
	}

	to {
		transform: scale(1);
	}
}

@keyframes slide {
	to {
		transform: translateX(1.5em)
	}
}

.loader-ellips__dot:nth-child(1) {
	animation-name: reveal;
}

.loader-ellips__dot:nth-child(2),
.loader-ellips__dot:nth-child(3) {
	animation-name: slide;
}

.page-status-container {
	position: relative;
	margin-top: 18px;
	height: auto;
}

.page-status-no-more {
	text-align: center;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 0.8em;
	line-height: 2;
	margin-left: -15px;
	display: none;
}

.load-next-items {
	max-height: none;
	margin-top: 12px;
	padding: 8px 12px 3px;
}

.dynloader:not(.inmodal) {
	position: fixed;
	left: 50%;
	top: 50%;
	height: 60px;
	width: 60px;
	transform: translate(-50%, -50%);
	opacity: 0;
	z-index: 1;
}

#changeSlidesDynloader {
	transform: none;
	left: 50%;
	top: 30%;
	margin-left: -30px;
}

#modalMediaContent {
	position: relative;
}

/* In-modal loader: centered on the slider shell inside #sContainer */
#sContainer>.dynloader.inmodal {
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	width: 60px;
	height: 60px;
	transform: translate(-50%, -50%) !important;
	z-index: 1201;
	margin: 0 !important;
	opacity: 1;
	pointer-events: none;
}

#newsContainer .dynloader {
	position: absolute;
	width: 40px;
	height: 40px;
	left: 50%;
	margin-top: 160px;
	opacity: 1;
	z-index: 1;
}

#page-title .dynloader,
.plyr--html5 .dynloader {
	position: absolute;
	left: 50%;
	top: 40%;
}

.dynloader span {
	display: block;
	position: absolute;
	width: 12px;
	height: 12px;
	opacity: 0;
	border-radius: 3px;
	animation: load 3.5s ease-in-out infinite;
}

.dynloader span.block-1 {
	animation-delay: 0.92s;
	left: 0px;
	top: 0px;
}

.dynloader span.block-2 {
	animation-delay: 0.84s;
	left: 16px;
	top: 0px;
}

.dynloader span.block-3 {
	animation-delay: 0.76s;
	left: 32px;
	top: 0px;
}

.dynloader span.block-4 {
	animation-delay: 0.68s;
	left: 48px;
	top: 0px;
}

.dynloader span.block-5 {
	animation-delay: 0.6s;
	left: 0px;
	top: 16px;
}

.dynloader span.block-6 {
	animation-delay: 0.52s;
	left: 16px;
	top: 16px;
}

.dynloader span.block-7 {
	animation-delay: 0.44s;
	left: 32px;
	top: 16px;
}

.dynloader span.block-8 {
	animation-delay: 0.36s;
	left: 48px;
	top: 16px;
}

.dynloader span.block-9 {
	animation-delay: 0.28s;
	left: 0px;
	top: 32px;
}

.dynloader span.block-10 {
	animation-delay: 0.2s;
	left: 16px;
	top: 32px;
}

.dynloader span.block-11 {
	animation-delay: 0.12s;
	left: 32px;
	top: 32px;
}

.dynloader span.block-12 {
	animation-delay: 0.04s;
	left: 48px;
	top: 32px;
}

.dynloader span.block-13 {
	animation-delay: -0.04s;
	left: 0px;
	top: 48px;
}

.dynloader span.block-14 {
	animation-delay: -0.12s;
	left: 16px;
	top: 48px;
}

.dynloader span.block-15 {
	animation-delay: -0.2s;
	left: 32px;
	top: 48px;
}

.dynloader span.block-16 {
	animation-delay: -0.28s;
	left: 48px;
	top: 48px;
}

#newsContainer .dynloader span {
	display: block;
	position: absolute;
	width: 8px;
	height: 8px;
	opacity: 0;
	border-radius: 3px;
	animation: load 3.5s ease-in-out infinite;
}

#newsContainer .dynloader span.block-1 {
	animation-delay: 0.92s;
	left: 0px;
	top: 0px;
}

#newsContainer .dynloader span.block-2 {
	animation-delay: 0.84s;
	left: 11px;
	top: 0px;
}

#newsContainer .dynloader span.block-3 {
	animation-delay: 0.76s;
	left: 22px;
	top: 0px;
}

#newsContainer .dynloader span.block-4 {
	animation-delay: 0.68s;
	left: 33px;
	top: 0px;
}

#newsContainer .dynloader span.block-5 {
	animation-delay: 0.6s;
	left: 0px;
	top: 11px;
}

#newsContainer .dynloader span.block-6 {
	animation-delay: 0.52s;
	left: 11px;
	top: 11px;
}

#newsContainer .dynloader span.block-7 {
	animation-delay: 0.44s;
	left: 22px;
	top: 11px;
}

#newsContainer .dynloader span.block-8 {
	animation-delay: 0.36s;
	left: 33px;
	top: 11px;
}

#newsContainer .dynloader span.block-9 {
	animation-delay: 0.28s;
	left: 0px;
	top: 22px;
}

#newsContainer .dynloader span.block-10 {
	animation-delay: 0.2s;
	left: 11px;
	top: 22px;
}

#newsContainer .dynloader span.block-11 {
	animation-delay: 0.12s;
	left: 22px;
	top: 22px;
}

#newsContainer .dynloader span.block-12 {
	animation-delay: 0.04s;
	left: 33px;
	top: 22px;
}

#newsContainer .dynloader span.block-13 {
	animation-delay: -0.04s;
	left: 0px;
	top: 33px;
}

#newsContainer .dynloader span.block-14 {
	animation-delay: -0.12s;
	left: 11px;
	top: 33px;
}

#newsContainer .dynloader span.block-15 {
	animation-delay: -0.2s;
	left: 22px;
	top: 33px;
}

#newsContainer .dynloader span.block-16 {
	animation-delay: -0.28s;
	left: 33px;
	top: 33px;
}

@keyframes load {
	0% {
		opacity: 0;
		transform: translateY(-100px);
	}

	15% {
		opacity: 0;
		transform: translateY(-100px);
	}

	30% {
		opacity: 1;
		transform: translateY(0);
	}

	70% {
		opacity: 1;
		transform: translateY(0);
	}

	85% {
		opacity: 0;
		transform: translateY(100px);
	}

	100% {
		opacity: 0;
		transform: translateY(100px);
	}
}

.text1 p {
	font-size: 17px;
}

.text2 p {
	font-size: 18px;
}

/* NOTE: Smaller text throughout the site */
.modal .textMatter p:not(.psource):not(.qsource),
.modal .textMatter blockquote,
.modal .textMatter .quotation,
.modal .textMatter .inlist div,
.modal .textMatter ul:not(.smlmenu)>li,
.modal .textMatter ol>li,
.portfolio-item p,

.modalcontent:not(#modalMediaContent) .textMatter p,
.modalcontent:not(#modalMediaContent) .textMatter ul>li,
.tblsort p,
.tblsort ul>li,
.smllist,
.smaller {
	font-size: 0.96em;
}

/* ===========================================================
	RESPONSIVE
============================================================== */

@media (min-width: 576px) {

	.container-sm,
	.container {
		max-width: 800px;
	}

}

@media (min-width: 768px) {

	.container-md,
	.container-sm,
	.container {
		max-width: 960px;
	}

}

@media (min-width: 992px) {

	.container-lg,
	.container-md,
	.container-sm,
	.container {
		max-width: 1200px;
	}

	.col-lg-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}

	.col-lg-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}

	.modal:not(.plyrmodal):not(.lotusmodal) .modal-dialog {
		max-width: 800px;
	}

	.primary-menu {
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		-ms-flex-positive: 0;
		flex-grow: 0;
	}

	.sub-menu-container {
		position: absolute;
		visibility: hidden;
	}

	.primary-menu:not(.on-click) .menu-item .sub-menu-container {
		display: block;
		opacity: 0;
		margin-top: 15px;
		z-index: -9999;
		pointer-events: none;
	}

	/* NOTE: the ":not(.on-click)" part is essential; probably from how Canvas' fuctions.js is configurated */
	.primary-menu:not(.on-click) .menu-item:hover>.sub-menu-container {
		opacity: 1;
		visibility: visible;
		z-index: 399;
		pointer-events: auto;
	}

	.primary-menu:not(.on-click) .sub-menu-container .menu-item:hover>.sub-menu-container {
		margin-top: 0;
	}

	.primary-menu:not(.on-click) .menu-container>.menu-item:hover>.sub-menu-container {
		margin-top: 9px;
	}

	.primary-menu:not(.on-click) .menu-container>.menu-item.sub-menu::after {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		height: 14px;
		z-index: 400;
	}

	.primary-menu:not(.on-click) .menu-item:not(:hover)>.sub-menu-container>* {
		display: none;
	}

	.sub-menu-container .sub-menu-container {
		list-style: none;
		top: -2px !important;
		left: 100%;
	}

	.sub-menu-container.menu-pos-invert {
		left: auto;
		right: 0;
	}

	.sub-menu-container .sub-menu-container.menu-pos-invert {
		right: 100%;
	}

	.sub-menu-container .menu-item>.menu-link {
		padding: 10px 15px;
	}

	.sub-menu-container .menu-item:has(> .sub-menu-container)>.menu-link div {
		position: relative;
	}

	.sub-menu-container .menu-item:has(> .sub-menu-container)>.menu-link div>i.fa-bars {
		display: block;
		position: absolute;
		top: 50%;
		right: -8px;
		font-size: 12px;
		font-weight: bold;
		line-height: 0;
		margin: 0;
		vertical-align: middle;
		transform: translateY(-50%);
	}

	.sub-menu-container .menu-link div>i:not(.fa-bars) {
		display: block;
		position: absolute;
		top: 50%;
		right: -8px;
		font-size: 12px;
		font-weight: bold;
		line-height: 0;
		margin: 0;
		vertical-align: middle;
		transform: translateY(-50%);
	}

	.menu-item .sub-menu-trigger {
		display: none;
	}

	.full-header #logo {
		padding-right: 0;
	}

	.menu-container:not(.mobile-primary-menu) {
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-ms-flex-align: center;
		align-items: center;
	}

	.menu-container>.menu-item:not(:first-child) {
		margin-left: 2px;
	}

	#header.header-size-lg .menu-container>.menu-item>.menu-link {
		margin: 20px 1px;
	}

	#header.header-size-md .menu-container>.menu-item>.menu-link {
		margin: 8px 1px;
	}

	#header.header-size-sm .menu-container>.menu-item>.menu-link {
		margin: 0 1px;
	}

	#header.header-size-sm.sticky-header-shrink .primary-menu>ul>li>a {
		font-size: 14px;
	}

	.sticky-header .menu-container>.menu-item>.menu-link {
		margin: 0 1px;
	}

	.full-header .primary-menu .menu-container {
		border-right: none;
		padding-right: 0;
		margin: 0;
	}

	.primary-menu .menu-item .sub-menu-container {
		display: block;
		opacity: 0;
		margin-top: 15px;
		z-index: -9999;
		pointer-events: none;
		transition: opacity .3s ease, margin .25s ease;
	}

	#header-wrap {
		position: fixed;
		height: auto;
		width: 100%;
		top: 0;
		right: 0;
		z-index: 299;

		backface-visibility: hidden;
		will-change: left, top, transform;
	}

	.sticky-header #header-wrap {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 299;
		transform: translateZ(0);
		backface-visibility: hidden;
	}

	body:not(.clearview).all-padded #header:not(.sticky-header) #header-wrap {
		position: absolute;
	}

	.header-wrap-clone {
		display: block;
		height: calc(100px + 1px);
	}

	.header-size-sm .header-wrap-clone {
		height: calc(60px + 1px);
	}

	.header-size-md .header-wrap-clone {
		height: calc(80px + 1px);
	}

	.header-size-lg .header-wrap-clone {
		height: calc(100px + 1px);
	}

	#header.transparent-header,
	#header.transparent-header:not(.sticky-header) #header-wrap {
		background: transparent;
		border-bottom: 1px solid transparent;
		z-index: 299;
	}

	body.stretched .full-header #header-wrap>.container {
		width: 100%;
		max-width: none;
		padding: 0 30px;
	}

	#header .header-row {
		flex-wrap: nowrap;
		position: initial;
	}

	.menu-link {
		padding: 39px 10px;
	}

	#tPrimaryMenu {
		display: none !important;
	}

	body.all-padded {
		padding: 40px 30px;
	}

	body.all-padded #wrapper {
		border-radius: var(--yim-br12);
	}

	body.all-padded #header:not(.sticky-header),
	body.all-padded #header:not(.sticky-header) #header-wrap,
	body.all-padded #header:not(.sticky-header) #header-wrap .container {
		border-radius: var(--yim-br12-top);
	}

	#header.header-size-lg.sticky-header-shrink #header-wrap #logo img {
		height: 80px;
	}

	#header.header-size-md.sticky-header-shrink #header-wrap #logo img {
		height: 60px;
	}

	#header.header-size-sm.sticky-header-shrink #header-wrap #logo img {
		height: 40px;
	}

	body.all-padded #copyrights,
	body.all-padded #footer {
		border-radius: var(--yim-br12-bottom);
	}

	body.clearview:not(.stretched) #content,
	body.clearview:not(.stretched) #content .content-wrap,
	body.clearview:not(.stretched) #content .section-top {
		border-radius: var(--yim-br12-top);
	}

	/* NOTE: this min-height is important;
	It is used only on the Home, Mainteance, Article, Blog and Clips pages where there is a newsColumn on the right;
	It is designed to ensure that the items in the right column (#rCol) always appear nomally and with the right height or minimum height even when the text loaded is short; otherwise the left column being short that will also set the height of the right column too short */
	/* NOTE: 1242px ensures well-fitted items in Clips.html */
	blockquote p:not(:last-child) {
		margin-bottom: 15px;
	}

	blockquote p:last-child {
		margin-bottom: 0;
	}

}

@media (min-width: 1200px) {
	body:not(.stretched) #wrapper {
		max-width: 1200px;
	}
}

@media (min-width: 1440px) {
	body:not(.stretched) #wrapper {
		max-width: 1440px;
	}
}

@media (max-width: 1499.98px) {

	.full-slider #yilivSlider:not(.f-screen) {
		max-width: 1340px;
	}
}


@media (max-width: 991.98px) {

	#mobileMenu .modalclose.top,
	#mobileMenu .modalclose.top a.mobile-menu-trigger {
		top: 6px;
		right: 6px;
	}

	.modal:not(.plyrmodal):not(.lotusmodal) .modal-dialog {
		margin-top: 38px;
	}

	body.stretched #content .content-wrap,
	body.stretched #content .content-wrap .container,
	body.stretched #content .content-wrap .container .slides {
		padding-top: 0;
		margin-top: 0;
	}

	#titleInContent {
		display: block;
		position: relative;
		padding: 40px 8px 8px;
	}

	#titleInContent .title {
		text-align: right;
		margin: 0;
		padding: 0;
	}

	#header {
		/* NOTE: z-index important to see the box-shadow on small screens */
		z-index: 2;
	}

	#header.header-size-sm,
	#header.header-size-md,
	#header.header-size-lg {
		padding-bottom: 0;
	}

	.sticky-header #header-wrap {
		border-radius: var(--yim-br0);
	}

	.sticky-header .header-wrap-clone {
		display: block;
	}

	body.clearview #header-wrap {
		background: none;
	}

	#logo {
		/* NOTE: important to centre logo on all small screens */
		margin-left: auto;
	}

	#copyrights {
		border-radius: var(--yim-br0);
	}

	#sidenavContainer {
		position: relative;
	}

	#sidenavScroller {
		margin-bottom: 0;
	}

	#page-title .smcontainer.pf-columns,
	#page-title .smcontainer.pf-columns * {
		display: none;
	}

	.smcontainer {
		position: relative;
	}

	.smcontainer.text-filter,
	.smlmenu#textFilter {
		width: 100%;
	}

	/* NOTE: specifically for in-quest process pages */
	.printpdf[class*="content"]:not(.bottom) {
		margin-bottom: 124px;
	}

	.table-display .row {
		margin: 0;
	}

	.table-display .row p:first-child,
	.table-display .row+h3+p {
		margin-top: 0.5em;
	}

	.table-display .span p {
		text-align: left !important;
	}

	body.commented #rCol #newsColumn {
		min-height: 740px;
	}

	body.commented #rCol {
		height: auto !important;
		margin-bottom: 36px;
	}

	#rCol .news-column .scroll-container {
		max-height: 1000px;
	}

	#rCol.articles.nonews {
		height: auto !important;
	}

	#sidebarWrapper {
		min-height: unset;
	}

	#sidenavContainer {
		width: auto;
		max-width: 400px;
		margin: auto;
	}

}

@media (max-width: 766.98px) {

	body.stretched.clearview #page-title:not(.full-slider),
	body.all-padded.clearview #page-title {
		height: 100svh;
		padding-bottom: env(safe-area-inset-bottom);
	}

	.pl-scroller {
		display: none !important;
	}

	#header.header-size-lg #header-wrap #logo img {
		height: 76px;
	}

	.slider-caption {
		right: 25%;
	}

	#slider {
		height: calc(100vh + 30px);
	}

	#slider .inevma .author-container {
		right: -15.5%;
	}

	#slider .inevma .text-container div:nth-child(3) {
		margin-right: -15.5%;
	}

	#lCol.nominheight {
		min-height: initial !important;
	}

	h1,
	#post_id h1 {
		font-size: 1.75em;
	}

	#post_id h1+div,
	#post_id h1+div p {
		font-size: 1em;
	}

	.sidenav a:hover .icon-chevron-right,
	.sidenav a:hover .icon-chevron-left,
	.sidenav .ui-tabs-active .icon-chevron-right,
	.sidenav .ui-tabs-active a:hover .icon-chevron-right,
	.sidenav .ui-tabs-active .icon-chevron-left,
	.sidenav .ui-tabs-active a:hover .icon-chevron-left {
		opacity: 0;
	}

	#fJewels {
		/* NOTE: 100% is too large */
		font-size: 99%;
	}

	#shareLinks {
		right: 30px;
	}

}

@media only screen and (max-width: 766.98px) {
	body.clearview:not(.slides):not(.articles):not(.hatha) #content .content-wrap {
		padding-top: 120px;
	}
}

@media (min-width: 568px) and (max-width: 991.98px) and (max-height: 479.98px) {

	.slider-caption,
	.slider-caption-top-left {
		top: -48px;
	}

	#slider .inevma {
		margin-top: 25%;
	}

}

@media (max-width: 667.98px) {

	.modal-title h1 {
		font-size: 1.8em;
	}

	.slider-caption,
	.slider-caption-top-left {
		top: 36px;
	}

}

@media (max-width: 567.98px) {

	.smlmenu#textFilter li {
		font-size: 2.7vw;
		padding-left: 1vw;
		padding-right: 1vw;
	}

	#pgVertMenu {
		width: auto;
	}

}

@media (max-width: 479.98px) {

	#content .content-wrap {
		padding-right: 0;
		padding-left: 0;
	}

	[class*="gutter-"]>.col,
	[class*="gutter-"]>[class*="col-"] {
		padding-right: calc(var(--custom-gutter) / 2.5);
		padding-left: calc(var(--custom-gutter) / 2.5);
		margin-top: var(--custom-gutter);
	}

	.vertmenu,
	ul.vertmenu {
		width: 90%;
	}

	.popover {
		width: 100%;
		margin-left: 5px;
	}

	.popover.top {
		left: 10px;
		margin: auto;
	}

	#fontDec span {
		display: none;
	}

	img.halffullwidth {
		width: 100%;
		margin: 12px auto;
	}

	.txtbox.tableft,
	.txtbox.tabright {
		width: 100%;
		margin: 25px auto;
	}

	.modal.simple .modalcontent h4 {
		font-size: 1.3em;
	}

	.modal.simple .modalcontent .scroll-container div p {
		font-size: 0.9em;
	}

	.table-wrap,
	.textMatter .xlg,
	.textMatter .lg,
	.textMatter .md,
	.textMatter .sm,
	.textMatter .ssm,
	.textMatter .xsm {
		margin-left: 0;
		margin-right: 0;
		padding: 0;
		width: auto;
	}

	body:not(.clearview) #page-title h1,
	#titleInContent h1 {
		font-size: 2.1em;
		margin-bottom: 0;
	}

	body:not(.clearview) #page-title h1+div,
	#titleInContent h1+div {
		font-size: 1.1em;
	}

	#titleInContent {
		padding: 0;
	}

	#sideListsWrap h3 {
		font-size: 1.5em;
	}

	.social-icon {
		margin: 0 3px;
	}

}

@media (max-width: 414.98px) {

	.modal:not(.plyrmodal) .modalclose.top,
	.modal:not(.plyrmodal) .modalclose.top:hover {
		right: 6px;
		top: 6px;
		font-size: 28px;
		width: 28px;
		height: 28px;
	}

	.modal-title * {
		text-align: center !important;
	}

	.container,
	.container-fluid,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl,
	.container-xxl {
		padding-right: var(--bs-gutter-x, 0.75rem);
		padding-left: var(--bs-gutter-x, 0.75rem);
	}

	:not(.boxed)>.txtbox {
		margin: 25px 0;
	}

	#endNotes.boxed {
		width: 100%;
	}

	.poem:not(.fullwidth) {
		font-size: 80%;
		margin: 1.5em 0.5em;
	}

	.infomsg p {
		margin: 0;
	}

	figure.language {
		width: 40px;
		height: 24px;
	}

	blockquote {
		padding: 0 0 0 1em;
		margin: 1em 1.5em 0 1em;
	}

	p.instruct {
		font-size: 1em;
		line-height: 1.62em;
	}

	h2 {
		font-size: 1.5em;
	}

	h3 {
		font-size: 1.1em;
	}

	h4 {
		font-size: 1.1em;
	}

	h4.title {
		font-size: 1.7em;
	}

	h5 {
		font-size: 1.1em;
	}

	h6 {
		font-size: 1.1em;
	}

	.quotation p::before,
	.quotation p::after {
		font-size: 500%;
	}

	.quotation p::before {
		left: -4rem;
	}

	.quotation p::after {
		right: -3.3rem;
	}

	.table-wrap.xlg {
		font-size: 90%;
		margin: 0;
	}

	.table>thead>tr>th,
	.table>tbody>tr>th,
	.table>tfoot>tr>th,
	.table>thead>tr>td,
	.table>tbody>tr>td,
	.table>tfoot>tr>td {
		padding: 6px;
	}

	.textMatter.readmodal ul:not(.smlmenu) {
		margin-left: 0.5em;
		width: calc(100% - 0.5em);
	}

	h4.title {
		font-size: 200%;
	}

	.modal-body {
		padding: 0 12px;
	}

	.vmcontainer {
		width: 86%;
	}

	.dyncontent.topmargin-sm {
		padding-top: 0;
	}

	.toggle .boxed,
	.accordion .boxed {
		margin: 1.5em 0;
	}

	#clipWrapper {
		min-height: 0;
		margin-bottom: 30px;
	}

	#copyrights {
		font-size: 0.6em;
		line-height: 4.5;
	}

	#shareLinks {
		margin-right: 0;
	}

}

@media only screen and (max-width: 359.98px) {

	.page-title-right .container,
	.page-title-left .container {
		padding-left: 15px;
		padding-right: 15px;
	}

	.modal .table {
		font-size: 0.86em;
	}

	#pSections li:not(:first-child) span.sml {
		font-size: 60% !important;
	}

	#copyrights {
		font-size: 0.5em;
		line-height: 5;
	}

	.social-icon {
		margin: 0;
	}

	.modal-title h1 {
		font-size: 1.7em;
	}

	body:not(.clearview) #page-title h1,
	#titleInContent h1 {
		font-size: 1.8em;
		margin-bottom: 0;
	}

	body:not(.clearview) #page-title h1+div {
		font-size: 0.9em;
	}

	#footer .footer-bottom {
		padding: 0;
	}

	#footer .footer-bottom .share-links a {
		width: 30px;
		height: 30px;
		font-size: 14px;
	}

}

/* **********************************************
	Mobile devices
************************************************* */

/* ----------------------------------------------------------------
	Media Queries for Standard Devices
	https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
-----------------------------------------------------------------*/

/* ----------- iPhone 4 and 4S ----------- */

/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

@media only screen and (max-width: 320px) and (min-height: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {

	.full-slider .parallax-window {
		min-height: 70vh;
	}

	#slider {
		height: calc(100vh + 30px);
	}
}

@media only screen and (max-height: 320px) and (min-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
	.full-slider .parallax-window {
		min-height: 160vh;
	}

	#slider {
		height: calc(100vh + 10px);
	}

}

/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

@media only screen and (max-width: 375px) and (min-height: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
	body.device-touch .full-slider .parallax-window {
		min-height: 65vh;
	}

	#slider {
		height: calc(100vh + 30px);
	}

}

@media only screen and (max-height: 375px) and (min-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
	.full-slider .parallax-window {
		min-height: 155vh;
	}

	#slider {
		height: calc(100vh + 10px);
	}

}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

@media only screen and (max-width: 414px) and (min-height: 730px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
	.full-slider .parallax-window {
		min-height: 60vh;
	}

	#slider {
		height: calc(100vh + 30px);
	}
}

@media only screen and (max-height: 414px) and (min-width: 730px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
	.full-slider .parallax-window {
		min-height: 150vh;
	}

	#slider {
		height: calc(100vh + 10px);
	}
}

/* ----------- iPhone X ----------- */

@media only screen and (max-width: 375px) and (min-height: 812px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait) {
	.full-slider .parallax-window {
		min-height: 56vh;
	}

}

@media only screen and (max-width: 375px) and (min-height: 812px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: landscape) {
	.full-slider .parallax-window {
		min-height: 170vh;
	}

}

/* ----------- iPad 1, 2, Mini and Air ----------- */

@media only screen and (max-width: 768px) and (min-height: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
	body.device-touch .full-slider .parallax-window {
		min-height: 60vh;
	}

}

@media only screen and (max-height: 768px) and (min-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
	body.device-touch .full-slider .parallax-window {
		min-height: 95vh;
	}

}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */

@media only screen and (max-width: 768px) and (min-height: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
	.full-slider .parallax-window {
		min-height: 60vh;
	}

}

@media only screen and (max-height: 768px) and (min-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
	.full-slider .parallax-window {
		min-height: 95vh;
	}

}

/* ----------- iPad Pro 10.5" ----------- */

@media only screen and (max-width: 834px) and (min-height: 1112px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
	.full-slider .parallax-window {
		min-height: 56vh;
	}

}

@media only screen and (max-height: 834px) and (min-width: 1112px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
	.full-slider .parallax-window {
		min-height: 95vh;
	}

}

/* ----------- iPad Pro 12.9" ----------- */

@media only screen and (min-width: 1024px) and (min-height: 1366px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
	.full-slider .parallax-window {
		min-height: 56vh;
	}

}

@media only screen and (min-width: 1024px) and (min-height: 1366px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
	.full-slider .parallax-window {
		min-height: 95vh;
	}

}

/* ***********************************************
	Single devices
************************************************** */

/* ----------- Galaxy S4, S5, S6. Note 3, Pixel, Pixel XL ----------- */

@media (min-width: 320px) and (max-width: 360px) and (min-height: 569px) and (max-height: 640px) {

	.full-slider .parallax-window {
		min-height: 65vh;
	}

}

@media (min-height: 320px) and (max-height: 360px) and (min-width: 569px) and (max-width: 640px) {

	body.device-touch .full-slider .parallax-window {
		min-height: 160vh;
	}
}