/*! Mix-IT© 2015-2025 EMIAGIC, Corp. | All rights reserved | Tous droits réservés | Author: Jimmy Paquereau (jimmy.paquereau@emiagic.com)  | Contributors: Jimmy Paquereau, Anthony PORTALES | This file is part of Mix-IT© framework. For the full copyright and license information, please view the "license" file that was distributed with this source code and EMIAGIC general terms and conditions: https://www.emiagic.com/pdf/cgv.pdf. */

/* === Font === */

@font-face{
	font-family: montserrat;
	src: local(montserrat), url("/core/font/montserrat.ttf");
}

@media (max-width: 400px) {
    html, body { font-size: calc(0.80 * var(--em)); }
}
@media (min-width: 400px) and (max-width: 600px) {
    html, body { font-size: calc(0.84 * var(--em)); }
}
@media (min-width: 600px) and (max-width: 800px) {
    html, body { font-size: calc(0.87 * var(--em)); }
}
@media (min-width: 800px) and (max-width: 1000px) {
    html, body { font-size: calc(0.90 * var(--em)); }
}
@media (min-width: 1000px) and (max-width: 1200px) {
    html, body { font-size: calc(0.92 * var(--em)); }
}
@media (min-width: 1200px) and (max-width: 1400px) {
    html, body { font-size: calc(0.95 * var(--em)); }
}
@media (min-width: 1400px) and (max-width: 1600px) {
    html, body { font-size: calc(0.97 * var(--em)); }
}
@media (min-width: 1600px) and (max-width: 1800px) {
    html, body { font-size: calc(0.98 * var(--em)); }
}
@media (min-width: 1800px) and (max-width: 2000px) {
    html, body { font-size: calc(1.00 * var(--em)); }
}
@media (min-width: 2000px) and (max-width: 2200px) {
    html, body { font-size: calc(1.02 * var(--em)); }
}
@media (min-width: 2200px) and (max-width: 2400px) {
    html, body { font-size: calc(1.03 * var(--em)); }
}
@media (min-width: 2400px) and (max-width: 2600px){
    html, body { font-size: calc(1.05 * var(--em)); }
}
@media (min-width: 2600px){
    html, body { font-size: calc(1.06 * var(--em)); }
}

/* === Animations === */

@keyframes wait{ 0%{ opacity: 0; } 100%{ opacity: 0; } }
@keyframes rotx360{ 0%{ transform: rotateX(0); } 100%{ transform: rotateX(360deg); } }
@keyframes roty360{ 0%{ transform: rotateY(0); } 100%{ transform: rotateY(360deg); } }
@keyframes rotz360{ 0%{ transform: rotateZ(0); } 100%{ transform: rotateZ(360deg); } }
@keyframes trt2b{ 0%{ position: relative; bottom: 100%; } 100%{ position: relative; bottom: 0; } }
@keyframes trb2t{ 0%{ position: relative; top: 100%; } 100%{ position: relative; top: 0; } }
@keyframes trl2r{ 0%{ position: relative; right: 100%; } 100%{ position: relative; right: 0; } }
@keyframes trr2l{ 0%{ position: relative; left: 100%; } 100%{ position: relative; left: 0; } }
@keyframes fadein{ 0%{ opacity: 0; } 100%{ opacity: 1; } }
@keyframes fadeout{ 0%{ opacity: 1; } 100%{ opacity: 0; } }

/* === Global === */

::-webkit-scrollbar{ width: var(--scroll-size); height: var(--scroll-size); }
::-webkit-scrollbar-track{ background: var(--scroll-track); }
::-webkit-scrollbar-thumb{ background: var(--scroll-thumb); }
::-webkit-scrollbar-thumb:hover{ background: var(--scroll-over); }

html{ overflow: auto; }
html, body{ width: 100%; height: 100%; padding: 0; margin: 0; display: block; font-family: var(--font); }
*{ padding: 0; margin: 0; box-sizing: border-box; }
*:focus{ outline: 1px dashed #000; }
*[tabindex="-1"]{ outline: none; }
div,header,section,article,nav,ul,li,footer,p{ display: block; }

/* === Titles === */

h1,h2,h3,h4,h5,h6{ display: block; width: 100%; }
h1{ font-size: var(--h1-size); font-family: var(--h1-font); color: var(--h1-color); font-weight: var(--h1-weight); font-style: var(--h1-style); text-decoration: var(--h1-decoration); text-align: var(--h1-align); }
h2{ font-size: var(--h2-size); font-family: var(--h2-font); color: var(--h2-color); font-weight: var(--h2-weight); font-style: var(--h2-style); text-decoration: var(--h2-decoration); text-align: var(--h2-align); }
h3{ font-size: var(--h3-size); font-family: var(--h3-font); color: var(--h3-color); font-weight: var(--h3-weight); font-style: var(--h3-style); text-decoration: var(--h3-decoration); text-align: var(--h3-align); }
h4{ font-size: var(--h4-size); font-family: var(--h4-font); color: var(--h4-color); font-weight: var(--h4-weight); font-style: var(--h4-style); text-decoration: var(--h4-decoration); text-align: var(--h4-align); }
h5{ font-size: var(--h5-size); font-family: var(--h5-font); color: var(--h5-color); font-weight: var(--h5-weight); font-style: var(--h5-style); text-decoration: var(--h5-decoration); text-align: var(--h5-align); }
h6{ font-size: var(--h6-size); font-family: var(--h6-font); color: var(--h6-color); font-weight: var(--h6-weight); font-style: var(--h6-style); text-decoration: var(--h6-decoration); text-align: var(--h6-align); }

/* === Misc === */

dialog{ border: none; }
table{ border-collapse: collapse; border-spacing: 0; }
mtd{ padding: .125em; }

/* === Links === */

a{ cursor: pointer; font-weight: normal; color: #000; text-decoration: none; }
a[disabled]{ cursor: not-allowed; }

/* === Icons === */

.icon{ 
	cursor: pointer; 
	height: var(--icon-size); width: var(--icon-size); flex: 0 0 var(--icon-size); 
	opacity: var(--icon-opacity); transform: var(--icon-transform); 
	filter: var(--icon-filter); outline: var(--icon-outline);  border: var(--icon-border); 
	border-radius: var(--icon-radius); transition: var(--icon-transition); 
	background-size: var(--icon-image); background-repeat: no-repeat; background-position: center center;
}
.icon:hover{ 
	background-size: var(--icon-over-image); transform: var(--icon-over-transform); 
	opacity: var(--icon-over-opacity); filter: var(--icon-over-filter); 
	outline: var(--icon-over-outline); border: var(--icon-over-border); 
}
.icon:focus{ 
	background-size: var(--icon-focus-image); transform: var(--icon-focus-transform); 
	opacity: var(--icon-focus-opacity); filter: var(--icon-focus-filter); 
	outline: var(--icon-focus-outline); border: var(--icon-focus-border); 
}
.icon[disabled]{ 
	cursor: not-allowed; background-size: var(--icon-disabled-image); transform: var(--icon-disabled-transform); 
	opacity: var(--icon-disabled-opacity); filter: var(--icon-disabled-filter); 
	outline: var(--icon-disabled-outline); border: var(--icon-disabled-border); 
}
.mi-zoom .icon {
    height: min(calc(12 * var(--icon-size)), 100%);
    width: min(calc(12 * var(--icon-size)), 100%);
    flex: 0 0 min(calc(12 * var(--icon-size)), 100%);
}

/* === Buttons === */

button, .button{ 
	display: inline-flex; align-items: center; justify-content: center;
	position: relative; text-align: center; padding: 0em var(--button-padding); 
	cursor: pointer; white-space: nowrap; text-decoration: none; height: var(--button-height); 
	color: var(--button-color); background: var(--button-background); 
	border-radius: var(--button-radius); border: var(--button-border); outline: var(--button-outline); 
	opacity: var(--button-opacity); filter: var(--button-filter); box-shadow: var(--button-shadow); 
	transition: var(--button-transition); font-weight: var(--button-weight); 
	font-family: var(--button-font);
}
button:hover, .button:hover{ 
	color: var(--button-over-color); background: var(--button-over-background); 
	border: var(--button-over-border); outline: var(--button-over-outline); 
	opacity: var(--button-over-opacity); filter: var(--button-over-filter); 
	box-shadow: var(--button-over-shadow); font-weight: var(--button-over-weight);
}
button:focus, .button:focus{ 
	color: var(--button-focus-color); background: var(--button-focus-background); 
	border: var(--button-focus-border); outline: var(--button-focus-outline); 
	opacity: var(--button-focus-opacity); filter: var(--button-focus-filter); 
	box-shadow: var(--button-focus-shadow); font-weight: var(--button-focus-weight);
}
button[disabled], .button[disabled]{ 
	cursor: not-allowed; box-shadow: var(--button-disabled-shadow); 
	color: var(--button-disabled-color); background: var(--button-disabled-background); 
	border: var(--button-disabled-border); outline: var(--button-disabled-outline);
	opacity: var(--button-disabled-opacity); filter: var(--button-disabled-filter); 
	font-weight: var(--button-disabled-weight);
}

button:before, .button:before, button:after, .button:after{ 
	content: ""; display: none; vertical-align: middle; 
	background-repeat: no-repeat; background-position: center center; 
	height: var(--button-icon-size); width: var(--button-icon-size); 
	flex: 0 0 var(--button-icon-size); transform: var(--button-icon-transform); 
	background-size: var(--button-icon-image); opacity: var(--button-icon-opacity); 
	filter: var(--button-icon-filter); 
}
button:hover:before, .button:hover:before, button:hover:after, .button:hover:after{ 
	transform: var(--button-icon-over-transform); 
	background-size: var(--button-icon-over-image); opacity: var(--button-icon-over-opacity); 
	filter: var(--button-icon-over-filter); 
}
button:focus:before, .button:focus:before, button:focus:after, .button:focus:after{ 
	transform: var(--button-icon-focus-transform); 
	background-size: var(--button-icon-focus-image); opacity: var(--button-icon-focus-opacity); 
	filter: var(--button-icon-focus-filter); 
}
button[disabled]:before, .button[disabled]:before, button[disabled]:after, .button[disabled]:after{ 
	transform: var(--button-icon-disabled-transform); 
	background-size: var(--button-icon-disabled-image); opacity: var(--button-icon-disabled-opacity); 
	filter: var(--button-icon-disabled-filter); 
}
button:empty, .button:empty{ 
	width: var(--button-height); flex: 0 0 var(--button-height); 
}
button:not(:empty):before, .button:not(:empty):before{ 
	margin-right: calc(0.25 * var(--button-height) - 0.25em); 
}
button:not(:empty):after, .button:not(:empty):after{ 
	margin-left: calc(0.25 * var(--button-height) - 0.25em); 
}
button:not(:empty):before, .button:not(:empty):before{ margin-right: .5em; }
button:not(:empty):after, .button:not(:empty):after{ margin-left: .5em; }

/* === Fields === */

input, button, select, textarea{ font-size: 1em; }
fieldset{ border: none; }

.input{ display: flex; align-items: center; position: relative; overflow: hidden; }
.input>.input, .input>input, .input>select, .input>textarea,
.input>.input:focus, .input>input:focus, .input>select:focus, .input>textarea:focus,
.input>.input:hover, .input>input:hover, .input>select:hover, .input>textarea:hover{ 
	border-top: none; border-bottom: none; outline: none; border-radius: 0; 
}
.input>.input:first-child, .input>input:first-child, .input>select:first-child, .input>textarea:first-child{ 
	border-left: none; 
}
.input>.input:last-child, .input>input:last-child, .input>select:last-child, .input>textarea:last-child{ 
	border-right: none; 
}
.input>*:first-child{ margin-left: calc(-1 * var(--input-padding)); }
.input>*:first-child[type="checkbox"]{ margin-left: 0; }
.input>*:first-child[type="radio"]{ margin-left: 0; }
.input>*:last-child{ margin-right: calc(-1 * var(--input-padding)); }
.input>*:last-child[type="checkbox"]{ margin-right: 0; }
.input>*:last-child[type="radio"]{ margin-right: 0; }
.input:before, .input:after{ 
	content: ""; display: none; vertical-align: middle; position: absolute; top: 0;
	background-repeat: no-repeat; background-position: center center; 
	height: 100%; width: var(--input-height); flex: 0 0 var(--input-height); 
	background-size: var(--input-icon);
}
.input>.icon, .input>.icon:hover, .input>.icon:focus, .input>.icon[disabled]{ 
	height: 100%; width: var(--input-height); flex: 0 0 var(--input-height); 
	background-size: var(--input-icon) var(--input-icon);
}
.input>.icon:focus{ height: calc(100% - 2px); }
.input>.icon:focus:first-child{ margin-left: calc(-1 * var(--input-padding) + 1px); }
.input>.icon:focus:last-child{ margin-right: calc(-1 * var(--input-padding) + 1px); }
.input[class*="-before"]{ padding-left: calc(var(--input-height) + var(--input-padding)); }
.input[class*="-after"]{ padding-right: calc(var(--input-height) + var(--input-padding)); }
.input:before{ left: 0; border-right: var(--input-separator); }
.input:after{ right: 0; border-left: var(--input-separator); }
.input:hover:before{ border-right: var(--input-over-separator); }
.input:hover:after{ border-left: var(--input-over-separator); }
.input:focus:before{ border-right: var(--input-focus-separator); }
.input:focus:after{ border-left: var(--input-focus-separator); }
.input[disabled]:before{ border-right: var(--input-disabled-separator); }
.input[disabled]:after{ border-left: var(--input-disabled-separator); }

.input, input, select, textarea{ 
	resize: none; cursor: default; font-family: var(--font); 
	height: var(--input-height); padding: 0em var(--input-padding); 
	transition: var(--input-transition);
	color: var(--input-color); background: var(--input-background); 
	border: var(--input-border); outline: var(--input-outline); 
	border-radius: var(--input-radius); box-shadow: var(--input-shadow); 
	opacity: var(--input-opacity); filter: var(--input-filter); 
}
input[type="text"], textarea, [contenteditable="true"]{ cursor: text; }
.input:hover, input:hover, select:hover, textarea:hover{ 
	color: var(--input-over-color); background: var(--input-over-background); 
	border: var(--input-over-border); outline: var(--input-over-outline); 
	box-shadow: var(--input-over-shadow);
	opacity: var(--input-over-opacity); filter: var(--input-over-filter); 
}
.input:focus, input:focus, select:focus, textarea:focus{ 
	color: var(--input-focus-color); background: var(--input-focus-background); 
	border: var(--input-focus-border); outline: var(--input-focus-outline); 
	box-shadow: var(--input-focus-shadow); 
	opacity: var(--input-focus-opacity); filter: var(--input-focus-filter); 
	position: relative; z-index: 1;
}
.input[disabled], input[disabled], select[disabled], textarea[disabled]{ 
	cursor: not-allowed; 
	color: var(--input-disabled-color); background: var(--input-disabled-background); 
	border: var(--input-disabled-border); outline: var(--input-disabled-outline); 
	box-shadow: var(--input-disabled-shadow); 
	opacity: var(--input-disabled-opacity); filter: var(--input-disabled-filter); 
}
input[type="checkbox"], input[type="radio"]{ border: none; background: none; padding: 0; height: auto; }
input[type="color"]{ padding: 0; }
textarea{ padding: var(--input-padding); }

/* === Predefined === */

.sr-only{ border: 0 !important; clip: rect(1px, 1px, 1px, 1px) !important; -webkit-clip-path: inset(50%) !important; }
.sr-only{ clip-path: inset(50%) !important; height: 1px !important; overflow: hidden !important; padding: 0 !important; }
.sr-only{ position: absolute !important; width: 1px !important; white-space: nowrap !important; }

.off{ display: none !important; }

.color-none, .bg-none, .img-none{ background: url(/core/img/none/color.png) no-repeat center center / cover; }

.space{ display: block; width: 100%; }
.space.xxs{ display: block; width: 100%; height: .25em; }
.space.xs{ display: block; width: 100%; height: .5em; }
.space.s{ display: block; width: 100%; height: 1em; }
.space.m{ display: block; width: 100%; height: 2em; }
.space.l{ display: block; width: 100%; height: 3.5em; }
.space.xl{ display: block; width: 100%; height: 5em; }
.space.xxl{ display: block; width: 100%; height: 10em; }

.x1{ width: 1% !important; } .x2{ width: 2% !important; } .x3{ width: 3% !important; } 
.x4{ width: 4% !important; } .x5{ width: 5% !important; } .x6{ width: 6% !important; } 
.x7{ width: 7% !important; } .x8{ width: 8% !important; } .x9{ width: 9% !important; } 
.x10{ width: 10% !important; } .x11{ width: 11% !important; } .x12{ width: 12% !important; } 
.x13{ width: 13% !important; } .x14{ width: 14% !important; } .x15{ width: 15% !important; } 
.x16{ width: 16% !important; } .x17{ width: 17% !important; } .x18{ width: 18% !important; } 
.x19{ width: 19% !important; } .x20{ width: 20% !important; } .x25{ width: 25% !important; } 
.x30{ width: 30% !important; } .x33{ width: 33.33% !important; } .x35{ width: 35% !important; } .x40{ width: 40% !important; } 
.x45{ width: 45% !important; } .x50{ width: 50% !important; } .x55{ width: 55% !important; } 
.x60{ width: 60% !important; } .x65{ width: 65% !important; } .x70{ width: 70% !important; } 
.x75{ width: 75% !important; } .x80{ width: 80% !important; } .x85{ width: 85% !important; } 
.x90{ width: 90% !important; } .x95{ width: 95% !important; } .x100{ width: 100% !important; }
.y1{ height: 1% !important; } .y2{ height: 2% !important; } .y3{ height: 3% !important; } 
.y4{ height: 4% !important; } .y5{ height: 5% !important; } .y6{ height: 6% !important; } 
.y7{ height: 7% !important; } .y8{ height: 8% !important; } .y9{ height: 9% !important; } 
.y10{ height: 10% !important; } .y11{ height: 11% !important; } .y12{ height: 12% !important; } 
.y13{ height: 13% !important; } .y14{ height: 14% !important; } .y15{ height: 15% !important; } 
.y16{ height: 16% !important; } .y17{ height: 17% !important; } .y18{ height: 18% !important; } 
.y19{ height: 19% !important; } .y20{ height: 20% !important; } .y25{ height: 25% !important; } 
.y30{ height: 30% !important; } .y35{ height: 35% !important; } .y40{ height: 40% !important; } 
.y45{ height: 45% !important; } .y50{ height: 50% !important; } .y55{ height: 55% !important; } 
.y60{ height: 60% !important; } .y65{ height: 65% !important; } .y70{ height: 70% !important; } 
.y75{ height: 75% !important; } .y80{ height: 80% !important; } .y85{ height: 85% !important; } 
.y90{ height: 90% !important; } .y95{ height: 95% !important; } .y100{ height: 100% !important; }
.f1{ flex: 0 0 1% !important; } .f2{ flex: 0 0 2% !important; } .f3{ flex: 0 0 3% !important; } 
.f4{ flex: 0 0 4% !important; } .f5{ flex: 0 0 5% !important; } .f6{ flex: 0 0 6% !important; } 
.f7{ flex: 0 0 7% !important; } .f8{ flex: 0 0 8% !important; } .f9{ flex: 0 0 9% !important; } 
.f10{ flex: 0 0 10% !important; } .f11{ flex: 0 0 11% !important; } .f12{ flex: 0 0 12% !important; } 
.f13{ flex: 0 0 13% !important; } .f14{ flex: 0 0 14% !important; } .f15{ flex: 0 0 15% !important; } 
.f16{ flex: 0 0 16% !important; } .f17{ flex: 0 0 17% !important; } .f18{ flex: 0 0 18% !important; } 
.f19{ flex: 0 0 19% !important; } .f20{ flex: 0 0 20% !important; } .f25{ flex: 0 0 25% !important; } 
.f30{ flex: 0 0 30% !important; } .f33{ flex: 0 0 33.33% !important; } .f35{ flex: 0 0 35% !important; } .f40{ flex: 0 0 40% !important; } 
.f45{ flex: 0 0 45% !important; } .f50{ flex: 0 0 50% !important; } .f55{ flex: 0 0 55% !important; } 
.f60{ flex: 0 0 60% !important; } .f65{ flex: 0 0 65% !important; } .f70{ flex: 0 0 70% !important; } 
.f75{ flex: 0 0 75% !important; } .f80{ flex: 0 0 80% !important; } .f85{ flex: 0 0 85% !important; } 
.f90{ flex: 0 0 90% !important; } .f95{ flex: 0 0 95% !important; } .f100{ flex: 0 0 100% !important; }
.x1em{ width: 1em !important; } .x2em{ width: 2em !important; } .x3em{ width: 3em !important; } 
.x4em{ width: 4em !important; } .x5em{ width: 5em !important; } .x6em{ width: 6em !important; } 
.x7em{ width: 7em !important; } .x8em{ width: 8em !important; } .x9em{ width: 9em !important; } 
.x10em{ width: 10em !important; } .x11em{ width: 11em !important; } .x12em{ width: 12em !important; } 
.x13em{ width: 13em !important; } .x14em{ width: 14em !important; } .x15em{ width: 15em !important; } 
.x16em{ width: 16em !important; } .x17em{ width: 17em !important; } .x18em{ width: 18em !important; } 
.x19em{ width: 19em !important; } .x20em{ width: 20em !important; } .x25em{ width: 25em !important; } 
.x30em{ width: 30em !important; } .x35em{ width: 35em !important; } .x40em{ width: 40em !important; } 
.x45em{ width: 45em !important; } .x50em{ width: 50em !important; } .x55em{ width: 55em !important; } 
.x60em{ width: 60em !important; } .x65em{ width: 65em !important; } .x70em{ width: 70em !important; } 
.x75em{ width: 75em !important; } .x80em{ width: 80em !important; } .x85em{ width: 85em !important; } 
.x90em{ width: 90em !important; } .x95em{ width: 95em !important; } .x100em{ width: 100em !important; }
.y1em{ height: 1em !important; } .y2em{ height: 2em !important; } .y3em{ height: 3em !important; } 
.y4{ height: 4em !important; } .y5{ height: 5em !important; } .y6{ height: 6em !important; } 
.y7{ height: 7em !important; } .y8{ height: 8em !important; } .y9{ height: 9em !important; } 
.y10{ height: 10em !important; } .y11em{ height: 11em !important; } .y12em{ height: 12em !important; } 
.y13em{ height: 13em !important; } .y14em{ height: 14em !important; } .y15em{ height: 15em !important; } 
.y16em{ height: 16em !important; } .y17em{ height: 17em !important; } .y18em{ height: 18em !important; } 
.y19em{ height: 19em !important; } .y20em{ height: 20em !important; } .y25em{ height: 25em !important; } 
.y30em{ height: 30em !important; } .y35em{ height: 35em !important; } .y40em{ height: 40em !important; } 
.y45em{ height: 45em !important; } .y50em{ height: 50em !important; } .y55em{ height: 55em !important; } 
.y60em{ height: 60em !important; } .y65em{ height: 65em !important; } .y70em{ height: 70em !important; } 
.y75em{ height: 75em !important; } .y80em{ height: 80em !important; } .y85em{ height: 85em !important; } 
.y90em{ height: 90em !important; } .y95em{ height: 95em !important; } .y100em{ height: 100em !important; }
.f1em{ flex: 0 0 1em !important; } .f2em{ flex: 0 0 2em !important; } .f3em{ flex: 0 0 3em !important; } 
.f4em{ flex: 0 0 4em !important; } .f5em{ flex: 0 0 5em !important; } .f6em{ flex: 0 0 6em !important; } 
.f7em{ flex: 0 0 7em !important; } .f8em{ flex: 0 0 8em !important; } .f9em{ flex: 0 0 9em !important; } 
.f10em{ flex: 0 0 10em !important; } .f11em{ flex: 0 0 11em !important; } .f12em{ flex: 0 0 12em !important; } 
.f13em{ flex: 0 0 13em !important; } .f14em{ flex: 0 0 14em !important; } .f15em{ flex: 0 0 15em !important; } 
.f16em{ flex: 0 0 16em !important; } .f17em{ flex: 0 0 17em !important; } .f18em{ flex: 0 0 18em !important; } 
.f19em{ flex: 0 0 19em !important; } .f20em{ flex: 0 0 20em !important; } .f21em{ flex: 0 0 21em !important; } 
.f22em{ flex: 0 0 22em !important; } .f23em{ flex: 0 0 23em !important; } .f24em{ flex: 0 0 24em !important; } 
.f25em{ flex: 0 0 25em !important; } .f26em{ flex: 0 0 26em !important; } .f27em{ flex: 0 0 27em !important; }
.f28em{ flex: 0 0 28em !important; } .f29em{ flex: 0 0 29em !important; } .f30em{ flex: 0 0 30em !important; } 
.f35em{ flex: 0 0 35em !important; } .f40em{ flex: 0 0 40em !important; } .f45em{ flex: 0 0 45em !important; } 
.f50em{ flex: 0 0 50em !important; } .f55em{ flex: 0 0 55em !important; } .f60em{ flex: 0 0 60em !important; } 
.f65em{ flex: 0 0 65em !important; } .f70em{ flex: 0 0 70em !important; } .f75em{ flex: 0 0 75em !important; } 
.f80em{ flex: 0 0 80em !important; } .f85em{ flex: 0 0 85em !important; } .f90em{ flex: 0 0 90em !important; } 
.f95em{ flex: 0 0 95em !important; } .f100em{ flex: 0 0 100em !important; }
.m1em{ min-height: 1em !important; } .m2em{ min-height: 2em !important; } .m3em{ min-height: 3em !important; } 
.m4{ min-height: 4em !important; } .m5{ min-height: 5em !important; } .m6{ min-height: 6em !important; } 
.m7{ min-height: 7em !important; } .m8{ min-height: 8em !important; } .m9{ min-height: 9em !important; } 
.m10{ min-height: 10em !important; } .m11em{ min-height: 11em !important; } .m12em{ min-height: 12em !important; } 
.m13em{ min-height: 13em !important; } .m14em{ min-height: 14em !important; } .m15em{ min-height: 15em !important; } 
.m16em{ min-height: 16em !important; } .m17em{ min-height: 17em !important; } .m18em{ min-height: 18em !important; } 
.m19em{ min-height: 19em !important; } .m20em{ min-height: 20em !important; } .m25em{ min-height: 25em !important; } 
.m30em{ min-height: 30em !important; } .m35em{ min-height: 35em !important; } .m40em{ min-height: 40em !important; } 
.m45em{ min-height: 45em !important; } .m50em{ min-height: 50em !important; } .m55em{ min-height: 55em !important; } 
.m60em{ min-height: 60em !important; } .m65em{ min-height: 65em !important; } .m70em{ min-height: 70em !important; } 
.m75em{ min-height: 75em !important; } .m80em{ min-height: 80em !important; } .m85em{ min-height: 85em !important; } 
.m90em{ min-height: 90em !important; } .m95em{ min-height: 95em !important; } .m100em{ min-height: 100em !important; }
.w100{ width: 100% !important; } .w80{ width: 80% !important; } .w75{ width: 75% !important; }
.w66{ width: 66.66% !important; } .w60{ width: 60% !important; } .w50{ width: 50% !important; } 
.w40{ width: 40% !important; } .w33{ width: 33.33% !important; } .w25{ width: 25% !important; } 
.w20{ width: 20% !important; } 
.vw100{ width: 100vw !important; } .vw80{ width: 80vw !important; } .vw75{ width: 75vw !important; }
.vw66{ width: 66.66vw !important; } .vw60{ width: 60vw !important; } .vw50{ width: 50vw !important; } 
.vw40{ width: 40vw !important; } .vw33{ width: 33.33vw !important; } .vw25{ width: 25vw !important; } 
.vw20{ width: 20vw !important; } 
.h100{ height: 100% !important; }
.vh100{ height: 100vh !important; } .vh80{ height: 80vh !important; } .vh75{ height: 75vh !important; }
.vh66{ height: 66.66vh !important; } .vh60{ height: 60vh !important; } .vh50{ height: 50vh !important; } 
.vh40{ height: 40vh !important; } .vh33{ height: 33.33vh !important; } .vh25{ height: 25vh !important; }
.vh20{ height: 20vh !important; } 
.h0em25{ height: .25em !important; } .h0em5{ height: .5em !important; } .h0em75{ height: .75em !important; }
.h1em25{ height: 1.25em !important; } .h1em5{ height: 1.5em !important; } .h1em75{ height: 1.75em !important; }
.h1em{ height: 1em !important; } .h2em{ height: 2em !important; } .h3em{ height: 3em !important; }
.h4em{ height: 4em !important; } .h5em{ height: 5em !important; } .h6em{ height: 6em !important; }
.h7em{ height: 7em !important; } .h8em{ height: 8em !important; } .h9em{ height: 9em !important; }
.h10em{ height: 10em !important; } .h11em{ height: 11em !important; } .h12em{ height: 12em !important; }
.h13em{ height: 13em !important; } .h14em{ height: 14em !important; } .h15em{ height: 15em !important; }
.h20em{ height: 20em !important; } .h25em{ height: 25em !important; } .h30em{ height: 30em !important; }
.h35em{ height: 35em !important; } .h40em{ height: 40em !important; } .h45em{ height: 45em !important; }
.h50em{ height: 50em !important; } .h55em{ height: 55em !important; } .h60em{ height: 60em !important; }
.w1em{ width: 1em !important; } .w2em{ width: 2em !important; } .w3em{ width: 3em !important; }
.w4em{ width: 4em !important; } .w5em{ width: 5em !important; } .w6em{ width: 6em !important; }
.w7em{ width: 7em !important; } .w8em{ width: 8em !important; } .w9em{ width: 9em !important; }
.w10em{ width: 10em !important; } .w11em{ width: 11em !important; } .w12em{ width: 12em !important; }
.w13em{ width: 13em !important; } .w14em{ width: 14em !important; } .w15em{ width: 15em !important; }
.w20em{ width: 20em !important; } .w25em{ width: 25em !important; } .w30em{ width: 30em !important; }
.w35em{ width: 35em !important; } .w40em{ width: 40em !important; } .w45em{ width: 45em !important; }
.w50em{ width: 50em !important; } .w55em{ width: 55em !important; } .w60em{ width: 60em !important; }
.hw1em{ height: 1em !important; width: 1em !important; } .hw2em{ height: 2em !important; width: 2em !important; } 
.hw3em{ height: 3em !important; width: 3em !important; } .hw4em{ height: 4em !important; width: 4em !important; } 
.hw5em{ height: 5em !important; width: 5em !important; } .hw6em{ height: 6em !important; width: 6em !important; }
.hw7em{ height: 7em !important; width: 7em !important; } .hw8em{ height: 8em !important; width: 8em !important; } 
.hw9em{ height: 9em !important; width: 9em !important; } .hw10em{ height: 10em !important; width: 10em !important; } 
.hw11em{ height: 11em !important; width: 11em !important; } .hw12em{ height: 12em !important; width: 12em !important; }
.hw13em{ height: 13em !important; width: 13em !important; } .hw14em{ height: 14em !important; width: 14em !important; } 
.hw15em{ height: 15em !important; width: 15em !important; } .hw20em{ height: 20em !important; width: 20em !important; } 
.hw25em{ height: 25em !important; width: 25em !important; } .hw30em{ height: 30em !important; width: 30em !important; }
.hw35em{ height: 35em !important; width: 35em !important; } .hw40em{ height: 40em !important; width: 40em !important; } 
.hw45em{ height: 45em !important; width: 45em !important; } .hw50em{ height: 50em !important; width: 50em !important; } 
.hw55em{ height: 55em !important; width: 55em !important; } .hw60em{ height: 60em !important; width: 60em !important; }
.fit{ flex-grow: 0 !important; flex-basis: fit-content !important; }
.fill{ flex-grow: 1 !important; flex-basis: 0 !important; }

.rfloat{ float: right !important; } 
.lfloat{ float: left !important; } 
.mauto{ margin: auto !important; }
.table{ display: table !important; }
.tfixed{ table-layout: fixed !important; }
.cell{ display: table-cell !important; }
.vtop{ vertical-align: top !important; }
.vcenter,.vmiddle{ vertical-align: middle !important; }
.vbottom{ vertical-align: bottom !important; }
.hleft{ text-align: left !important; }
.hcenter{ text-align: center !important; margin: auto !important; }
.hright{ text-align: right; }
.hjustify{ text-align: justify; }
.vhcenter,.hvcenter{ vertical-align: middle !important; text-align: center !important; }
.mauto{ margin: auto !important; }
.ohidden{ overflow: hidden !important; }
.oauto{ overflow: auto !important; }
.oxauto{ overflow-x: auto !important; overflow-y: hidden !important; }
.oyauto{ overflow-y: auto !important; overflow-x: hidden !important; }
.tellipsis{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nowrap{ white-space: nowrap; }
.inline{ display: inline !important; }
.inblock{ display: inline-block !important; }
.grab{ cursor: grab !important; cursor: -webkit-grab !important; }
.grabbing{ cursor: grabbing !important; cursor: -webkit-grabbing !important; }

.top{ vertical-align: top !important; } .middle{ vertical-align: middle !important; } 
.bottom{ vertical-align: bottom !important; } .left{ text-align: left !important; }  
.center{ text-align: center !important; } .center>*{ margin: auto !important; }
.right{ text-align: right !important; } .justify{ text-align: justify !important; } 
.tleft{ vertical-align: top !important; text-align: left !important; } 
.tcenter{ vertical-align: top !important; text-align: center !important; } 
.tcenter>*{ margin-left: auto !important; margin-right: auto !important; } 
.tright{ vertical-align: top !important; text-align: right !important; } 
.mleft{ vertical-align: middle !important; text-align: left !important; } 
.mcenter{ vertical-align: middle !important; text-align: center !important; } 
.mcenter>*{ margin-left: auto !important; margin-right: auto !important; } 
.mright{ vertical-align: middle !important; text-align: right !important; } 
.bleft{ vertical-align: bottom !important; text-align: left !important; } 
.bcenter{ vertical-align: bottom !important; text-align: center !important; } 
.bcenter>*{ margin-left: auto !important; margin-right: auto !important; } 
.bright{ vertical-align: bottom !important; text-align: right !important; }
.contain{ background-repeat: no-repeat !important; background-position: center center !important; background-size: contain !important; }
.cover{ background-repeat: no-repeat !important; background-position: center center !important; background-size: cover !important; }
.fixed{ background-attachment: fixed !important; }
.astart{ align-items: flex-start !important; }
.acenter{ align-items: center !important; }
.aend{ align-items: flex-end !important; }
.jstart{ justify-content: flex-start !important; }
.jcenter{ justify-content: center !important; }
.jend{ justify-content: flex-end !important; }

/* === Widgets layers (minimals) === */

.mi-editor-view>*{ margin-bottom: var(--s4x); }
.mi-editor-view>*:last-child{ margin-bottom: 0; }
.mi-editor-view br{ display: block; content: ""; height: var(--s1x); }
/*.mi-richtext-body>*{ margin-bottom: var(--s1x); }
.mi-richtext-body>*:last-child{ margin-bottom: 0; }
p>*{ margin-bottom: var(--s1x); }
p>*:last-child{ margin-bottom: 0; }*/

@media (max-width: 1200px){
	.mi-editor-view>*{ margin-bottom: var(--s2x); }
	.mi-editor-view>*:last-child{ margin-bottom: 0; }
}

.section, .blackout, .whiteout{ padding: 3em; margin: 0; hyphens: auto; }
.section:focus, .blackout:focus, .whiteout:focus{ position: relative; z-index: 1; }
.section>*, .blackout>*, .whiteout>*{ margin-bottom: var(--s4x); }
.section>*:last-child, .blackout>*:last-child, .whiteout>*:last-child{ margin-bottom: 0; }
.section-center, .blackout-center, .whiteout-center{ margin: auto; width: min(100%, 60em); }
.section-center>*, .blackout-center>*, .whiteout-center>*{ margin-bottom: var(--s4x); }
.section-center>*:last-child, .blackout-center>*:last-child, .whiteout-center>*:last-child{ margin-bottom: 0; }

@media (max-width: 1200px){
	.section, .blackout, .whiteout{ padding: 1.5em; }
	.section>*, .blackout>*, .whiteout>*{ margin-bottom: var(--s2x); }
	.section-center>*, .blackout-center>*, .whiteout-center>*{ margin-bottom: var(--s2x); }
}

.split{ display: flex; width: 100%; }
.split>*{ display: flex; flex-direction: column; padding: 0em 1em; flex-grow: 1; flex-basis: 0; }
.split>*:first-child{ padding-left: 0em; }
.split>*:last-child{ padding-right: 0em; }
.split>*>*{ text-align: justify; margin-bottom: var(--s2x); }
.split>*>*:last-child{ text-align: justify; margin-bottom: 0; }

@media (max-width: 1200px){
	.split{ flex-direction: column; }
	.split>*{ padding: 1em 0em; }
	.split>*:first-child{ padding-top: 0em; }
	.split>*:last-child{ padding-bottom: 0em; }
}

.dotlist{ padding-left: 1.125em; text-align: left; }
.dotlist>*{ display: list-item; margin-bottom: var(--s1x); }
.dotlist>*:last-child{ margin-bottom: 0em; }
.dotlist>*>*{ margin-bottom: var(--s1x); }
.dotlist>*>*:last-child{ margin-bottom: 0; }
.disclist{ list-style-type: disc; }
.squarelist{ list-style-type: square; }
.circlelist{ list-style-type: circle; }
.icolist>*{ padding-left: 1.5em; margin-bottom: var(--s1x); line-height: 1.25em; }
.icolist>*:last-child{ margin-bottom: 0; }
.icolist>*>*{ margin-bottom: var(--s1x); }
.icolist>*>*:last-child{ margin-bottom: 0; }
.icolist>*{ background: url(/core/img/media/image.png) no-repeat left center / 1em 1em; }
.checklist>*{ background-image: var(--success-icon); }

.ilist{ width: 100%; }
.ilist-row{ display: table; width: 100%; margin-bottom: var(--s1x); }
.ilist-row:last-child{ margin-bottom: 0; }
.ilist-row>*{ display: table-cell; vertical-align: middle; }
.ilist-row>*:first-child{ padding-right: .75em; }
.ilist-row>*:last-child{ width: 100%; }
.ilist-row>*:first-child>img{ height: 2em; display: block; }
.ilist-row>*>*{ margin-bottom: var(--s1x); }
.ilist-row>*>*:last-child{ margin-bottom: 0; }

/* deprecated (use ilist) >>> */
.item-row{ display: table; width: 100%; margin-bottom: .5em; }
.item-row:last-child{ margin-bottom: 0em; }
.item-row>*{ display: table-cell; vertical-align: middle; }
.item-row>*:first-child{ width: 0%; padding-right: .5em; }
.item-row>*:last-child{ width: 100%; }
.item-icon>img{ width: 2em; }
.item-image>img{ width: 2em; }
/* <<< */

.table{ width: 100%; }
.tcell{ padding: .5em .75em; border: 1px solid #dcdcdc; }
.hcell{ text-align: center; background: #ececec; }
.bcell{ text-align: center; }

.title>*{ display: block; }
.title>*:last-child{ font-weight: normal; }
.title-h1{ font-size: var(--h1-size); font-family: var(--h1-font); color: var(--h1-color); font-weight: var(--h1-weight); font-style: var(--h1-style); text-decoration: var(--h1-decoration); text-align: var(--h1-align); }
.title-h2{ font-size: var(--h2-size); font-family: var(--h2-font); color: var(--h2-color); font-weight: var(--h2-weight); font-style: var(--h2-style); text-decoration: var(--h2-decoration); text-align: var(--h2-align); }
.title-h3{ font-size: var(--h3-size); font-family: var(--h3-font); color: var(--h3-color); font-weight: var(--h3-weight); font-style: var(--h3-style); text-decoration: var(--h3-decoration); text-align: var(--h3-align); }
.title-h4{ font-size: var(--h4-size); font-family: var(--h4-font); color: var(--h4-color); font-weight: var(--h4-weight); font-style: var(--h4-style); text-decoration: var(--h4-decoration); text-align: var(--h4-align); }
.title-h5{ font-size: var(--h5-size); font-family: var(--h5-font); color: var(--h5-color); font-weight: var(--h5-weight); font-style: var(--h5-style); text-decoration: var(--h5-decoration); text-align: var(--h5-align); }
.title-h6{ font-size: var(--h6-size); font-family: var(--h6-font); color: var(--h6-color); font-weight: var(--h6-weight); font-style: var(--h6-style); text-decoration: var(--h6-decoration); text-align: var(--h6-align); }
.title-h1+*{ font-size: var(--h3-size); font-family: var(--h3-font); color: var(--h3-color); font-weight: var(--h3-weight); font-style: var(--h3-style); text-decoration: var(--h3-decoration); text-align: var(--h1-align); }
.title-h2+*{ font-size: var(--h4-size); font-family: var(--h4-font); color: var(--h4-color); font-weight: var(--h4-weight); font-style: var(--h4-style); text-decoration: var(--h4-decoration); text-align: var(--h2-align); }
.title-h3+*{ font-size: var(--h5-size); font-family: var(--h5-font); color: var(--h5-color); font-weight: var(--h5-weight); font-style: var(--h5-style); text-decoration: var(--h5-decoration); text-align: var(--h3-align); }
.title-h4+*{ font-size: var(--h6-size); font-family: var(--h6-font); color: var(--h6-color); font-weight: var(--h6-weight); font-style: var(--h6-style); text-decoration: var(--h5-decoration); text-align: var(--h4-align); }
.title-h5+*{ font-size: var(--h7-size); font-family: var(--h7-font); color: var(--h7-color); font-weight: var(--h7-weight); font-style: var(--h7-style); text-decoration: var(--h7-decoration); text-align: var(--h5-align); }

.notice{ padding: 1em 1em 1em 4em; background: #ececec; }
.notice{ background-repeat: no-repeat; background-position: 1em center; background-size: 2em 2em; }
.notice.success{ background-color: var(--success-background); color: var(--success-color); background-image: var(--success-icon); }
.notice.error{ background-color: var(--error-background); color: var(--error-color); background-image: var(--error-icon); }
.notice.info{ background-color: var(--info-background); color: var(--info-color); background-image: var(--info-icon); }
.notice.warning{ background-color: var(--warning-background); color: var(--warning-color); background-image: var(--warning-icon); }
.notice.question{ background-color: var(--question-background); color: var(--question-color); background-image: var(--question-icon); }

.image{ width: 100%; text-align: center !important; margin-left: auto; margin-right: auto; }
.image>img{ margin: auto; height: 100%; }

.link{ 
	display: inline-flex; cursor: pointer;
	transition: var(--link-transition); color: var(--link-color); font-weight: var(--link-weight); 
	text-decoration: var(--link-decoration); 
}
.link:hover{ cursor: pointer; color: var(--link-over-color); font-weight: var(--link-over-weight); text-decoration: var(--link-over-decoration); }
.link:active{ color: var(--link-focus-color); font-weight: var(--link-focus-weight); text-decoration: var(--link-focus-decoration); }
.link:focus{ color: var(--link-focus-color); font-weight: var(--link-focus-weight); text-decoration: var(--link-focus-decoration); }
.hlink{ cursor: pointer; display: flex; align-items: center; justify-content: center; text-decoration: none; flex-direction: row; }
.hlink>*{ margin-right: .5em; }
.hlink>*:last-child{ margin-right: 0em; }
.vlink{ cursor: pointer; display: flex; align-items: center; justify-content: center; text-decoration: none; flex-direction: column; }
.vlink>*{ margin-bottom: .5em; }
.vlink>*:last-child{ margin-bottom: 0em; }