/* ============================================================================================================================
	rm-layout.css - the layout layer (Step 4, 5 Oct 2026): the page frame - #wrapper, the header with the logo, the menu and the
	sticky header, the content, the footer, the go-to-top button, the page loader and the page transitions - and the grid helpers
	(.container widths, sections, columns, margin/visibility helpers), with their responsive rules.

	The rules were moved here from site.css (the theme's style.css/dark.css, 3 Oct 2026), site-after-icons.css (its animate.css,
	responsive.css, colors.css, radio-checkbox.css) and rm-components.css; each section heading names the file and section a rule
	comes from, the declarations are unchanged. A rule only changed its place where no other rule that could decide the same
	property of the same element (same specificity and importance, overlapping @media) sits between its old and its new place -
	checked rule by rule (Docs\Architecture\Step 4 rm- Restructure (5 Oct 2026).md, "The CSS layers"), so the cascade is the one
	the site had; the computed styles of every element of every page and dialog at 8 sizes are unchanged.
	Load order (helperfunctions.php PageStylesheets()): rm-brand-tokens.css, rm-layout-tokens.css, Bootstrap, rm-adapter-bootstrap.css,
	rm-base.css, rm-layout.css, the icon font, rm-components-theme.css, Tom Select's stylesheet + ui/rm-*.css, rm-switch.css,
	rm-components.css, rm-brand-states.css (last), then the page's own (rm-page-*.css, rm-dialog-*.css).
============================================================================================================================ */
/* ---- site.css: from the theme's style.css ---- */

@media (min-width: 576px) {
	.container { max-width: 540px; }
}
@media (min-width: 768px) {
	.container { max-width: 750px; }
}
@media (min-width: 992px) {
	.container { max-width: 970px; }
}
@media (min-width: 1200px) {
	.container { max-width: 1170px; }
}

/* ---- site.css: Helper Classes ---- */

.uppercase { text-transform: uppercase !important; }
.lowercase { text-transform: lowercase !important; }
.tright { text-align: right !important; }
.fright { float: right !important; }
.fleft { float: left !important; }
#wrapper {
	position: relative;
	float: none;
	width: 1220px;
	margin: 0 auto;
	min-height: 100% !important;		/* the background covers the whole screen (terms of service and other short pages) */
	background-color: var(--rm-white);
	box-shadow: 0 0 10px var(--rm-black-10);
	-moz-box-shadow: 0 0 10px var(--rm-black-10);
	-webkit-box-shadow: 0 0 10px var(--rm-black-10);
}
.line {
	clear: both;
	position: relative;
	width: 100%;
	margin: var(--rm-space-8) 0;
	border-top: var(--rm-border-width) solid var(--rm-lighter);
}
.topmargin { margin-top: var(--rm-space-7) !important; }
.bottommargin { margin-bottom: var(--rm-space-7) !important; }
.leftmargin-sm { margin-left: var(--rm-space-5) !important; }
.rightmargin-sm { margin-right: var(--rm-space-5) !important; }
.topmargin-sm { margin-top: var(--rm-space-5) !important; }
.bottommargin-sm { margin-bottom: var(--rm-space-5) !important; }
.rightmargin-lg { margin-right: var(--rm-space-9) !important; }
.topmargin-lg { margin-top: var(--rm-space-9) !important; }
.bottommargin-lg { margin-bottom: var(--rm-space-9) !important; }
.nomargin {margin: 0 !important; }
.norightmargin { margin-right: 0 !important; }
.notopmargin { margin-top: 0 !important; }
.nobottommargin { margin-bottom: 0 !important; }
.nobottomborder { border-bottom: none !important; }
.nopadding { padding: 0 !important; }
.hidden { display: none !important; }
.inline-block {
	float: none !important;
	display: inline-block !important;
}
.center { text-align: center !important; }
.color { color: var(--rm-accent) !important; }
.border-color { border-color: var(--rm-accent) !important; }
.nobg { background: none !important; }
.imagescale {
	display: block;
	overflow: hidden;
}
.imagescale img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
	-webkit-transition: all var(--rm-duration-slow) ease;
	transition: all var(--rm-duration-slow) ease;
}
.imagescale:hover img {
	-webkit-transform: scale(1);
	transform: scale(1);
}
@-ms-keyframes BgAnimated {
	from  {background-position:0 0;}
	to    {background-position:0 400px;}
	}

/* ---- site.css: Sections ---- */

.section {
	position: relative;
	margin: var(--rm-space-8) 0;
	padding: var(--rm-space-8) 0;
	background-color: var(--rm-grey-f9);
	overflow: hidden;
}
.section .container { z-index: var(--rm-z-raised-2); }

/* ---- site.css: Columns & Grids ---- */

.col_half { width: 48%; }
.col_one_third { width: 30.63%; }
.col_full,
.col_half,
.col_one_third {
	display: block;
	position: relative;
	margin-right: 4%;
	margin-bottom: var(--rm-space-7);
	float: left;
}
.col_full {
	width: 100%;
	clear: both;
	float: none;
	margin-right: 0;
}
.col_last {
	margin-right: 0 !important;
	float: right;
	clear: right;
}

/* ---- site.css: Flex Slider ---- */

.fslider,
.fslider .flexslider,
.fslider .slider-wrap,
.fslider .slide,
.fslider .slide > a,
.fslider .slide > img,
.fslider .slide > a > img {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	overflow: hidden;
	-webkit-backface-visibility: hidden;
}
.slider-wrap {margin: 0; padding: 0; list-style: none; border: none;}
.flexslider {position: relative;margin: 0; padding: 0;}

/* ---- site.css: Header ---- */

#header {
	position: relative;
	background-color: var(--rm-white);
	border-bottom: var(--rm-border-width) solid var(--rm-grey-f5);
}
#header .container { position: relative; }
#header.transparent-header {
	background: transparent;
	border-bottom: none;
	z-index: var(--rm-z-header);
}
#header.transparent-header + #slider,
#slider + #header.transparent-header {
	top: -100px;
	margin-bottom: -100px;
}

/* ---- site.css: Logo ---- */

#logo {
	position: relative;
	float: left;
	font-family: 'Raleway', sans-serif;
	font-size: 36px;
	line-height: 100%;
	margin-right: var(--rm-space-6);
}
#logo a {
	display: block;
	color: var(--rm-black);
}
#logo img {
	display: block;
	max-width: 100%;
}
#logo a.standard-logo { display: block; }
#logo a.retina-logo { display: none; }

/* ---- site.css: Primary Menu ---- */

#primary-menu { float: right; }
#primary-menu-trigger {
	opacity: 0;
	pointer-events: none;
	cursor: pointer;
	font-size: 14px;
	position: absolute;
	top: 50%;
	margin-top: -25px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	-webkit-transition: opacity var(--rm-duration-medium) ease;
	-o-transition: opacity var(--rm-duration-medium) ease;
	transition: opacity var(--rm-duration-medium) ease;
}
#primary-menu ul {
	list-style: none;
	margin: 0;
}
#primary-menu > ul { float: left; }
#primary-menu ul li { position: relative; }
#primary-menu ul > li {
	float: left;
	margin-left: 2px;
}
#primary-menu > ul > li:first-child { margin-left: 0; }
#primary-menu ul li > a {
	display: block;
	line-height: 22px;
	padding: 39px var(--rm-space-3);
	color: var(--rm-grey-44);
	font-weight: bold;
	font-size: 13px;
	letter-spacing: var(--rm-letter-spacing);
	text-transform: uppercase;
	font-family: 'Raleway', sans-serif;
	-webkit-transition: margin var(--rm-duration-normal) ease, padding var(--rm-duration-normal) ease;
	-o-transition: margin var(--rm-duration-normal) ease, padding var(--rm-duration-normal) ease;
	transition: margin var(--rm-duration-normal) ease, padding var(--rm-duration-normal) ease;
}
#primary-menu ul li > a span { display: none; }
#primary-menu ul li > a i {
	position: relative;
	top: -1px;
	font-size: 14px;
	width: 16px;
	text-align: center;
	margin-right: 6px;
	vertical-align: top;
}
#primary-menu ul li > a i.icon-angle-down:last-child {
	font-size: 12px;
	margin: 0 0 0 var(--rm-space-1);
}
#primary-menu ul li:hover > a,
#primary-menu ul li.current > a { color: var(--rm-accent); }
#primary-menu ul ul:not(.mega-menu-column),
#primary-menu ul li .mega-menu-content {
	display: none;
	position: absolute;
	width: 220px;
	background-color: var(--rm-white);
	--rm-menu-shadow: rgba(0, 0, 0, 0.05);
	box-shadow: 0px 13px 42px 11px var(--rm-menu-shadow);
	border: var(--rm-border-width) solid var(--rm-lighter);
	border-top: 2px solid var(--rm-accent);
	height: auto;
	z-index: var(--rm-z-header);
	top: 100%;
	left: 0;
	margin: 0;
}
#primary-menu ul ul:not(.mega-menu-column) ul {
	top: -2px !important;
	left: 218px;
}
#primary-menu ul ul.menu-pos-invert:not(.mega-menu-column),
#primary-menu ul li .mega-menu-content.menu-pos-invert {
	left: auto;
	right: 0;
}
#primary-menu ul ul:not(.mega-menu-column) ul.menu-pos-invert { right: 218px; }
#primary-menu ul ul li {
	float: none;
	margin: 0;
}
#primary-menu ul ul li:first-child { border-top: 0; }
#primary-menu ul ul li > a {
	font-size: 12px;
	font-weight: var(--rm-font-weight-bold);
	color: var(--rm-mid-grey);
	padding-top: var(--rm-space-2);
	padding-bottom: var(--rm-space-2);
	border: 0;
	letter-spacing: 0;
	font-family: 'Lato', sans-serif;
	-webkit-transition: all var(--rm-duration-fast) ease-in-out;
	-o-transition: all var(--rm-duration-fast) ease-in-out;
	transition: all var(--rm-duration-fast) ease-in-out;
}
#primary-menu ul ul li > a i { vertical-align: middle; }
#primary-menu ul ul li:hover > a {
	background-color: var(--rm-grey-f9);
	padding-left: 18px;
	color: var(--rm-accent);
}
#primary-menu ul ul > li.sub-menu > a,
#primary-menu ul ul > li.sub-menu:hover > a {
	background-image: url("../images/icons/submenu.png");
	background-position: right center;
	background-repeat: no-repeat;
}

/* ---- site.css: Mega Menu ---- */

#primary-menu ul li .mega-menu-content {
	width: 720px;
	max-width: 400px;
}
#primary-menu ul li .mega-menu-content ul {
	display: block;
	position: relative;
	top: 0;
	min-width: inherit;
	border: 0;
	box-shadow: none;
	background-color: transparent;
}
#primary-menu ul li .mega-menu-content ul:not(.megamenu-dropdown) {
	display: block !important;
	opacity: 1 !important;
	top: 0;
	left: 0;
}
#primary-menu ul li .mega-menu-content ul:not(.mega-menu-column) { width: 100%; }
#primary-menu.style-4 > ul > li > a {
	margin: 28px 0;
	padding-top: var(--rm-space-2);
	padding-bottom: var(--rm-space-2);
	border-radius: var(--rm-radius-sm);
	border: var(--rm-border-width) solid transparent;
}

/* ---- site.css: Sticky Header ---- */

#header,
#header-wrap,
#logo img {
	height: 100px;
	-webkit-transition: height var(--rm-duration-normal) ease, opacity var(--rm-duration-medium) ease;
	-o-transition: height var(--rm-duration-normal) ease, opacity var(--rm-duration-medium) ease;
	transition: height var(--rm-duration-normal) ease, opacity var(--rm-duration-medium) ease;
}
#primary-menu > ul > li > ul,
#primary-menu > ul > li > .mega-menu-content {
	-webkit-transition: top var(--rm-duration-normal) ease;
	-o-transition: top var(--rm-duration-normal) ease;
	transition: top var(--rm-duration-normal) ease;
}
body:not(.top-search-open) #header-wrap #logo,
body:not(.top-search-open) #primary-menu > ul,
body:not(.top-search-open) #primary-menu > .container > ul {
	opacity: 1;
	-webkit-transition: height var(--rm-duration-normal) ease, margin var(--rm-duration-normal) ease, opacity var(--rm-duration-fast) var(--rm-duration-fast) ease;
	-o-transition: height var(--rm-duration-normal) ease, margin var(--rm-duration-normal) ease, opacity var(--rm-duration-fast) var(--rm-duration-fast) ease;
	transition: height var(--rm-duration-normal) ease, margin var(--rm-duration-normal) ease, opacity var(--rm-duration-fast) var(--rm-duration-fast) ease;
}
#header-wrap {
	position: relative;
	z-index: var(--rm-z-header);
	-webkit-backface-visibility: hidden;
}
#header.sticky-header #header-wrap {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: var(--rm-white);
	box-shadow: 0 0 10px var(--rm-black-10);
}
#header.sticky-header:not(.static-sticky),
#header.sticky-header:not(.static-sticky) #header-wrap,
#header.sticky-header:not(.static-sticky):not(.sticky-style-2):not(.sticky-style-3) #logo img { height: 60px; }
#header.sticky-header:not(.static-sticky) #primary-menu > ul > li > a {
	padding-top: 19px;
	padding-bottom: 19px;
}
#header.sticky-header:not(.static-sticky) #primary-menu.style-4 > ul > li > a {
	padding-top: 8px;
	padding-bottom: 8px;
	margin: var(--rm-space-2) 0;
}
@media (min-width: 992px) {
	.side-header #header {
	position: fixed;
	top: 0;
	left: 0;
	z-index: var(--rm-z-side-header);
	width: 260px;
	height: 100%;
	height: calc(100vh);
	background-color: var(--rm-white);
	border: none;
	border-right: var(--rm-border-width) solid var(--rm-lighter);
	overflow: hidden;
	--rm-side-header-shadow: rgba(0, 0, 0, 0.065);
	box-shadow: 0 0 15px var(--rm-side-header-shadow);
}
	.side-header #header-wrap {
	width: 300px;
	height: 100%;
	overflow: auto;
	padding-right: var(--rm-space-6);
}
	.side-header #header .container {
	width: 260px !important;
	padding: 0 var(--rm-space-5) !important;
	margin: 0 !important;
}
	.side-header #logo {
	float: none;
	margin: var(--rm-space-8) 0 var(--rm-space-6);
}
	.side-header #logo img { height: auto !important; }
	.side-header #logo:not(.nobottomborder):after,
	.side-header #primary-menu:not(.nobottomborder):after {
	display: block;
	content: '';
	width: 20%;
	border-bottom: var(--rm-border-width) solid var(--rm-grey-e5);
}
	.side-header .center #logo:after { margin: 0 auto; }
	.side-header #primary-menu { margin-bottom: var(--rm-space-5); }
	.side-header #primary-menu:not(.nobottomborder):after { margin-top: var(--rm-space-6); }
	.side-header #primary-menu,
	.side-header #primary-menu ul {
	float: none;
	height: auto;
}
	.side-header #primary-menu ul li {
	float: none;
	margin: var(--rm-space-3) 0 0;
}
	.side-header #primary-menu ul li:first-child { margin-top: 0; }
	.side-header #primary-menu ul li a {
	height: 25px;
	line-height: 25px;
	padding: 0;
	text-transform: uppercase;
}
	.side-header #primary-menu ul li i { line-height: 24px; }
	.side-header #primary-menu ul ul {
	position: relative;
	width: 100%;
	background-color: transparent;
	box-shadow: none;
	border: none;
	height: auto;
	z-index: var(--rm-z-raised);
	top: 0;
	left: 0;
	margin: var(--rm-space-1) 0;
	padding-left: 12px;
}
	.side-header #primary-menu ul ul ul {
	top: 0 !important;
	left: 0;
}
	.side-header #primary-menu ul ul.menu-pos-invert {
	left: 0;
	right: auto;
}
	.side-header #primary-menu ul ul ul.menu-pos-invert { right: auto; }
	.side-header #primary-menu ul ul li {
	margin: 0;
	border: 0;
}
	.side-header #primary-menu ul ul li:first-child { border-top: 0; }
	.side-header #primary-menu ul ul a {
	font-size: 12px;
	height: auto !important;
	line-height: 24px !important;
	padding: 2px 0 !important;
}
	.side-header #primary-menu ul ul li:hover > a {
	background-color: transparent !important;
	color: var(--rm-grey-44) !important;
}
	.side-header #primary-menu ul > li.sub-menu > a,
	.side-header #primary-menu ul > li.sub-menu:hover > a { background-image: none !important; }
	.side-header #primary-menu ul > li.sub-menu > a:after {
	position: absolute;
	content: '\e7a5';
	top: 1px;
	right: 0;
	-webkit-transition: transform var(--rm-duration-fast) linear;
	-o-transition: transform var(--rm-duration-fast) linear;
	transition: transform var(--rm-duration-fast) linear;
}
	.side-header #primary-menu ul > li.sub-menu:hover > a:after {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
}
	.side-header:not(.open-header) #wrapper {
	margin: 0 0 0 260px !important;
	width: auto !important;
}
	.side-header:not(.open-header) #wrapper .container {
	width: auto;
	max-width: none;
	margin: 0 var(--rm-space-6);
}
}
.slider-element {
	position: relative;
	width: 100%;
	overflow: hidden;
}

/* ---- site.css: Slider ---- */

.boxed-slider { padding-top: var(--rm-space-6); }
.video-overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: var(--rm-z-overlay);
	background: transparent url('../images/grid.png') repeat;
	-webkit-backface-visibility: hidden;
}

/* ---- site.css: Content ---- */

#content {
	position: relative;
	overflow: hidden;
	background-color: var(--rm-white);
}
#content p { line-height: 1.8; }
.content-wrap {
	position: relative;
	padding: var(--rm-space-9) 0;
}
#content .container { position: relative; }
.grid-container {
	position: relative;
	overflow: hidden;
}
body:not(.device-touch) .grid-container {
	-webkit-transition: height var(--rm-duration-normal) ease;
	-o-transition: height var(--rm-duration-normal) ease;
	transition: height var(--rm-duration-normal) ease;
}

/* ---- site.css: Blog ---- */

.entry {
	position: relative;
	margin: 0 0 var(--rm-space-7);
}

/* ---- site.css: Buttons ---- */

.button {
	display: inline-block;
	position: relative;
	cursor: pointer;
	outline: none;
	white-space: nowrap;
	margin: var(--rm-space-1);
	padding: 0 22px;
	font-size: 14px;
	height: 40px;
	line-height: 40px;
	background-color: var(--rm-accent);
	color: var(--rm-white);
	font-weight: var(--rm-font-weight-bold);
	text-transform: uppercase;
	letter-spacing: var(--rm-letter-spacing);
	border: none;
	text-shadow: 1px 1px 1px var(--rm-black-20);
}

/* ---- site.css: Styled Icons ---- */

.i-rounded,
.i-plain,
.i-circled,
.social-icon {
	display: block;
	float: left;
	margin: 4px 11px 7px 0;
	text-align: center !important;
	font-size: 28px;
	color: var(--rm-white);
	text-shadow: 1px 1px 1px var(--rm-black-30);
	cursor: pointer;
	font-style: normal;
}

/* ---- site.css: Social Icons ---- */

.social-icon {
	margin: 0 var(--rm-space-1) var(--rm-space-1) 0;
	width: 40px;
	height: 40px;
	font-size: 20px;
	line-height: 38px !important;
	color: var(--rm-grey-55);
	text-shadow: none;
	border: var(--rm-border-width) solid var(--rm-grey-aa);
	border-radius: 3px;
	overflow: hidden;
}

/* ---- site.css: Toggle ---- */

.toggle {
	display: block;
	position: relative;
	margin: 0 0 var(--rm-space-4) 0;
}

/* ---- site.css: Quotes & Blockquotes ---- */

.quote:before {
	font-family: 'font-icons';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	content: "\e7ad";
	position: absolute;
	width: 48px;
	height: 48px;
	line-height: 48px;
	font-size: 42px;
	top: 0;
	left: 0;
	color: var(--rm-lighter);
}

/* ---- site.css: Go To Top ---- */

#gotoTop {
	display: none;
	z-index: var(--rm-z-gototop);
	position: fixed;
	width: 40px;
	height: 40px;
	background-color: var(--rm-black-30);
	font-size: 20px;
	line-height: 36px;
	text-align: center;
	color: var(--rm-white);
	top: auto;
	left: auto;
	right: 30px;
	bottom: 50px;
	cursor: pointer;
	border-radius: var(--rm-radius-sm);
}
body:not(.device-touch) #gotoTop {
	transition: background-color var(--rm-duration-fast) linear;
	-webkit-transition: background-color var(--rm-duration-fast) linear;
	-o-transition: background-color var(--rm-duration-fast) linear;
}
.stretched #gotoTop { bottom: 30px; }
#gotoTop:hover { background-color: var(--rm-accent); }

/* ---- site.css: Notifications: assets/css/ui/rm-notify.css since Step 3a (5 Oct 2026; toastr before) ---- */

#footer {
	position: relative;
	background-color: var(--rm-lighter);
	border-top: 5px solid var(--rm-black-20);
}

/* ---- site.css: Footer ---- */

.device-xl.sticky-footer #header,
.device-lg.sticky-footer #header { z-index: var(--rm-z-header); }
.device-xl.sticky-footer #slider:not(.slider-parallax-invisible),
.device-xl.sticky-footer #content,
.device-lg.sticky-footer #slider:not(.slider-parallax-invisible),
.device-lg.sticky-footer #content { z-index: var(--rm-z-raised-2); }
.device-xl.sticky-footer #footer,
.device-lg.sticky-footer #footer {
	position: fixed;
	top: auto;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: var(--rm-z-raised);
}
.device-xl.sticky-footer:not(.stretched) #footer,
.device-lg.sticky-footer:not(.stretched) #footer {
	left: 50%;
	margin-left: -610px;
	width: 1220px;
}
.device-lg.sticky-footer:not(.stretched) #footer {
	margin-left: -500px;
	width: 1000px;
}
#copyrights {
	padding: var(--rm-space-6) 0;
	background-color: var(--rm-grey-dd);
	font-size: 14px;
	line-height: 1.8;
}
#copyrights .col_half { margin-bottom: 0 !important; }
#copyrights a:first-child { margin-left: 0; }
#copyrights .tright a:last-child { margin-right: 0; }

/* ---- site.css: Stretched Layout ---- */

.stretched #wrapper {
	width: 100%;
	margin: 0;
	box-shadow: none;
}

/* ---- site.css: Page Transitions ---- */

body:not(.no-transition) #wrapper {
	position: relative;
	opacity: 0;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
@-webkit-keyframes bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0.0) }
	40% { -webkit-transform: scale(1.0) }
}
@keyframes bouncedelay {
	0%, 80%, 100% {
	transform: scale(0.0);
	-webkit-transform: scale(0.0);
	} 40% {
	transform: scale(1.0);
	-webkit-transform: scale(1.0);
	}
}

/* ---- site.css: Dark Scheme ---- */

.dark .css3-spinner > div { --rm-spinner-dot-dark: rgba(255, 255, 255, 0.35); background-color: var(--rm-spinner-dot-dark); }
.dark #header:not(.transparent-header),
#header.dark:not(.transparent-header) {
	background-color: var(--rm-dark);
	border-bottom: var(--rm-border-width) solid var(--rm-white-05);
}
.dark #header.sticky-header:not(.transparent-header) #header-wrap:not(.not-dark),
.dark #header.sticky-header.transparent-header #header-wrap:not(.not-dark),
#header.dark.sticky-header:not(.transparent-header) #header-wrap:not(.not-dark),
#header.dark.sticky-header.transparent-header #header-wrap:not(.not-dark) { background-color: var(--rm-dark); }
.dark #logo a { color: var(--rm-white); }
.dark #header-wrap:not(.not-dark) #primary-menu > ul > li > a,
.dark #header-wrap:not(.not-dark) #primary-menu > .container > ul > li > a {
	color: var(--rm-lighter);
	text-shadow: 1px 1px 1px var(--rm-black-10);
}
.dark #header.transparent-header:not(.sticky-header) #header-wrap:not(.not-dark) form input,
#header.dark.transparent-header:not(.sticky-header) #header-wrap:not(.not-dark) form input { border-bottom-color: var(--rm-white-15) !important; }
.dark #header-wrap:not(.not-dark) #primary-menu > ul > li:hover > a,
.dark #header-wrap:not(.not-dark) #primary-menu > ul > li.current > a,
.dark #header-wrap:not(.not-dark) #primary-menu > .container > ul > li:hover > a,
.dark #header-wrap:not(.not-dark) #primary-menu > .container > ul > li.current > a { color: var(--rm-lighter); }
.dark #primary-menu:not(.not-dark) ul ul,
.dark #primary-menu:not(.not-dark) ul li .mega-menu-content,
#primary-menu.dark ul ul,
#primary-menu.dark ul li .mega-menu-content {
	background-color: var(--rm-dark);
	border-color: var(--rm-grey-3f);
	border-top-color: var(--rm-accent);
}
.dark #primary-menu:not(.not-dark) ul ul li,
#primary-menu.dark ul ul li { border-top-color: var(--rm-grey-3f); }
.dark #primary-menu:not(.not-dark) ul ul li:first-child,
#primary-menu.dark ul ul li:first-child { border-top: 0; }
.dark #primary-menu:not(.not-dark) ul ul li > a,
#primary-menu.dark ul ul li > a { color: var(--rm-grey-99) !important; }
.dark #primary-menu:not(.not-dark) ul ul li:hover > a,
#primary-menu.dark ul ul li:hover > a {
	background-color: var(--rm-black-10);
	color: var(--rm-grey-cc) !important;
}
.dark #primary-menu:not(.not-dark) ul ul > li.sub-menu > a,
.dark #primary-menu:not(.not-dark) ul ul > li.sub-menu:hover > a,
#primary-menu.dark ul ul > li.sub-menu > a,
#primary-menu.dark ul ul > li.sub-menu:hover > a { background-image: url("../images/icons/submenu-dark.png"); }
.dark.side-header #header {
	background-color: var(--rm-dark);
	border-right-color: var(--rm-grey-3f);
}
.dark.side-header #logo:not(.nobottomborder):after,
.dark.side-header #primary-menu:not(.nobottomborder):after { border-bottom-color: var(--rm-grey-3f); }
.dark.side-header #primary-menu:not(.not-dark) > ul > li > a,
.dark.side-header #primary-menu ul ul li:hover > a { color: var(--rm-grey-dd) !important; }
.dark.side-header #primary-menu ul ul a { color: var(--rm-grey-aa) !important; }
.dark #footer .social-icon.si-borderless,
#footer.dark .social-icon.si-borderless { color: var(--rm-grey-55) !important; }
#footer.dark,
.dark #footer {
	background-color: var(--rm-dark);
	color: var(--rm-grey-cc);
	border-top-color: var(--rm-black-20);
}
.dark #copyrights {
	background-color: var(--rm-black-20);
	--rm-copyrights-text-dark: var(--rm-grey-99);		/* 5.1:1 on the footer's #292929 (white at 25 % was 2.26:1 - J-34) */
	color: var(--rm-copyrights-text-dark);
	text-shadow: 1px 1px 1px var(--rm-black-10);
}
@media (max-width: 991px) {
	.dark #header.transparent-header,
	#header.dark.transparent-header {
		background-color: var(--rm-dark);
		border-bottom-color: var(--rm-white-10);
	}
	.dark #primary-menu:not(.not-dark) ul li,
	.dark #primary-menu:not(.not-dark) ul ul,
	.dark #primary-menu:not(.not-dark) ul li .mega-menu-content,
	.dark #primary-menu:not(.not-dark) ul ul li,
	.dark #primary-menu:not(.not-dark) ul li .mega-menu-content ul ul { border-top-color: var(--rm-white-10) !important; }
	.dark #primary-menu:not(.not-dark) > ul > li.sub-menu > a,
	.dark #primary-menu:not(.not-dark) > .container > ul > li.sub-menu > a { background-image: url("../images/icons/submenu-dark.png"); }
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu ul li,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu ul ul,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu ul li .mega-menu-content,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu ul ul li,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu ul li .mega-menu-content ul ul { border-top-color: var(--rm-lighter) !important; }
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > ul > li:hover a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > ul > li.current a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > div > ul > li:hover a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > div > ul > li.current a { color: var(--rm-accent) !important; }
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu ul ul a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > ul > li:hover ul a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > ul > li.current ul a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > div > ul > li:hover ul a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > div > ul > li.current ul a { color: var(--rm-grey-44) !important; }
}

/* ---- site-after-icons.css: from the theme's css/responsive.css ---- */

@media (min-width: 992px) and (max-width: 1199.98px) {
	#wrapper { width: 1000px; }
}
@media (max-width: 991.98px) {
	#wrapper {
		width: 100%;
		margin: 0;
		box-shadow: none;
	}
	.col_last { float: none; }
	#header,
	#header-wrap { height: auto !important; }
	#header.sticky-header #header-wrap { position: relative; }
	#header.transparent-header {
		background: var(--rm-white);
		border-bottom: var(--rm-border-width) solid var(--rm-grey-f5);
		z-index: auto;
	}
	#header.dark.transparent-header {
		background-color: var(--rm-dark);
		border-bottom: var(--rm-border-width) solid var(--rm-black-10);
	}
	#header.transparent-header + #slider,
	#slider + #header.transparent-header {
		top: 0;
		margin-bottom: 0;
	}
	#logo {
		display: block;
		height: 100px;
		float: none;
		margin: 0 auto 0 !important;
		max-width: none;
		text-align: center;
		border: 0 !important;
		padding: 0 !important;
	}
	#logo a.standard-logo { display: inline-block; }
	#primary-menu {
		display: block;
		float: none;
	}
	#primary-menu-trigger {
		opacity: 1;
		pointer-events: auto;
		top: 25px;
		margin-top: 0;
		left: 0;
		z-index: var(--rm-z-raised);
	}
	#primary-menu .container #primary-menu-trigger {
		top: 5px;
		left: 0;
	}
	#primary-menu > ul,
	#primary-menu > div > ul {
		display: none;
		float: none !important;
		border: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		-webkit-transition: none;
		-o-transition: none;
		transition: none;
	}
	#primary-menu > div > ul { padding-top: var(--rm-space-8) !important; }
	body:not(.top-search-open) #primary-menu-trigger {
		opacity: 1;
		-webkit-transition: opacity var(--rm-duration-fast) var(--rm-duration-fast) ease, top var(--rm-duration-normal) ease;
		-o-transition: opacity var(--rm-duration-fast) var(--rm-duration-fast) ease, top var(--rm-duration-normal) ease;
		transition: opacity var(--rm-duration-fast) var(--rm-duration-fast) ease, top var(--rm-duration-normal) ease;
	}
	#primary-menu ul li {
		float: none;
		margin: 0 !important;
		text-align: left !important;
		border-top: var(--rm-border-width) solid var(--rm-lighter);
	}
	#primary-menu ul li:first-child { border-top: 0; }
	#primary-menu ul > li > a {
		padding: 14px var(--rm-space-1) !important;
		border: none !important;
		margin: 0 !important;
	}
	#primary-menu ul:not(.windows-mobile-menu) li > a i.icon-angle-down:last-child { display: none; }
	#primary-menu > ul > li.sub-menu > a,
	#primary-menu > .container > ul > li.sub-menu > a {
		background-image: url("../images/icons/submenu.png");
		background-position: right center;
		background-repeat: no-repeat;
	}
	#primary-menu ul ul:not(.mega-menu-column),
	#primary-menu ul li .mega-menu-content {
		position: relative;
		width: auto;
		max-width: none;
		background: transparent !important;
		box-shadow: none;
		border: 0;
		border-top: var(--rm-border-width) solid var(--rm-lighter);
		z-index: var(--rm-z-raised);
		top: 0;
		padding-left: var(--rm-space-3);
	}
	#primary-menu ul ul:not(.mega-menu-column) ul {
		top: 0 !important;
		left: 0;
	}
	#primary-menu ul ul.menu-pos-invert:not(.mega-menu-column),
	#primary-menu ul li .mega-menu-content.menu-pos-invert {
		left: 0;
		right: 0;
	}
	#primary-menu ul ul:not(.mega-menu-column) ul.menu-pos-invert { right: 0; }
	#primary-menu ul ul li {
		float: none;
		margin: 0;
		border-top: var(--rm-border-width) solid var(--rm-lighter);
	}
	#primary-menu ul ul li > a {
		padding: 11px var(--rm-space-1) !important;
		font-size: 13px;
		text-transform: none;
		font-weight: 400;
	}
	#primary-menu ul ul li:hover > a {
		background-color: transparent !important;
		font-weight: var(--rm-font-weight-bold);
		padding-left: var(--rm-space-1);
		color: var(--rm-accent);
	}
	#primary-menu ul li .mega-menu-content {
		padding-left: 0;
		width: auto;
		margin: 0;
		top: 0;
	}
	#primary-menu ul li .mega-menu-content ul {
		display: block !important;
		position: relative;
		opacity: 1 !important;
		top: 0;
		left: 0;
		min-width: inherit;
		width: 100% !important;
	}
	#primary-menu ul li .mega-menu-content ul ul { border-top: var(--rm-border-width) solid var(--rm-lighter); }
}
/* J-33 (bug run 10 Oct 2026, slice 15): from 768 to 991 px .col_last is un-floated (above) while .col_half / .col_one_third still float
   (48 % / 30.63 % until 767 px): as an ordinary block (position: relative) the last column lay over the columns before it and took their
   clicks and taps - Account Settings' four e-mail switches could not be switched, a tap on the start page's left video/picture opened the
   right one. Its own block formatting context never overlaps a float: it sits beside the floats where it fits, under them where not
   (test_shared_css.py) */
@media (min-width: 768px) and (max-width: 991.98px) {
	.col_last { display: flow-root; }
}
@media (max-width: 767.98px) {
	#wrapper { width: 100% !important; }
	#copyrights .col_half { text-align: center; }
	#copyrights .col_half:last-child { display: none; }
}
@media (max-width: 575.98px) {
	.container { width: 100% !important; }		/* (its padding is the later .container rule's: a 40 px one here never applied - J-42) */
	#primary-menu-trigger { left: 20px; }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) {
	#logo a.standard-logo { display: none; }
	#logo a.retina-logo { display: block; }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 991.98px), only screen and ( -o-min-device-pixel-ratio: 2/1) and (max-width: 991.98px), only screen and ( min-resolution: 192dpi) and (max-width: 991.98px), only screen and ( min-resolution: 2dppx) and (max-width: 991.98px) {
	#logo a.standard-logo { display: none; }
	#logo a.retina-logo { display: inline-block; }
}

/* ---- site-after-icons.css: Colors Replace the HEX Code with your Desired Color HEX ---- */

#primary-menu.style-4 > ul > li:hover > a,
#primary-menu.style-4 > ul > li.current > a { border-color: var(--theme-color); }
#primary-menu ul ul:not(.mega-menu-column),
#primary-menu ul li .mega-menu-content,
.dark #primary-menu:not(.not-dark) ul ul,
.dark #primary-menu:not(.not-dark) ul li .mega-menu-content,
#primary-menu.dark ul ul,
#primary-menu.dark ul li .mega-menu-content { border-top-color: var(--theme-color); }
@media only screen and (max-width: 991px) {
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > ul > li:hover a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > ul > li.current a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > div > ul > li:hover a,
	body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) #primary-menu > div > ul > li.current a,
	#primary-menu ul ul li:hover > a { color: var(--theme-color) !important; }
}

/* ---- rm-components.css ---- */

/* Extra small devices (portrait phones, less than 544px)
 No media query since this is the default in Bootstrap */
.container {
	padding-left: var(--rm-space-4) !important;
	padding-right: var(--rm-space-4) !important;
}
/* Make mobile menu horizontal lines larger */
#primary-menu-trigger i { font-size: 1.5rem; }
@media (min-width: 1720px) {
	.container {
		max-width: 90vw;
	}
	#header.sticky-header:not(.static-sticky), #header.sticky-header:not(.static-sticky) #header-wrap, #header.sticky-header:not(.static-sticky):not(.sticky-style-2):not(.sticky-style-3) #logo img {
		max-width: 100%;
		margin: auto;
	}
}


/* ---- Step 7 (6 Oct 2026): the classes of the former style="..." attributes (the header logo) ---- */
.rm-header__logo:not(#rm-inline) { transform: scale(0.6); transform-origin: left; }
.rm-header__logo--retina:not(#rm-inline) { transform: scale(0.6); }
/* the local servers' list in the menu (menu.main.php): as wide as its content, as its old style attribute made it over the menu's
   own sub-list width (#primary-menu ul ul:not(.mega-menu-column)) */
#primary-menu #my-server-status-list { width: max-content; }

/* The dark pages (the <style> block of index, the menu pages, privacy policy, terms of service, httperror and connect until Step 7) */
body.rm-page--dark, .rm-page--dark #content.my_background_image { background-color: var(--rm-page-dark); }