/* semi bold */
@font-face
{
    FONT-FAMILY: "Cormorant Garamond";
    SRC: url("font/cormorantgaramond-semibold.woff2") format("woff2");
    FONT-WEIGHT: 600;
    FONT-STYLE: normal;
    FONT-DISPLAY: swap;
}

@font-face
{
    FONT-FAMILY: "Cormorant Garamond";
    SRC: url("font/cormorantgaramond-semibolditalic.woff2") format("woff2");
    FONT-WEIGHT: 600;
    FONT-STYLE: italic;
    FONT-DISPLAY: swap;
}

/* bold */
@font-face
{
    FONT-FAMILY: "Cormorant Garamond";
    SRC: url("font/cormorantgaramond-bold.woff2") format("woff2");
    FONT-WEIGHT: 700;
    FONT-STYLE: normal;
    FONT-DISPLAY: swap;
}

@font-face
{
    FONT-FAMILY: "Cormorant Garamond";
    SRC: url("font/cormorantgaramond-bolditalic.woff2") format("woff2");
    FONT-WEIGHT: 700;
    FONT-STYLE: italic;
    FONT-DISPLAY: swap;
}

/* medium */
@font-face
{
    FONT-FAMILY: "Montserrat";
    SRC: url("font/montserrat-medium.woff2") format("woff2");
    FONT-WEIGHT: 500;
    FONT-STYLE: normal;
    FONT-DISPLAY: swap;
}

@font-face
{
    FONT-FAMILY: "Montserrat";
    SRC: url("font/montserrat-mediumitalic.woff2") format("woff2");
    FONT-WEIGHT: 500;
    FONT-STYLE: italic;
    FONT-DISPLAY: swap;
}

/* semi bold */
@font-face
{
    FONT-FAMILY: "Montserrat";
    SRC: url("font/montserrat-semibold.woff2") format("woff2");
    FONT-WEIGHT: 600;
    FONT-STYLE: normal;
    FONT-DISPLAY: swap;
}

@font-face
{
    FONT-FAMILY: "Montserrat";
    SRC: url("font/montserrat-semibolditalic.woff2") format("woff2");
    FONT-WEIGHT: 600;
    FONT-STYLE: italic;
    FONT-DISPLAY: swap;
}

/* regular */
@font-face
{
    FONT-FAMILY: "Woodford Bourne";
    SRC: url("font/woodfordbourne-regular.woff2") format("woff2");
    FONT-WEIGHT: 400;
    FONT-STYLE: normal;
    FONT-DISPLAY: swap;
}

@font-face
{
    FONT-FAMILY: "Woodford Bourne";
    SRC: url("font/woodfordbourne-italic.woff2") format("woff2");
    FONT-WEIGHT: 400;
    FONT-STYLE: italic;
    FONT-DISPLAY: swap;
}

/* bold */
@font-face
{
    FONT-FAMILY: "Woodford Bourne";
    SRC: url("font/woodfordbourne-bold.woff2") format("woff2");
    FONT-WEIGHT: 700;
    FONT-STYLE: normal;
    FONT-DISPLAY: swap;
}

@font-face
{
    FONT-FAMILY: "Woodford Bourne";
    SRC: url("font/woodfordbourne-bolditalic.woff2") format("woff2");
    FONT-WEIGHT: 700;
    FONT-STYLE: italic;
    FONT-DISPLAY: swap;
}

: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: #323734;
    --cms-color-alt: var(--cms-color);
    --cms-color-highlight: #7c1221;
    --cms-background: #ffffff;
    --cms-background-alt: #eaedec;
    --cms-font-family: "Cormorant Garamond", "Arial", sans-serif;
    --cms-font-size: max(18px, 18 * var(--cms-factor));
    --cms-font-weight: 600;
    --cms-line-height: 130%;

    /* link */
    --cms-link-color: var(--cms-color);
    --cms-link-color-alt: var(--cms-color);

    /* spacing */
    --cms-hpadding: max(12.5px, 12.5 * var(--cms-factor));
    --cms-vpadding: max(7.5px, 7.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: #72451d;
    --cms-h1-background: transparent;
    --cms-h1-font-family: "Woodford Bourne", "Arial", sans-serif;
    --cms-h1-font-size: max(35px, 50 * var(--cms-factor));
    --cms-h1-font-weight: 700;
    --cms-h1-line-height: 115%;

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

    /* heading 3 */
    --cms-h3-color: var(--cms-h1-color);
    --cms-h3-background: transparent;
    --cms-h3-font-family: inherit;
    --cms-h3-font-size: max(22px, 22 * var(--cms-factor));
    --cms-h3-font-weight: 700;
    --cms-h3-line-height: 115%;

    /* input */
    --cms-input-color: var(--cms-color);
    --cms-input-color-alt: var(--cms-color);
    --cms-input-background: var(--cms-background-alt);
    --cms-input-background-alt: var(--cms-background-alt);
    --cms-input-border: max(1px, var(--cms-factor)) dotted var(--cms-color);
    --cms-input-border-alt: max(1px, var(--cms-factor)) dotted var(--cms-color);

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

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

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

    /* overlay */
    --cms-overlay-color: var(--cms-background-alt);
    --cms-overlay-background: rgba(74, 44, 14, 0.95);

    /* scrollbar */
    --cms-scrollbar-color: var(--cms-color);
    --cms-scrollbar-color-alt: var(--cms-color);
    --cms-scrollbar-bgcolor: var(--cms-background-alt);
    --cms-scrollbar-width: max(10px, 10 * var(--cms-factor));

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

/* global reset */
*
{
    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;
}

/* scrollbars */
*
{
    SCROLL-BEHAVIOR: smooth;
    SCROLLBAR-COLOR: var(--cms-scrollbar-color) var(--cms-scrollbar-bgcolor);
    SCROLLBAR-WIDTH: auto;
}

/* 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: justify;
    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: 700;
}

BLOCKQUOTE, CITE, 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
{
    COLOR: var(--cms-link-color);
    CURSOR: pointer;
    TEXT-DECORATION: none;
}

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

/* heading */
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: calc(var(--cms-vspacing) * 1.5);
    TEXT-ALIGN: center;
}

H1 + H2,
H1 + DIV.like-h2,
DIV.like-h1 + H2,
DIV.like-h1 + DIV.like-h2
{
    MARGIN-TOP: calc(var(--cms-vspacing) * -1.5 + var(--cms-vpadding));
}

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);
    TEXT-ALIGN: center;
}

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-WEIGHT: var(--cms-h3-font-weight);
    LINE-HEIGHT: var(--cms-h3-line-height);
    MARGIN-BOTTOM: var(--cms-vspacing);
    TEXT-ALIGN: center;
}

/* paragraph */
P,
.p
{
    DISPLAY: block;
    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-WEIGHT: 700;
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
}

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

.varied
{

}

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

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

OL > LI
{
    MARGIN-BOTTOM: calc(var(--cms-vspacing) / 3 * 2);
}

H1:last-child,
.like-h1:last-child,
H2:last-child,
.like-h2:last-child,
H3:last-child,
.like-h3:last-child,
P:last-child,
.p:last-child,
OL:last-child,
UL:last-child,
LI:last-child
{
    MARGIN-BOTTOM: 0;
}

/* media*/
CANVAS,
IMG,
VIDEO
{
    BORDER: none;
    HEIGHT: auto;
    MAX-WIDTH: 100%;
    OVERFLOW: clip;
    OVERFLOW-CLIP-MARGIN: content-box;
    VERTICAL-ALIGN: middle;
}

/* 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%;
}

/* response */
DIV.response
{
    BACKGROUND: var(--cms-response-background) !important;
    COLOR: var(--cms-response-color) !important;
    FONT-WEIGHT: 500;
    MARGIN: var(--cms-vspacing) 0;
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
}

DIV.response-success
{
    BACKGROUND: var(--cms-success-background) !important;
    COLOR: var(--cms-success-color) !important;
    FONT-WEIGHT: 500;
    MARGIN: var(--cms-vspacing) 0;
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
}

DIV.response-error
{
    BACKGROUND: var(--cms-error-background) !important;
    COLOR: var(--cms-error-color) !important;
    FONT-WEIGHT: 500;
    MARGIN: var(--cms-vspacing) 0;
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
}

DIV.response:empty,
DIV.response-success:empty,
DIV.response-error:empty
{
    DISPLAY: none;
}

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

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

LABEL
{
    COLOR: var(--cms-link-color);
    FONT-WEIGHT: 700;
}

LABEL[for]
{
    CURSOR: pointer;
}

LABEL:has(INPUT[type=checkbox]),
LABEL:has(INPUT[type=radio])
{
    CURSOR: pointer;
    FONT-WEIGHT: var(--cms-font-weight);
}

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

/* 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);
    FONT-WEIGHT: var(--cms-font-weight);
    MARGIN: 0 var(--cms-hpadding) var(--cms-hpadding) 0;
    MAX-WIDTH: 100%;
    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]:not([size]),
INPUT[type=password]:not([size]),
INPUT[type=text]:not([size]),
TEXTAREA:not([cols])
{
    WIDTH: 100%;
}

TEXTAREA:not([rows])
{
    HEIGHT: 15em;
}

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;
    MARGIN: 0 var(--cms-hpadding) var(--cms-hpadding) 0;
    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);
}

BUTTON:disabled,
INPUT:disabled,
SELECT:disabled,
TEXTAREA:disabled
{
    FILTER: grayscale(1);
    OPACITY: 0.5;
    POINTER-EVENTS: none;
}

/* forms */
SECTION.mailform FIELDSET.mailform-mismatch LEGEND,
SECTION.mailform DIV.mailform-mismatch LABEL,
SECTION.profile FIELDSET.profile-mismatch LEGEND,
SECTION.profile DIV.profile-mismatch LABEL
{
    COLOR: var(--cms-error-color);
}

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

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

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

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

/* chat / core control */
.cms-chat-interface
{
    /*CLIP-PATH: inset(0 0 0 0);*/
    DISPLAY: grid;
    GAP: var(--cms-vspacing) var(--cms-hspacing);
    GRID-TEMPLATE-ROWS: auto 1fr auto;
    HEIGHT: calc(100vh - var(--cms-hspacing) * 2);
    OVERFLOW: hidden;
}

#chat-control-switch
{
    DISPLAY: none;
}

#chat-menu
{
    DISPLAY: flex;
    FLEX-WRAP: wrap;
    GRID-COLUMN: 1;
    GRID-ROW: 1;
    JUSTIFY-SELF: end;
    MARGIN-LEFT: calc(var(--cms-hspacing) * -1);
}

#chat-menu > *
{
    MARGIN-LEFT: var(--cms-hspacing);
}

#chat-menu > *:nth-child(1):before
{
    CONTENT: "\e967\00a0";
    FONT-FAMILY: "Fontello";
}

#chat-menu > *:nth-child(2):before
{
    CONTENT: "\e8e6\00a0";
    FONT-FAMILY: "Fontello";
}

#chat-menu > *:nth-child(3):before
{
    CONTENT: "\e87d\00a0";
    FONT-FAMILY: "Fontello";
}

#chat-output
{
    GRID-COLUMN: 1;
    GRID-ROW: 2;
    OVERFLOW-Y: auto;
}

#chat-output A
{
    COLOR: inherit;
}

#chat-input
{
    GRID-COLUMN: 1;
    GRID-ROW: 3;
}

#chat-control
{
    BACKGROUND: var(--cms-background);
    GRID-COLUMN: 1;
    GRID-ROW: 1 / span 3;
    TRANSFORM: translateX(calc(100% + var(--cms-hspacing)));
    TRANSITION: transform 0.5s;
}

#chat-control-head
{
    DISPLAY: flex;
    FLEX-WRAP: wrap;
    JUSTIFY-CONTENT: space-between;
    MARGIN-LEFT: calc(var(--cms-hspacing) * -1);
}

#chat-control-head > *
{
    MARGIN: 0 0 var(--cms-vspacing) var(--cms-hspacing);
}

#chat-control-head > *:first-child:before
{
    CONTENT: "\e83d\00a0";
    FONT-FAMILY: "Fontello";
}

#chat-settings
{
    DISPLAY: flex;
    FLEX-WRAP: wrap;
    MARGIN-LEFT: 0;
}

#chat-settings > *
{
    MARGIN-LEFT: var(--cms-hspacing);
}

#chat-settings > *:last-child:before
{
    CONTENT: "\e873\00a0";
    FONT-FAMILY: "Fontello";
}

#chat-control > IFRAME
{
    HEIGHT: 100%;
    WIDTH: 100%;
}

#chat-control-switch:checked ~ #chat-control
{
    TRANSFORM: none;
}

.cms-chat-control
{
    MARGIN: 0;
}

.chat-message,
.chat-message-private,
.chat-message-system,
.chat-message-info,
.core-control-channel,
.core-control-profile
{
    BACKGROUND-COLOR: var(--cms-input-background);
    BORDER-RADIUS: var(--cms-hpadding);
    DISPLAY: block;
    MARGIN-BOTTOM: var(--cms-vpadding);
    OVERFLOW: hidden;
    PADDING: var(--cms-vpadding) var(--cms-hpadding);
}

.chat-message:has(.chat-message-image),
.chat-message-private:has(.chat-message-image),
.core-control-profile:has(.core-control-profile-image)
{
    PADDING-LEFT: calc(max(35px, 35 * var(--cms-factor)) + var(--cms-hpadding) * 2);
    MIN-HEIGHT: max(35px, 35 * var(--cms-factor));
}

.chat-message-image,
.core-control-profile-image
{
    BORDER-RADIUS: 100%;
    HEIGHT: max(35px, 35 * var(--cms-factor));
    LEFT: var(--cms-hpadding);
    OBJECT-FIT: cover;
    POSITION: absolute;
    WIDTH: max(35px, 35 * var(--cms-factor));
}

.chat-message-name,
.core-control-channel-name,
.core-control-profile-name
{
    FONT-WEIGHT: bold;
}

.core-control-channel-status,
.core-control-profile-status
{
    FONT-SIZE: 0.75em;
}

.core-control-list
{
    DISPLAY: flex;
    FLEX-WRAP: wrap;
    MARGIN: 0 calc(var(--cms-vpadding) * -1) calc(var(--cms-vpadding) * -1 + var(--cms-vspacing)) 0;
}

.core-control-list > *
{
    FLEX: 1 1 max(250px, 250 * var(--cms-factor));
    MARGIN: 0 var(--cms-vpadding) var(--cms-vpadding) 0;
}

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

BODY.cms-identification > *
{
    PADDING: var(--cms-vspacing) var(--cms-hspacing);
    MAX-WIDTH: max(250px, 250 * var(--cms-factor));
    OUTLINE: 50vmax solid var(--cms-overlay-background);
    WIDTH: 100%;
}

/* -------- 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;
}

/* permission */
.permission
{
    LINE-HEIGHT: 100%;
    TEXT-ALIGN: right;
}

.permission IMG
{
    VERTICAL-ALIGN: middle;
}