/* @import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700&display=swap"); */
/* :root {
    --main-bg-color: #ffffff;
    --main-text-color: #3b4045;
    --main-border-color: #c0c0c0;
    --dark-color: #646566;
    --gray-color: #767778;
    --dim-color: #88898a;
    --pdf-color: #cf4742;
    --adderat-color: #88A71D;
    --link-color: #08c;
    prev adderat: #82a53e
} */

:root {
    /* NOTE: Palette extended 2025-10-18 with -4 and -5 darker levels for all color scales
       Usage: .bg-<color>-4 / .bg-<color>-5 provide higher contrast backgrounds with light text.
       Keep progression: 1=lightest (pastell), 2=soft mid, 3=accent, 4=strong, 5=deep.
    */
    /* RÖD */
    --red-1: #ffd6d6; /* din angivna ljusa */
    --red-2: #f5a8a8; /* mellan */
    --red-3: #e56d6d; /* mörkare */
    /* Added darker extensions */
    --red-4: #c84343; /* ännu mörkare för hög kontrast */
    --red-5: #a72e2e; /* djup mörkröd för kritiska tillstånd */

    /* ORANGE */
    --orange-1: #fde3ae; /* din ljusa bas */
    --orange-2: #f9c978; /* mellan, lite djupare men fortfarande mjuk */
    --orange-3: #f5a84d; /* mörkare, tydlig och varm */
    --orange-4: #d87a1b; /* mörkare orange */
    --orange-5: #b55f12; /* djup orange/bränd */

    /* GUL */
    --yellow-1: #fff5cc; /* ljus pastell */
    --yellow-2: #ffe866; /* mellan */
    --yellow-3: #ffd500; /* mättad gul */
    --yellow-4: #e5b800; /* mörkare varm gul */
    --yellow-5: #b38f00; /* djupare ockra */

    /* GRÖN */
    --green-1: #d6ffd6; /* motsvarande din ljusa */
    --green-2: #9ee89e; /* mellan */
    --green-3: #57c757; /* mörkare, frisk grön */
    --green-4: #3ea33e; /* mörkare grön */
    --green-5: #2b7a2b; /* djup mörkgrön */

    /* YELLOWGREEN (grön med gul ton) */
    --yellowgreen-1: #ecffcc; /* ljus pastell gulgrön */
    --yellowgreen-2: #d2f59a; /* mjuk mellan gulgrön */
    --yellowgreen-3: #b0e066; /* accent gulgrön */
    --yellowgreen-4: #8ac437; /* stark gulgrön */
    --yellowgreen-5: #5f8f1f; /* djup mörk gulgrön */

 /* === NEUTRAL (grå/beige, för ?ok?/mellanläge) === */
    --neutral-1: #f3f3f3;  /* ljus bakgrund, nästan vit */
    --neutral-2: #dcdcdc;  /* mellangrå */
    --neutral-3: #a0a0a0;  /* mörkare text/ramar */
     --neutral-4: #6c6c6c;  /* mörk neutral */
     --neutral-5: #444444;  /* djup mörk neutral */

    /* === BLÅ (info, hint, trust) === */
    --blue-1: #d6ebff;  /* ljus pastellblå */
    --blue-2: #91c6ff;  /* mellanblå */
    --blue-3: #3a91f5;  /* djupare, accentblå */
    --blue-4: #1f6fd1;  /* mörkare blå */
    --blue-5: #0d4ea3;  /* djup marinblå */

    /* === TEAL (djupare, kallare grönblå) === */
    --teal-1: #c9f2ef;  /* ljus pastellteal */
    --teal-2: #72d2cb;  /* mellan */
    --teal-3: #2a9d8f;  /* mörk, harmonisk och professionell */
    --teal-4: #1f7c71;  /* mörkare teal */
    --teal-5: #15564e;  /* djup teal */

    /* === CYAN / TURKOS (aktiv, teknisk, fräsch) === */
    --cyan-1: #d6fff7;  /* ljus turkos */
    --cyan-2: #8ef0db;  /* mellan */
    --cyan-3: #36c4a5;  /* mörkare akvagrön */
    --cyan-4: #259883;  /* mörkare turkos */
    --cyan-5: #176e5e;  /* djup turkos */

    /* === LILA (sekundär, kreativ) === */
    --purple-1: #f0d6ff;  /* ljus lila */
    --purple-2: #d09ff9;  /* mellan */
    --purple-3: #a25cd6;  /* djupare, accentlila */
    --purple-4: #7c39ad;  /* mörkare lila */
    --purple-5: #5a2780;  /* djup lila */

    /* === ROSA (accent, vänlig, playful) === */
    --pink-1: #ffd6eb;  /* ljus */
    --pink-2: #f9a8d8;  /* mellan */
    --pink-3: #e56db6;  /* mörkare magenta-ton */
    --pink-4: #c84392;  /* mörkare rosa */
    --pink-5: #a72e74;  /* djup magenta */

    --adderat-color-test: #78be20;
    --adderat-success-color: #48ad20;
    --adderat-color-green-dark: #58a000;

    --body-color: #212529;
    --bg-text-color: var(--body-color);

    --text-light: #f7f8f9;

    --border-color: rgba(0, 0, 0, .075);

    --adderat-color-green: #529214;
    --adderat-color-green-darker: #78be20;
    --adderat-color-green-light: #eaf2e2;
    --adderat-color-teal: #237284;
    --adderat-color-teal-light: #ecf3f4;
    --adderat-color-teal-light-50: rgba(236, 243, 244, 0.5);
    --adderat-color-teal-dark: #1a4e5d;
    --adderat-color-blue: #0075c4;
    --adderat-color-yellow: #c4a000;
    /* --adderat-color-red: #cf4742; */
    --adderat-color-red: #b94a48;
    --adderat-color-orange: #f57c00;
    --adderat-color-purple: #6444ff;
    --adderat-color-pink: #ff6b6b;
    --adderat-color-brown: #8a6d3b;
    --adderat-color-gray: #646566;
    --adderat-color-dark: #3b4045;
    --adderat-color-light: #f7f8f9;
    --adderat-color-lighter: #f5f5f5;
    --adderat-color-lightest: #f9f9f9;

    --adderat-color-agency: var(--adderat-color-green);
    --adderat-color-agency-light: var(--adderat-color-green-light);

    --adderat-color-client: var(--adderat-color-teal);
    --adderat-color-client-light: var(--adderat-color-teal-light);


    --ai-bg-color: #6444ff;
    --ai-color: #6444ff;
    --ai-color-dark: #4424df;
    --ai-color-25: #6444ff40;
    --ai-color-50: #6444ff80;
    --row-hover-bg: #fcf8e3;

    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-normal: 400;
    --fw-light: 300;
    --fw-thin: 100;
    --fw-extra-bold: 800;
    --fw-black: 900;
    --fw-roboto-semibold: 500;


}
.text-bg {
  color: var(--bg-text-color, var(--body-color));
}

/* Utility-klasser (för snabb användning) */
/* === RÖD === */
.bg-red-1    { background-color: var(--red-1); --bg-text-color: var(--body-color); }
.bg-red-2    { background-color: var(--red-2); --bg-text-color: var(--body-color); }
.bg-red-3    { background-color: var(--red-3); --bg-text-color: var(--text-light); }
.bg-red-4    { background-color: var(--red-4); --bg-text-color: var(--text-light); }
.bg-red-5    { background-color: var(--red-5); --bg-text-color: var(--text-light); }

/* === ORANGE === */
.bg-orange-1 { background-color: var(--orange-1); --bg-text-color: var(--body-color); }
.bg-orange-2 { background-color: var(--orange-2); --bg-text-color: var(--body-color); }
.bg-orange-3 { background-color: var(--orange-3); --bg-text-color: var(--body-color); }
.bg-orange-4 { background-color: var(--orange-4); --bg-text-color: var(--text-light); }
.bg-orange-5 { background-color: var(--orange-5); --bg-text-color: var(--text-light); }

/* === GUL === */
.bg-yellow-1 { background-color: var(--yellow-1); --bg-text-color: var(--body-color); }
.bg-yellow-2 { background-color: var(--yellow-2); --bg-text-color: var(--body-color); }
.bg-yellow-3 { background-color: var(--yellow-3); --bg-text-color: var(--body-color); }
.bg-yellow-4 { background-color: var(--yellow-4); --bg-text-color: var(--body-color); }
.bg-yellow-5 { background-color: var(--yellow-5); --bg-text-color: var(--text-light); }



    /* === YELLOWGREEN === */
    .bg-yellowgreen-1 { background-color: var(--yellowgreen-1); --bg-text-color: var(--body-color); }
    .bg-yellowgreen-2 { background-color: var(--yellowgreen-2); --bg-text-color: var(--body-color); }
    .bg-yellowgreen-3 { background-color: var(--yellowgreen-3); --bg-text-color: var(--body-color); }
    .bg-yellowgreen-4 { background-color: var(--yellowgreen-4); --bg-text-color: var(--text-light); }
    .bg-yellowgreen-5 { background-color: var(--yellowgreen-5); --bg-text-color: var(--text-light); }

/* === GRÖN === */
.bg-green-1  { background-color: var(--green-1); --bg-text-color: var(--body-color); }
.bg-green-2  { background-color: var(--green-2); --bg-text-color: var(--body-color); }
.bg-green-3  { background-color: var(--green-3); --bg-text-color: var(--text-light); }
.bg-green-4  { background-color: var(--green-4); --bg-text-color: var(--text-light); }
.bg-green-5  { background-color: var(--green-5); --bg-text-color: var(--text-light); }

/* === NEUTRAL === */
.bg-neutral-1 { background-color: var(--neutral-1); --bg-text-color: var(--body-color); }
.bg-neutral-2 { background-color: var(--neutral-2); --bg-text-color: var(--body-color); }
.bg-neutral-3 { background-color: var(--neutral-3); --bg-text-color: var(--text-light); }
.bg-neutral-4 { background-color: var(--neutral-4); --bg-text-color: var(--text-light); }
.bg-neutral-5 { background-color: var(--neutral-5); --bg-text-color: var(--text-light); }

/* === BLÅ === */
.bg-blue-1 { background-color: var(--blue-1); --bg-text-color: var(--body-color); }
.bg-blue-2 { background-color: var(--blue-2); --bg-text-color: var(--body-color); }
.bg-blue-3 { background-color: var(--blue-3); --bg-text-color: var(--text-light); }
.bg-blue-4 { background-color: var(--blue-4); --bg-text-color: var(--text-light); }
.bg-blue-5 { background-color: var(--blue-5); --bg-text-color: var(--text-light); }

/* === TEAL === */
.bg-teal-1 { background-color: var(--teal-1); --bg-text-color: var(--body-color); }
.bg-teal-2 { background-color: var(--teal-2); --bg-text-color: var(--body-color); }
.bg-teal-3 { background-color: var(--teal-3); --bg-text-color: var(--text-light); }
.bg-teal-4 { background-color: var(--teal-4); --bg-text-color: var(--text-light); }
.bg-teal-5 { background-color: var(--teal-5); --bg-text-color: var(--text-light); }

/* === CYAN / TURKOS === */
.bg-cyan-1 { background-color: var(--cyan-1); --bg-text-color: var(--body-color); }
.bg-cyan-2 { background-color: var(--cyan-2); --bg-text-color: var(--body-color); }
.bg-cyan-3 { background-color: var(--cyan-3); --bg-text-color: var(--text-light); }
.bg-cyan-4 { background-color: var(--cyan-4); --bg-text-color: var(--text-light); }
.bg-cyan-5 { background-color: var(--cyan-5); --bg-text-color: var(--text-light); }

/* === LILA === */
.bg-purple-1 { background-color: var(--purple-1); --bg-text-color: var(--body-color); }
.bg-purple-2 { background-color: var(--purple-2); --bg-text-color: var(--body-color); }
.bg-purple-3 { background-color: var(--purple-3); --bg-text-color: var(--text-light); }
.bg-purple-4 { background-color: var(--purple-4); --bg-text-color: var(--text-light); }
.bg-purple-5 { background-color: var(--purple-5); --bg-text-color: var(--text-light); }

/* === ROSA === */
.bg-pink-1 { background-color: var(--pink-1); --bg-text-color: var(--body-color); }
.bg-pink-2 { background-color: var(--pink-2); --bg-text-color: var(--body-color); }
.bg-pink-3 { background-color: var(--pink-3); --bg-text-color: var(--text-light); }
.bg-pink-4 { background-color: var(--pink-4); --bg-text-color: var(--text-light); }
.bg-pink-5 { background-color: var(--pink-5); --bg-text-color: var(--text-light); }

/* === Text color utilities (.fc-*) === */
/* RÖD */
.fc-red-1 { color: var(--red-1); }
.fc-red-2 { color: var(--red-2); }
.fc-red-3 { color: var(--red-3); }
.fc-red-4 { color: var(--red-4); }
.fc-red-5 { color: var(--red-5); }

/* ORANGE */
.fc-orange-1 { color: var(--orange-1); }
.fc-orange-2 { color: var(--orange-2); }
.fc-orange-3 { color: var(--orange-3); }
.fc-orange-4 { color: var(--orange-4); }
.fc-orange-5 { color: var(--orange-5); }

/* GUL */
.fc-yellow-1 { color: var(--yellow-1); }
.fc-yellow-2 { color: var(--yellow-2); }
.fc-yellow-3 { color: var(--yellow-3); }
.fc-yellow-4 { color: var(--yellow-4); }
.fc-yellow-5 { color: var(--yellow-5); }

/* GRÖN */
.fc-green-1 { color: var(--green-1); }
.fc-green-2 { color: var(--green-2); }
.fc-green-3 { color: var(--green-3); }
.fc-green-4 { color: var(--green-4); }
.fc-green-5 { color: var(--green-5); }

/* NEUTRAL */
.fc-neutral-1 { color: var(--neutral-1); }
.fc-neutral-2 { color: var(--neutral-2); }
.fc-neutral-3 { color: var(--neutral-3); }
.fc-neutral-4 { color: var(--neutral-4); }
.fc-neutral-5 { color: var(--neutral-5); }

/* BLÅ */
.fc-blue-1 { color: var(--blue-1); }
.fc-blue-2 { color: var(--blue-2); }
.fc-blue-3 { color: var(--blue-3); }
.fc-blue-4 { color: var(--blue-4); }
.fc-blue-5 { color: var(--blue-5); }

/* TEAL */
.fc-teal-1 { color: var(--teal-1); }
.fc-teal-2 { color: var(--teal-2); }
.fc-teal-3 { color: var(--teal-3); }
.fc-teal-4 { color: var(--teal-4); }
.fc-teal-5 { color: var(--teal-5); }

/* CYAN */
.fc-cyan-1 { color: var(--cyan-1); }
.fc-cyan-2 { color: var(--cyan-2); }
.fc-cyan-3 { color: var(--cyan-3); }
.fc-cyan-4 { color: var(--cyan-4); }
.fc-cyan-5 { color: var(--cyan-5); }

/* LILA */
.fc-purple-1 { color: var(--purple-1); }
.fc-purple-2 { color: var(--purple-2); }
.fc-purple-3 { color: var(--purple-3); }
.fc-purple-4 { color: var(--purple-4); }
.fc-purple-5 { color: var(--purple-5); }

/* ROSA */
.fc-pink-1 { color: var(--pink-1); }
.fc-pink-2 { color: var(--pink-2); }
.fc-pink-3 { color: var(--pink-3); }
.fc-pink-4 { color: var(--pink-4); }
.fc-pink-5 { color: var(--pink-5); }

/* YELLOWGREEN text utilities */
.fc-yellowgreen-1 { color: var(--yellowgreen-1); }
.fc-yellowgreen-2 { color: var(--yellowgreen-2); }
.fc-yellowgreen-3 { color: var(--yellowgreen-3); }
.fc-yellowgreen-4 { color: var(--yellowgreen-4); }
.fc-yellowgreen-5 { color: var(--yellowgreen-5); }


/* .btn-success {
    background-color: var(--adderat-success-color) !important;
    color: #fff;
    border-color: var(--adderat-success-color) !important;
    background-image: none !important;
}
.btn {
    background-image: none !important;
    border-color: #0002 !important;
    box-shadow: none !important;
}

button.btn:hover {
    filter: brightness(1.1);
    background-image: none !important;
    outline: 1px solid #0002;
    box-shadow: none !important;
} */

html {
    height: 100%;
}

body {
    min-height: 100%;
}

html,
body {
    font-size: 12px;
}

body {
    font-family: Verdana, sans-serif;
    background-color: #FFF;
    background-image: url(../../gfx/bodybg.png?v=3.2.0.0);
    background-position: top;
    background-repeat: repeat-x;
    margin: 0;
    padding: 0;
}

body,
.fc-body {
    color: var(--body-color) !important;
}


input,
select {
    /* height: auto !important;
    min-height: 16px; */
    box-sizing: border-box;
    font-family: Verdana;
    font-size: 1rem;
    margin-left: 0;
    padding: 1px;
}

input,
select,
textarea {
    padding: 4px;
    border: 1px solid rgba(0,0,0,.2);
    background: #fff;
    border-radius: 3px;
}

input[type="checkbox"],
input[type="radio"] {
    padding: initial;
    border: 1px solid rgba(0,0,0,.2);
    background: #fff;
    border-radius: initial;
    margin-left: 0;
    /* accent-color: var(--adderat-color-green); */
}

.select2-container .select2-choice {
    border: 1px solid rgba(0,0,0,.2) !important;
}

input[type="checkbox"].input-color-adderat,
input[type="radio"].input-color-adderat {
    accent-color: var(--adderat-color-green);
}

input:focus,
select:focus,
textarea:focus {
    /* border-color: #999 !important; */
    border-color: #5897fb !important;
    outline: none;
    /* box-shadow: 0 0 3px #ccc; */
}


input[type="file"] {
    background: #fcfdfe;
}


.h-100 {
    height: 100%;
}

.fc-ai {
    color: var(--ai-color) !important;
}

.bg-ai {
    background-color: var(--ai-bg-color);
}

.bg-ai-25 {
    background-color: var(--ai-color-25) !important;
}

.border-ai {
    border-color: var(--ai-color);
}

.border-transparent {
    border-color: transparent !important;
}

.panel-ai {
    padding: 0.5rem;
    background: var(--ai-color-25);
    border-radius: 0.5rem;
}


.btn-flex {
    display: inline-flex;
    align-items: center;
}

.btn-ai {
    background: var(--ai-bg-color) !important;
    color: #fff !important;
    text-shadow: none !important;
    border: 1px solid var(--ai-color) !important;
}

.btn-ai:hover {
    filter: brightness(1.1);
}

.btn-ai.btn-inverse {
    background: var(--body-color) !important;
    color: #fff !important;
    border: 1px solid var(--body-color) !important;
}

.btn-clear {
    background: none;
    border: none;
    box-shadow: none;
    text-shadow: none !important;
}


.gpt-dialog {
    display: flex;
    position: fixed;
    z-index: 10000;
    padding: 1rem;
    padding-top: 0;
    height: calc(100vh);
    box-shadow: 0px 0 0px 5px #6444ff55;
    border-left: 1px solid var(--ai-color);
    border-right: 1px solid var(--ai-color);
    gap: .25rem;
    flex-direction: column;
    top: 0;
    right: 0;
    width: 25vw;
    min-width: 500px;
    overflow-y: auto;
    background: #fff;
    box-sizing: border-box;
}

.gpt-dialog.gpt-target {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    border: none;
    box-shadow: none;
    min-height: 300px;
}

.gpt-dialog.gpt-target .wbtn-close,
.gpt-dialog.gpt-target .close-button {
    display: none;
}

.gpt-response-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1em;
    position: relative;
    flex-grow: 1;
    overflow-y: auto;
}

.gpt-response {
    margin-top: 1rem;
    width: 100%;
}

.gpt-response-toolbar {
    display: flex;
    gap: 1em;
    font-size: 9px;
    padding: .5em;
}

.gpt-response-msg {
    /* background: #f7f8f9; */
    border-radius: 0 0 .5em .5em;
    padding: 0.5em;
    word-wrap: break-word;
    white-space: pre-wrap;
    box-sizing: border-box;
    border-top: 1px solid var(--ai-color-25);
    line-height: 1.75;
    min-height: 350px;
}

.layout-ai {
    line-height: 1.75;
}

.gpt-response-wrapper.markdown .gpt-response-msg {
    white-space: normal;
}

.gpt-response-wrapper.markdown .gpt-response-msg pre {
    white-space: pre-wrap;
}

.gpt-response-msg ul,
.layout-ai ul,
.gpt-response-msg ol,
.layout-ai ol {
    list-style-position: outside !important;
}

.layout-ai .mce ul,
.layout-ai .mce ol {
    margin: 0;
    padding: 0;
}

.gpt-response-msg li,
.layout-ai li {
    margin-left: 1em !important;
}

.gpt-response-msg p,
.layout-ai p {
    margin-bottom: 1.25rem !important;
    margin-top: 1.25rem !important;
}

.gpt-response-msg h1,
.layout-ai h1,
.gpt-response-msg h2,
.layout-ai h2,
.gpt-response-msg h3,
.layout-ai h3,
.gpt-response-msg h4,
.layout-ai h4,
.gpt-response-msg h5,
.layout-ai h5,
.gpt-response-msg h6,
.layout-ai h6 {
    margin-top: 1.25rem !important;
    margin-bottom: .5rem !important;
}

.gpt-response-msg h1+p,
.layout-ai h1+p,
.gpt-response-msg h2+p,
.layout-ai h2+p,
.gpt-response-msg h3+p,
.layout-ai h3+p,
.gpt-response-msg h4+p,
.layout-ai h4+p,
.gpt-response-msg h5+p,
.layout-ai h5+p,
.gpt-response-msg h6+p,
.layout-ai h6+p {
    margin-top: 0 !important;
}

.layout-ai h1:nth-child(1),
.layout-ai h2:nth-child(1),
.layout-ai h3:nth-child(1),
.layout-ai h4:nth-child(1),
.layout-ai h5:nth-child(1),
.layout-ai h6:nth-child(1) {
    margin-top: 0 !important;
}

.gpt-response-msg p:has(~ ul),
.layout-ai p:has(~ ul),
.gpt-response-msg p:has(~ ol),
.layout-ai p:has(~ ol) {
    margin-bottom: .625em !important;
}

.gpt-response-subject {
    font-weight: bold;
    background: var(--ai-color-25);
    display: inline-block;
    padding: 0.25em .5em;
    color: var(--ai-color);
    border-radius: .75em 0.75em 0em 0em;
}

.gpt-pill,
.ai-pill {
    background: var(--ai-color);
    padding: .5em;
    border-radius: 50%;
    color: white;
}

.gpt-input:focus {
    border-color: var(--ai-color) !important;
    outline: 1px solid var(--ai-color);
}

.gpt-input {
    border: 1px solid var(--ai-color);
}

textarea.gpt-input,
input[type="text"].gpt-input {
    border-radius: .5rem;
    box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
}

.psButton {

    background-color: #f5f5f5;
    border: 1px solid #d0d0d0;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    font-family: Verdana, sans-serif;
    font-size: 1rem;
    line-height: 1.3;
    text-decoration: none;
    font-weight: 700;
    color: #000;
    cursor: pointer;
    background-image: url('../../gfx/btnbg.png?v=3.2.0.0');
    background-position: top;
    background-repeat: repeat-x;
    margin: 2px;
    padding: 2px 3px 3px 2px;
    border-radius: 3px;
}

.psCursor {
    margin: 2.5px;
    cursor: pointer;
    vertical-align: text-bottom;
    text-align: center;
}

.adderatColor,
.adderat,
.buy,
.fc-adderat {
    color: var(--adderat-color-green);
}

.fc-standard {
    color: var(--adderat-color-teal);
}

.fc-agency {
    color: var(--adderat-color-agency);
}

.bg-agency {
    background-color: var(--adderat-color-agency);
}

.bg-agency-light {
    background-color: var(--adderat-color-agency-light);
}

.fc-client {
    color: var(--adderat-color-client);
}

.bg-client {
    background-color: var(--adderat-color-client);
}

.bg-client-light {
    background-color: var(--adderat-color-client-light);
}

.adderat,
.buy {
    font-weight: bold;
}

a {
    text-decoration: none;
    color: #08c;
}

.linkColor {
    color: #08c !important;
}

a.body-color:hover {
    text-decoration: none;
}

a.normal {
    color: #08c;
}

a:focus,
a:active {
    outline: none;
}

hr {
    border: none;
    border-top: solid 1px #c0c0c0;
    margin: 0;
    padding: 0px;
    height: 1px;
}

optgroup {
    font-style: normal;
    font-weight: bold;
    margin: 0px;
}

a:hover {
    text-decoration: underline;
}

.hover:hover a {
    text-decoration: none;
}

.hover.active {
    background-color: var(--body-color);
    color: #fff;
}

.hover.active a {
    color: #fff;
}

.hover.active .active-gray {
    color: #DDD;
}

.hover:not(.active):hover {
    background-color: #c6deec !important;
}

a img {
    border: none;
}

p,
dd,
.lh-sm,
.lh {
    line-height: 1.5;
}

.lh-md {
    line-height: 1.8rem;
}

.lh-lg {
    line-height: 2rem;
}

.lh-0 {
    line-height: 1 !important;
}

dl {
    margin: 0;
}

dd {
    /*padding-left: 10px;*/
    margin-left: 2px;
}

ul,
ol {
    padding: 0;
    margin: 0;
    list-style-position: inside;
}

li ul,
li ol {
    margin-left: 16px;
    margin-bottom: 0;
    margin-top: 0;
}

#helpList li ul {
    padding-left: 16px;
}

#helpList {
    list-style-position: inside;
    float: left;
    border-right: 1px solid #c0c0c0;
    padding-right: 15px;
    margin: 0;
}

#login-logo {
    height: 80px;
    padding: 0;
    position: relative;
}

#login-logo img {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}

.strike {
    text-decoration: line-through;
}

li {
    padding: 2px 0;
    margin: 0;
}

/*
h3:first-letter {
    font-size: 15px;
}*/

/*h3 span:first-letter {
    font-size: 14px;
}*/

.fs-default {
    font-size: 12px;
}

.body-color {
    color: var(--body-color) !important;
}

h1,
h2,
h3 {
    /*color: var(--body-color);*/
    margin: 0;
    font-weight: bold;
    margin-bottom: 0.3rem;
}

#login-main {
    position: relative;
}


#login-top h1 {
    font-size: 1.6rem;
    font-weight: normal;
    letter-spacing: 2px;
    background: #7fa609;
    color: white;
    padding: 0.75rem;
    box-shadow: 0 3px 3px 0 #0000001a;
}

h1 {
    font-size: 26px;
}

h2 {
    font-size: 20px;
}

h3 {
    font-size: 16px;
}

h4 {
    font-size: 14px;
}

/*h2:first-letter {
    font-size: 17px;
}*/

/*h3 {
    font-size: 18px;
    margin-bottom:0.4rem;
    color: #8a8a8a;
}*/
h1 small,
h2 small,
h3 small {
    font-size: 0.6em;
    font-weight: normal;
}



.b-box,
.b-box-all * {
    box-sizing: border-box;
}

.mw100 {
    min-width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}


.cell-shrink {
    width: 0.1%;
    white-space: nowrap;
}

.bw100 {
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.bw50 {
    width: 50%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.bw-half {
    width: 49%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

table.eq-width td:first-child {
    width: 50%;
}

table.eq-width td:last-child {
    width: 50%;
}

.lh3 {
    line-height: 3;
}

table {
    border: 1px solid #eee;
    border-collapse: collapse;
    font-size: 12px;
}


th.hat {
    border: none !important;
    background-image: none !important;
    background: transparent !important;
    padding: 0px !important;
    border-bottom: none !important;
}

th.hat .hat-inner {
    padding: 8px 12px;
    border-radius: 17px 17px 0px 0px;
    margin-left: -1px;
    margin-right: -1px;
    font-size: 1.1em;
    background-color: #fff;
    border: 1px solid #b0b0b0;
    border-top: 3px solid #a1a1a1;
    border-bottom: none;
    color: #7a7a7a;
    background: linear-gradient(0deg, rgb(244, 244, 244) 12%, rgb(255, 255, 255) 30%);
    text-align: center;
}

table th.shrink,
table td.shrink {
    width: 1px;
    white-space: nowrap;
}

table.table-print,
table.table-print td,
table.table-print th {
    border-color: #000;
    vertical-align: top;
    padding: 0.3rem;
    text-shadow: none;
}

table.table-print th {
    background: none;
}

table.table-form-print,
table.table-form-print td,
table.table-form-print th {
    border-color: #000;
    vertical-align: top;
    padding: 2px 5px;
    height: 40px;
    text-shadow: none;
    background: none;
}

table.table-form-print .cell-title {
    font-size: 11px;
}

table.table-sticky {
    position: relative;
}

table.table-sticky thead:first-child th {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 50;
    border-width: 0px;
}

td {
    font-size: .9rem;
    border: 1px solid var(--border-color, #eee);
    /*    min-height: 22px;*/
    /*padding: 1px 3px;*/
    height: 22px;
    padding: 2px;
}

/*table.sortable th.header {
    background-image: url(../../gfx/th.png?v=3.2.0.0); 
    cursor: pointer; 
    background-repeat: repeat-x; 
    background-position: center left; 
    border-right: 1px solid #dad9c7; 
}*/
table:not(.mod17) th,
td.th,
.th td,
.thSim,
span.th {
    color: #446;
    border: 1px solid var(--border-color, #eee);
    background-color: #DADADA;
    background-image: url(../../gfx/th.png?v=3.2.0.0);
    background-position: center;
    background-repeat: repeat-x;
    text-align: left;
    padding: 4px;
    font-weight: bold;
    border-style: double;
    border-bottom: 1px solid var(--border-color, #eee);
    /*background-color: #d5d6d8;*/
    background-color: #dfe0e2;
    /*background-image: none;*/
    /*background: linear-gradient(0deg, rgb(220, 220, 220) 0%, rgb(230, 230, 230) 3%, rgb(245, 245, 245) 100%);*/
}


table:not(.nofs) th:not(.nofs),
table:not(.nofs) td.th:not(.nofs),
table:not(.nofs) .th:not(.nofs) td {
    font-size: .9em;
}

td.blank {
    background: none !important;
    border-color: transparent !important;
}

.splashDialog {
    z-index: 999999999 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 20px !important;
    opacity: 0.9;
}

.splashContent {
    border-radius: 20px !important;
}

.dlg-fw {
    width: 100% !important;
    box-sizing: border-box;
}

.splashDialog .ui-dialog-titlebar,
.splashDialog .ui-resizable-handle {
    display: none;
}

.noClose .ui-dialog-titlebar-close {
    display: none
}

.ui-dialog-content {
    background-color: #fafafa !important;
}

.ui-widget-overlay {
    background-image: none !important;
    background-color: #000 !important;
}

#admPanel,
#admSubPanel {
    background-image: url(../../gfx/panelbg.png?v=3.2.0.0);
    background-repeat: repeat-x;
    background-position: top;
    z-index: 902;
    height: 25px;
    /*line-height: 25px;*/
    position: fixed;
    bottom: 0px;
    left: 1%;
    right: 1%;
    background-color: #e1e1e1;
    border: solid 1px #bbb;
    border-width: 1px 1px 0px 1px;
    padding-left: 5px;
    padding-right: 5px;
    -moz-border-radius: 3px 3px 0px 0px;
    -webkit-border-radius: 3px 3px 0px 0px;
    border-radius: 3px 3px 0px 0px;
    -moz-box-shadow: 0 0 3px #88898A;
    -webkit-box-shadow: 0 0 3px #88898A;
    box-shadow: 0 0 3px #88898A;
}

#admSubPanel {
    bottom: 25px;
    height: auto;
    -moz-border-radius: 3px 3px 0px 0px;
    -webkit-border-radius: 3px 3px 0px 0px;
    border-radius: 3px 3px 0px 0px;
    padding-bottom: 25px;
    padding-top: 5px;
    background-color: white;
    line-height: 1.4;
    z-index: 9998;
    text-align: left;
}

#admSubPanel.left {
    left: 2%;
    right: auto;
    margin-right: auto;
    margin-left: 0px;
}

#admSubPanel.right {
    left: auto;
    right: 1%;
    margin-left: auto;
    margin-right: 0px;
}

#admSubPanel h3 {
    font-size: 12px;
    /*    margin-top: -5px;*/
    padding: 0px;
    padding-bottom: 12px;
    text-align: center;
}

#admPanel .searchIcon {
    height: 16px;
    /*
width: 16px;
    */
    margin-top: 5px;
    margin-right: 5px;
    float: left;
}

#admPanel .separator {
    height: 16px;
    width: 3px;
    vertical-align: middle;
    margin-bottom: 3px;
}

.autoclr:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.inline-block {
    display: inline-block;
    vertical-align: top;
}

.d-block {
    display: block;
}

.clearRight {
    clear: right;
}

.printOnly,
.printOnly-inline {
    display: none;
}

.msgDialog .smallMessageBox {
    overflow-y: scroll;
    height: 200px;
    width: 300px;
    width: 100%;
    border: solid 1px #c0c0c0;
}

.smallMessageBox .last {
    padding-bottom: 5px;
}

.msgSubject {
    font-size: 12px;
    /*
     color: #446;
    */
}

.msgName2 {
    color: gray;
    font-size: 10px;
}

button.msgUnread,
span.msgUnread {
    color: #D12F19 !important;
}

div.msgUnread {
    background-image: url(./icons/unread_letter.png?v=3.2.0.0);
    background-position: top right;
    background-repeat: no-repeat;
}

div.msgRead {

    background-image: url(./icons/open_letter.png?v=3.2.0.0);
    background-position: top right;
    background-repeat: no-repeat;
}



.msgDtDiv {
    /*
        margin-top: -0.5rem;
    */
    font-weight: normal;
    /*
        background-color: #F5F5F5;
        border-left: solid 1px #DDD;
        border-bottom: solid 1px #DDD;
    */
    text-align: right;
}

.msgReadCBLabel {
    padding-right: 16px;
    color: #696969 !important;
}

.msgText {
    width: 99%;
    height: 50px;
}

.msgReadCB {
    margin-top: 2px;
}

.smallMessageBox {
    /*font-size: .9rem;*/
    margin: 0;
    text-align: left;
    /*    background-color: #fefefe;*/
}

.smallMessageBoxWrapper {
    /*margin-left: 10px;*/
    margin-bottom: 10px;
}

.smallMessageBox dl dt {
    /*padding-left: 3px;*/
    /*
     padding-top: 3px;
    */
    padding-top: 3px;
    font-weight: bold;
    border-top: solid 1px #EFEFEF;

    /*background: #fff;*/
    /*margin: 2px;*/
    margin-bottom: 0;
}

.smallMessageBox dl dd {
    margin-bottom: 1px;
    /*background: #fff;*/
    margin: 5px 0px;
}

.smallMessageBox .msgTime {
    font-size: 0.8rem;
    /*
        float: right;
    */
    padding-right: 3px;
}

.smallMessageBox .msgStatus {
    background-color: #F5F5F5;
    border-bottom: solid 1px #c0c0c0;
    padding-top: 1px;
}

.smallMessageBox .today {
    color: black;
}

.smallMessageBox .now {
    color: black;
    background-color: #E6EFC2;
}

.today {
    color: #529214;
}

.history {
    color: #888;
}

.yesterday {
    color: var(--body-color);
}

.today .msgTime {
    color: #529214;
}

.smallMessageBox .yesterday {
    color: var(--body-color);
}

.smallMessageBox .yesterday .msgSubject {
    color: #446;
}

.smallMessageBox .history {
    color: #888;
}

.smallMessageBox .history .msgSubject {
    color: #666;
}

.smallMessageBox dl dd {
    font-weight: normal;
}

table.ui-datepicker-calendar th {
    background-image: none;
    background-color: #fafafa;
    color: #446;
    font-size: .8rem;
}

#searchBox img.ui-datepicker-trigger,
.searchBox img.ui-datepicker-trigger {
    /*
     position: absolute;
    */
    bottom: -4px;
    cursor: pointer;
}

#searchBox table *,
.searchBox table * {
    position: relative !important;
}

#searchBox select.dynSel {
    width: 125px;
}

#searchBox .sb .bold,
#searchBox .sb b,
#searchBox .sb strong {
    color: var(--body-color);
}

#browseBoxName {
    height: 16px;
    position: relative;
    width: 130px;
    overflow: hidden;
    display: block;
    float: left;
    text-align: center;
    white-space: nowrap;
}

#browseBoxName img {
    float: none;
    height: 16px;
    position: absolute;
    right: -1px;
    top: 0;
}

#pageHelp {
    width: 450px;
    background-color: white;
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    padding: 8px;
    padding-top: 0px;
    border: solid 1px #c0c0c0;
    z-index: 10;
}

#pageHelp p {
    line-height: 1.3;
}

li.locked {
    list-style-image: url(../../gfx/lock.png?v=3.2.0.0);
}

div.tab {
    width: 20px;
    height: 10px;
    float: left;
}

span.tab {
    padding-left: 20px;
}

button.icon {
    width: 28px;
}

.ui-dialog-content p,
.paragraphs p {
    line-height: 1.4;
    margin-bottom: 1rem;
}

.ui-dialog-content p.nmb {
    margin-bottom: 0;
}

.ui-resizable-helper {
    border: 2px dotted gray;
    z-index: 999999;
}


.title-sm {
    font-size: 12px;
    color: #88898A;
    font-weight: bold;
}

.title-success {
    color: var(--adderat-color-green) !important;
}

.title {
    font-size: 18px;
    color: var(--body-color);
    font-weight: bold;
    padding: 3px 0;
    margin: 0;
    line-height: 1.1rem;
    margin-bottom: 2px;
}


.title-md {
    font-size: 14px;
    font-weight: bold;
    color: #B0B0B1;
}

.addBox .title {
    padding-top: 0px;
    font-size: 1.0rem;
}

.title td,
td.title {
    border-top: none;
    border-bottom: solid 1px #c0c0c0;
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
    height: 35px;
    vertical-align: bottom;
    padding-bottom: 2px;
    padding-left: 0px;
}

.debugBox {
    background-color: #E6EFC2;
    padding: 4px;
    border: solid 1px #c0d372;
    font-family: monospace, "Courier New", Courier;
    font-size: 12px;
    color: #363f14;
    word-wrap: break-word;
    min-width: 600px;
}

.debugBox .gray {
    color: #7d922e;
}

.infoBox {
    background-color: #deedf5;
    padding: 5px;
    border: solid 1px #c0dcef;
    font-size: 12px;
    color: #225577;
    border-bottom: solid 2px #225577;
}

.helpBox {
    background-repeat: no-repeat;
    background-position: 10px 10px;
    margin: 10px 0;
    padding: 15px 10px 15px 50px;
    background-image: url(./icons/help32.png?v=3.2.0.0);
    background-color: #fff;
    /*border:solid 1px #ddd;*/
    border-radius: 10px;
    box-shadow: 0 7px 10px #ccc;
}

.nfo-email,
.nfo-phone {
    background-repeat: no-repeat;
    background-position: 0 50%;
    margin: 2px 0px;
    padding-left: 20px;
    padding-top: 2px;
}

.nfo-email {
    background-image: url(./icons/letter.png?v=3.2.0.0);
}

.nfo-phone {
    background-image: url(./icons/phone.png?v=3.2.0.0);
}

.warnBox {
    padding: 5px;
    border: solid 1px #E00;
    font-size: 12px;
    color: #E00;
    font-weight: bold;
    box-shadow: #E00 0px 0px 5px;
    border-radius: 5px;
}

.errorBox {
    background-color: #ee0000;
    padding: 5px;
    border: solid 1px #ffb0b0;
    font-size: 12px;
    color: #fff;
    border-bottom: solid 2px #ff0000;
    font-weight: bold;
}

input.error,
select.error {
    background-color: #ff8888;
}

input.warning {
    background-color: #ffcc66;
}

span.error,
p.error,
b.error,
div.error,
ul.error,
li.error,
ol.error {
    color: #E00;
}

td.error {
    background-color: #f2dede;
    color: #721c24;
}

.fc-warning {
    color: #856404;
}

.fc-white {
    color: #fff;
}

.warning {
    color: #856404;
    background-color: #fff3cd;
}

.border-warning {
    border-color: #ffeeba;
}

textarea.error {
    background-color: #f2dede !important;
    color: #721c24 !important;
    border: 1px solid #dd9ca3 !important;
}

.white-space--pre {
    white-space: pre;
}

.white-space--pre-wrap {
    white-space: pre-wrap;
}

.white-space-pre-line {
    white-space: pre-line;
}

.disabled-plain:disabled {
    border: none !important;
    background: transparent !important;
}

.inactive input,
.inactive select,
.inactive textarea {
    color: #696969;
    background-color: #f0f0f0;
}

.errorBorder {
    border: solid 2px red !important;
}

.border-error-b {
    border-bottom: solid 2px red !important;
}

.notificationBar,
.obs {
    padding: 1px;
    padding-left: 3px;
    /*    background-color: #fff;*/
    color: #555;
    border-left: solid 5px #ffcc33;
}

.nfo,
.dimNfo,
.dimNfoRight {
    padding: 1px;
    border-left: solid 5px #4aa5ff;
    padding-left: 3px;
    color: #555;
    font-size: 12px;
    line-height: 1.4;
}

.nfoBlue,
.nfoInfo {
    color: #0075c4;
}

.nfoWarning {
    color: #bf8110;
    border-color: #bf8110;
}

.nfoDanger {
    color: #dc3545;
    border-color: #dc3545;
}

.dimNfo,
.dimNfoRight {
    border-color: #A6A9AC;
    color: #696969;
}

.dimNfoRight {
    text-align: right;
    border-left: none;
    border-right-style: solid;
    border-right-width: 5px;
    padding-left: 0px;
    padding-right: 3px;
}

.ui-dialog-content .obs,
.ui-dialog-content .notificationBar {
    background-color: transparent;
}

.pad0,
.p-none {
    padding: 0px !important;
}

.pl-none {
    padding-left: 0px !important;
}

.pt-none {
    padding-top: 0px !important;
}

.pb-none {
    padding-bottom: 0px !important;
}

.pr-none {
    padding-right: 0px !important;
}

.px-none {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.py-none {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.py-xs,
.py-xs td {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.py-sm,
.py-sm td {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

.py-md {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.py-lg {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

.px-xs {
    padding-left: 2px !important;
    padding-right: 2px !important;
}

.px-sm {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.px-md {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.px-lg {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.padding {
    padding: 5px;
}

.padding-xs {
    padding: 2px;
}

.p-3px {
    padding: 3px;
}

.padding-sm {
    padding: 4px;
}

.padding-2x {
    padding: 10px;
}

.padding-lg {
    padding: 16px;
}

.padding-xl {
    padding: 2rem;
}

.padding-md {
    padding: 8px;
}

.margin {
    margin: 5px;
}

.m-xs {
    margin: 2px;
}

.padH {
    padding-right: 5px;
    padding-left: 5px;
}

.padT,
.pt {
    padding-top: 5px;
}

.padV,
.padV td {
    padding-top: 5px;
    padding-bottom: 5px;
}

.padB,
.padB td,
.pb {
    padding-bottom: 5px;
}

.pb-md {
    padding-bottom: 1.2rem;
}

.pb-lg {
    padding-bottom: 2.0rem;
}

.pt-xs {
    padding-top: 2px !important;
}

.pt-1 {
    padding-top: 1rem;
}

.pt-md {
    padding-top: 1.2rem;
}

.pt-lg {
    padding-top: 2.0rem;
}


.pad6 td {
    padding: 6px;
}

.pr {
    padding-right: 5px !important;
}

.pr-2x {
    padding-right: 10px;
}

.pr-xs {
    padding-right: 2px !important;
}

.pr-sm {
    padding-right: 4px !important;
}

.pr-md {
    padding-right: 1.2rem !important;
}

.pr-lg {
    padding-right: 2rem !important;
}


.pl,
.pl-sm {
    padding-left: 5px !important;
}

.pl-md {
    padding-left: 1.2rem;
}

.pl-1 {
    padding-left: 1em;
}

.pl-lg {
    padding-left: 2rem;
}

.mt,
.mt-sm {
    margin-top: 5px;
}

.mt-2x {
    margin-top: 10px !important;
}

.mt-md {
    margin-top: 1.2rem;
}

.mt-lg {
    margin-top: 2rem;
}

.mt-xl {
    margin-top: 3.5rem;
}

.mt-xxl {
    margin-top: 6rem;
}

.mt-xs {
    margin-top: 2px;
}

.mb,
.mb-sm {
    margin-bottom: 5px;
}

.mb-xs {
    margin-bottom: 2px;
}

.mb-md {
    margin-bottom: 1.2rem;
}

.mb-mds {
    margin-bottom: 0.8rem;
}

.mb-lg {
    margin-bottom: 2rem;
}

.mb-xl {
    margin-bottom: 3.5rem;
}

.mb-xxl {
    margin-bottom: 6rem;
}

.pb-xxl {
    padding-bottom: 6rem;
}

.ml,
.ml-sm {
    margin-left: 5px;
}

.ml-md {
    margin-left: 1.2rem !important;
}

.ml-lg {
    margin-left: 2rem !important;
}

.ml-xl {
    margin-left: 3.5rem !important;
}

.mr,
.mr-sm {
    margin-right: 5px;
}

.mr-md {
    margin-right: 1.2rem !important;
}

.mr-lg {
    margin-right: 2rem !important;
}

.mr-xl {
    margin-right: 3.5rem !important;
}

.mr-xs {
    margin-right: 2px !important;
}

.mt0 {
    margin-top: 0;
}

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

.ml0 {
    margin-left: 0;
}

.mr0 {
    margin-right: 0;
}

.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

.underline,
.underlineA a,
.underlineTD td {
    text-decoration: underline;
}

div.hover:hover,
table.hoverY td.hover,
table.mouseover tr:not(.blank):hover td:not(.th),
table.hoverX>tbody>tr:not(.blank):not(.noHover):hover>td:not(.th):not(.saved) {
    background-color: #fcf8e3 !important;
}

div.hoverX:hover {
    background-color: #fcf8e3 !important;
}

table.hoverX.hover-outline>tbody>tr:not(.blank):not(.noHover):hover {
    outline: 1px solid rgba(255, 233, 125, .5);
}

.hover-gray:hover {
    background-color: #f5f6f7 !important;
}

.page-task {
    margin-left: -5px;
    padding-left: 5px;
}

ul.hoverX li:not(.active):hover {
    background-color: #fcf8e3 !important;
    color: #446 !important;
}

table.hoverX-medium tbody tr:hover td {
    background-color: #f5f5f5 !important;
}

.hidden {
    display: none !important;
}

.bold,
.bold var,
tr.bold td {
    font-weight: bold !important;
}

.fw-bold {
    font-weight: bold;
}

.fw-bolder {
    font-weight: bolder;
}

.fw-thin {
    font-weight: 100;
}

.fw-light {
    font-weight: 300;
}

.fw-black {
    font-weight: 900;
}

.fw-semi-bold {
    font-weight: 600;
}

.fw-roboto-semi-bold {
    font-weight: 500;
}

.em {
    font-style: italic;
}

.normal {
    font-weight: normal;
}

.fs-xs {
    font-size: 9px;
}

.fs-xxs {
    font-size: 8px;
}

.fs-sm,
.fs-sm input,
.fs-sm select {
    font-size: 10px;
}

.fs-smd {
    font-size: 11px;
}

.fs {
    font-size: 12px;
}

.fs-md {
    font-size: 14px;
}

.fs-mds {
    font-size: 13px;
}

.fs-lg {
    font-size: 16px;
}

input.fs-lg {
    font-size: 16px !important;
}

.fs-xl {
    font-size: 18px;
}

.fs-title {
    font-size: 20px;
}

.fs-xxl {
    font-size: 24px;
}

.fs110 {
    font-size: 1.1rem;
}

.bigger,
.fs115 {
    font-size: 1.15rem;
}

.fs120 {
    font-size: 1.2rem;
}

.big,
.fs13,
.fs130 {
    font-size: 1.3rem;
}

.smaller,
.fs085 {
    font-size: 0.85em;
}

.fs080,
.fs08 {
    font-size: 0.8rem;
}

.fs08-all,
.fs08-all * {
    font-size: 0.8rem !important;
}


.smaller2,
.fs09,
.fs090 {
    font-size: 0.9rem;
}

.small,
.fs075 {
    font-size: 0.75em;
}

.fs12px {
    font-size: 12px;
}

.fs10px {
    font-size: 10px;
}

.fs11px {
    font-size: 11px;
}

.fs09em {
    font-size: 0.9em;
}

a.normal {
    font-weight: normal;
    font-size: 12px;
    font-variant: normal;
    letter-spacing: normal;
}

span.normal {
    font-variant: normal;
    letter-spacing: 0px;
}

.inactive {
    color: #b0b0b0;
}



.filler {
    height: 8px;
}

.clearFix,
.clearfix {
    clear: both;
    height: 0;
    font-size: 0;
    line-height: 0;
}

.clearBoth {
    clear: both;
}

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

.word-wrap {
    white-space: normal;
}

.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.email,
.email input {
    width: 200px;
    box-sizing: border-box;
}

.integer,
.integer input {
    width: 40px;
    box-sizing: border-box;
}

.double,
.double input {
    width: 77px;
    box-sizing: border-box;
}

.smallDouble,
.smallDouble input,
.smallTime,
.smallTime input {
    width: 40px;
    box-sizing: border-box;
}

.percent,
.percent input {
    width: 42px;
    box-sizing: border-box;
}

.string {
    width: 150px;
    box-sizing: border-box;
}

.time,
.datetime {
    /*
     width: 40px;
    */
    text-align: center;
    padding: 0 4px;
    box-sizing: border-box;
}

.time input,
.datetime input {
    width: 50px;
    box-sizing: border-box;
}

input.iw-xs,
.iw-xs {
    box-sizing: border-box;
    width: 20px;
}

input.iw-sm,
.iw-sm {
    box-sizing: border-box;
    width: 40px;
}

input.iw-80,
.iw-80 {
    box-sizing: border-box;
    width: 80px;
}

input.iw-md,
.iw-md {
    box-sizing: border-box;
    width: 110px;
}

input.iw-lg,
.iw-lg {
    box-sizing: border-box;
    width: 140px;
}

input.iw-lg-lg,
.iw-lg-lg {
    box-sizing: border-box;
    width: 160px;
}

input.iw-email,
.iw-email {
    box-sizing: border-box;
    width: 200px;
}

input.iw-time,
.iw-time {
    box-sizing: border-box;
    width: 5em;
}

input[type="time"].iw-time {
    width: 6em;
}

.iw-time-md {
    width: 6em;
}

input.iw-xl,
.iw-xl {
    box-sizing: border-box;
    width: 235px;
}

input.iw-xxl,
.iw-xxl {
    box-sizing: border-box;
    width: 300px;
}

input.fs-xs,
select.fs-xs {
    padding-top: 5px;
    padding-bottom: 5px;
}

.check-before::before {
    text-align: left;
    background-color: transparent;
    content: "\f00c";
    margin-top: 1px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    margin-right: 0.5em;
}

.check-after::after {
    text-align: left;
    background-color: transparent;
    content: "\f00c";
    margin-top: 1px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    margin-left: 0.5em;
}

.iw-item {
    /*display: inline-block;*/
    padding: 2px;
    margin: 5px;
}

.mw-full {
    min-width: 100%;
}

.mw-50 {
    min-width: 50px;
}

.mw-xs {
    min-width: 40px;
}

.mw-sm {
    min-width: 60px;
}

.mw-md {
    min-width: 110px;
}

.mw-lg {
    min-width: 140px;
}

.mw-lg-lg {
    min-width: 190px;
}

.mw-xl {
    min-width: 235px;
}

.fw-sm,
.fw-md,
.fw-lg,
.fw-xl {
    word-break: break-all;
}

.fw-sm {
    width: 60px;
}

.fw-md {
    width: 110px;
}

.fw-lg {
    box-sizing: border-box;
    width: 22%;
    min-width: 140px;
}

.fw-xl {
    width: 235px;
}

.fullName {
    width: 180px;
}

.date {
    width: 98px;
}

.filterInfo {
    color: #529214;
}

.lit {
    /*
     border: solid 2px #ff8033;
    */
    border: solid 3px #ffcc33 !important;
}

.litColor {
    color: #0080aa !important;
    cursor: crosshair !important;
}

.ui-effects-transfer {
    border: solid 2px black;
    z-index: 10000;
}

.ocr-effect-transfer {
    background-color: #1dc116;
    opacity: 0.2;
    border: none;
    /*    border: solid 1px #1dc116;
        border-width: 4px 1px 4px 1px;
        border-right: solid 2px #1dc116;
        z-index: 10000;*/
}

.litBorder {
    border-color: #0080aa !important;
}

table.litBorder {
    border-color: #0080aa !important;
    border-width: 2px !important;
}

.litBg {
    background-color: #aaeaff !important;
}

.blueBg,
.calChecked {
    background-color: #00c0ff !important;
}

.litBgE,
.litBgE td {
    background-color: #ffaaaa !important;
}

.litBgE td {
    border-color: #ff9090 !important;
}

/*
#searchDetails .s_item {
    cursor: default;
}
*/

.badge,
.blueLabel,
.redLabel,
.greenLabel,
.whiteLabel,
.orangeLabel,
.blackLabel {
    display: inline-block;
    padding: 0.3em 0.5em;
    font-size: 0.8em;
    font-weight: 700;
    line-height: 1.1em;
    text-align: center;
    white-space: nowrap;
    border-radius: 1em;
    text-shadow: none;
}

.badge-fs {
    font-size: 1em;
    line-height: 1.5em;
}

.redLabel,
.blackLabel,
.blueLabel {
    color: #fff;
}

.badge-danger {
    color: #fff;
    background-color: #dc3545;
}

.badge-dark {
    color: #fff;
    background-color: var(--body-color);
}

.badge-light {
    color: var(--body-color);
    background-color: rgba(255, 255, 255, 0.75)
}

.badge-gray {
    color: var(--body-color);
    background-color: rgba(237, 238, 239, 0.75);
}


.em td,
td.em {
    background-image: none !important;
    background-color: #ccc !important;
}

.blackLabel {
    color: #fff;
    background-color: var(--body-color);
    border: solid 1px var(--body-color);
}

.orangeLabel {
    color: #fff;
    background-color: #ff9933;
    border: solid 1px #ff9933;
}

.blueLabel {
    color: #fff;
    background-color: #00acff;
    border: solid 1px #00acff;
}

.box-border {
    border: solid 5px #cacaca;
}

.bg-adderat {
    background-color: #88b00e !important;
}

.dark-dark-bg,
.bg-dark-dark {
    background-color: #88898A;
}

.dark-bg,
.bg-dark {
    background-color: #eee !important;
}

.medium-bg,
.bg-medium {
    background-color: #f4f5f6 !important;
}

.bg-medium-dark {
    background-color: #e4e7ea !important;
}

.light-bg,
.bg-light {
    background-color: #eee !important;
}

.light-light-bg,
.bg-light-light {
    background-color: #fff;
}

.blue-gray-box {
    background-color: #e0eaf0;
    color: #404a50;
}

.bg-gold-light {
    background-color: #fff6d1;
}

.fc-gold {
    color: #9e7f10 !important;
}

.fc-gold-light {
    color: #bbad80 !important;
}

.border-gold {
    border: 1px solid #9e7f10;
}

.box-gold {
    background-color: #fff6d1;
    border: 1px solid #fde6b4;
}

.newBg {
    background-color: #dff0d8 !important;
}

.lightBlueBg {
    background-color: #c7ecff;
}

.lightGrayBg,
.bg-light-gray {
    background-color: #f6f9fa !important;
}

.darkGrayBg,
.bg-dark-gray {
    background-color: #aaa;
}

.bg-medium-gray {
    background-color: #ccc;
}


.lightYellowBg {
    background-color: #FFFFCC !important;
}

.whiteBg {
    background-color: #FFFFFF !important;
}

.redLabel {
    background-color: #ff3300;
    border: solid 1px #ff3300;
}

.greenLabel {
    background-color: #99dd00;
    border: solid 1px #99dd00;
}

.whiteLabel {
    background-color: #ffffff;
    border: solid 1px #EAEAEA;
    color: black;
}

.border-danger {
    border-color: #e00 !important;
}

.border-info {
    border-color: #3a87ad !important;
}

.border-blue-light {
    border-color: #E0EAEF !important;
}

.noBorder {
    border: none;
}

.noBorder td {
    border: none !important;
}

.noBorder th {
    border: none !important;
}

.noBorder .th {
    border: none !important;
}

.no-top-border,
.no-top-border td,
.no-top-border th {
    border-top-width: 0px;
    border-top-color: transparent;
}

.no-bottom-border,
.no-bottom-border td,
.no-bottom-border th {
    border-bottom-width: 0px !important;
    border-bottom-color: transparent !important;
}

.no-x-border,
.no-x-border td,
.no-x-border th {
    border-top-width: 0px;
    border-top-color: transparent;
    border-bottom-width: 0px !important;
    border-bottom-color: transparent !important;
}

.noTdHeight td {
    height: auto !important;
}

.smallThPadH th {
    padding-top: 1px;
    padding-bottom: 1px;
}

.noStyle {
    border: none;
}

.noStyle th,
.noStyle td {
    border: none;
    background: none;
    font-size: 1em !important;
}

th.noStyle {
    background: none;
    border: none;
}

tr.no-bg td,
tr.no-bg th,
td.no-bg {
    background: none !important;
}

tr.no-border th {
    border: none !important;
}

tr.no-height td,
tr.no-height th {

    height: auto !important;
}

table.border-white td,
table.border-white th {
    border-color: #fff;
}

table.border-dark td,
table.border-dark th {
    border-color: var(--body-color) !important;
}

table.border-green td,
table.border-green th {
    border-color: #529214 !important;
}

.mce-editor {
    border: 2px solid #eee;
    border-radius: .5rem;
    padding: 1rem;
    background: white;
    min-height: 18px;
}

.mce {
    position: relative;
}

.mce-inline .mce-editor {
    /* margin-top: 1rem; */
    border: 1px solid rgba(0, 0, 0, .1);
    /* box-shadow: 0 1px 2px rgba(0, 0, 0, .1); */
    /* margin-bottom: 1rem; */
}

.mce ul,
.mce li,
.mce p {
    padding: unset;
    margin: unset;
}

.mce ul {
    list-style-position: unset;
    padding-left: 40px;
    margin: 12px 0;
}

.mce h1,
.mce h2,
.mce h3,
.mce h4,
.mce h5,
.mce h6 {
    margin: 0.75em 0;
}

.mce .mce-edit-btn {
    text-align: right;
    background-color: transparent;
    color: #08c;
    display: block;
    padding: 4px;
    position: absolute;
    top: 4px;
    right: 4px;
    cursor: pointer;
    z-index: 2;
}

tr.no-pad-h td,
tr.no-pad-h th {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}

table.plain-body tbody tr td {
    border: none !important;
    background: transparent !important;
}

table.plain-head thead tr th {
    border: none;
}


table.plain {
    border: none !important;
}

table.plain th,
table.plain td {
    background-color: transparent;
    background-image: none;
    margin: 0;
    padding: 3px;
    border: none !important;
    text-shadow: none;
}

table.nofs td,
table.nofs th {
    font-size: 1em !important;
}

table.aligned tr th {
    vertical-align: bottom !important;
}

table.aligned tr td {
    vertical-align: top !important;
}

table.wide th:not(:first-child),
table.wide td:not(:first-child) {
    padding-left: 10px !important;
}

table.wide th:not(:last-child),
table.wide td:not(:last-child) {
    padding-right: 10px !important;
}

table.wide-md th:not(:first-child),
table.wide-md td:not(:first-child) {
    padding-left: 20px !important;
}

table.wide-md th:not(:last-child),
table.wide-md td:not(:last-child) {
    padding-right: 20px !important;
}


td>pre {
    margin: 0;
    padding: 0;
}

.userReport {
    zoom: 1;
    padding: 0px;
    border: none;
    margin: 0px;
}

.userReport td,
.userReport th {
    border: none;
    padding: 1px 10px 1px 0px;
    background-image: none;
    font-size: 12px;
    color: #000;
    vertical-align: middle;
}

table.userReport td {
    height: auto;
    padding-right: 10px;
}

.warn {
    color: #E00 !important;
}

span.warn,
div.warn,
td.warn,
th.warn,
p.warn {
    border-bottom: dashed 1px #F99;
    cursor: help;
}

a.warn {
    border-bottom: dashed 1px #F99;
    cursor: pointer;
}

a.warn:hover {
    text-decoration: none;
}

.warnColor {
    color: #E00;
}

input.warn {
    cursor: auto;
}

tr.warn td {
    border: dashed 2px #F99;
    background-color: #f2dede;
}

tr.error td {
    background-color: #f2dede;
    color: #e00;
}

div.info {
    color: #369;
}

.txt {
    color: var(--body-color);
}

#bubble,
.multiBubble {
    height: 15px;
}

#bubble,
.multiBubble,
#bubble-r {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 1000;
    display: none;
    zoom: 1;
    font-size: 12px;
    border: 1px solid #000;
    background-color: #FFF;
    border-radius: 0px 3px 3px 3px;
    -moz-box-shadow: 0 0 3px #88898A;
    -webkit-box-shadow: 0 0 3px #88898A;
    box-shadow: 0 0 3px #88898A;
    padding: 2px 5px;
    font-weight: bold;
    white-space: nowrap;
}

#bubble .html,
#bubble-r .html,
.multiBubble .html {
    padding-right: 8px;
}

.multiBubble {
    color: #C00;
    font-weight: bold;
}

#bubble #bubbleArrow,
.multiBubble .bubbleArrow {
    display: none;
    position: absolute;
    z-index: 1001;
    bottom: 0;
    left: 15px;
    margin-bottom: -5px;
}

#bubbleArrow-r,
.multiBubbleArrow {
    display: none;
    position: absolute;
    z-index: 1001;
    bottom: 0;
    left: -6px;
    top: 4px;
}

#bubbleX,
.bubbleX {
    position: absolute;
    top: -2px;
    right: -2px;
}

#helpArrow-r {
    display: none;
    position: absolute;
    z-index: 1001;
    bottom: 0;
    left: -8px;
    top: 6px;
}

#bubble span,
#bubble-r span,
.inputRef,
.multiBubble span {
    border: 1px dotted #446;
    padding: 0px 2px;
}

#quickHelp {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 2000;
    display: none;
    zoom: 1;
    font-size: 12px;
    border: 1px solid #000;
    background-color: #FFF;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0 0 3px #88898A;
    -webkit-box-shadow: 0 0 3px #88898A;
    box-shadow: 0 0 3px #88898A;
    padding: 2px 5px;
    font-weight: bold;
    white-space: nowrap;
}

#generalQuickHelp {
    float: right;
    z-index: 1000;
    display: none;
    zoom: 1;
    font-size: 12px;
    padding: 2px 5px;
    white-space: nowrap;
    height: 100%;
    color: gray;
}

#qeGeneralTitle {
    display: none;
    float: right;
    padding-right: 3px;
}

#quickHelpToolbar .negative {
    color: black;
}

#quickHelp .html,
#generalQuickHelp .generalHtml {
    font-weight: normal;
    white-space: normal;
}

#quickHelp .html img,
#generalQuickHelp .generalHtml img,
.simButton {
    padding: 3px;
    background-color: #f5f5f5;
    border: 1px solid #d0d0d0;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    background-image: url(../../gfx/btnbg.png?v=3.2.0.0);
    background-position: top;
    background-repeat: repeat-x;
}

.simButton {
    padding: 3px !important;
    border-radius: 3px;
}

#quickHelp .html button img,
#generalQuickHelp .generalHtml button img {
    padding: 0px;
    border: none;
    background: none;
}

#quickHelpToolbar {
    height: 22px;
}

#quickHelpToolbar button {
    padding: 0px;
    width: 24px;
    height: 22px;
}

#qeSaveBtn {
    display: none;
}

#generalQuickHelp {
    float: right;
}

#qeSiteTitle {
    padding-right: 50px;
}

#qeGeneralTitle {
    padding-right: 25px;
}

#qeXBtn {
    position: absolute;
    top: 0px;
    right: 0px;
}

#qeBtn {
    position: absolute;
    top: 0px;
    right: 24px;
}

.q {
    /* margin: 0 2px; */
    white-space: nowrap;
}

.q i {
    color: rgba(0,0,0,.3) !important;
    font-size: 11px !important;
}
.q i:hover {
    color: rgba(0,0,0,.75) !important;
}

td .q {
    float: right;
}

.summary {
    background-color: #FFF;
    font-size: 1.1rem;
}

.smallTextarea {
    width: 150px;
    height: 34px;
}

.mediumTextarea {
    width: 400px;
    height: 200px;
}

.bigTextarea {
    width: 600px;
    height: 400px;
}

.size200x200 {
    height: 200px;
    width: 200px;
}

var {
    text-decoration: none;
    /*
     font-weight: 400;
    */
    font-style: normal;
}

var.checked {
    background-image: url(../../gfx/checked.png?v=3.2.0.0);
    background-position: center;
    background-repeat: no-repeat;
    width: 10px;
    height: 10px;
    display: block;
}

.addBox {
    display: none;
    z-index: 99999999;
    background-color: #FFF;
    border: 1px solid #c0c0c0;
    position: absolute;
    top: 0px;
    left: 0px;
    margin: 0;
    padding: 4px;
    zoom: 1;
}

.addBox table {
    margin: 0 0 4px;
}

#searchBox,
.searchBox {
    /*
        margin-top: -7px;
    */
    margin-top: -3px;

    zoom: 1;
    position: relative;
    display: none;
    font-size: .9rem;
    margin-bottom: 10px;
    border: 1px solid #c0c0c0;
    border-bottom: solid 2px #c0c0c0;

    /*
    border-top: solid 1px #d0d0d0;
    */

    background-color: #fff;
    /*
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    */
    border-radius: 5px;
    padding: 3px;
    /*
            background-image: url(../../gfx/shadow.png?v=3.2.0.0);
            background-position: top;
            background-repeat: repeat-x;
    */
}

#searchBox #searchButtons,
.searchBox .searchButtons {
    padding: 5px 0px 0px 0px;
    margin: 0;
    clear: both;
    min-height: 16px;
    float: none;
    border: none;
    /*
            border-top: solid 1px #ddd;
    */
    background-image: none;
    background-color: #fff;
    margin-top: 5px;
    border-radius: 0px;
    /*
            filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    */
}

.searchBox {
    display: block;
}

#searchBox .sb,
.searchBox .sb {
    float: left;
}

#searchBox .sb,
.searchBox .sb,
.box {

    border: solid 1px #ddd;
    border-radius: 3px;
    background-color: #fafafa;
    padding: 3px;
    min-height: 60px;
}

.box.box-nh {
    min-height: 1px;
}

.cell-box {
    border: 1px solid #fff;
    /* box-shadow: 0 0 1px 0 #0002; */
    border-radius: 3px;
}


.cell-box>*:first-child {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.cell-box>*:last-child {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.grid {
    display: grid;
}

.grid-item-sm {
    padding: 3px;
}

.grid-1 {
    grid-template-columns: repeat(1, auto);
}

.grid-2 {
    grid-template-columns: repeat(2, auto);
}

.grid-3 {
    grid-template-columns: repeat(3, auto);
}

.grid-4 {
    grid-template-columns: repeat(4, auto);
}

.grid-5 {
    grid-template-columns: repeat(5, auto);
}

.grid-6 {
    grid-template-columns: repeat(6, auto);
}



.mh-0 {
    min-height: 0px !important;
}

.sb-list {
    max-height: 125px !important;
    overflow-y: auto !important;
    min-width: 200px !important;
    background: #eee;
    border-top: solid 1px #c0c0c0;
    padding: 2px;
}

.sb-list .sb {
    float: none !important;
    margin-bottom: 5px !important;
    word-break: keep-all;
    white-space: nowrap;
}

.sb-list select,
.sb-list input[type=text] {
    box-sizing: border-box;
    width: 100%;
    max-width: 200px;
    display: block;
    float: none;
    clear: both;
    margin-bottom: 2px;
}

.box {
    background: #f6f9fa;
    padding: 5px;
}

#searchBox .box {
    background: #fafafa;
}

.box-inline {
    display: inline-block;
}

.box-spaced {
    padding: 10px !important;
    margin-top: 10px;
    margin-bottom: 10px;
}

.box-pad {
    padding: 10px !important;
}

.boxNH {
    border: solid 1px #ddd;
    border-radius: 3px;
    background-color: #fafafa;
    padding: 3px;
}

table.mod17.table-panel th {
    background-color: #f4f5f6;
    padding: 10px;
    /*color: #646566;*/
    text-shadow: none;
}

table.mod17.table-panel th,
table.mod17.table-panel td {
    border: 1px solid #e0e1e2;
}


.panel,
.panel-sm {
    border: solid 1px #e0e1e2;
    border-radius: 3px;
    background-color: #fcfdfe;
    border-bottom-color: #cccdce;
}

.panel-sm {
    padding: .5rem;
}

.panel,
.panel-header,
.panel-sub-header {
    padding: 10px;
}

.panel-np .panel-body {
    padding: 10px;
}

.panel .panel-header {
    border: solid 1px #e0e1e2;
    margin-left: -11px;
    margin-top: -11px;
    margin-right: -11px;
    margin-bottom: 10px;
    background: #f4f5f6;
    font-weight: bold;
    border-radius: 3px 3px 0 0;
    color: #646566;
    border-bottom: 1px solid #e2e9f0;

}

.panel.panel-np,
.panel-np .panel-header {
    margin: 0;
}

.panel-np .panel-header {
    border-top: none;
    border-left: none;
    border-right: none;
}

.panel-np .panel-header-sub {
    border-top: solid 1px #e0e1e2;
    border-radius: unset;
}

.panel.panel-np {
    padding: 0px;
}

.panel .panel-body-np {
    margin: -10px;
}

.bg-panel {
    background-color: #fcfdfe;
}

.panel-t {
    border-bottom-color: #f6f9fa;
}

.panel-b {
    border-top-color: #eee;
}

.panel .panel-grp-name {
    color: #88898A;
    padding-bottom: 4px;
    margin-top: -5px;
    font-size: 11px;
    border-bottom: solid 1px #ececec;
    margin-bottom: 4px;
}


.mainBox {
    border: solid 1px #c0c0c0;
    border-radius: 3px;
    background-color: #FAFAFA;
    padding: 5px;
    -webkit-box-shadow: 0 2px 0px 0 #ddd;
    -moz-box-shadow: 0 2px 0px 0 #ddd;
    box-shadow: 0 2px 0px 0 #ddd;
    background: #fcfdfe;
    /* Old browsers */
    background: -moz-linear-gradient(top, #fcfdfe 0%, #f5f5f5 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcfdfe), color-stop(100%, #f5f5f5));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #fcfdfe 0%, #f5f5f5 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #fcfdfe 0%, #f5f5f5 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #fcfdfe 0%, #f5f5f5 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #fcfdfe 0%, #f5f5f5 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfdfe', endColorstr='#f5f5f5', GradientType=0);
    /* IE6-9 */

}

/*
#searchBox .sb *, .searchBox .sb * {
    margin: 1px;
    position: relative;
}*/

#searchBox .sb {
    margin: 1px;
}

/*select.combo, .select2-container {
    width: 175px !important;
}*/

.select-nofloat.select2-container-multi .select2-choices li {
    float: none !important;
}

#searchBox .sb .sb,
.searchBox .sb .sb {
    border: none;
    float: left;
    background: none;
    margin-top: 0;
    padding-top: 0;
    min-height: 16px;
}

#searchBox table,
.searchBox table {
    border: none;
    margin: 0;
    padding: 0;
}

#searchBox th,
#searchBox td,
.searchBox th,
.searchBox td {
    border: none;
    background: none;
    margin: 0;
    padding: 0;
}

table.mod23 {
    font-size: 1rem !important;
    border: none;
    color: var(--body-color);
}

table.mod23 td {
    vertical-align: middle;
    border: none;
}

table.mod23 th,
table.mod23 td {
    font-size: 1rem !important;
    height: auto;
    padding: 8px 10px !important;
    margin: 0;
}

table.mod23 tr td:first-child {
    border-left: none;
}

table.mod23 tr td:last-child {
    border-right: none;
}

table.mod23.nth>tbody>tr:not(.noStripe):nth-child(even),
table.mod23.nth-white tbody tr:not(.noStripe):nth-child(even) {
    background-color: #fff;
}

table.mod23.nth>tbody>tr:not(.noStripe):nth-child(odd),
table.mod23.nth-white tbody tr:not(.noStripe):nth-child(odd) {
    background-color: #fafafa;
}

pre.nth code:nth-child(odd) {
    background-color: #f5f5f5;
}

table.mod23 th,
table.mod23 .th,
table.mod23 tr.th {
    background-color: #fff !important;
    vertical-align: bottom;
    background-image: none !important;
    border: none !important;
    border-bottom: 1px solid #a6a9ac !important;
    text-shadow: none !important;
}

table.mod23 th div {
    text-shadow: none !important;
}

table.sortable.mod23 th.header:not(.no-sort)::after,
table.sortable.mod23 th.header:not(.no-sort)::before {
    color: var(--body-color);
    vertical-align: bottom;
    text-shadow: none !important;
}

table.sortable.mod23 th.header:not(.no-sort):before {
    vertical-align: bottom;
}

table.mod23 th .q {
    display: none;
}

table.mod23 th .q i {
    vertical-align: bottom;
}


/**/

table.mod17 tr.blank td {
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}


table.mod17 {
    font-size: 12px !important;
    border: none;
    color: var(--body-color);
}

table.mod17 tr.blank td {
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}

.borderColor {
    color: #E0E0E0;
}

table.mod17 .th.alt-th,
table.mod17 th.alt-th,
table.mod17 tr.alt-th th,
table.mod17 tr.alt-th .th,
.bg-gray {
    background-color: #ddd;
}

table.mod17 th,
table.mod17 td {
    font-size: 0.9rem;
    height: auto;
    padding: 6px;
    margin: 0;
    vertical-align: middle;
}


.v-top td {
    vertical-align: top !important;
}

thead.v-top th {
    vertical-align: top !important;
}

table.mod17 .td-color {
    color: var(--body-color) !important;
}

table.mod17:not(.td-colors) tr:not(.thbg) th,
table.mod17:not(.td-colors) tr:not(.thbg) td {
    background-image: none;
}

table.mod17 th,
table.mod17 .th,
table.mod17 tr.th {
    background-color: #eaeaea;
    padding-top: 8px;
    padding-bottom: 8px;
    color: var(--body-color);
    border-style: double;
    border: solid 1px var(--border-color, #eee);
    border-bottom-width: 2px;
    border-bottom-color: #a6a9ac;
}

table.mod17-md th,
table.mod17-md td.th,
table.mod17-md td {
    padding: 4px;
    padding-top: 6px;
    padding-bottom: 6px;
}

table.mod17-lg th,
table.mod17-lg td.th,
table.mod17-lg td {
    padding: 10px;
}

table.mod17-xl th,
table.mod17-xl td.th,
table.mod17-xl td {
    padding: 16px;
}


table.mod17-sm th,
table.mod17-sm td.th,
table.mod17-sm td {
    padding: 2px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 0.8rem;
}

table.table-border-gray td {
    border-color: #aaa;
}

table tr.no-th-bg th {
    background: none !important;
}

table.no-th-bg th {
    background: none !important;
}

table.white-bg td {
    background: white;
}


table.compact {
    font-size: 12px !important;
    border: none;
}

table.compact th,
table.compact td {
    font-size: 10px;
    height: auto;
    /*height:20px;*/
    padding: 2px;
    background: none;
    margin: 0;
    border: none;
    vertical-align: top;
}

table.compact td {
    padding: 1px 3px;
}

table.compact.xs td,
table.compact.xs {
    height: auto;
    padding: 1px;
}

#notification {
    display: none;
    background-color: #FFF;
    color: #D00;
    border: solid 1px #DDD;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 1000;
    padding: 3px;
}

#notification img {
    margin-left: 8px;
}



table.nth-white tbody tr:not(.noStripe):nth-child(odd) {
    background-color: #fff;
}

table.nth-col tr:not(.blank):not(.noStripe) td:not(.th):not(.head):not(.blank):nth-child(even) {
    background-color: #f5f5f5;
}

table.nth-overlap tr td:nth-child(even) {
    background-color: #f5f5f5;
}

table.nth-overlap tr:nth-child(even) {
    background-color: #f5f5f5;
}

table.nth-overlap tr:nth-child(even) td:nth-child(even) {
    background-color: #e2e2e2;
}

table.nth-overlap tr td.th:nth-child(odd) {
    background-color: #fff;
}

table.nth-overlap tr:nth-child(odd) td.th {
    background-color: #fff;
}

table.nth-overlap td,
table.nth-overlap th,
.blend-multi {
    background-blend-mode: multiply;
}


/* nth */

table.nth>tbody>tr:not(.noStripe):nth-child(even),
table.nth-white tbody tr:not(.noStripe):nth-child(even) {
    background-color: #f5f5f5;
}

.rowsOnly .odd td,
.rowsOnly .even td {
    border-width: 1px 0px;
}

/*table:not(.noJsColor):not(.noStyle) tbody tr:not(.noStripe):nth-child(even) td {
    background-image: url(../../gfx/shadow.png?v=3.2.0.0);
    background-position: top;
    background-repeat: repeat-x;
}
table:not(.noJsColor):not(.noStyle) tbody tr:not(.noStripe):nth-child(odd) td {
    background-color: #f6f9fa;
}*/


/*
*/


table tr.evenC td,
table tr.even td,
table tr.alwaysEven td,
tbody.even tr td {
    background-color: #FFF;
}

table tr.odd td,
table tr.oddC td,
tbody.odd tr td {
    background-color: #f5f5f5;
}

table tr.odd-light td,
table tr.oddC-light td,
tbody.odd-light tr td {
    background-color: #f9f9f9;
}

table tr.inverse th,
table.inverse th {
    background-color: #606060 !important;
    color: #fcfdfe !important;
    text-shadow: 1px 1px #111 !important;
    border-color: #88898A !important;
}

table tr.basic th,
table.basic th {
    background-color: transparent !important;
    color: #555 !important;
    text-shadow: none;
}

table.table-list {
    border: none;
}

table.table-list th {
    background-color: transparent !important;
    background-image: none !important;
    color: var(--body-color) !important;
    text-shadow: none;
    border: none;
    border-bottom: solid 1px;
    padding: 4px;
}

table.table-list tr.no-bottom-border th {
    border-bottom: none !important;
}

table.table-list tr.td-border th {
    border-bottom: solid 1px rgba(0, 0, 0, 0.05);
}

table.table-list td {
    border: none;
    border-bottom: solid 1px rgba(0, 0, 0, 0.05);
    padding: 4px;
}

table.table-list.list-light td {
    border-color: #eee;
}

.table-list tbody tr:last-child td {
    border-bottom: none;
}


/*
 .blink {
 background-color: #def5c5;
 }
*/
.blink td {
    background-color: #e2f1ad;
}

/*
 .blink input {
 background-color: #f8fdf4;
 border: solid 2px #f8fdf4;
 }
*/
#info,
#success,
#warning,
#errors {
    margin: 10px auto;
    width: 320px;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
}

#ajaxError {
    border: none;
    display: none;
    font-size: 1rem;
    padding: 10px 10px 15px 10px;
    margin: 0;
    text-align: center;
}

#ajaxError button {
    font-size: 1.2rem;
}

#ajaxError ol {
    text-align: left;
}

#ajaxError .aeFooter {
    font-size: 0.9rem;
    color: gray;
}

#ajaxError h3 {
    color: #D8000C;
    font-size: 1.6rem;
}


#errors li,
#success li,
#info li {
    list-style-type: none;
    padding: 10px;
}

#wrap {
    /*position: relative;*/
    /*width: 96%;*/
    padding-top: 25px;
    margin: 0 auto 0;
    padding-bottom: 25px;
}

#content {
    position: relative;
    /* width: 100%; */
    /*    background-image: url(../../gfx/hline.png?v=3.2.0.0);
        background-position: top;
        background-repeat: repeat-x;*/
    padding-top: 10px;
    margin: 0 auto;
    padding-bottom: 10px;
    min-width: 100%;
    width: max-content;
    padding-right: 26px;
}

@media print {
    #content {
        width: 100%;
        padding-right: 0;
    }
}

table {
    max-width: 100vw;
}



#loginBox .login {
    margin: auto;
}

#loginText {
    display: block;
    margin-left: auto;
    margin-right: auto;
    font-size: .9rem;
}

#loginText ul {
    list-style: outside;
}

#loginText ul li {
    margin: 2px 0;
}

#loginBg {
    width: 320px;
    background-image: url(../../gfx/loginbg.png?v=3.2.0.0);
    background-position: bottom center;
    background-repeat: no-repeat;
    padding-bottom: 12px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
}


.login,
.login-box {
    position: relative;
}

.login-box,
.tab-top {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    box-sizing: border-box;
    z-index: 250;
}

.login fieldset {
    /*background-color: #FFF;*/
    position: relative;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    border: none;
}

.login label {
    width: 100px;
}

.login button {
    width: 142px;
}

.login #username,
.login #password {
    width: 140px;
}

.login-wrapper {
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    border-radius: 11px;
    background-color: rgba(255, 255, 255, 0.9);
    /* box-shadow: 0 0px 80px 0 #dadada; */
    box-shadow: 0 0px 80px 0 #dadada, 0px 0px 1px 0px #dadada;
    margin-top: 2rem;
}

.login-box label {
    font-weight: bold;
}

.login-box input {
    padding: .7rem .5rem !important;
}

.login-box .links {
    line-height: 1.8;
}

.login-content {
    padding: 20px;
}

.loginbox fieldset label {
    float: left;
    text-align: right;
    font-weight: 700;
}

.loginbox fieldset input,
fieldset label,
fieldset select {
    margin: 2px 4px;
    padding: 2px 0;
}

.loginbox fieldset .submit {
    margin-left: 112px;
    margin-top: 8px;
}

fieldset.fset {
    border: solid 1px #c0c0c0;
    border-radius: 3px;
    margin-left: 0;
    margin-right: 0;
}

.fset legend {
    color: #446;
    font-size: 12px;
    font-weight: bold;
}

#user {
    /*position: absolute;*/
    top: 0px;
    right: 0;
    text-align: right;
    z-index: 50;

    float: right;
    margin-right: 3%;
    margin-top: 4px;
}

#debug {
    height: 300px;
    overflow: auto;
    background-color: #FBFBF6;
    border: 1px solid #c0c0c0;
    margin: 0;
}

.debug {
    background: #FFFFE0;
    color: #350;
}

.tbButton {
    border-radius: 0px;
}




/* Cannot use this margin while spaces have been added before button text */
/*
 button.positive img, button.negative img, button.edit img {
 margin: 0 3px -2px 0 !important;
 }
*/
button.edit {
    color: #000000;
    /*515151*/
}

button.edit:hover {
    background-color: #dadada;
    border: 1px solid #A6A9AC;
    color: #000000;
    /*515151*/
}

button.edit.inset,
button.inset {
    background-color: #dadada;
    background-position: bottom;
    border-style: inset;
}

button.strong {
    background-color: #ffcc00;
    border-color: #000 !important;

}

button.strong:hover {
    background-color: #ffbb00;
    border-color: #996600;
}

button.feedback {
    font-size: 1rem;
    border-color: #a2c0df;
    color: #38c;
    background-color: #d5e2f0;
}

button.feedback:hover {
    /*
        background-color: #bcd665;
            color: #465115;
    */
    background-color: #c5d8eb;
}

button.positive:hover,
button.done:hover {
    background-color: #E6EFC2;
    border: 1px solid #A6A9AC;
    color: #529214;
}

button.negative:hover {
    background-color: #fbe3e4;
    border: 1px solid #fbc2c4;
    color: #d12f19;
}

#tabs {
    height: 24px;
    border-bottom: solid 1px #eee;
}

#tabs ul {
    list-style: none;
    height: 24px;
    margin: 0;
    padding: 0;
}

#tabs ul li {
    font-size: .9rem;
    float: left;
    background-color: #dedede;
    border: 1px solid #c0c0c0;
    /*border-bottom: none;*/
    background-image: url(../../gfx/shadowup.png?v=3.2.0.0);
    background-position: bottom;
    background-repeat: repeat-x;
    margin: 0 1px 0 0;

    padding: 0px 10px;
    padding-top: 3px;

    height: 20px;
    vertical-align: middle;
    border-radius: 3px 3px 0 0;
}

#tabs ul li.active,
#tabs ul li.superActive {
    /*    background-image: url(../../gfx/btnbg.png?v=3.2.0.0);
        background-position: bottom;
        background-repeat: repeat-x;*/
    background-color: #f6f9fa;
    background: none;
    border: 1px solid #c0c0c0;
    /*border-bottom: none;*/
    font-weight: bold;
    border-bottom-color: white;
}

#tabs ul li img {
    width: 16px;
    height: 16px;
}

#tabs a:hover {
    text-decoration: none;
}

#tabs ul li:hover {
    background-color: #EEE;
    border: 1px solid #cecece;
    /*    border-bottom: none;*/
}

#tabs ul li.active:hover,
#tabs ul li.superActive:hover {
    background: none;
    border: 1px solid #c0c0c0;
    border-bottom-color: white;
}

#tabs ul li.first {
    margin-left: 5px;
}

.popMessage {
    z-index: 300;
    display: block;
    position: fixed;
    left: 25%;
    right: 25%;
    top: 25%;
    width: 400px;
    background-color: #f6f9fa;
    border: solid 5px var(--body-color);
    border-top: solid 2px var(--body-color);
    text-align: center;
    font-weight: 700;
    margin: auto;
}

.popMessage h4 {
    background-color: var(--body-color);
    color: #FFF;
    vertical-align: middle;
    height: 16px;
    text-align: left;
    margin: 0;
    padding: 1px 1px 2px 20px;
}

.popMessage h4 img {
    position: absolute;
    top: 0;
    left: 0;
    width: 16px;
    height: 16px;
}

#lockedBg,
#loader {
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    z-index: 200;
    background-color: #000;
    opacity: .8;
    width: 100%;
    height: 100%;
    text-align: center;
    filter: alpha(opacity=80);
}

#loader {
    display: block;
    background-color: #FFF;
    padding-top: 25%;
    font-size: 1.2rem;
    font-weight: 700;
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
}



#loginBox {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 1000;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 100%;
}

#startPageTop {
    padding: 0px 0px 0px 0px;
}

#startPageTop ul li.inline-block {
    margin: 5px 5px 5px 5px;

    width: 170px;
}

#startPage {
    padding: 10px 2px;
    /*
            border-top: solid 1px #DDDDDD;
            background-image: url(../../gfx/shadow.png?v=3.2.0.0); 
            background-position: top; 
            background-repeat:repeat-x;
        border-radius: 5px;
    */
}

#startPage .section {
    margin-bottom: 30px;
    /*border-bottom: solid 1px #EEE;*/
    margin-right: 20px !important;
    max-width: 500px;
    display: block !important;
    margin-left: 0px !important;
}

#startPage .section .content {
    max-height: 400px;
    overflow-y: auto;
    line-height: 1.7;
}

ul.outside,
ol.outside {
    list-style-position: outside;
    padding-left: 10px;
}

.list-circle {
    list-style-type: circle;
}

.startNavBox,
.startNavBox2 {
    width: 170px;
    padding: 1px 1px 0px 1px;
    border: solid 1px lightgray;
    border-bottom-width: 4px;
    position: relative;
}

.startNavBox {
    border-radius: 10px;
}

.startNavBox2 {
    border-radius: 8px;
}

.snBox .sbox h3 {
    font-size: 14px;
    margin: 0;
}


#startPageTop .navBoxList {
    display: none;
}

.snBox a:hover .sbox,
#startPageTop .hover .sbox {
    background-color: #E7F1D1;
}

.startNavBox a:hover,
.startNavBox2 a:hover {
    text-decoration: none;
}


.sbox {
    background-image: url(../../gfx/startboxbg.png?v=3.2.0.1);
    background-position: top center;
    background-repeat: repeat-x;
    border-radius: 6px;
    padding: 2px;
    padding-top: 1px;
}

.startNavBox .sbox img {
    height: 128px;
    width: 128px;
}

.navBoxList {
    vertical-align: top;
}

.startNavBox2 .sbox img {
    height: 32px;
    width: 32px;
    margin-right: 2px;
}

.sBtn {
    padding: 0px;
    background-position: center left;
    background-repeat: no-repeat;
    padding-left: 34px;
    vertical-align: middle;
    text-align: left;
    display: table-cell;
    height: 40px;
    cursor: pointer;

    font-weight: normal;
}

.invoices32 {
    background-image: url(../../gfx/invoices32.png?v=3.2.0.0);
}

.payables32 {
    background-image: url(../../gfx/payables32.png?v=3.2.0.0);
}

.receipts32 {
    background-image: url(../../gfx/receipts32.png?v=3.2.0.0);
}

.time32 {
    background-image: url(../../gfx/time32.png?v=3.2.0.0);
}

.mileage32 {
    background-image: url(../../gfx/mileage32.png?v=3.2.0.0);
}

.allowance32 {
    background-image: url(../../gfx/allowance32.png?v=3.2.0.0);
}

.outlay32 {
    background-image: url(../../gfx/outlay32.png?v=3.2.0.0);
}

.supplement32 {
    background-image: url(../../gfx/supplement32.png?v=3.2.0.0);
}

.report32 {
    background-image: url(../../gfx/report32.png?v=4);
}

.payrun32 {
    background-image: url(../../gfx/payrun32.png?v=3.2.0.0);
}

.startNavBox2 .sbox h3 {
    font-size: 14px;
    /*
            position: relative;
            text-align: left;
            padding-left: 2px;
    */
}

.startNavBox2 .sbox h3 span {
    position: absolute;
    top: 12px;
}

#startPageTop div.extra {
    margin-top: 5px;
}

#startPage h3 {
    font-size: 22px;
    font-family: sans-serif;
}

h1.line,
h2.line,
h3.line,
h4.line,
h5.line,
#startPage h3,
.header-line {
    border-bottom: solid 3px #EFEFEF;
    font-weight: 600;
    padding-bottom: 0.25em;
    margin-bottom: 0.25em;

}

dl.menu {
    margin-bottom: 10px;
    font-size: 0.9rem;
}

dl.menu dt {
    /*color: #446;*/
    font-weight: bold;
    margin-top: 3px;
}

.tbButton {
    height: 24px;
    width: 24px;
    margin-right: 2px;
    padding: 0;
}

.tbButton:hover {
    background-color: #FFF;
    border: 1px solid #d0d0d0;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
}

.tbButton img {
    height: 16px;
    width: 16px;
}

p,
#menu,
#menu * {
    margin: 0;
    padding: 0;
}

p {
    margin: 3px 0;
}

option,
textarea {
    font-family: Verdana;
    font-size: 0.9rem;
}

.green,
.fc-green,
button.positive,
button.done,
.text-success {
    color: #529214 !important;
}

.ok-color {
    color: #529214 !important;
}

.lightGreen,
.fc-green-light {
    color: #b9e052;
}

.disabled,
button.disabled {
    color: #ccc;
}

.disabled textarea {
    border-color: #ccc !important;
    background-color: #f5f5f5 !important;
}

.disabled input {
    color: #ccc !important;
    border-color: #ccc !important;
    background-color: #f5f5f5 !important;
}

button.menuButton {
    position: relative;
    padding-right: 15px;
}

button.menuButton img.arw {
    width: 8px;
    height: 4px;
    position: absolute;
    top: 10px;
    right: 5px;
}

button.menuButton:hover {
    background-color: #FFF;
    border: 1px solid #d0d0d0;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    color: #000;
}

.menu-item {
    white-space: nowrap;
    padding: 8px;
    color: var(--body-color);
    font-size: 12px;
    text-shadow: none;
    text-align: left;
    display: flex;
    align-items: center;
}

.menu-item[disabled] {
    color: #999 !important;
}

button.menu-item {
    box-sizing: border-box;
    width: 100%;
    border: none !important;
    background: none !important;
    border-radius: 0px !important;
}

a.menu-item {
    text-decoration: none;
}

.btn-drop::after {
    content: "\f0d7";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1rem;
    margin-left: 0.5em;
}


.item-ico {
    display: inline-block;
    margin: 0 .25em;
    width: 2em;
}

.item-ico-end {
    margin-left: auto;
    display: inline-block;
}

.item-ico i {
    text-align: center;
    width: 1.1em;
    font-size: 1.3rem;
}

.menu-item .item-ico {
    transform-origin: center right;
    transition: transform .1s ease-in-out;
}

.menu-item:not(.active):hover {
    background-color: #c6deec !important;
}


.menu-item.linkColor:hover {
    color: #007bb9 !important;
}

.menu-item .flexbox {
    width: 100%;
    align-items: center;
}

.menu-item small {
    color: #999;
    font-size: 0.8em;
    padding: 0 .5em;
    margin-left: auto;
}

.contextMenu {
    display: none;
    min-width: 80px;
    position: absolute;
    z-index: 500;
    background: #fff;
    padding: 4px 0px;
    outline: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    font-weight: normal;
    box-shadow: 0 8px 16px 2px rgba(0, 0, 0, 0.2);

    opacity: 0;
    transform: translateY(-10px);
    animation: fadeInDown 0.2s ease-in-out forwards;
    line-height: 1.5;
}

.contextMenu.ctx-up {
    animation: fadeInUp 0.2s ease-in-out forwards;
}

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

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

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

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

.menu-content {
    padding: 8px;
}

.contextMenu:after {
    position: absolute;
    content: "";
    bottom: -40px;
    height: 40px;
    width: 1px;
}

.ctx-dropdown {
    border-radius: 0px 0px 6px 6px;
    border-top: none;
}

.ctx-up {
    bottom: 100%;
    top: auto;
}

.ctx-drop-btn {
    display: block;
}

.ctx-drop-btn.active {
    /*color: #606061;*/
    /*background-color: #d7d8d9;*/
    /*background-color: #666667;*/
    color: #fff !important;
    /*box-shadow: inset 0px -16px #1a90cb;*/
    background-color: #2096d1 !important;
}


.ctx-drop-container {
    display: none;
    /*background-color: #f6f6f8;*/
    /*background-color: #eef4f9;*/
    background-color: #f3f5f7;
}


.ctx-header {
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    background: var(--body-color);
    border-radius: 4px 4px 0px 0px;
    margin-top: -4px;
    padding: 4px;
    color: #ececec;
    position: relative;
    padding-right: 18px;
}

.ctx-header .ctx-close-btn {
    position: absolute;
    right: 5px;
    top: 5px;
    z-index: 3;
    color: #bababa;
}

.ctx-header .ctx-close-btn:hover {
    color: #f00;
}


.ctx-divider {
    padding-top: 0px;
    border-bottom: 1px solid #eee;
    margin-bottom: 0px;
}

.ctx-drop-container .menu-item {
    padding-left: 1.5rem;
}


.ctx-caret-down {
    float: right;
}

.flexbox .ctx-caret-down {
    float: none;
    margin-left: auto;
}

.ctx-fw {
    min-width: 210px;
}

.contextMenu ul {
    list-style-type: none;
}

.box-shadow {
    box-shadow: 0px 3px 5px 0px #C0C0C0;
}

.box-shadow-light {
    box-shadow: 2px 2px 3px #eee;
}

.box-shadow-sm {
    box-shadow: 1px 1px 1px #eee;
}

.shadow-panel {
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
}

.inset-dark-33 {
    box-shadow: inset 0px 0px 0px 2px rgba(0, 0, 0, 0.33);
}

.border-bg {
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
}

.bg-white-5,
.bg-white-50 {
    background: rgba(255, 255, 255, 0.5);
}


input.required,
select.required,
textarea.required {
    /*background-color: #fff0f0;*/
    /*    border-color: #b33;
        box-shadow: inset 0px -1px #b33;*/
    box-shadow: 0px 2px 0px 0px #e66;
}

.required-soft {
    box-shadow: 0px 2px 0px 0px #ea6;
}

.required-const {
    box-shadow: 0px 2px 0px 0px #aaa;
}


button.disabled img {
    opacity: .3;
    filter: alpha(opacity=30);
}

button.disabled:hover {
    background-color: #f5f5f5;
    border: 1px solid #d0d0d0;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    color: #ccc;
    -moz-box-shadow: 0 0 3px #ccc;
    -webkit-box-shadow: 0 0 3px #ccc;
    box-shadow: 0 0 3px #ccc;
}


.red,
button.negative,
a.red {
    color: #d12f19;
}

.border-red {
    border: 1px solid #d12f19;
}

hr.red {
    color: #d12f19;
    background-color: #d12f19;
    border-color: #d12f19;
}

.link,
link-nu,
.cursor-pointer {
    cursor: pointer;
}

.zoom-in {
    cursor: zoom-in;
}

.zoom-out {
    cursor: zoom-out;
}

.link-nu {
    text-decoration: none;
}

.silver {
    color: #c0c0c0;
}

.daydone td.red {
    color: #ff8033;
}

.daydone td.green {
    color: #529214;
}

.black {
    color: #000;
}

.fc-pdf {
    color: #cf4742;
}

.dimGray,
.dimGrey,
.fc-dim {
    color: #88898A !important;
}

.fc-gray {
    color: #767778;
}


.fc-dark {
    color: #646566;
}

.monospace {
    font-family: Consolas, Courier, monospace;
}

.bgLit,
.greenBg {
    background-color: #e7f1d1 !important;
}

.redBg {
    background-color: #f2dede !important;
}

.darkGray {
    color: #446;
}

.midGray {
    color: #555;
}

.redBorder {
    border-color: red !important;
}

.cell-blocked {
    background: #ddd;
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    cursor: not-allowed;
}

.wideTextarea {
    width: 400px;
}

.wideTextarea textarea {
    height: 50px;
}

.longTextarea {
    width: 100px;
}

.longTextarea textarea {
    height: 100px;
}

.widerTextarea {
    width: 600px;
}

.widerTextarea textarea {
    height: 50px;
}

.vTop td,
td.vTop {
    vertical-align: top;
}

.v-top {
    vertical-align: top !important;
}

.v-bot {
    vertical-align: bottom !important;
}

.v-bot td {
    vertical-align: bottom !important;
}

tr.v-bot th {
    vertical-align: bottom !important;
}

.vMid,
.vMid td,
td.vMid,
.v-mid,
td.v-mid,
.v-mid td {
    vertical-align: middle !important;
}

.t1 {
    font-size: 1.15rem;
    font-weight: bold;
}

.t2 {
    font-size: 1.1rem;
    font-weight: bold;
}

.t3 {
    font-weight: bold;
}

tr.bb td,
tr.bb th {
    border-bottom: 2px solid #eee;
}

.bt {
    border-top: solid 1px #c0c0c0;
}

.bb {
    border-bottom: solid 1px #c0c0c0;
}

.bl {
    border-left: solid 1px #c0c0c0;
}

.br {
    border-right: solid 1px #c0c0c0;
}

.bb-light {
    border-bottom: solid 1px #eee;
}

.bb-white {
    border-bottom: solid 1px #fff;
}

.bb-warning-dot {
    border-bottom: 1px dotted #b94a48;
}

td.bx-none {
    border-left: 2px solid transparent !important;
    border-right: 2px solid transparent !important;
}

.bb-none {
    border-bottom-color: transparent !important;
    border-bottom: none !important;
}

.bb-dark {
    border-bottom: solid 1px var(--body-color) !important;
}

.bt-light {
    border-top: solid 1px #eee;
}

.bt-white {
    border-top: 1px solid #fff;
}

.bt-none {
    border-top-color: transparent !important;
    border-top: none !important;
}

.bt-hide {
    border-top-color: transparent !important;
    border-top-width: 2px !important;
}

.br-light {
    border-right: solid 1px #eee;
}

.br-none {
    border-right-color: transparent !important;
    border-right: none !important;
}

.bl-light {
    border-left: solid 1px #eee;
}

.bl-none {
    border-left-color: transparent !important;
    border-left: none !important;
}

td.bl-none {
    border-left: 2px solid transparent !important;
}

td.br-none {
    border-right: 2px solid transparent !important;
}

.bb-fc {
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.bt-fc {
    border-top-style: solid;
    border-top-width: 1px;
}

.bt-w-2 {
    border-top-width: 2px !important;
}

.bb-w-2 {
    border-bottom-width: 2px !important;
}

.br-w-2 {
    border-right-width: 2px !important;
}

.bl-w-2 {
    border-left-width: 2px !important;
}

.b-w-2 {
    border-width: 2px !important;
}


.bl2 {
    border-left: solid 2px #A6A9AC !important;
}

.br2 {
    border-right: solid 2px #A6A9AC !important;
}

.border-1 {
    border: solid 1px;
}


.border {
    border: solid 1px #c0c0c0 !important;
}

.border-success {
    border-color: #52a452;
}

.border-dark {
    border: solid 1px #646566 !important;
}

.border-medium {
    border: solid 1px #aaa !important;
}

.border-light {
    border: solid 1px #eee !important;
}

.border-r-light {
    border-right: solid 1px #eee !important;
}

.border-l-light {
    border-left: solid 1px #eee !important;
}

.border-none {
    border: none !important;
}



.ml20 {
    margin-left: 20px;
}

.ba {
    vertical-align: bottom;
}

.ta {
    vertical-align: top;
}

.ma {
    vertical-align: middle;
}

.la,
.popMessage p {
    text-align: left;
}

.ra,
.double {
    text-align: right;
}

input.double {
    text-align: left;
}

.ca,
.integer,
.checkbox {
    text-align: center !important;
}

.selects input {
    margin: 1px 0px;
}

.selects {
    vertical-align: top;
}

.sunday,
div.warn {
    color: #C00;
}

.ajax,
.wrap,
.ajax2 {
    display: table;
}

.ajax var,
.ajax2 var {
    display: block;
    background-image: url(../../gfx/ajaxcell.png?v=3.2.0.0);
    background-position: top right;
    background-repeat: no-repeat;
    padding: 1px;
    padding-right: 6px;
}

.switch-target {
    display: none;
}

#menu a,
#tabs .active a,
#tabs .superActive a,
#tabs a {
    color: #446;
    outline: none;
}

#menu *:active,
#menu *:focus {
    outline: none;
}

.popMessage div {
    padding: 5px;
}

.flag img {
    /*
            border: solid 1px #BABABA;
            border-left-color: #EAEAEA;
            border-top-color: #EAEAEA;
    */
    border: solid 1px #FFF;
    background-color: #FFF;
    padding: 3px;
}

.flag:hover img {
    border-color: #BABABA;
}

.activeFlag img {
    border: solid 1px #BABABA;
    border-right-color: #EAEAEA;
    border-bottom-color: #EAEAEA;
}

#menu li img.arw {
    position: absolute;
    top: 10px;
    right: 5px;
}

#menu li ul li img.arw {
    position: absolute;
    top: 8px;
    right: 5px;
}

#menu {
    z-index: 100;
    list-style: none;
    font-size: .9rem;
    /*margin-left:2%;*/
    float: left;
    margin-top: 4px;
}

#menu li ul {
    list-style: none;
    z-index: 100;
}

#menu li {
    float: left;
    zoom: 1;
    text-align: left;
    border: 1px solid #c0c0c0;
    background-color: #f9f9f9;
    background-image: url(../../gfx/btnbg.png?v=3.2.0.0);
    background-position: top;
    background-repeat: repeat-x;
    margin-left: -1px;
    position: relative;
    z-index: 100;
}

#menu > li:first-child {
    border-radius: 3px 0 0 3px;
}

#menu > li:last-child {
    border-radius: 0 3px 3px 0;
}

#menu li.subbed {
    padding-right: 10px;
}

#menu a {
    text-decoration: none;
    white-space: nowrap;
}

#menu a:hover {
    color: #000;
}

#menu a.void:hover {
    cursor: default;
}

#menu a:active {
    color: #000;
}

#menu li a {
    display: block;
    padding: 5px 10px;
}

#menu li.hover,
#menu li:hover {
    background-color: #EAEAEA;
    color: #000;
    position: relative;
    background-image: none;
    z-index: 100;
}

#menu li.noHover {
    background-color: white;
}

/*
 2
*/
#menu ul {
    padding-right: 0;
    /*
width: 140px;
    */
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    border-bottom: 1px solid #c0c0c0;
    border-top: 1px solid #c0c0c0;
    background-color: #FFF;
    z-index: 100;
}

#menu ul li {
    font-weight: normal;
    color: #446;
    float: none;
    background: none;
    border: none;
    border-left: 1px solid #c0c0c0;
    border-right: 1px solid #c0c0c0;
    padding-right: 0px;
    z-index: 100;
}

/* IE 6 & 7 needs inline block */
#menu ul li a {
    width: 100%;
    display: inline-block;
    color: #446;
    padding-right: 10px;
}

#menu ul li.ico a {
    width: 100%;
    display: inline-block;
    color: #446;
    padding-right: 10px;
    padding-left: 21px;
}

#menu ul li.ico ul li a {
    padding-left: 10px;
}

#menu li.ico img.ico {
    position: absolute;
    top: 3px;
    left: 3px;
}

/*
 3
*/
#menu ul ul {
    left: 100%;
    top: 0;
    margin-left: 1px;
    margin-top: -1px;
}

/*
#menu li:hover > ul {
    visibility: visible;
}
*/

.balloon {
    background-image: url(../../gfx/bloon_bg.png?v=3-2-0-0);
    background-position: bottom;
    background-repeat: repeat-x;
    margin: 0px;
    border-radius: 5px;
    background-color: #d5ecff;
    border: solid 1px #84c8ff;
    box-shadow: 0 1px 5px #aaccff;
    color: black;
    /*
        background-color: #ecf5f9;
        border: solid 1px #9eb7c3;
            box-shadow: 0px 3px 4px #c9d8de;
    */
    border-bottom-width: 2px;
    display: none;
    position: absolute;
    max-width: 400px;
    z-index: 900;
}

.balloon_inner {
    padding: 4px;
    padding-top: 1px;
}

.balloon_content {
    clear: both;
}

.bloonBtn {
    cursor: pointer;
    position: absolute;
    top: 0px;
}

.balloonEdit {
    right: 17px;
}

.balloonX {
    right: 0px;
}

a.bloonBtn:hover img {
    background-color: #f5fafc;
}

.balloon_title_bar {
    color: black;
    font-weight: bold;
    height: 16px;
    margin: 2px;
    margin-bottom: 0px;
    padding-left: 2px;
    position: relative;
    padding-bottom: 2px;
}

.balloon_title {
    padding-right: 3px;
}

.hoverItems li:hover {
    background-color: #EAEAEA;
}

table.ajaxCalendar,
.ajaxCalWidth {
    width: 276px;
}

table.ajaxCalendar {
    background-color: #f5f5f5;
}

.ajaxCalendar td {
    height: 32px !important;
    width: 32px !important;
    /*
            font-weight: bold;
    */
    text-align: center;
    border: solid 1px #fff;
}

.ajaxCalendar td.tdMon {
    border-left-style: solid;
}

.ajaxCalendar td.tdSun {
    border-right-style: solid;
    color: red;
}

.ajaxCalendar td.cal_day {
    cursor: pointer;
}

.ajaxCalendar td.cal_day:hover {
    background-color: #eaeaea;
}


.ajaxCalendar td.cal_na {
    color: #bbb;
}

.ajaxCalendar .days th {
    border: solid 1px #dadada;
    border-left: none;
    border-right: none;
    text-align: center;
    font-weight: normal;
    color: #777;
}

.ajaxCalendar .thMon {
    border-left: solid 1px #dadada !important;
}

.ajaxCalendar .thSun {
    border-right: solid 1px #dadada !important;
    color: #ff6666 !important;
}

.ajaxCalendar tr.panelTop {
    box-shadow: 0px 2px 2px #88898A;
}

.ajaxCalendar tr.panelTop th {
    background-image: url(../../gfx/paneltop.png);
    background-position: top;
    background-repeat: repeat-x;
    border: solid 1px #dadada;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px #ccc;
    border-top: solid 1px #ddd;
    height: 21px;
    padding: 0px;
    text-align: center;
    font-weight: bold;
    font-size: 14px;
    color: #446;
}

#sideBarWindow {
    display: none;
    background-color: white;
    border: solid 1px #ccc;
    border-left: solid 2px #ccc;
    padding: 0;
    margin: 0;
    box-shadow: 0px 0px 10px 0px #ccc;
}

#sideBar,
#sideBarWindow {
    position: fixed;
    right: 0;
    top: 0;
    z-index: 999;
    height: 100vh;
}

ul#sideBar {
    list-style-position: inside;
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 24px;
    /*	position: absolute;*/
    line-height: 0;
}

ul#sideBar li {
    list-style-type: none;
    margin: 0;
    padding: 0;
    line-height: 0;
    background-color: #eee;
    /*background-image: linear-gradient(to right, #ffffff, #e6e6e6);*/
    position: relative;
    padding-bottom: 13px;
    padding-top: 13px;
    border: solid 1px #ccc;
    border-right: none;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    margin-bottom: 1px;
    box-shadow: inset 0 0 1px #fff;
    /*opacity: 0.75;*/
}

/*ul#sideBar li:hover, ul#sideBar li.active {
    opacity: 1;
}*/

ul#sidebar li {
    background: #eee;
}

ul#sideBar li .tab_text {
    display: block;
    line-height: 1.15;
    margin: 0;
    padding: 0;
    /*    background-image: url(../../gfx/sb_tab_bg.png);
        background-repeat: repeat-y;*/
    padding-left: 5px;
    position: relative;
    font-weight: bold;
}


#sideBarWindow .subContainer {
    margin: 0;
    padding: 0;
    line-height: 0;
    height: 24px;
    /*margin-top: -26px;*/
    position: relative;
    /* margin-left: 5px; */
}

#sideBarWindow .toolpanel {
    display: flex;
    align-items: center;
    background: #f5f6f7;
    margin-bottom: 5px;
}

#sideBarWindow .subContainer .sb_icon {
    float: left;
    margin-right: 3px;
}

#sideBarWindow .wbtns {
    display: flex;
    align-items: center;
}

#sideBarWindow .wbtn {
    display: block;
    /* float: left; */
    padding: 3px;
    padding-top: 5px;
    min-height: 17px;
    min-width: 26px;
    text-align: center;
}

#sideBarWindow .wbtn:hover {
    background: #ddd;
}

#sideBarWindow .subTab {
    margin: 0;
    padding: 0;
    line-height: 0;
    /*	position: relative;*/
    height: 24px;
    /*	margin-top: -24px;*/
    padding-left: 13px;
    padding-right: 13px;
    /*    border: solid 1px #c0c0c0;
        border-radius: 0px 0px 5px 5px;
        border-top:none;*/
    margin-right: 2px;
}

#sideBarWindow .subTab a {
    text-decoration: none;
    /*color: #446;*/
}

#sideBarWindow .tab_text {
    height: 24px;
    display: block;
    line-height: 1.15;
    margin: 0;
    padding: 0;
    padding-top: 5px;
    position: relative;
    font-weight: bold;
    font-size: 11px;
}

#sideBarWindow .active a {
    border-top: solid 3px #99cc00;
    padding-top: 2px;
}

#sideBarWindow .active {
    background: #fff;
}

ul#sideBar li.active a {
    border-left: solid 3px #99cc00;
    padding-left: 2px;
    background: url(../../gfx/strong_x.png) no-repeat center top;
    padding-top: 16px;
}

ul#sideBar li.active {
    background: #fff;
    margin-right: -1px;
}

ul#sideBar li a:hover {
    border-left: solid 3px #00acff;
    padding-left: 2px;
}


ul#sideBar li img.tab_t,
ul#sideBar li img.tab_b {
    padding: 0;
    margin: 0;
    height: 13px;
    width: 24px;
}

ul#sideBar li img.tab_t {
    position: absolute;
    top: 0;
    left: 0;
}

ul#sideBar li img.tab_b {
    position: absolute;
    bottom: 0;
    left: 0;
}

ul#sideBar img.sb_icon {
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}


table tfoot td {
    border-width: 0;
    padding: 3px;
}


th,
#tabs {
    text-shadow: 1px 1px rgba(255, 255, 255, 0.5);
}

th div {
    text-shadow: 0px 0px #fff;
}

p.buy,
div.buy {
    padding: 16px 16px 16px 42px;
    font-size: 14px;
    background-image: url(./icons/info.png);
    background-position: 5px 50%;
    background-repeat: no-repeat;
    background-color: #fff;
    display: inline-block;
    margin: 5px;
    margin-left: 0px;
    box-shadow: 0px 7px 10px gray;
    border-radius: 10px;
    line-height: 2;
}

.buy button {
    color: var(--body-color);
}

.buy a {
    color: #20adee;
}

table.sortable th.header:not(.no-sort) .tablesorter-header-inner::before,
table.sortable th.header:not(.no-sort) .tablesorter-header-inner::after {
    text-align: left;
    background-color: transparent;
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: rgba(0, 0, 0, .5);
    text-shadow: none;
    line-height: 1.2;
    font-size: 11px;
}

.tablesorter-header-inner:not(.no-sort) {
    display: flex;
    flex-wrap: nowrap;
    align-items: start;
    gap: 2px;
    text-align: left;
}

.tablesorter-header-inner:not(.no-sort) .q {
    margin-left: auto;
}

table.sortable th.header:not(.no-sort) .tablesorter-header-inner::before {
    /*content: url(../../gfx/ts_bg.gif?v=1);*/
    content: "\f0dc";
}

table.sortable th.tablesorter-headerAsc:not(.no-sort) .tablesorter-header-inner::before {
    content: "\f0de";
    /*content: url(../../gfx/ts_asc.gif?v=1);*/
}

table.sortable th.tablesorter-headerDesc:not(.no-sort) .tablesorter-header-inner::before {
    content: "\f0dd";
    /*content: url(../../gfx/ts_desc.gif?v=1);*/
}


/* From the old pages: */

.infoBox {
    padding: 5px;
    background-color: #e6e6e6;
    margin: 5px 0;
}

.priser th {
    vertical-align: bottom;
    border-bottom: 1px solid #cccccc;
}

.priser span {
    font-size: 0.85rem;
    font-weight: normal;
}

/*
* ---------------------
*/

.rotate-45 {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.rotate-315 {
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    -ms-transform: rotate(315deg);
    -o-transform: rotate(315deg);
    transform: rotate(315deg);
}

.r-north {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    /* IE 9 */
    -moz-transform: rotate(0deg);
    /* Firefox */
    -webkit-transform: rotate(0deg);
    /* Safari and Chrome */
    -o-transform: rotate(0deg);
    /* Opera */
}

.r-east {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    /* IE 9 */
    -moz-transform: rotate(90deg);
    /* Firefox */
    -webkit-transform: rotate(90deg);
    /* Safari and Chrome */
    -o-transform: rotate(90deg);
    /* Opera */
}

.r-south {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    /* IE 9 */
    -moz-transform: rotate(180deg);
    /* Firefox */
    -webkit-transform: rotate(180deg);
    /* Safari and Chrome */
    -o-transform: rotate(180deg);
    /* Opera */
}

.r-west {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    /* IE 9 */
    -moz-transform: rotate(270deg);
    /* Firefox */
    -webkit-transform: rotate(270deg);
    /* Safari and Chrome */
    -o-transform: rotate(270deg);
    /* Opera */
}


.ico {
    padding-left: 28px;
    background-position: 7px center;
    background-repeat: no-repeat;
}

.ico.ico-right {
    background-position: center right 7px;
}

.ico-light-close {
    background-image: url(./icons/ico-light-close.png);
}

.ico-light-home {
    background-image: url(./icons/ico-light-home.png);
}

.ico-light-logout {
    background-image: url(./icons/ico-light-logout.png);
}

.ico-light-back {
    background-image: url(./icons/ico-light-back.png);
}

.ico-light-forward {
    background-image: url(./icons/ico-light-forward.png);
}

.table-responsive {
    min-height: .01%;
    overflow-x: auto
}

.table-row {
    display: flex;
    max-width: fit-content;
}

.w-md {
    width: 850px;
}

.w-lg {
    width: 1000px;
}

.w-xl {
    width: 1200px;
}

.w-currency {
    width: 94px;
}

.mw-currency {
    min-width: 94px;
}

.h-input-text {
    height: 24px;
}

.h-input-text-md {
    height: 30px;
}


#wrap {
    width: 100%;
    padding-left: 36px;
    padding-right: 36px;
    box-sizing: border-box;
}

#user,
#menu {
    margin-right: 36px;
}

#menu {
    margin-left: 36px;
}

@media screen and (max-width: 1300px) {
    .xl-hide {
        display: none;
    }

    .w-xl {
        width: 1100px;
    }
}

@media screen and (max-width: 1200px) {
    .xl-hide {
        display: none;
    }

    .w-xl,
    .w-lg {
        width: 950px;
    }
}

@media screen and (max-width: 992px) {
    .w-lg {
        width: 800px;
    }

    .lg-hide {
        display: none;
    }

    .w-xl {
        width: 800px;
    }
}

@media screen and (max-width: 767px) {
    .w-lg {
        width: 600px;
    }

    .w-xl {
        width: 600px;
    }

    .w-md {
        width: 600px;
    }

    .sm-hide {
        display: none;
    }

    #wrap {
        padding-left: 10px;
    }

    #menu {
        margin-left: 10px;
    }

    .table-responsive {
        width: 100%;
        margin-bottom: 15px;
        overflow-y: hidden;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        border: 1px solid #ddd
    }

    .table-responsive>.table {
        margin-bottom: 0
    }

    .table-responsive>.table>tbody>tr>td,
    .table-responsive>.table>tbody>tr>th,
    .table-responsive>.table>tfoot>tr>td,
    .table-responsive>.table>tfoot>tr>th,
    .table-responsive>.table>thead>tr>td,
    .table-responsive>.table>thead>tr>th {
        white-space: nowrap
    }

    .table-responsive>.table-bordered {
        border: 0
    }

    .table-responsive>.table-bordered>tbody>tr>td:first-child,
    .table-responsive>.table-bordered>tbody>tr>th:first-child,
    .table-responsive>.table-bordered>tfoot>tr>td:first-child,
    .table-responsive>.table-bordered>tfoot>tr>th:first-child,
    .table-responsive>.table-bordered>thead>tr>td:first-child,
    .table-responsive>.table-bordered>thead>tr>th:first-child {
        border-left: 0
    }

    .table-responsive>.table-bordered>tbody>tr>td:last-child,
    .table-responsive>.table-bordered>tbody>tr>th:last-child,
    .table-responsive>.table-bordered>tfoot>tr>td:last-child,
    .table-responsive>.table-bordered>tfoot>tr>th:last-child,
    .table-responsive>.table-bordered>thead>tr>td:last-child,
    .table-responsive>.table-bordered>thead>tr>th:last-child {
        border-right: 0
    }

    .table-responsive>.table-bordered>tbody>tr:last-child>td,
    .table-responsive>.table-bordered>tbody>tr:last-child>th,
    .table-responsive>.table-bordered>tfoot>tr:last-child>td,
    .table-responsive>.table-bordered>tfoot>tr:last-child>th {
        border-bottom: 0
    }
}

.overview-box {
    float: left;
    margin: 1rem;
    margin-right: 2rem;
    margin-left: 0;
}

.radio-label {
    display: inline-block;
    padding: 3px;
    border-radius: 10px;
}

.label-yes {
    background: #e7f1d1;
}

.label-no {
    background: #f2dede;
}

input.cb-onoff {
    visibility: hidden;
    /* Makes input not-clickable */
    position: absolute;
    /* Remove input from document flow */
}

label.cb-onoff:hover {
    cursor: pointer;
    background-color: #fafafa;
}

label.cb-onoff {
    cursor: pointer;
}

input+label .cb-off {
    display: inline-block;
}

input+label .cb-on {
    display: none;
}

input:checked+label .cb-on {
    display: inline-block;
}

input:checked+label .cb-off {
    display: none;
}

.help-dlg ol {
    list-style-position: outside;
}

.help-dlg ol li {
    margin: 1em 0;
    margin-left: 20px;
    font-size: 14px;
}

.help-dlg ol li img {
    opacity: 0.6;
    border: solid 1px #00acff;
    border-left: solid 3px #00acff;
}

.dropzone {
    background: #ddeeff !important;
    /*background: #f0f8ff !important;*/
    /*background: #cde9fe !important;*/
    border: 1px dashed #bce !important;
    color: #159;
}

.drop-fix.dropzone {
    min-height: auto !important;
    padding: 8px !important;
}

.drop-fix.dropzone .dz-message {
    margin: 2px !important;
    width: 100%;
}


.related-links {
    float: right;
    text-align: right;
}

.related-links .related-title {
    color: #777;
}

#email-app {
    background: white;
}

.email-panel {
    background: #eee;
    padding: 0.3rem;
    padding-bottom: 5px;
    border-bottom: solid 1px #c0c0c0;
    font-size: 11px;
    min-height: 28px;
}

#email-list {
    width: 100%;
    list-style: none;
    font-size: 12px;
    background: white;
    max-height: 740px;
    overflow: auto;
}

#email-list li {
    padding: 8px;
    padding-left: 2px;
    padding-right: 2px;
    position: relative;
    border-bottom: solid 1px #ddd;
    cursor: pointer;
    background: inherit;
}

#email-list li.active {
    background-color: var(--body-color);
    color: white;
}

#email-list .email-from {
    white-space: nowrap;
    overflow: hidden;
}

#email-list .email-subject {
    padding-top: 5px;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0.9em;
}

#email-list .email-files {
    color: #aaa;
}

#email-list .email-time {
    color: #aaa;
}

#email-list .email-item-info {
    width: 200px;
    overflow: hidden;
}

#email-list .email-item-data {
    /* position: absolute; */
    background: inherit;
    min-height: 30px;
    z-index: 1;
    /* top: 5px;
    right: 10px; */
    text-align: right;
    padding-left: 5px;
    /* bottom: 0px; */
    margin-right: 10px;
    margin-left: auto;
}

#email-list .email-list-item-child {
    margin-top: -1px;
    color: #08d;
}


#email-container {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (doesn't work very well) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.flexbox {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (doesn't work very well) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.flex-1 {
    flex: 1;
}

.gap-0 {
    gap: 0 !important;
}

.gap {
    gap: 1em;
}

.gap-sm {
    gap: .5em !important;
}

.gap-md,
.flex-item-stretch-center {
    gap: 8px;
}

.gap-lg {
    gap: 16px !important;
}

.gap-xl {
    gap: 24px !important;
}

.gap-xxl {
    gap: 40px !important;

}

.gap-none {
    gap: 0 !important;
}

.flex-default {
    display: flex;
    gap: 1.25rem;
    row-gap: .5rem;
    flex-wrap: wrap;
    /* align-items: start; */
}

.col-gap {
    column-gap: 1.25rem;
}

.col-gap-sm {
    column-gap: .5rem;
}

.row-gap-default {
    row-gap: 1.25rem;
}

.row-gap-none {
    row-gap: 0;
}

.flex-end {
    align-items: flex-end;
}

.align-self-end {
    align-self: flex-end;
}

.flex-item-stretch-center {
    align-self: stretch;
    display: flex;
    align-items: center;
}

.flex-space-between {
    justify-content: space-between;
}

.flex-break {
    flex-basis: 100%;
    height: 0;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-nowrap {
    flex-wrap: nowrap;
}

.flex-grow {
    flex-grow: 1;
    -webkit-flex-grow: 1;
}

.flex-item-center {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

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

.align-items-center {
    align-items: center;
}

.align-items-top {
    align-items: flex-start;
}

.align-items-bottom {
    align-items: flex-end;
}


#email-list-container {
    box-sizing: border-box;
    -webkit-box-ordinal-group: 1;
    /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-ordinal-group: 1;
    /* OLD - Firefox 19- */
    -ms-flex-order: 1;
    /* TWEENER  - IE 10 */
    -webkit-order: 1;
    /* NEW - Chrome */
    order: 1;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
    /* width: 220px; */
    /* No flex here, other cols take up remaining space */
    -moz-box-flex: 1;
    /* Without this, Firefox 19- expands to widest paragraph, overrides width */
    border-right: solid 1px #ddd;
    overflow: auto;
}

#email-message-container {
    box-sizing: border-box;
    overflow-y: auto;
    -webkit-box-ordinal-group: 2;
    /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-ordinal-group: 2;
    /* OLD - Firefox 19- */
    -ms-flex-order: 2;
    /* TWEENER - IE 10 */
    -webkit-order: 2;
    /* NEW - Chrome */
    order: 2;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
    -webkit-box-flex: 1;
    /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-flex: 1;
    /* Firefox 19- */
    width: 50%;
    /* For OLD syntax, otherwise collapses. */
    -ms-flex: 1;
    /* TWEENER - IE 10 */
    -webkit-flex: 1;
    /* NEW - Chrome */
    flex: 1;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
    /* custom */
    /*max-width: 1000px;*/
    position: relative;
}


.st-badge {
    position: relative;
}

.st-badge::after {
    top: -0.6em;
    right: -0.4em;
    font-size: 1em;
    text-shadow: -1px 1px 0px #fff;
    position: absolute;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

i.st-badge::after {
    top: -0.5em;
    right: -0.4em;
    font-size: 0.8em;
}

span.st-badge::after {
    right: -1.2em;
}


.st-badge.st-badge--clock::after {
    content: "\f017";
}

.st-badge.st-badge--ai::after {
    content: "\f544";
    color: var(--ai-color);
    top: -7px;
    right: 0px;
    font-size: 12px;
}

.st-badge.st-badge--sidebar::after {
    content: "\f0da";
    transform: rotate(-45deg);
    top: -7px;
    right: 0px;
    font-size: 12px;
}

.st-badge--danger::after {
    color: red;
}

.st-badge--warning::after {
    color: #f0ad4e;
}

.st-badge--success::after {
    color: #5cb85c;
}

.st-badge.st-badge--pill::after {
    font-family: Consolas, monospace;
    font-weight: bold;
    content: attr(data-content);
    color: #fff;
    background-color: #f00;
    border-radius: 1em;
    padding: 0px 0.38em;
    text-shadow: none;
}

.st-badge.st-badge--pill.st-badge--danger::after {
    background-color: #d9534f;
    color: #fff;
}

.st-badge.st-badge--pill.st-badge--warning::after {
    background-color: #f0ad4e;
    color: #fff;
}

.st-badge.st-badge--pill.st-badge--success::after {
    background-color: #529214;
    color: #fff;
}


.status-box {
    width: 12px;
    height: 12px;
    display: inline-block;
    border: solid 1px #c0c0c0;
    vertical-align: text-bottom;
}

.status-open,
.status-open td {
    /*background: #fff494 !important;*/
    background: #fff !important;
}

.status-done {
    color: #628918;
    background: #DFF2BF;
}

.status-done td {
    color: #628918 !important;
    background: #DFF2BF !important;
}

.status-paid,
.status-paid td {
    background: #e3b7eb !important;
    color: #784C80 !important;
}

.status-closed,
.status-closed td {
    background: #c9ccc4 !important;
}

.status-waiting,
.status-waiting td {
    background: #F3E4A8 !important;
    color: #9F6000 !important;
}

.status-attest,
.status-attest td {
    background: #8DE5F8 !important;
    color: #00529B !important;
}

.status-warning,
.status-warning td {
    background: #FCBDBD !important;
    color: #854646 !important;
}

.status-highlight,
.status-highlight td {
    background: #fcf8e3 !important;
    color: #a07833 !important;
}

.status-na,
.status-na td {
    opacity: 0.7;
}

.status-muted,
.status-muted td {
    background: #eaeaea !important;
    color: #aaa !important;
}

.status-deleted,
.status-deleted td {
    text-decoration: line-through;
    color: #ff9a98 !important;
    background: #fee !important;
}


/**https://support.mantishub.com/hc/en-us/article_attachments/201777753/IssueTable.PNG*/

.app-header {
    /*background: #ececec;*/
    padding: 2px 0;
}

.app-header .page-title {
    font-size: 16px;
    font-weight: bold;
    height: 20px;
    white-space: nowrap;
    vertical-align: middle;
}

.app-header .btn {
    font-weight: normal;
}

.app select {
    padding: 0.5em 3px;
}

.sub-title {
    font-size: 16px;
    font-weight: bold;
    white-space: nowrap;
    color: #ccc;
    margin: 0;
}

.input-highlight-blue {
    box-shadow: 0px 2px 0px 0px #00acff;
}

.border-smooth {
    border-radius: 3px;
}

.border-smooth-lg {
    border-radius: 9px;
}

.group-rounded {
    border-radius: 3px;
}

.group-rounded>* {
    border-radius: 0px;
}

.group-rounded>*:first-child {
    border-radius: 3px 0px 0px 3px;
}

.group-rounded>*:last-child {
    border-radius: 0px 3px 3px 0px;
}

.br-left-none {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

.br-right-none {
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.app-row {
    padding: 0.5em 0;
    box-sizing: border-box;
}

.app-row-dark {
    background: #ECECEC;
    padding: 0.5rem;
    border-radius: 0.5rem;
}

.app-dark {
    background: #ECECEC;
}

.app-row-light {
    background: #FFF;
    padding: 0.5rem;
    border-radius: 0.5rem;
}

.row-item {
    line-height: 18px;
    padding: 2px 10px;
    display: inline-block;
    vertical-align: top;
}

.list-item {
    margin: 3px 0;
    padding: 2px;
}

.list-item-light {
    background: #FFF;
}

.app-xs {
    max-width: 320px;
}

.app-sm {
    max-width: 640px;
}

.app-form {
    background: #bdc3c7;
    padding: 0.5rem .75rem;
    border-radius: 0.5rem;
}

.app-form .app-row {
    padding: 0.5rem;
    background: white;
    margin: 0.5em 0;
    border-radius: 0.5rem;
}

.input-row {
    margin: 0.5em 0;
}

.label,
.label-top {
    color: #999;
    font-size: 10px;
    padding-bottom: 2px;
    display: block;
}

/* .label-top {
    color: #999;
    font-size: 11px;
    padding-bottom: 3px;
} */



.label-top-sm {
    color: #999;
    font-size: 10px;
    padding-bottom: 2px;
    font-weight: bold;
}

.label-top.strong,
.label.strong,
.label-top-sm.strong {
    font-weight: bold;
    color: #646566;
}

.app-form-title {
    color: #fdffff;
    text-shadow: 0px -1px #8d9397;
    font-size: 1.2rem;
}

.item-selected {
    background: var(--body-color) !important;
    color: #EEE !important;
}

form.submitting * {
    color: #ccc;
}

.btn.la {
    text-align: left;
}

.fa-font,
.fa-font option {
    font-family: 'Verdana', 'Font Awesome 5 Free';
    font-weight: 900;
}

.abs {
    position: absolute;
    z-index: 901;
}

.rel,
.ctx {
    position: relative;
}

.abs.abs-right,
.ctx-right .contextMenu,
.contextMenu.ctx-right {
    right: 0;
}

.dlg,
.context-box {
    background: #fcfdfe;
    padding: 10px;
    border: solid 1px rgba(0, 0, 0, .1);
    border-radius: 5px;
    box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, .15);
}

.dlg-header {
    font-size: 14px;
    font-weight: bold;
    padding: 0px;
    color: #7aa110;
    margin-bottom: 8px;
}

.text-shadow-light {
    text-shadow: 1px 1px #fff;
}

.text-shadow-left-light {
    text-shadow: -1px 0 #fff;
}

.fc-dark-15 {
    color: rgba(0, 0, 0, .15);
}

.fc-dark-30 {
    color: rgba(0, 0, 0, .3);
}

.fc-dark-45 {
    color: rgba(0, 0, 0, .45);
}

.lightBlue,
.fc-blue-light {
    color: #00a8c1;
}

.yellow,
.fc-yellow {
    color: #e8c800;
}

.border-yellow {
    border: 1px solid #e8c800;
}

.lightYellow,
.fc-yellow-light {
    color: #ffffcc;
}

.darkYellow,
.fc-yellow-dark {
    /*color: #FFBF00;*/
    color: #F90;
}

.border-darkYellow {
    border: 1px solid #F90;
}

.bg-gold {
    background-color: #f7df8dcc;
}

.bg-orange {
    background-color: #fddc9acc;
}

.bg-blue {
    background-color: #c6e9fbcc;
}

.bg-a-blue {
    background-color: var(--adderat-color-blue);
}

.bg-a-green {
    background-color: var(--adderat-color-green);
}

.bg-a-red {
    background-color: var(--adderat-color-red);
}

.bg-a-yellow {
    background-color: var(--adderat-color-yellow);
}

.bg-a-orange {
    background-color: var(--adderat-color-orange);
}

.bg-a-gray {
    background-color: var(--adderat-color-gray);
}

.bg-a-dark {
    background-color: var(--adderat-color-dark);
}

.bg-blue-light {
    background-color: #F0FAFFcc;
}

.grad-middle-white {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 100%)
}

.bg-red {
    background-color: #ffcccccc;
}

.bg-green {
    background-color: #caf0c0cc;
}

.bg-green-medium {
    background-color: #8dc16acc;
}

.bg-green-dark {
    background-color: #529214cc;
}

.bg-green-dark.text-bg {
    color: #fff;
}

.bg-yellow {
    background-color: #fffaaacc;
    /*background-color:#fef080;*/
}

.bg-yellow-light {
    background-color: #fffddecc;
}

.black,
.fc-black {
    color: black;
}

.white,
.fc-white {
    color: white;
}

.gray,
.grey,
.faded,
.fc-gray-medium {
    color: #A6A9AC;
}

.faded .green,
.faded.green {
    color: #788837 !important;
}

.fc-gray-light,
.lightGray,
.fc-muted {
    /* color: #cbcccd; */
    color: rgba(0, 0, 0, .2);
}

.fc-muted-light {
    color: rgba(255, 255, 255, .33);
}

.fc-dark-60 {
    color: #0006;
}

.blue,
.fc-blue {
    color: #003399;
}

.orange,
.fc-orange {
    color: #ff8000;
}

.fc-orange-light {
    color: #eeaa33;
}

.purple,
.fc-purple {
    color: #803378;
}

.folderColor,
.fc-folder {
    color: #efd475;
}

.fc-absent {
    color: #DA4453;
}

.td-danger {
    background-color: #ffd0ca;
    background: repeating-linear-gradient(45deg, #ffd0ca, #ffd0ca 10px, #ffb4aa 10px, #ffb4aa 20px) !important;
}

.inset-border-danger-1,
.td-danger {
    box-shadow: inset 0px 0px 0px 1px #e27e70 !important;
}

.bg-danger {
    background-color: #dc3545 !important;
}

.bg-danger-light {
    background-color: #ffd0d0 !important;
}

.bg-warning {
    background-color: #ffc107 !important;
}

.bg-warning-light {
    background-color: #ffeab0 !important
}

.bg-info {
    background-color: #17a2b8 !important;
}

.bg-info-light {
    background-color: #def9fd !important;
}

.bg-success {
    background-color: #28a745 !important;
}

.bg-light {
    background-color: #f8f9fa !important;
}

.bg-dark {
    background-color: #343a40 !important;
}

.bg-secondary {
    background-color: #6c757d !important;
}

.bg-primary {
    background-color: #007bff !important;
}

.bg-white {
    background-color: #fff !important;
}

.page-task.disabled .task-icon {
    background-color: #fff !important;
    color: #ccc !important;
}

.page-task .task-tool-hover {
    visibility: hidden;
}

.page-task:hover .task-tool-hover {
    visibility: visible;
}

.shadow-danger-inset {
    box-shadow: inset 0px 0px 0px 3px #e27e70 !important;
}

.fc-danger,
.fc-red {
    color: #b94a48 !important;
}

.fc-danger-strong {
    color: #e00 !important;
}

.bg-danger-striped {
    background-color: #ffd0ca;
    background: repeating-linear-gradient(45deg, #ffd0ca, #ffd0ca 10px, rgba(0, 0, 0, 0) 10px, rgba(0, 0, 0, 0) 20px) !important;
}

.bg-warning-striped {
    background-color: #ffd0ca;
    background: repeating-linear-gradient(45deg, #ffd0ca, #ffd0ca 10px, rgba(0, 0, 0, 0) 10px, rgba(0, 0, 0, 0) 20px) !important;
}

.bg-absent {
    background-color: #DA4453;
}

.fc-vacation {
    color: #8CC152;
}

.bg-vacation {
    background-color: #8CC152;
}

.fc-working {
    color: #446333;
}

.bg-working {
    background-color: #446333;
}

.fc-debit {
    color: #2288d1 !important;
}

.fc-lightred {
    color: #ff8080 !important;
}

.bg-debit {
    background-color: #0288d1;
}

.fc-salary {
    color: #D770AD;
}

.bg-salary {
    background-color: #D770AD;
}

.ico-btn {
    display: inline-block;
    padding: 5px;
    text-align: center;
    cursor: pointer;
    border-radius: 3px;
}

.ico-btn .btn-text {
    font-size: 11px;
}

a.ico-btn:hover {
    text-decoration: none;
}

.ico-btn:hover {
    background: #c6deec;
}

.btn .btn-text {
    margin-left: 0.25em;
}


.btn.btn-fa i {
    line-height: 1.5em;
}


.datepicker-no-days .ui-datepicker-calendar {
    display: none;
}

.card {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    border-radius: 5px;
}

.card .card-image {
    border-radius: 5px;
}

.card .card-content {
    padding: 8px;
}

.card .card-head {
    padding-left: 8px;
    padding-top: 8px;
}


@keyframes lookhere {
    0% {}

    5% {
        transform: rotate(2deg);
    }

    8% {
        transform: rotate(-1deg);
    }

    10% {
        transform: rotate(1deg);
    }

    12%,
    75%,
    100% {
        transform: rotate(0deg);
    }
}

.anim-lookhere-inf {
    animation: lookhere 2000ms infinite;
}

.anim-lookhere {
    animation: lookhere 2000ms 1;
}

.saved-box-shadow {
    animation: savedbox 200ms linear;
}

@keyframes savedbox {
    50% {
        box-shadow: 0px 0px 2px 2px #529214;
    }
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.ml-auto {
    margin-left: auto !important;
}

.mr-auto {
    margin-right: auto !important;
}

.hint {
    cursor: help;
}

.ui-tooltip {
    background-color: #fff !important;
    color: #515253 !important;
    box-shadow: 1px 2px 3px #000 !important;
    border: 1px solid #515253 !important;
    white-space: pre-line;
}

/* table.mod17:not(.no-border):not(.no-bottom-border) { border-bottom: 2px solid #e0e0e0; }  Removed empty ruleset */

table.mod17 i {
    font-size: 1rem;
}

.fa-clear {
    font-size: 1.13333rem;
}

.fa-lg.fa-clear {
    font-size: 1.3rem;
}

table.mod17 .fa-lg {
    font-size: 1.33333rem !important;
}

table.mod17 .fa-xs {
    font-size: .75rem !important;
}

table.mod17 .fa-sm {
    font-size: .875rem !important;
}

table.mod17 .fa-1x {
    font-size: 1rem !important;
}

table.mod17 .fa-2x {
    font-size: 2em !important;
}

.fa-3x {
    font-size: 3em !important;
}

.fa-4x {
    font-size: 4em !important;
}

.fa-5x {
    font-size: 5em !important;
}

.fa-6x {
    font-size: 6em !important;
}

.fa-7x {
    font-size: 7em !important;
}

.fa-8x {
    font-size: 8em !important;
}

.fa-9x {
    font-size: 9em !important;
}

.fa-10x {
    font-size: 10em !important;
}

.tox-tinymce:not(.tox-tinymce-inline) {
    outline: 2px solid #aaa !important;
    outline-offset: -1px;
}

.tox-tinymce.tox-tinymce-inline {
    outline: 1px solid rgba(0, 0, 0, .2) !important;
}

.page-break-avoid {
    page-break-inside: avoid;
}

.page-break-after {
    page-break-after: always;
}

.page-break-before {
    page-break-before: always;
}
.page-fw {
    margin-left: -36px;
    margin-right: -36px;
    box-sizing: border-box;
}
.page-fw-padding {
    padding-left: 36px !important;
    padding-right: 36px !important;
    box-sizing: border-box;
}

iframe {
 box-sizing: border-box;
}

/* ---- tests ---- */
.appnav-main {
    background-color: #fff;
    /* border-bottom:1px solid #e0e0e0; */
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    padding:0.6rem;
      padding-right: 0.6rem;
      padding-left: 0.6rem;
    display: flex;
    padding-right: 3%;
    padding-left: 2%;
    flex-wrap: wrap;
}

/* .appnav-main {
    background-color: #a0bf42;
    color: #fff;
    box-shadow:none;
} */


.appnav-main #menu ul {
    border: none !important;
    /* box-shadow: 0 2px 15px -3px rgba(0, 0, 0, 0.07), 0 10px 20px -2px rgba(0, 0, 0, 0.04); */
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
    padding: 0.3rem;
    border-radius: 0.3rem;
    background: #fff;
}

.appnav-main #menu li {
    margin: 0px !important;
    border: none !important;
}

.appnav-main #menu>li {
    float: none !important;
    display: flex;
    margin: 0px;
    margin-right: 0.3rem;
}

.appnav-main #menu li img.arw {
    opacity: 0.5;
    right: 8px;
}

.appnav-main #menu {
    display: flex;
}

.appnav-main #menu,
.appnav-main #user {
    float: none !important;
    margin: 0px !important;
    font-size: 12px;
}

.appnav-main #user {
    margin-left: auto !important;
}

.appnav-main #menu .mainMenu {
    border: none !important;
    background: none !important;
}

.appnav-main #menu .mainMenu>li,
.appnav-main #menu .mainMenu>li a,
.appnav-main #menu a {
    color: rgb(0 0 0 / 50%) !important;
}

.appnav-main #menu .mainMenu>li:hover,
.appnav-main #menu .mainMenu>li a:hover,
.appnav-main #menu a:hover {
    color: rgb(0 0 0 / 95%) !important;
}

.appnav-main #menu .arw {
    opacity: 0.5;
}


.label-icon-group {
    display: flex;
    align-items: center;
}

.label-icon-wrapper {
    text-align: center;
    position: relative;
    border: 1px solid #aaa;
    align-self: stretch;
    border-radius: 2px 0px 0px 2px;
    background-color: #f0f0f0;
    border-right: 1px solid #dedede;
    padding: 0 1.5em;
}

.label-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.label-icon-group input {
    margin: 0 !important;
    border-left: none !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.orgname {
    display: flex;
    gap: 1em;
    align-items: center;
    font-size: 1rem;
}

#toolBar {
    display: flex;
}

.is-resizable {
    /* position: relative; */
    overflow: auto;
}

.size-handle-left,
.size-handle-right {
    width: 4px;
    height: 100%;
    background-color: #a9a9a9;
    position: absolute;
    cursor: ew-resize;
}

.size-handle-left:hover,
.size-handle-right:hover {
    background-color: #555;
}

.size-handle-left {
    left: 0;
}

.size-handle-right {
    right: 0;
}

.no-select {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

label:has(input:disabled) {
    color: #c5c6cd;
}

#loading-splash {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 99999;
}

.loading-content {
    text-align: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 2rem;
    position: relative;
}

.loading-text {
    position: absolute;
    top: 40px;
    color: var(--adderat-color-green);
    font-size: 16px;
    text-shadow: 0 0 10px #fff;
}

.loading-content button {
    text-shadow: none;
    color: rgba(255, 255, 255, .8);
    font-size: 0.9rem;
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, .3);
}

.load-spinner {
    border: 8px solid rgb(255, 255, 255);
    border-top: 8px solid var(--adderat-color-green);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    animation: spin 10s ease-in-out infinite;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 0 40px rgba(0, 0, 0, .2);
}

@keyframes spin {
    0% {
        transform: rotate(0deg) scale(1);
    }

    5% {
        transform: rotate(0deg) scale(1);
    }

    35% {
        transform: rotate(360deg) scale(1.2);
    }

    40% {
        transform: rotate(360deg) scale(1.2);
    }

    100% {
        transform: rotate(720deg) scale(1);
    }
}

.saved {
    position: relative;
}

.saved::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 4px;
    /* Simplified highlight overlay */
    background: rgba(76, 175, 80, .35);
    z-index: 2;
    opacity: 0;
    animation: saved-pulse 450ms ease-out;
    pointer-events: none;
}

.saved>* { pointer-events: auto; }

@keyframes saved-pulse {
    0% { opacity: .7; transform: scale(1); }
    60% { opacity: .3; }
    100% { opacity: 0; transform: scale(.985); }
}

@media (prefers-reduced-motion: reduce) {
    .saved::after { animation: saved-pulse 600ms linear; }
}