:root
{
    --cms-factor: 0.0625vw;

    /* success */
    --cms-success-color: #408040;
    --cms-success-background: #daf2da;

    /* error */
    --cms-error-color: #800000;
    --cms-error-background: #ffd9d9;

    /* general */
    --cms-color: #000000;
    --cms-color-alt: #ffffff;
    --cms-background: #ffffff;
    --cms-background-alt: #000000;
    --cms-font-family: "Open Sans", "Arial", sans-serif;
    --cms-font-size: max(17px, 17 * var(--cms-factor));
    --cms-font-weight: 300;
    --cms-line-height: 155%;

    /* link */
    --cms-link-color: #404040;
    --cms-link-color-alt: #404040;

    /* spacing */
    --cms-hpadding: max(10px, 10 * var(--cms-factor));
    --cms-vpadding: max(5px, 5 * var(--cms-factor));
    --cms-hspacing: max(25px, 25 * var(--cms-factor));
    --cms-vspacing: max(25px, 25 * var(--cms-factor));

    /* heading 1 */
    --cms-h1-color: inherit;
    --cms-h1-background: transparent;
    --cms-h1-font-family: inherit;
    --cms-h1-font-size: max(25px, 25 * var(--cms-factor));
    --cms-h1-font-weight: 900;
    --cms-h1-line-height: 125%;

    /* heading 2 */
    --cms-h2-color: inherit;
    --cms-h2-background: transparent;
    --cms-h2-font-family: inherit;
    --cms-h2-font-size: max(25px, 25 * var(--cms-factor));
    --cms-h2-font-weight: bold;
    --cms-h2-line-height: 125%;

    /* heading 3 */
    --cms-h3-color: inherit;
    --cms-h3-background: transparent;
    --cms-h3-font-family: inherit;
    --cms-h3-font-size: max(25px, 25 * var(--cms-factor));
    --cms-h3-font-weight: bold;
    --cms-h3-line-height: 125%;

    /* input */
    --cms-input-color: #000000;
    --cms-input-color-alt: #000000;
    --cms-input-background: #f6f6f6;
    --cms-input-background-alt: #f6f6f6;
    --cms-input-border: max(1px, var(--cms-factor)) dotted #b3b3b3;
    --cms-input-border-alt: max(1px, var(--cms-factor)) dotted #4d4d4d;

    /* checkbox */
    --cms-checkbox-color: transparent;
    --cms-checkbox-color-alt: #4d4d4d;
    --cms-checkbox-background: #f6f6f6;
    --cms-checkbox-background-alt: #f6f6f6;
    --cms-checkbox-border: max(1px, var(--cms-factor)) solid #b3b3b3;
    --cms-checkbox-border-alt: max(1px, var(--cms-factor)) solid #4d4d4d;

    /* button */
    --cms-button-color: #b3123f;
    --cms-button-color-alt: #ffffff;
    --cms-button-background: #ffffff;
    --cms-button-background-alt: #b3123f;
    --cms-button-border: max(1px, var(--cms-factor)) dotted #b3123f;
    --cms-button-border-alt: max(1px, var(--cms-factor)) solid #b3123f;

    /* separator */
    --cms-separator-width: max(2px, 2 * var(--cms-factor));
    --cms-separator-style: dotted;
    --cms-separator-color: #000000;
    --cms-separator-border: var(--cms-separator-width) var(--cms-separator-style) var(--cms-separator-color);

    /* overlay */
    --cms-overlay-color: #ffffff;
    --cms-overlay-background: rgba(15, 15, 15, 0.95);

    /* scrollbar */
    --cms-scrollbar-color: #bfbfbf;
    --cms-scrollbar-color-alt: #808080;
    --cms-scrollbar-bgcolor: #ffffff;
    --cms-scrollbar-width: max(10px, 10 * var(--cms-factor));

    /* shadow */
    --cms-box-shadow: max(1px, var(--cms-factor)) max(1px, var(--cms-factor)) max(10px, 10 * var(--cms-factor)) rgba(0, 0, 0, 0.5);
}

/* global reset */
HTML *
{
    BACKGROUND-ATTACHMENT: scroll;
    BACKGROUND-COLOR: transparent;
    BACKGROUND-IMAGE: none;
    BACKGROUND-POSITION: left top;
    BACKGROUND-REPEAT: no-repeat;
    BORDER: none;
    BORDER-RADIUS: 0;
    BOTTOM: auto;
    COLOR: inherit;
    FLOAT: none;
    FONT-FAMILY: inherit;
    FONT-SIZE: inherit;
    FONT-STYLE: inherit;
    FONT-VARIANT: inherit;
    FONT-WEIGHT: inherit;
    LEFT: auto;
    LETTER-SPACING: inherit;
    LINE-HEIGHT: inherit;
    MARGIN: 0;
    OVERFLOW: visible;
    OVERFLOW-WRAP: break-word;
    PADDING: 0;
    POSITION: relative;
    RIGHT: auto;
    TEXT-ALIGN: inherit;
    TEXT-DECORATION: inherit;
    TEXT-INDENT: 0;
    TEXT-TRANSFORM: inherit;
    TOP: auto;
    VERTICAL-ALIGN: top;
    VISIBILITY: inherit;
    WHITE-SPACE: inherit;
    WORD-BREAK: break-word;
    WORD-SPACING: inherit;
    WORD-WRAP: break-word;
    Z-INDEX: auto;
}

/* html5 fallback */
ARTICLE, ASIDE, DETAILS, FIGCAPTION, FIGURE, FOOTER, HEADER, HGROUP, MAIN, MENU, NAV, SECTION, SUMMARY
{
    DISPLAY: block;
}

/* general */
BODY
{
    BACKGROUND: var(--cms-background);
    COLOR: var(--cms-color);
    FONT-FAMILY: var(--cms-font-family);
    FONT-SIZE: var(--cms-font-size);
    FONT-STYLE: normal;
    FONT-VARIANT: normal;
    FONT-WEIGHT: var(--cms-font-weight);
    LETTER-SPACING: 0;
    LINE-HEIGHT: var(--cms-line-height);
    MARGIN: var(--cms-vspacing) var(--cms-hspacing);
    TEXT-ALIGN: left;
    TEXT-DECORATION: none;
    TEXT-INDENT: 0;
    TEXT-TRANSFORM: none;
    VISIBILITY: visible;
    WHITE-SPACE: normal;
    WORD-SPACING: 0;
    BACKGROUND-SIZE: cover;
    -MOZ-BACKGROUND-SIZE: cover;
    -WEBKIT-BACKGROUND-SIZE: cover;
    HYPHENS: auto;
    -MOZ-HYPHENS: auto;
    -MS-HYPHENS: auto;
    -WEBKIT-HYPHENS: auto;
}

/* semantic */
B, STRONG
{
    FONT-WEIGHT: bold;
}

BLOCKQUOTE, CITE, QCITE, Q
{
    QUOTES: "“" "”" "‘" "’";
}

BLOCKQUOTE:before, CITE:before, Q:before
{
    CONTENT: open-quote;
}

BLOCKQUOTE:after, CITE:after, Q:after
{
    CONTENT: close-quote;
}

CODE, PRE
{
    FONT-FAMILY: monospace;
    WHITE-SPACE: pre-wrap;
}

DEL, S
{
    TEXT-DECORATION: line-through;
}

EM, I
{
    FONT-STYLE: italic;
}

SMALL
{
    FONT-SIZE: 0.75em;
}

SUB
{
    FONT-SIZE: smaller;
    TOP: 0.4em;
    VERTICAL-ALIGN: text-bottom;
}

SUP
{
    FONT-SIZE: smaller;
    TOP: -0.4em;
    VERTICAL-ALIGN: text-top;
}

U
{
    TEXT-DECORATION: underline;
}

/* link */
A,
LABEL
{
    COLOR: var(--cms-link-color);
    CURSOR: pointer;
    TEXT-DECORATION: none;
}

A:focus,
A:hover,
LABEL:focus,
LABEL:hover
{
    COLOR: var(--cms-link-color-alt);
    TEXT-DECORATION: underline;
}

/* headings */
H1,
.like-h1
{
    BACKGROUND: var(--cms-h1-background);
    COLOR: var(--cms-h1-color);
    FONT-FAMILY: var(--cms-h1-font-family);
    FONT-SIZE: var(--cms-h1-font-size);
    FONT-WEIGHT: var(--cms-h1-font-weight);
    HYPHENS: none;
    LINE-HEIGHT: var(--cms-h1-line-height);
    MARGIN-BOTTOM: var(--cms-vspacing);
    TEXT-TRANSFORM: uppercase;
}

H2,
.like-h2
{
    BACKGROUND: var(--cms-h2-background);
    COLOR: var(--cms-h2-color);
    FONT-FAMILY: var(--cms-h2-font-family);
    FONT-SIZE: var(--cms-h2-font-size);
    FONT-WEIGHT: var(--cms-h2-font-weight);
    HYPHENS: none;
    LINE-HEIGHT: var(--cms-h2-line-height);
    MARGIN-BOTTOM: var(--cms-vspacing);
}

H3,
.like-h3
{
    BACKGROUND: var(--cms-h3-background);
    COLOR: var(--cms-h3-color);
    FONT-FAMILY: var(--cms-h3-font-family);
    FONT-SIZE: var(--cms-h3-font-size);
    FONT-STYLE: italic;
    FONT-WEIGHT: var(--cms-h3-font-weight);
    LINE-HEIGHT: var(--cms-h3-line-height);
    MARGIN-BOTTOM: var(--cms-vspacing);
}

/* paragraph */
P
{
    MARGIN-BOTTOM: var(--cms-vspacing);
}

/* table */
TABLE
{
    BORDER-COLLAPSE: collapse;
    BORDER-SPACING: 0;
    MARGIN: calc(var(--cms-vpadding) / -2) calc(var(--cms-hpadding) / -2);
}

TH
{
    FONT-SIZE: 25px;
    FONT-WEIGHT: bold;
    LINE-HEIGHT: 125%;
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
}

TD
{
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
}

.varied
{

}

/* list */
OL,
UL
{
    MARGIN-LEFT: var(--cms-hspacing);
}

LI
{
    MARGIN-BOTTOM: calc(var(--cms-vspacing) / 4);
}

LI:last-child
{
    MARGIN-BOTTOM: 0;
}

/* image */
IMG
{
    BORDER: none;
    HEIGHT: auto;
    OVERFLOW: hidden;
    VERTICAL-ALIGN: bottom;
}

/* whitespace */
BR
{
    CLEAR: both;
}

NOBR
{
    WHITE-SPACE: nowrap;
}

PRE
{
    WHITE-SPACE: pre-wrap;
}

/* separator */
HR
{
    BORDER: none;
    BORDER-BOTTOM: var(--cms-separator-border);
    COLOR: transparent;
    DISPLAY: block;
    BACKGROUND-COLOR: transparent;
    HEIGHT: 0;
    MARGIN: var(--cms-vspacing) 0;
    WIDTH: 100%;
}

/* form */
FIELDSET
{
    MARGIN: var(--cms-vspacing) 0 0;
}

FIELDSET + H2
{
    MARGIN-TOP: var(--cms-vspacing);
}

LEGEND
{
    FLOAT: left;
    FONT-WEIGHT: bold;
    WIDTH: 100%;
}

/* input */
INPUT[type=email],
INPUT[type=password],
INPUT[type=text],
SELECT,
TEXTAREA
{
    BACKGROUND: var(--cms-input-background);
    BORDER: var(--cms-input-border);
    BOX-SIZING: border-box;
    COLOR: var(--cms-input-color);
    MIN-HEIGHT: max(40px, 40 * var(--cms-factor));
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
    TEXT-ALIGN: left;
}

TEXTAREA
{
    WHITE-SPACE: pre-wrap;
}

INPUT[type=email]:focus,
INPUT[type=password]:focus,
INPUT[type=text]:focus,
SELECT:focus,
TEXTAREA:focus
{
    BACKGROUND: var(--cms-input-background-alt);
    BORDER: var(--cms-input-border-alt);
    COLOR: var(--cms-input-color-alt);
    OUTLINE: none;
}

INPUT[type=email]:valid
{
    BACKGROUND-COLOR: var(--cms-success-background);
    BORDER-COLOR: var(--cms-success-color);
}

/* checkbox */
INPUT[type=checkbox],
INPUT[type=radio]
{
    CURSOR: pointer;
    HEIGHT: 0;
    MARGIN-RIGHT: calc(var(--cms-font-size) * 0.75 + var(--cms-hpadding) / 2);
    VERTICAL-ALIGN: baseline;
    WIDTH: 0;
    -MOZ-APPEARANCE: initial;
}

INPUT[type=checkbox]:before,
INPUT[type=radio]:before
{
    BACKGROUND: var(--cms-checkbox-background);
    BORDER: var(--cms-checkbox-border);
    BOTTOM: 0;
    BOX-SIZING: border-box;
    CONTENT: "";
    CURSOR: pointer;
    HEIGHT: calc(var(--cms-font-size) * 0.75);
    LEFT: 0;
    POSITION: absolute;
    WIDTH: calc(var(--cms-font-size) * 0.75);
}

INPUT[type=checkbox]:checked:before,
INPUT[type=radio]:checked:before
{
    BACKGROUND: var(--cms-checkbox-background-alt);
    BORDER: var(--cms-checkbox-border-alt);
}

INPUT[type=checkbox]:after,
INPUT[type=radio]:after
{
    BACKGROUND: var(--cms-checkbox-color);
    BOTTOM: calc(var(--cms-font-size) * 0.175);
    BOX-SIZING: border-box;
    CONTENT: "";
    CURSOR: pointer;
    HEIGHT: calc(var(--cms-font-size) * 0.4);
    LEFT: calc(var(--cms-font-size) * 0.175);
    POSITION: absolute;
    WIDTH: calc(var(--cms-font-size) * 0.4);
}

INPUT[type=checkbox]:checked:after,
INPUT[type=radio]:checked:after
{
    BACKGROUND: var(--cms-checkbox-color-alt);
}

INPUT[type=radio]:before,
INPUT[type=radio]:after
{
    BORDER-RADIUS: 50%;
}

/* button */
A.button,
BUTTON,
INPUT[type=button],
INPUT[type=submit]
{
    BACKGROUND: var(--cms-button-background);
    BORDER: var(--cms-button-border);
    BOX-SIZING: border-box;
    COLOR: var(--cms-button-color);
    CURSOR: pointer;
    DISPLAY: inline-block;
    MIN-HEIGHT: max(40px, 40 * var(--cms-factor));
    MIN-WIDTH: 100px;
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
    TEXT-ALIGN: center;
    TEXT-DECORATION: none;
}

A.button:focus,
A.button:hover,
BUTTON:focus,
BUTTON:hover,
INPUT[type=button]:focus,
INPUT[type=button]:hover,
INPUT[type=submit]:focus,
INPUT[type=submit]:hover
{
    BACKGROUND: var(--cms-button-background-alt);
    BORDER: var(--cms-button-border-alt);
    COLOR: var(--cms-button-color-alt);
}

/* forms */
P.identification-error,
P.identification-mismatch,
P.mailform-error,
P.mailform-mismatch,
P.profile-error,
P.profile-mismatch
{
    COLOR: var(--cms-error-color);
    FONT-WEIGHT: bold;
}

P.identification-success,
P.mailform-success,
P.profile-success
{
    COLOR: var(--cms-success-color);
    FONT-WEIGHT: bold;
}

SECTION.identification FIELDSET.identification-mismatch,
SECTION.mailform FIELDSET.mailform-mismatch,
SECTION.profile FIELDSET.profile-mismatch
{

}

SECTION.identification FIELDSET.identification-mismatch INPUT[type=password],
SECTION.identification FIELDSET.identification-mismatch INPUT[type=text],
SECTION.identification FIELDSET.identification-mismatch SELECT,
SECTION.identification FIELDSET.identification-mismatch TEXTAREA,
SECTION.mailform FIELDSET.mailform-mismatch INPUT[type=password],
SECTION.mailform FIELDSET.mailform-mismatch INPUT[type=text],
SECTION.mailform FIELDSET.mailform-mismatch SELECT,
SECTION.mailform FIELDSET.mailform-mismatch TEXTAREA,
SECTION.profile FIELDSET.profile-mismatch INPUT[type=password],
SECTION.profile FIELDSET.profile-mismatch INPUT[type=text],
SECTION.profile FIELDSET.profile-mismatch SELECT,
SECTION.profile FIELDSET.profile-mismatch TEXTAREA
{
    BACKGROUND: var(--cms-error-background);
    BORDER-COLOR: var(--cms-error-color);
}

SECTION.identification FIELDSET.identification-command,
SECTION.mailform FIELDSET.mailform-command,
SECTION.profile FIELDSET.profile-command
{
    TEXT-ALIGN: center;
}

SECTION.identification INPUT[type=password],
SECTION.identification INPUT[type=text],
SECTION.identification SELECT,
SECTION.identification TEXTAREA,
SECTION.mailform INPUT[type=password],
SECTION.mailform INPUT[type=text],
SECTION.mailform SELECT,
SECTION.mailform TEXTAREA,
SECTION.profile INPUT[type=password],
SECTION.profile INPUT[type=text],
SECTION.profile SELECT,
SECTION.profile TEXTAREA
{
    WIDTH: 100%;
}

SECTION.mailform DIV.mailform-multicolumn
{
    DISPLAY: flex;
    FLEX-WRAP: wrap;
    MARGIN: 0 calc(var(--cms-hpadding) * -1);
}

SECTION.mailform DIV.mailform-multicolumn > DIV
{
    BOX-SIZING: border-box;
    PADDING: 0 var(--cms-hpadding);
}

@media (max-width: 640px)
{
    SECTION.mailform DIV.mailform-multicolumn > DIV
    {
        WIDTH: 100% !important;
    }
}

/* identification */
BODY.cms-identification
{
    ALIGN-ITEMS: center;
    BOX-SIZING: border-box;
    DISPLAY: flex;
    JUSTIFY-CONTENT: center;
    MIN-HEIGHT: calc(100vh - var(--cms-vspacing) * 2);
}

BODY.cms-identification SECTION.identification
{
    MAX-WIDTH: max(400px, 400 * var(--cms-factor));
    PADDING: var(--cms-vspacing) var(--cms-hspacing);
}

/* -------- DO NOT CHANGE BELOW -------- */

/* layout tables */
TABLE.layout
{
    BACKGROUND-COLOR: transparent;
    BORDER: none;
    BORDER-COLLAPSE: collapse;
    BORDER-SPACING: 0;
    EMPTY-CELLS: show;
    MARGIN: 0;
    TABLE-LAYOUT: auto;
}

TABLE.layout > TR,
TABLE.layout > TBODY > TR
{
    BACKGROUND-COLOR: transparent;
    BORDER: none;
}

TABLE.layout > TR > TD,
TABLE.layout > TBODY > TR > TD
{
    BACKGROUND-COLOR: transparent;
    BORDER: none;
    PADDING: 0;
}

/* error messages */
DIV.error
{
    BACKGROUND-COLOR: rgba(255, 255, 255, 0.95);
    BORDER: 2px solid #ff6a00;
    BOTTOM: auto;
    COLOR: #293131;
    LEFT: auto;
    MARGIN: 40px 50px;
    MAX-HEIGHT: 500px;
    MAX-WIDTH: 350px;
    OVERFLOW: auto;
    OUTLINE: 2px solid #ffffff;
    PADDING: 9px 14px 11px;
    POSITION: fixed;
    RIGHT: 0;
    TOP: 0;
    WHITE-SPACE: normal;
    Z-INDEX: 1000;
}

DIV.error A,
DIV.error LABEL
{
    COLOR: #ff6a00;
    CURSOR: pointer;
}

DIV.error SMALL
{
    COLOR: #737c85;
}

DIV.error INPUT,
DIV.error INPUT + *
{
    DISPLAY: none;
}

DIV.error INPUT:checked + *
{
    DISPLAY: block;
}

/* textcontrol */
DIV.textcontrol
{
    LINE-HEIGHT: 100%;
    MARGIN-BOTTOM: 5px;
}

DIV.textcontrol IMG
{
    PADDING: 2px;
}