/* https://grow-it.pl/GROWEngine/InfoBox/InfoBox.css */

.info-box {
    pointer-events: none;
    z-index: 100;
}

.info-box .info-box-content {
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);

    border-radius: var(--base-padding);
    box-shadow: 0px var(--half-padding) var(--base-padding) rgba(0, 0, 0, 0.25);
    
    width: 450px;
    height: 75px;

    overflow: hidden;
}

@media (max-width: 1460px) {
    .info-box .info-box-content {
        width: 360px;
        height: 75px;
    }
}

.info-box .info-box-content .info-box-icon-controller {
    background-color: #d1914a;
    color: rgb(255, 255, 255);
}

.info-box[type="success"] .info-box-content .info-box-icon-controller {
    background-color: rgb(110, 167, 50);
    color: rgb(255, 255, 255);
}

.info-box[type="error"] .info-box-content .info-box-icon-controller {
    background-color: #dc143c;
    color: rgb(255, 255, 255);
}

/* https://grow-it.pl/GROWEngine/ModalBox/ModalBox.css */

.modal-box-wide.modal-box .modal-box-wide-content {
    position: relative;
    margin: 0px auto;
    width: 100%;
    height: 100%;
    max-width: 1080px !important;
    max-height: 90vh;
    overflow-y: auto;
}

/* https://grow-it.pl/GROWEngine/ModalBox/ModalBoxWide.css */

.modal-box-wide {
    background-color: rgb(0, 0, 0, 0.5);
    display: flex;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100vw;
    height: 100vh;
    z-index: 100;
    overflow-y: auto;
}

.modal-box-wide .modal-box-wide-content {
    background-color: white;
    position: relative;
    margin: 0px auto;
    width: 100%;
    max-width: 1920px;
}

.modal-box-wide .modal-box-wide-content .modal-box-wide-main {
    width: 100%;
    height: 100%;
}

.modal-box-wide .modal-box-wide-content .modal-box-wide-main .modal-box-wide-main-content {
    width: 100%;
    height: 100%;
}

/* https://grow-it.pl/includes/Styles/boxes.css */

.context-box { background-color: var(--primary-color-light);

    box-shadow: var(--shadow);

    border-radius: var(--button-padding);

    padding: var(--content-padding) 0px;
    
    position: absolute;

    min-width: 100px;
}

.context-box .context-box-content {
    height: 100%;

    overflow-y: auto;
    overflow-x: hidden;
}

.context-box .context-box-input { cursor: pointer;
    padding: var(--button-padding);
}
.context-box .context-box-input:hover { background-color: var(--primary-color); }

.context-box .context-box-button { cursor: pointer;
    padding: var(--button-padding);
}
.context-box .context-box-button:hover { background-color: var(--primary-color); }

/*  Drag Box    */

.drag-box {
    user-select: none;

    position: relative;

    width: 100%;
    height: 100%;
}

.drag-content {
    background-color: var(--primary-color-light);

    padding: var(--content-padding);
}
.drag-box[drag] .drag-content:hover {
    border: 1px dashed black;
    
    padding: calc( var(--content-padding) - 1px );
}

.drag-item {
    background-color: var(--primary-color-light);

    box-shadow: var(--shadow);

    display: inline-block;

    cursor: grab;

    margin: var(--content-padding);
    padding: var(--content-padding);

    position: relative;
}
.drag-item[drag] {
    pointer-events: none;

    position: absolute;

    cursor: grabbing;

    z-index: 1;
}

/*  Link Box    */

.link-box {
    user-select: none;

    position: relative;
    
    width: 100%;
    height: 100%;
}

.link-content {
    background-color: var(--primary-color-light);

    padding: var(--content-padding);
}

.link-item {
    background-color: var(--primary-color-light);

    box-shadow: var(--shadow);

    cursor: grab;

    margin: var(--content-padding);
    padding: var(--content-padding);
}
.link-item[drag] {
    pointer-events: none;
}

.expand-box .expand-box-header .expand-box-icon .icon { transition: 0.4s transform; }
.expand-box:not(.expand-box-open) .expand-box-header .expand-box-icon .icon { transform: rotate( 0deg ); }
.expand-box.expand-box-open .expand-box-header .expand-box-icon .icon { transform: rotate( 90deg ); }

.expand-box .expand-box-content {
    display: none;
}

/* https://grow-it.pl/includes/Styles/form.css */

.radiobox-label {
    cursor: pointer;
}

.radiobox {
    color: var(--secondary-color);
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    font-family: 'GrowIcons';
    font-weight: 900;
    text-align: center;
    min-width: 32px;
}

.radiobox:hover {
    color: rgba(110, 167, 50, 0.7);
    cursor: pointer;
}

.radiobox::before {
    display: block;
    content: '\00E0';
    text-align: center;
    transform: scale(1.6);
}

.radiobox.checked::before {
    display: block;
    content: '\00E1';
}

.radiobox.locked {
    cursor: inherit !important;
    color: inherit !important;
}

.checkbox-label {
    cursor: pointer;
}

.checkbox {
    color: var(--secondary-color);
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    font-family: 'GrowIcons';
    font-weight: 900;
    text-align: center;
    min-width: 32px;
}

.checkbox:hover {
    color: rgba(110, 167, 50, 0.7);
    cursor: pointer;
}

.checkbox::before {
    display: block;
    content: '\00E0';
    text-align: center;
    transform: scale(1.6);
}

.checkbox.checked::before {
    display: block;
    content: '\00E1';
    /* content: '\00A9'; */
}

.checkbox.locked {
    cursor: inherit !important;
    color: inherit !important;
}

.checkbox-label:not(.checked) .checked:not(.checkbox):not(.ignore) { display: none !important; }
.checkbox-label.checked .not-checked:not(.checkbox):not(.ignore) { display: none !important; }

.finish-test{
    border: 1px solid #7317a0; 
    border-radius: calc( var(--font-size) / 8 ); 
    padding: calc( var(--font-size) / 4 ) calc( var(--font-size) / 2 ); 
    font-size: calc( var(--font-size) / 2 );
}

.return-test{
    border: 1px solid #7317a0; 
    border-radius: calc( var(--font-size) / 8 ); 
    padding: calc( var(--font-size) / 4 ) calc( var(--font-size) / 2 ); 
    font-size: calc( var(--font-size) / 2 );
}

[input="file"] {
    cursor: pointer;
}

/* https://grow-it.pl/includes/Styles/html.css */

/*  Select    */

.button-select {
    color: rgb(110, 167, 50);
    border: 1px solid rgb(110, 167, 50);
    border-radius: 5px;
    padding: 5px 10px;
    display: inline-block;
    cursor: pointer;
    text-transform: none;
    position: relative;
    min-width: 200px;
}

.select {
    color: rgb(110, 167, 50);
    border: 1px solid rgb(110, 167, 50);
    border-radius: 5px;
    padding: 5px 10px;
    display: inline-block;
    cursor: pointer;
    text-transform: none;
    position: relative;
    min-width: 135px;
}

.select > .icon {
    font-size: 20px;
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY( -50%) !important;
}

.select:not(.select-open)>.icon::before {
    content: '\005C';
}

.select.select-open>.icon::before {
    content: '\005E';
}

.select[noicon]>.icon {
    display: none !important;
}

.select .option[disabled] {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.select:not([noicon]) .option[disabled] {
    padding-right: 20px;
}

.select-controller .quick-box-content {
    min-width: 270px !important;
    width: auto !important;
    max-width: 300px !important;
}

.select .select-options {
    display: none;
}

.select-options {
    width: 100%;
    min-width: 180px;
    max-height: 360px;
    position: relative;
    overflow-y: auto;
}

.select-options .select-options-content {
    padding: 5px;
}

.select-options .option {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    border-radius: 5px;
    padding: 5px;
    margin: 5px;
}

.select-options .option {}

.select-options .option {
    background: rgb(239, 239, 239);
    color: black;
    transition: 0.2s opacity;
}

.select-options .option[selected] {
    background: rgb(50, 110, 167);
    color: white;
}

.select-options .option:hover {
    opacity: 0.5;
}

.quick-box {
    font-size: 14px;
    position: fixed;
    z-index: 150;
}

.quick-box .quick-box-content {
    display: block;
    background: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    box-shadow: 0px 0px 10px darkgray;
    border-radius: 5px;
    overflow: hidden;
    min-width: 200px;
    max-height: 90vh;
}

.category-hidden {
    display: none !important;
}

.competence-hidden {
    display: none !important;
}

.accordion .accordion-box {
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.accordion .accordion-box .accordion-box-header { cursor: pointer; }
.accordion .accordion-box .accordion-box-content { display: none; }

.accordion .accordion-box:not(.active) .accordion-box-header .accordion-box-icon .icon::before { content: '\002B'; }
.accordion .accordion-box.active .accordion-box-header .accordion-box-icon .icon::before { content: '\002D'; }

/* https://grow-it.pl/includes/Styles/icons.css */



/* https://grow-it.pl/includes/Styles/labels.css */

.label {
    display: flex !important;
    align-items: center;
    width: 100%;
}

.label-content {
    flex-grow: 1;
    width: 0%;
}

.label-icon {
    min-width: 45px;
}

.column {
    display: flex !important;
    flex-direction: column;
    height: 100%;
}

.column-content {
    flex-grow: 1;
    height: 0%;
}

.column-90 { width: 90px; }
.column-135 { width: 135px; }
.column-180 { width: 180px; }
.column-225 { width: 225px; }
.column-270 { width: 270px; }
.column-360 { width: 360px; }
.column-450 { width: 450px; }
.column-540 { width: 540px; }
.column-630 { width: 630px; }

.separator {
    padding: var(--base-padding) 0px;
    border-left: 1px solid rgba(0, 0, 0, 0.25);
}

.highlight {
    color: rgb(110, 167, 50);
}

/* https://grow-it.pl/includes/Styles/messages.css */

.content-red
{
    color: red;
}

.content-green
{
    color: green;
}


/* https://grow-it.pl/includes/Styles/reset.css */

/*
@import url('https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i&display=swap');
*/

* {
    box-sizing: border-box;
    border: none;
    background: none;
    color: inherit;
    text-decoration: inherit;
    font-weight: inherit;
    font-size: inherit;
    /* font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; */
    font-family: inherit;
    margin: 0;
    padding: 0;
    outline: none;
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-color) var(--background-color);
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    border-radius: 8px;
}

::-webkit-scrollbar-track {
    background: var(--background-color);
    border-radius: 8px;
}

::-webkit-scrollbar-thumb {
    background: var(--scrollbar-color);
    border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
    opacity: 0.75;
}

html {
    font-family: 'Century Gothic';
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: rgb(191, 191, 191);
    font-weight: 300;
    width: 100%;
    height: 100%;
}

body {
    width: 100%;
    height: 100%;
}

img {
    max-width: 100%;
}

b {
    font-weight: bold;
}

u {
    text-decoration: underline;
}

strike {
    text-decoration: line-through;
}

sub {
    vertical-align: sub;
    font-size: smaller;
}

sup {
    vertical-align: super;
    font-size: smaller;
}

/* https://grow-it.pl/includes/Styles/style.css */

:root {
    --font-weight-light: 300;
    --font-weight: 400;
    --font-weight-bold: 500;
    /*  Font    Sizes   */
    --sub-note-font-size: 10px;
    --note-font-size: 11px;
    --sup-note-font-size: 12px;
    --sub-paragraph-font-size: 14px;
    --paragraph-font-size: 15px;
    --sup-paragraph-font-size: 16px;
    --sub-title-font-size: 18px;
    --title-font-size: 19px;
    --sup-title-font-size: 20px;
    --sub-header-font-size: 22px;
    --header-font-size: 23px;
    --sup-header-font-size: 24px;
    --sub-big-font-size: 26px;
    --big-font-size: 27px;
    --sup-big-font-size: 28px;
    --sub-huge-font-size: 30px;
    --huge-font-size: 31px;
    --sup-huge-font-size: 32px;

    --giant-font-size: 54px;

    /*  Line    Heights */
    --sub-note-line-height: calc( var(--sub-note-font-size) + 5px);
    --note-line-height: calc( var(--note-font-size) + 5px);
    --sup-note-line-height: calc( var(--sup-note-font-size) + 5px);
    --sub-paragraph-line-height: calc( var(--sub-paragraph-font-size) + 5px);
    --paragraph-line-height: calc( var(--paragraph-font-size) + 5px);
    --sup-paragraph-line-height: calc( var(--sup-paragraph-font-size) + 5px);
    --sub-title-line-height: calc( var(--sub-title-font-size) + 5px);
    --title-line-height: calc( var(--title-font-size) + 5px);
    --sup-title-line-height: calc( var(--sup-title-font-size) + 5px);
    --sub-header-line-height: calc( var(--sub-header-font-size) + 5px);
    --header-line-height: calc( var(--header-font-size) + 5px);
    --sup-header-line-height: calc( var(--sup-header-font-size) + 5px);
    --sub-big-line-height: calc( var(--sub-big-font-size) + 5px);
    --big-line-height: calc( var(--big-font-size) + 5px);
    --sup-big-line-height: calc( var(--sup-big-font-size) + 5px);
    --sub-huge-line-height: calc( var(--sub-huge-font-size) + 5px);
    --huge-line-height: calc( var(--huge-font-size) + 5px);
    --sup-huge-line-height: calc( var(--sup-huge-font-size) + 5px);

    --giant-line-height: calc( var(--giant-font-size) + 5px);

    /*  Old */
    --offset-padding: 8pt;
    --content-padding: 6pt;
    --button-padding: 4pt;
    --primary-color: rgb(255, 255, 255);
    --primary-color-light: rgb(255, 255, 255);
    --primary-color-dark: rgb(223, 223, 223);
    --secondary-color: rgb(0, 121, 173);
    --secondary-color-light: rgb(0, 144, 206);
    --secondary-color-dark: rgb(0, 97, 139);
    --third-color: rgb(31, 31, 31);
    --third-color-light: rgb(63, 63, 63);
    --third-color-dark: rgb(0, 0, 0);
    --shadow: 5px 10px 15px var(--third-color-light);
    --shadow-light: 2px 4px 6px var(--third-color-light);
    --base-padding: 12px;
    --half-padding: 6px;
    --quarter-padding: 3px;
}

@media (max-width: 1380px) {
    :root {
        --sub-note-font-size: 6px !important;
        --note-font-size: 7px !important;
        --sup-note-font-size: 8px !important;
        --sub-paragraph-font-size: 10px !important;
        --paragraph-font-size: 11px !important;
        --sup-paragraph-font-size: 12px !important;
        --sub-title-font-size: 14px !important;
        --title-font-size: 15px !important;
        --sup-title-font-size: 16px !important;
        --sub-header-font-size: 18px !important;
        --header-font-size: 19px !important;
        --sup-header-font-size: 20px !important;
        --sub-big-font-size: 22px !important;
        --big-font-size: 23px !important;
        --sup-big-font-size: 24px !important;
        --sub-huge-font-size: 26px !important;
        --huge-font-size: 27px !important;
        --sup-huge-font-size: 28px !important;

        --giant-font-size: 40px !important;

        --base-padding: 8px !important;
        --half-padding: 4px !important;
        --quarter-padding: 2px !important;
    }
}
@media (max-height: 800px) {
    :root {
        --sub-note-font-size: 6px !important;
        --note-font-size: 7px !important;
        --sup-note-font-size: 8px !important;
        --sub-paragraph-font-size: 10px !important;
        --paragraph-font-size: 11px !important;
        --sup-paragraph-font-size: 12px !important;
        --sub-title-font-size: 14px !important;
        --title-font-size: 15px !important;
        --sup-title-font-size: 16px !important;
        --sub-header-font-size: 18px !important;
        --header-font-size: 19px !important;
        --sup-header-font-size: 20px !important;
        --sub-big-font-size: 22px !important;
        --big-font-size: 23px !important;
        --sup-big-font-size: 24px !important;
        --sub-huge-font-size: 26px !important;
        --huge-font-size: 27px !important;
        --sup-huge-font-size: 28px !important;

        --giant-font-size: 40px !important;

        --base-padding: 8px !important;
        --half-padding: 4px !important;
        --quarter-padding: 2px !important;
    }
}

@media (max-width: 1280px) {
    :root {
        --sub-note-font-size: 7px;
        --note-font-size: 8px;
        --sup-note-font-size: 9px;
        --sub-paragraph-font-size: 11px;
        --paragraph-font-size: 12px;
        --sup-paragraph-font-size: 13px;
        --sub-title-font-size: 15px;
        --title-font-size: 16px;
        --sup-title-font-size: 17px;
        --sub-header-font-size: 19px;
        --header-font-size: 20px;
        --sup-header-font-size: 21px;
        --sub-big-font-size: 23px;
        --big-font-size: 24px;
        --sup-big-font-size: 25px;
        --sub-huge-font-size: 27px;
        --huge-font-size: 28px;
        --sup-huge-font-size: 20px;

        --giant-font-size: 42px;

        --base-padding: 6px;
        --half-padding: 3px;
        --quarter-padding: 1.5px;
    }
}

.giant {
    --font-size: var(--giant-font-size) !important;
    --font-line-height: var(--giant-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sub-giant {
    --font-size: calc( var(--giant-font-size) * 0.75 ) !important;
    --font-line-height: calc( var(--giant-line-height) * 0.75 ) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sup-huge {
    --font-size: var(--sup-huge-font-size) !important;
    --font-line-height: var(--sup-huge-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.huge {
    --font-size: var(--huge-font-size) !important;
    --font-line-height: var(--huge-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sub-huge {
    --font-size: var(--sub-huge-font-size) !important;
    --font-line-height: var(--sub-huge-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sup-big {
    --font-size: var(--sup-big-font-size) !important;
    --font-line-height: var(--sup-big-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.big {
    --font-size: var(--big-font-size) !important;
    --font-line-height: var(--big-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sub-big {
    --font-size: var(--sub-big-font-size) !important;
    --font-line-height: var(--sub-big-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sup-header {
    --font-size: var(--sup-header-font-size) !important;
    --font-line-height: var(--sup-header-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.header {
    --font-size: var(--header-font-size) !important;
    --font-line-height: var(--header-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sub-header {
    --font-size: var(--sub-header-font-size) !important;
    --font-line-height: var(--sub-header-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sup-title {
    --font-size: var(--sup-title-font-size) !important;
    --font-line-height: var(--sup-title-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.title {
    --font-size: var(--title-font-size) !important;
    --font-line-height: var(--title-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sub-title {
    --font-size: var(--sub-title-font-size) !important;
    --font-line-height: var(--sub-title-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sup-paragraph {
    --font-size: var(--sup-paragraph-font-size) !important;
    --font-line-height: var(--sup-paragraph-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.paragraph {
    --font-size: var(--paragraph-font-size) !important;
    --font-line-height: var(--paragraph-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sub-paragraph {
    --font-size: var(--sub-paragraph-font-size) !important;
    --font-line-height: var(--sub-paragraph-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sup-note {
    --font-size: var(--sup-note-font-size) !important;
    --font-line-height: var(--sup-note-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.note {
    --font-size: var(--note-font-size) !important;
    --font-line-height: var(--note-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

.sub-note {
    --font-size: var(--sub-note-font-size) !important;
    --font-line-height: var(--sub-note-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
}

img {
    width: 100%;
    max-width: 100%;
}

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: both;
}

b,
strong,
.text-bold {
    font-weight: bold;
}

.underline {
    border-bottom: 1px solid rgb(63, 63, 63);
}

.text-center {
    text-align: center !important;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-justify {
    text-align: justify !important;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.sticky-top {
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    left: 0px;
    z-index: 10;
}

.sticky-bottom {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0px;
    left: 0px;
    z-index: 10;
}

.top {
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
}

.top-left {
    position: absolute;
    top: 0px;
    left: 0px;
}

.top-center {
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
}

.top-right {
    position: absolute;
    top: 0px;
    right: 0px;
}

.middle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.middle-left {
    position: absolute;
    top: 50%;
    left: 0px;
    transform: translateY(-50%);
}

.middle-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.middle-right {
    position: absolute;
    top: 50%;
    right: 0px;
    transform: translateY(-50%);
}

.bottom {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
}

.bottom-left {
    position: absolute;
    bottom: 0px;
    left: 0px;
}

.bottom-center {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
}

.bottom-right {
    position: absolute;
    bottom: 0px;
    right: 0px;
}

.border-radius {
    border-radius: var(--base-padding) !important;
}
.border-radius-left {
    border-radius: var(--base-padding) 0px 0px var(--base-padding) !important;
}
.border-round {
    border-radius: 100px !important;
}

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

.no-padding {
    padding: 0px !important;
}

.base-padding {
    padding: var(--base-padding) !important;
}

.base-padding-2 {
    padding: calc(var(--base-padding) * 2) !important;
}

.base-padding-3 {
    padding: calc(var(--base-padding) * 3) !important;
}

.base-padding-1-0 {
    padding: var(--base-padding) 0px !important;
}

.base-padding-0-1 {
    padding: 0 var(--base-padding) !important;
}

.base-padding-2-0 {
    padding: calc(var(--base-padding) * 2) 0px !important;
}

.base-padding-0-2 {
    padding: 0px calc(var(--base-padding) * 2) !important;
}

.base-padding-2-1 {
    padding: calc(var(--base-padding) * 2) var(--base-padding) !important;
}

.base-padding-1-2 {
    padding: var(--base-padding) calc(var(--base-padding) * 2) !important;
}

.half-padding {
    padding: var(--half-padding) !important;
}

.half-padding-1-0 {
    padding: var(--half-padding) 0px !important;
}

.half-padding-0-1 {
    padding: 0px var(--half-padding) !important;
}

.half-padding-2-0 {
    padding: var(--half-padding) 0px !important;
}

.half-padding-0-2 {
    padding: 0px var(--half-padding) !important;
}

.half-padding-2-1 {
    padding: calc(var(--half-padding) * 2) var(--half-padding) !important;
}

.half-padding-1-2 {
    padding: var(--half-padding) calc(var(--half-padding) * 2) !important;
}

.quarter-padding {
    padding: var(--quarter-padding) !important;
}

.quarter-padding-1-0 {
    padding: var(--quarter-padding) 0px !important;
}

.quarter-padding-0-1 {
    padding: 0px var(--quarter-padding) !important;
}

.quarter-padding-2-0 {
    padding: var(--quarter-padding) 0px !important;
}

.quarter-padding-0-2 {
    padding: 0px var(--quarter-padding) !important;
}

.quarter-padding-2-1 {
    padding: calc(var(--quarter-padding) * 2) var(--quarter-padding) !important;
}

.quarter-padding-1-2 {
    padding: var(--quarter-padding) calc(var(--quarter-padding) * 2) !important;
}

.justify-content-center {
    justify-content: center !important;
}

.text-center {
    text-align: center !important;
}

.row {
    display: flex;
}

.row .row-main {
    flex-grow: 1;
}

.disabled {
    pointer-events: none;
    opacity: 0.5;
}

.html-line {
    pointer-events: none;
}

.tool-bar {
    width: var(--header-size);
}

.tool {
    border: 2px solid transparent;
    cursor: pointer;
    line-height: calc(var(--header-size) - 4px);
    width: var(--header-size);
    height: var(--header-size);
}

.tool:hover {
    border-radius: var(--content-padding);
    border: 2px solid var(--primary-color);
}

.scroll {
    overflow-x: auto;
    overflow-y: auto;
    height: 100%;
    max-height: 100%;
}

.scroll-y {
    overflow-x: hidden;
    overflow-y: auto;
    height: 100%;
    max-height: 100%;
}
.overflow-y {
    overflow-x: hidden;
    overflow-y: scroll;
    height: 100%;
    max-height: 100%;
}

.scroll-x {
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
    max-width: 100%;
}

.fill-height {
    height: 100%;
}

.fill-width {
    width: 100%;
}

.fill-both {
    width: 100%;
    height: 100%;
}

.fill-absolute {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

.loading-spin {
    animation-name: loadingSpin;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

.hidden {
    display: none !important;
}

.hidden-search,
.hidden-role,
.hidden-type,
.hidden-status,
.hidden-grade,
.hidden-category {
    display: none !important;
}

@keyframes loadingSpin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.nowrap {
    white-space: nowrap;
}

.test {
    color: rgb(90, 17, 119);
}

.button-border {
    border: 1px solid rgb(110, 167, 50);
    border-radius: 5px;
    padding: 5px 10px;
}

.loading-text::after {    
    background-color: rgb(110, 167, 50);
    display: block;
    content: '';

    height: 4px;

    position: relative;

    animation-name: LoadingTextAnimation;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

@keyframes LoadingTextAnimation {
    0% {
        left: 0%;
        width: 0%;
    }

    25% {
        left: 0%;
        width: 0%;
    }

    50% {
        left: 0%;
        width: 100%;
    }

    75% {
        left: 100%;
        width: 0%;
    }

    100% {
        left: 100%;
        width: 0%;
    }
}

/* https://grow-it.pl/includes/Styles/tables.css */


.multitable {
    display: flex;
}

    .tr {
        display: flex;
    }

    .tr-sticky-top {
        background-color: white;
        position: sticky;
        left: 0px;
        top: 0px;
    }

    .tr-sticky-bottom {
        background-color: white;
        position: sticky;
        bottom: 0px;
    }

/* https://grow-it.pl/includes/Styles/tooltip.css */

.tooltip {
    display: block;

    pointer-events: none;

    background: rgb( 255, 255, 255 );
    color: rgb(0, 0, 0);

    border: 1px solid lightgray;
    border-radius: 5px;

    font-size: 12px;

    font-weight: 400;

    position: fixed;

    padding: 5px;

    min-width: 0px;
    width: auto;
    max-width: 50vw;

    min-height: 0px;
    height: auto;
    max-height: 50vw;

    overflow: hidden;

    z-index: 99999;
}

/* https://grow-it.pl/ModulesCore/Template/Template.css */

html {
    width: 100%;
    height: 100%;

    overflow: hidden;
}

body {
    display: flex;
    flex-direction: column;

    width: 100%;
    height: 100%;

    overflow: hidden;
}

#site {
    background-color: white;
    /* background-image: url('https://resources.grow-it.pl/grow.edu/Bulb.png');
    background-size: 50%;
    background-position: center;
    background-repeat: no-repeat; */
}

#site-content {
    flex-grow: 1;
    position: relative;
    z-index: 0;
    height: 0%;
}

/* https://grow-it.pl/Modules/CardGrid/CardGrid.css */

.grid-card-box {
    position: relative;
}

.grid-card {
    position: absolute;
    left: 0px;
    top: 0px;
    width: calc( 100% / var(--columns));
    height: 480px;
    transition: 0.2s left, 0.2s top, 0.2s width, 0.2s height;
}

.grid-card .grid-card-content {
    background-color: rgb(255, 255, 255);
    color: rgb(63, 63, 63);
    border-radius: 10px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
    transition: 0.2s box-shadow;
    width: 100%;
    height: 100%;
}

.grid-card:not(.active) .grid-card-content:hover {
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.grid-card.active {
    left: 0% !important;
    top: 0% !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1;
}

.grid-card:not(.active) .grid-card-button-close {
    display: none;
}

.grid-card:not(.active) .grid-card-opened-content {
    display: none;
}

.grid-card.active .grid-card-main-content {
    display: none;
}

/* https://grow-it.pl/Modules/Categories/CategoriesPanel.css */

.categories-panel-navigation .in,
.categories-panel-navigation .st,
.categories-panel-navigation .bt {
    --font-size: var(--paragraph-font-size) !important;
    --font-line-height: var(--paragraph-line-height) !important;
    font-size: var(--font-size) !important;
    line-height: var(--font-line-height) !important;
    transition: 0.4s font-size, 0.4s line-height;
}

/* https://grow-it.pl/Modules/Categories/Category/Category.panel.css */

.category-panel-maximized:not([category="0"]) .form-placeholder {
    display: none;
}
.category-panel-maximized[category="0"] .form-item {
    display: none;
}

.category-panel-maximized[status=""] .category-button-form-controller { display: block !important; }
.category-panel-maximized[status="trash"] .category-button-trash-controller { display: block !important; }
.category-panel-maximized[status="active"] .category-button-active-controller { display: block !important; }

/* https://grow-it.pl/Modules/Categories/Category/css/style.css */

.category-actions {
    text-align: center;
}

/* https://grow-it.pl/Modules/Company/Company/Company.css */

.company-avatar {
    width: 360px;
    height: 360px;
}

/* https://grow-it.pl/Modules/Company/css/Company.css */

/* .company-basic-info{
    border-left: 1px solid rgba(0,0,0,0.1);
    border-right: 1px solid rgba(0,0,0,0.1);
    border-radius: 10px;
    padding: 20px;
    margin: 20px; 
    height: 400px;
} */

table tr th{
    vertical-align: baseline;
    padding: var(--base-padding);
}

.button-select-all{
    /* padding: var(--base-padding) 0 0 0; */
}

.select.role-users-change-style {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-radius: 0;
}

.companies-user-content-inside{
    /* border-bottom: 1px solid rgba(0,0,0,0.1);  */
    height: 100px;
}

.company-name-input-div,
.company-tin-input-div,
.company-street-input-div,
.company-postal-input-div,
.company-flat-input-div,
.company-building-input-div,
.company-city-input-div,
.company-post-input-div,
.company-mail-host-input-div,
.company-mail-port-input-div,
.company-mail-user-input-div,
.company-mail-paswword-input-div
 {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    /* border-radius: 100px; */
    padding: var(--half-padding);
    background: rgba(0,0,0,0.01);
}

.form-user-edit{
    width: 350px !important;
}

.form-user-edit .user-firstname,
.form-user-edit .user-lastname,
.form-user-edit .user-email
{
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: var(--base-padding);
    background: rgba(0,0,0,0.01);
}

.user-button-reset-passsword,
.edit-user-button .form-button {
    padding: var(--base-padding);
}

.generate-new-password, 
.edit-user-button{
    display: flex;
    justify-content: center;
}

.select.role-user-select.role-filter {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    border-radius: 0;
    border-left: 0;
    border-top: 0;
    border-right: 0;
}

.title-form-company{
    /* padding-left: calc(var(--base-padding) * 1.5);  */
    font-size: 8pt;
}

/* https://grow-it.pl/Modules/Company/css/style.css */

.form-user { 
    text-align: left;
    /* width: 400px !important; */
}

.user-content-inputs{
    border-bottom: 1px solid rgba(0,0,0,0.1);
    /* border-radius: 15px; */
    padding: var(--half-padding);
    /* background: rgba(0,0,0,0.01); */
}

.instruction {
    font-size: var(--sup-huge-line-height);
}
.charts {
    font-size: calc(var(--sup-huge-line-height) + 4pt);
}

.avatar-hover:hover{
    -webkit-filter: brightness(70%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}

.user-global-row th{
    background: rgb(242, 242, 242);
    opacity: 1 !important;
    position: sticky;
    position: -webkit-sticky;
    top: 0px;
    z-index: 5;
    border-spacing: 0px;
}

.row-bottom-table{
    position: -webkit-sticky;
    position: sticky;
    bottom: 0px;
    /* background: rgb(242, 242, 242); */
    background: white;
    border-top: 1px solid rgba(0,0,0,0.1);
    color: rgb(170, 170, 170);
}

/*  permission and role checked styles  */
.inside-content-left .tr-content-left{ background: rgb(240,240,240) }
.inside-content-right .tr-content { background-color:white; }
.inside-content-left .tr-content-left.active {
    background-color: rgba(0,0,0,0.1);
}
.inside-content-right .tr-content.active  { background-color:rgba(0,0,0,0.1); }

/* https://grow-it.pl/Modules/ContextMenu/ContextMenu.css */

.context-menu {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

.context-menu .context-menu-content {
    background-color: white;
    box-shadow: 0px 0px var(--half-padding) rgba(0, 0, 0, 0.25);
    border-radius: 0px var(--half-padding) var(--half-padding) var(--half-padding);
    position: fixed;
    left: 0px;
    top: 0px;
    overflow: hidden;
}

.context-menu .context-menu-content .context-menu-button {
    cursor: pointer;
    padding: var(--base-padding);
    transition: 0.125s opacity;
}
.context-menu .context-menu-content .context-menu-button:hover {
    background-color: rgb(239, 239, 239);
    opacity: 0.75;
}

/* https://grow-it.pl/Modules/Files/FileBox/FileBox.css */

.file-box {
    z-index: 1000;
}

.file-box .file-box-content {
    background-color: white;
    width: 450px;
}

.file-box-upload::after {
    display: block;
    content: '';
    background-color: rgb(110, 167, 50);
    width: calc(var(--progress) * 100%);
    height: 4px;
    transition: 0.1s width;
}

/* https://grow-it.pl/Modules/Files/FileDrop/FileDrop.css */

.file-drop .file-drop-content {
    border: 2px dashed rgba(0, 0, 0, 0.0625);
    transition: 0.2s border-color, 0.2s box-shadow;
}
.file-drop.active .file-drop-content {
    border-color: rgba(110, 167, 50);
}
.file-drop.active-drop .file-drop-content {
    border-color: rgba(110, 167, 50);
    box-shadow: var(--half-padding) var(--half-padding) var(--base-padding) rgba(0, 0, 0, 0.25);
}

.file-explorer .file-drop-placeholder-icon {
    transition: 0.5s height;
    height: calc(var(--giant-line-height) + var(--base-padding) * 2);
    overflow: hidden;
}
.file-explorer.active .file-drop-content {
    transition: 0.5s padding;
}

.file-explorer.active .file-drop-placeholder-icon {
    height: 0px !important;
}

.file-explorer.active .file-drop-content {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

/* https://grow-it.pl/Modules/Files/css/style.css */



/* https://grow-it.pl/Modules/Forms/Form.css */

.textarea-controller {
    --background-color: transparent;
    --bt-color: #dadada6c;
    --scrollbar-color: var(--bt-color);
    border: 1px solid var(--bt-color);
    padding: var(--half-padding);
}

.textarea-controller textarea {
    --font-size: var(--paragraph-font-size);
    --font-line-height: var(--paragraph-line-height);
    
    color: #79838c;

    font-size: var(--font-size);
    line-height: var(--font-line-height);
    transition: 0.4s font-size, 0.4s line-height;

    padding: 0px !important;

    width: 100%;

    min-height: calc( var(--font-line-height) * 3 );
    height: calc( var(--font-line-height) * 3 );
    max-height: calc( var(--font-line-height) * 6 );
}

textarea {
    --font-size: var(--paragraph-font-size);
    --font-line-height: var(--paragraph-line-height);
    
    color: #79838c;

    font-size: var(--font-size);
    line-height: var(--font-line-height);
    transition: 0.4s font-size, 0.4s line-height;

    padding: 0px !important;

    width: 100%;

    min-height: calc( var(--font-line-height) * 3 );
    height: calc( var(--font-line-height) * 3 );
    max-height: calc( var(--font-line-height) * 6 );

    resize: vertical;
}

.in {
    --bt-color: #dadada6c;
    border-radius: var(--half-padding);
    border: 1px solid var(--bt-color);
    color: #79838c;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    padding: var(--half-padding);
    display: block;
    width: 100%;
    transition: 0.4s background-color, 0.4s color, 0.4s border-color;
}

.in:hover {
    background-color: var(--bt-color);
    color: #79838c;
}

.in:focus {
    background-color: var(--bt-color);
    color: #79838c;
}

.st {
    --bt-color: #dadada6c;
    border-radius: var(--half-padding) !important;
    border: 1px solid var(--bt-color);
    color: #79838c;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    padding: var(--half-padding);
    display: block;
    width: 100%;
    transition: 0.4s background-color, 0.4s color, 0.4s border-color;
}

.st-clear {
    --bt-color: #dadada6c;
    border-radius: var(--half-padding) !important;
    border: none;
    color: #79838c;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    padding: var(--half-padding);
    display: block;
    width: 100%;
    min-width: 0px;
    transition: 0.4s background-color, 0.4s color, 0.4s border-color;
}

.st:hover {
    background-color: var(--bt-color);
    color: #79838c;
}

.st.select-open {
    background-color: var(--bt-color);
    color: #79838c;
}

.bt {
    --bt-color: #dadada6c;
    border-radius: var(--half-padding) !important;
    background-color: var(--bt-color);
    border: 1px solid var(--bt-color);
    color: #79838c;
    cursor: pointer;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    text-align: center;
    padding: var(--half-padding);
    position: relative;
    display: block;
    width: 100%;
    transition: 0.4s background-color, 0.4s color, 0.4s box-shadow;
}

.bt:hover {
    background-color: var(--bt-color);
    color: #79838c;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.125);
}

.bt-group {
    display: flex;
}
.bt-group.vertical {
    flex-direction: column;
}

.bt-group:not(.vertical) .bt:not(:first-child) {
    border-left: 0px solid transparent;
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}
.bt-group:not(.vertical) .bt:not(:last-child) {
    border-right: 0px solid transparent;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.bt-group.vertical .bt:not(:first-child) {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}
.bt-group.vertical .bt:not(:last-child) {
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.bt-group .bt:not(.active) {
    background-color: transparent;
    color: inherit !important;
}

.bt-group .bt.active {
    background-color: #dadada6c;
    color: #79838c;
}

.bt-group .bt {
    border: none !important;
}

.tx {
    --bt-color: #dadada6c;
    border-radius: var(--half-padding) !important;
    border: 1px solid var(--bt-color);
    color: #79838c;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    padding: var(--half-padding);
    display: block;
    width: 100%;
    transition: 0.4s background-color, 0.4s color;
    resize: none;
}

.tx:hover {
    background-color: var(--bt-color);
    color: #79838c;
}

.tx:focus {
    background-color: var(--bt-color);
    color: #79838c;
}

.label-input {
    --bt-color: #dadada6c;
    border: 1px solid var(--bt-color);
    border-radius: 10px;
}

.form-placeholder {
    pointer-events: none;
    opacity: 0.25;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
    height: 100%;
}

.form-placeholder .form-placeholder-icon {
    padding: var(--base-padding);
}

.form-placeholder .form-placeholder-content {
    border-radius: var(--base-padding);
    text-align: center;
    padding: var(--base-padding);
    width: 0%;
    flex-grow: 1;
}

[require] {
    transition: 0.25s background-color, 0.25s color;
}
[require="error"] {
    background-color: crimson !important;
    color: white !important;
}

.object-button-controller {
    display: none;
    color: rgb(110, 167, 50);
}

.object-form .object-form-button {
    color: rgb(148, 77, 191);
}

.button {
    cursor: pointer;
    display: inline-block;
    text-align: left;
    min-width: 32px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.input-header {
    padding: var(--half-padding);
    text-transform: lowercase;
    opacity: 0.5;
}

/* https://grow-it.pl/Modules/Groups/Group/Group.panel.css */

.group-panel-maximized:not([group="0"]) .form-placeholder {
    display: none;
}
.group-panel-maximized[group="0"] .form-item {
    display: none;
}

.group-panel-maximized[status=""] .group-button-form-controller { display: block !important; }
.group-panel-maximized[status="trash"] .group-button-trash-controller { display: block !important; }
.group-panel-maximized[status="active"] .group-button-active-controller { display: block !important; }

/* https://grow-it.pl/Modules/HelpDesk/HelpDesk/HelpDesk.css */

.help-desk {
    background-color: white;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
    position: fixed;
    right: 0px;
    top: 0px;
    height: 100%;
    width: 0px;
    overflow: hidden;
    transition: 0.25s width;
    z-index: 2;
}
.help-desk.active {
    width: 450px;
}

.help-desk .help-desk-content {
    width: 450px;
}
.help-desk-button-toggle {
    cursor: pointer;
}

/* https://grow-it.pl/Modules/HelpDesk/HelpDeskMessage/HelpDeskMessage.css */

.helpdesk-message .helpdesk-message-text {
    white-space: pre-line;
}

form[name="helpdesk-message"] {
    background-color: rgb(161, 168, 176);
}

form[name="helpdesk-message"] .textarea-controller {
    background-color: white;
    border-radius: var(--half-padding);
}

form[name="helpdesk-message"] .st {
    background-color: white;
}

form[name="helpdesk-message"] .bt {
    background-color: white;
}

.helpdesk-message {
    border-top: 1px solid rgba(0, 0, 0, 0.0625);
}

.helpdesk-message[mine="true"] {
    background-color: rgb(239, 239, 239);
}

/* https://grow-it.pl/Modules/HelpDesk/HelpDeskThread/HelpDeskThread.css */

/* .helpdesk-thread-minimized:not(:last-child) {
    border-bottom: 1px solid rgba(0, 0, 0, 0.0625);
} */

.helpdesk-thread-minimized {
    padding: var(--half-padding) var(--base-padding);
}

.helpdesk-thread>.helpdesk-thread-content {
    background-color: white;
    color: rgb(0, 0, 0);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
}

.helpdesk-thread-minimized .helpdesk-thread-border {
    border-left: 5px solid rgba(0, 0, 0, 0.0625);
}

.helpdesk-thread:not([status="done"]) .helpdesk-thread-border {
    border-color: rgb(110, 167, 50);
}

.helpdesk-thread[type="grow.edu"][status="waiting"] .helpdesk-thread-border {
    border-color: rgb(167, 50, 110);
}

form[name="helpdesk-thread"] {
    background-color: rgb(161, 168, 176);
}

form[name="helpdesk-thread"] .textarea-controller {
    background-color: white;
    border-radius: var(--half-padding);
}

form[name="helpdesk-thread"] .st {
    background-color: white;
}

form[name="helpdesk-thread"] .bt {
    background-color: white;
}

/* https://grow-it.pl/Modules/Languages/Translation.css */

.translation-table tr td {
    transition: 0.4s background-color, 0.4s color;
}

.translation-table tr.highlight td {
    background-color: rgb(220, 20, 60);
    color: white;
}

.translation-table tr.new td {
    background-color: rgb(110, 167, 50);
    color: white;
}

/* https://grow-it.pl/Modules/Notifications/NotificationsPage.css */

.notifications-page {
    --background-offset: 45%;
    background-image: radial-gradient(at bottom right, limegreen var(--background-offset), royalblue var(--background-offset));
    color: white;
}

.notifications-page .notifications-page-content {
    margin: auto;
    max-width: 1080px;
}

.notification-setting-email-controller.disabled .checkbox {
    color: rgb(0, 0, 0, 0.5);
}

/* https://grow-it.pl/Modules/Notifications/Notification/Notification.css */

.notification-minimized {
    text-align: initial;
    position: relative;
    padding: var(--half-padding) var(--base-padding);
    transition: 0.2s opacity;
}

.notification-minimized>.notification-content {
    background-color: white;
    color: rgb(0, 0, 0);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
}

.notification-minimized>.notification-content>.notification-border {
    border-left: 5px solid var(--border-color);
}

.notification[href] {
    cursor: pointer;
}

.notification-minimized[read="true"] {
    opacity: 0.5;
}
.notification-minimized:hover {
    opacity: 1;
}

/* https://grow-it.pl/Modules/Panel/CardBox.css */

.card-box-controller {
    position: relative;
}

.card-box {
    position: absolute;
    left: 0px;
    top: 0px;
    width: calc( 100% / var(--columns));
    transition: 0.2s left, 0.2s top, 0.2s width, 0.2s height;
}

.card-box .card-box-content {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    transition: 0.2s box-shadow;
}

.card-box:not(.active) .card-box-content:hover {
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5);
}

.card-box.active {
    left: 0% !important;
    top: 0% !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1;
}

.card-box:not(.active) .card-box-button-close {
    display: none;
}

.card-box:not(.active) .card-box-opened-content {
    display: none;
}

.card-box.active .card-box-main-content {
    display: none;
}

/* https://grow-it.pl/Modules/Panel/Panel.css */

.panel {
    --background-color: rgb(239, 239, 239);
    background-color: var(--background-color);
    width: 100%;
    height: 100%;
}

/*
    Panel Navigation
*/

.panel-navigation {
    pointer-events: none;
    position: relative;
    width: calc(40px + var(--half-padding));
    height: 100%;
    z-index: 2;
}

.panel-navigation .panel-navigation-content {
    display: flex;
    flex-direction: column;
    pointer-events: none;
    width: calc(40px + var(--half-padding));
    height: 100%;
    overflow: hidden;
    transition: 0.25s width;
}
.panel-navigation .panel-navigation-content:hover {
    width: 225px;
}

.panel-navigation .panel-navigation-main {
    pointer-events: none;
    width: 250px;
    margin: auto;
    max-height: 100%;
    overflow: hidden;
}

.panel-navigation-button {
    pointer-events: all;
    display: block !important;
    width: calc(40px + var(--half-padding));
    overflow: hidden;
    transition: 0.25s width;
}
.panel-navigation-button:hover {
    width: 225px;
}

.panel-navigation-button-content {
    background-color: var(--color);
    color: white;

    border-radius: 100px;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
}

.panel-navigation .panel-navigation-button.active .panel-navigation-button-content {
}

.panel-navigation-button-icon {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
}

.panel-navigation-button-text {
    display: inline-block;
    vertical-align: middle;
    width: 200px;
    height: 40px;
}

@media (max-width: 1380px) {
    .panel-navigation {
        width: calc(30px + var(--half-padding));
    }
    .panel-navigation .panel-navigation-content {
        width: calc(30px + var(--half-padding));
    }
    .panel-navigation-button {
        width: calc(30px + var(--half-padding));
    }
    .panel-navigation-button-icon {
        width: 30px;
        height: 30px;
    }
    .panel-navigation-button-text {
        height: 30px;
    }
}

@media (max-height: 800px) {
    .panel-navigation {
        width: calc(30px + var(--half-padding));
    }
    .panel-navigation .panel-navigation-content {
        width: calc(30px + var(--half-padding));
    }
    .panel-navigation-button {
        width: calc(30px + var(--half-padding));
    }
    .panel-navigation-button-icon {
        width: 30px;
        height: 30px;
    }
    .panel-navigation-button-text {
        height: 30px;
    }
}

/*
    Panel Main
*/

.panel-main {
    position: relative;
    z-index: 1;
}

#panel .panel-content {
    height: 100%;
}

.panel-card-box {
    position: relative;
    transition: 0.4s background-color;
}

.panel-card-box[selecting="true"] {
    background-color: rgb(223, 223, 223);
}

.panel-card-box .select-tools {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
}

.panel-card-box:not([selecting="true"]) .select-tools {
    display: none !important;
}

.panel-card {
    position: absolute;
    left: calc( 100% / var(--columns) * var(--left) );
    top: calc( var(--top) * var(--height) * 1px );
    width: calc( 100% / var(--columns));
    height: calc( var(--height) * 1px );
    transition: 0.125s left, 0.125s top, 0.125s height;
}

.panel-card .panel-card-content {
    background-color: rgb(255, 255, 255);
    /* border: 1px solid rgba(0, 0, 0, 0.125); */
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    transition: 0.2s box-shadow;
}

.panel-card-box[selecting="true"] .panel-card.selected .panel-card-content {
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 1);
}

.panel-card:not(.active) .panel-card-content:hover {
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5);
}

.panel-card.active {
    left: 0% !important;
    top: 0% !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1;
}

.panel-card:not(.active) .panel-card-button-close {
    display: none;
}

.panel-card:not(.active) .panel-card-opened-content {
    display: none;
}

.panel-card.active .panel-card-main-content {
    display: none;
}

/*
    Panel Sidebar
*/

.panel .in .st {
    background-color: transparent !important;
}

.panel .panel-sidebar {
    position: relative !important;
}

.panel .panel-sidebar .panel-sidebar-content {
    position: relative !important;
    width: 100% !important;
}

.panel-sidebar-left {
    min-width: 270px;
    overflow: hidden;
}
.panel-sidebar-right {
    --background-color: rgb(247, 247, 247);
    background-color: var(--background-color);
    width: 0%;
    max-width: calc(100% - 270px);
}
[right-sidebar="true"] .panel-sidebar-right {
    width: 100%;
}

.panel-sidebar-right .panel-sidebar-right-button-hide { display: none; }
[right-sidebar="true"]  .panel-sidebar-right .panel-sidebar-right-button-hide {
    display: block;
}

@media screen and (max-width: 1366px) {
    .courses-panel .panel-sidebar-left {
        min-width: 225px;
    }

    .courses-panel .panel-sidebar-right {
        max-width: calc(100% - 225px);
    }
}


[right-sidebar="true"] .panel-sidebar-left tr {
    width: 100%;
}
[right-sidebar="true"] .panel-sidebar-left tr:not([hide="false"]) > td:nth-child(2) {
    border-width: 1px !important;
    border-radius: var(--base-padding) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 225px;
}
[right-sidebar="true"] .panel-sidebar-left tr:not([hide="false"]) > *:not(:nth-child(2)) {
    display: none !important;
}

.panel .panel-object {
    cursor: pointer;
}

.panel[right-sidebar="true"] .panel-object {
    transition: 0.2s opacity;
}
.panel[right-sidebar="true"] .panel-object:not(.selected) {
    opacity: 0.25;
}
.panel[right-sidebar="true"] .panel-object:not(.selected):hover {
    opacity: 1;
}

/* https://grow-it.pl/Modules/Panel/PanelCardBox.css */

.panel .panel-card-box .panel-card {
    transition: 0.25s opacity;
}

.panel[selecting="true"] .panel-card-box .panel-card,
.panel[selection="true"] .panel-card-box .panel-card {
    opacity: 0.25;
}

.panel[selecting="true"] .panel-card-box .panel-card[selection="true"],
.panel[selection="true"] .panel-card-box .panel-card[selection="true"] {
    opacity: 1;
}

/* https://grow-it.pl/Modules/Panel/Window/Window.css */

.window {
    width: 100%;
    height: 100%;
}

/* Layouts */

.window-columns {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.window-bars {
    display: flex;
    width: 100%;
}

/* Bars */

.window-bar {
    position: relative;
    width: 270px;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}

.window-bar-split {
    border-left: 1px solid rgba(0, 0, 0, 0.5);
    cursor: ew-resize;
    position: relative;
    width: 0px;
    height: 100%;
    z-index: 1;
}
.window-bar-split::after {
    content: '';
    display: block;
    position: absolute;
    left: -5px;
    width: 9px;
    height: 100%;
}

.window-bar-fill {
    flex-grow: 1;
    width: 0%;
    height: 100%;
}

/* Columns */

.window-column {
    position: relative;
    width: 100%;
    height: 270px;
    overflow: hidden;
    z-index: 0;
}

.window-column-split {
    border-top: 1px solid rgba(0, 0, 0, 0.5);
    cursor: ns-resize;
    position: relative;
    width: 100%;
    height: 0px;
    z-index: 1;
}
.window-column-split::after {
    content: '';
    display: block;
    position: absolute;
    top: -5px;
    width: 100%;
    height: 9px;
}

.window-column-fill {
    flex-grow: 1;
    width: 100%;
    height: 0%;
}

/* https://grow-it.pl/Modules/Picker/PickerForm.css */

.grow-it-search-in-quickbox{
    border-radius: 100px;
}

.grow-it-chechbox-in-quickbox-permission .data-content > .label,
.grow-it-chechbox-in-quickbox-role .data-content > .label{
    padding: 4px 8px;
}

.button-search-checkbox{
    justify-content: center;
}

.button-search-checkbox button{
    padding: var(--half-padding) var(--base-padding);
}

.checkbox-master {
    color: rgb(148, 77, 191);
    text-transform: none !important;
}

/*
    ClickMeeting Conference Picker
*/

.clickmeeting-conference-picker-form-controller .quick-box-content {
    border-radius: var(--half-padding) !important;
}

.clickmeeting-conference-picker-form {
    --color: #326EA7;
    overflow: hidden;
    
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: var(--color);
}

.clickmeeting-conference-picker-form .clickmeeting-conference-picker-form-filter-input {
    border: none !important;
    border-radius: 0px !important;
}
.clickmeeting-conference-picker-form .clickmeeting-conference-picker-form-filter-input .bt {
    background-color: rgb(231, 231, 231);
    color: rgb(0, 0, 0);
    border: none !important;
    border-radius: 0px !important;
}
.clickmeeting-conference-picker-form .clickmeeting-conference-picker-form-filter-input .bt.active {
    background-color: rgb(207, 207, 207);
    color: rgb(0, 0, 0);
}

.clickmeeting-conference-picker-form .select {
    border: initial;
    border-radius: 0px !important;
    border-bottom: 1px solid;
}

.clickmeeting-conference-picker-form .picker-label .picker-label-content {
    background-color: rgb(239, 239, 239);
    border-radius: var(--half-padding);
    cursor: pointer;
    transition: 0.125s background-color, 0.125s color, 0.125s opacity;
}
.clickmeeting-conference-picker-form .picker-label .picker-label-content:hover {
    opacity: 0.75;
}

.clickmeeting-conference-picker-form .clickmeeting-conference-picker-form-clickmeeting-conference-input {
    color: rgb(127, 127, 127);
}

.clickmeeting-conference-picker-form .checkbox-master-controller .checkbox-label {
    flex-direction: row-reverse;
}

/* Selected clickmeeting-conference  */
.clickmeeting-conference-picker-form .picker-label.active .picker-label-content {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.clickmeeting-conference-picker-form .picker-label.active .clickmeeting-conference-picker-form-clickmeeting-conference-input {
    color: white;
}

/*
    Competence Picker
*/

.competence-picker-form-controller .quick-box-content {
    border-radius: var(--half-padding) !important;
}

.competence-picker-form {
    --color: #326EA7;
    overflow: hidden;
    
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: var(--color);
}

.competence-picker-form .competence-picker-form-category-input {
    border-radius: var(--base-padding);
    /* border: 1px solid rgba(0, 0, 0, 0.0625); */
    border: none !important;
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
}
.competence-picker-form .competence-picker-form-category-input .bt {
    background-color: rgba(50, 110, 167, 0.1);
    color: rgb(0, 0, 0);
    border: none !important;
    border-bottom: 1px solid rgb(255, 255, 255) !important;
    border-radius: 0px !important;
    width: 50% !important;
}
.competence-picker-form .competence-picker-form-category-input .bt.active {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.competence-picker-form .competence-picker-form-category-input .bt:nth-child(odd) {
    border-right: 1px solid rgb(255, 255, 255) !important;
}

.competence-picker-form .select {
    border: initial;
    border-radius: 0px !important;
    border-bottom: 1px solid;
}

.competence-picker-form .picker-label .picker-label-content {
    background-color: rgb(239, 239, 239);
    border-radius: var(--half-padding);
    cursor: pointer;
    transition: 0.125s background-color, 0.125s color, 0.125s opacity;
}
.competence-picker-form .picker-label .picker-label-content:hover {
    opacity: 0.75;
}

.competence-picker-form .competence-picker-form-competence-input {
    color: rgb(127, 127, 127);
}

.competence-picker-form .checkbox-master-controller .checkbox-label {
    flex-direction: row-reverse;
}

/* Selected competence  */
.competence-picker-form .picker-label.active .picker-label-content {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.competence-picker-form .picker-label.active .competence-picker-form-competence-input {
    color: white;
}

/*
    Course Picker
*/

.course-picker-form-controller .quick-box-content {
    border-radius: var(--half-padding) !important;
}

.course-picker-form {
    --color: #326EA7;
    overflow: hidden;
    
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: var(--color);
}

.course-picker-form .course-picker-form-filter-input {
    border: none !important;
    border-radius: 0px !important;
}
.course-picker-form .course-picker-form-filter-input .bt {
    background-color: rgb(231, 231, 231);
    color: rgb(0, 0, 0);
    border: none !important;
    border-radius: 0px !important;
}
.course-picker-form .course-picker-form-filter-input .bt.active {
    background-color: rgb(207, 207, 207);
    color: rgb(0, 0, 0);
}

.course-picker-form .select {
    border: initial;
    border-radius: 0px !important;
    border-bottom: 1px solid;
}

.course-picker-form .picker-label .picker-label-content {
    background-color: rgb(239, 239, 239);
    border-radius: var(--half-padding);
    cursor: pointer;
    transition: 0.125s background-color, 0.125s color, 0.125s opacity;
}
.course-picker-form .picker-label .picker-label-content:hover {
    opacity: 0.75;
}

.course-picker-form .course-picker-form-course-input {
    color: rgb(127, 127, 127);
}

.course-picker-form .checkbox-master-controller .checkbox-label {
    flex-direction: row-reverse;
}

/* Selected course  */
.course-picker-form .picker-label.active .picker-label-content {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.course-picker-form .picker-label.active .course-picker-form-course-input {
    color: white;
}

/*
    Group Picker
*/

.group-picker-form-controller .quick-box-content {
    border-radius: var(--half-padding) !important;
}

.group-picker-form {
    --color: #326EA7;
    overflow: hidden;
    
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: var(--color);
}

.group-picker-form .group-picker-form-filter-input {
    border: none !important;
    border-radius: 0px !important;
}
.group-picker-form .group-picker-form-filter-input .bt {
    background-color: rgba(50, 110, 167, 0.1);
    color: rgb(0, 0, 0);
    border: none !important;
    border-radius: 0px !important;
}
.group-picker-form .group-picker-form-filter-input .bt.active {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}

.group-picker-form .select {
    border: initial;
    border-radius: 0px !important;
    border-bottom: 1px solid;
}

.group-picker-form .picker-label .picker-label-content {
    background-color: rgb(239, 239, 239);
    border-radius: var(--half-padding);
    cursor: pointer;
    transition: 0.125s background-color, 0.125s color, 0.125s opacity;
}
.group-picker-form .picker-label .picker-label-content:hover {
    opacity: 0.75;
}

.group-picker-form .group-picker-form-group-input {
    color: rgb(127, 127, 127);
}

.group-picker-form .checkbox-master-controller .checkbox-label {
    flex-direction: row-reverse;
}

/* Selected group  */
.group-picker-form .picker-label.active .picker-label-content {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.group-picker-form .picker-label.active .group-picker-form-group-input {
    color: white;
}

/*
    User Picker
*/

.user-picker-form-controller .quick-box-content {
    border-radius: var(--half-padding) !important;
}

.user-picker-form {
    --color: #326EA7;
    overflow: hidden;
    
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: var(--color);
}

.user-picker-form .user-picker-form-filter-input {
    border: none !important;
    border-radius: 0px !important;
}
.user-picker-form .user-picker-form-filter-input .bt {
    background-color: rgba(50, 110, 167, 0.1);
    color: rgb(0, 0, 0);
    border: none !important;
    border-radius: 0px !important;
}
.user-picker-form .user-picker-form-filter-input .bt.active {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.user-picker-form .user-picker-form-filter-input .bt:not(:last-child) {
    border-right: 1px solid rgb(255, 255, 255) !important;
}

.user-picker-form .select {
    border: initial;
    border-radius: 0px !important;
    border-bottom: 1px solid;
}

.user-picker-form .picker-label .picker-label-content {
    background-color: rgb(239, 239, 239);
    border-radius: var(--half-padding);
    cursor: pointer;
    transition: 0.125s background-color, 0.125s color, 0.125s opacity;
}
.user-picker-form .picker-label .picker-label-content:hover {
    opacity: 0.75;
}

.user-picker-form .user-picker-form-user-input {
    color: rgb(127, 127, 127);
}

.user-picker-form .checkbox-master-controller .checkbox-label {
    flex-direction: row-reverse;
}

/* Selected user  */
.user-picker-form .picker-label.active .picker-label-content {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.user-picker-form .picker-label.active .user-picker-form-user-input {
    color: white;
}

/*
    Video Picker
*/

.video-picker-form-controller .quick-box-content {
    border-radius: var(--half-padding) !important;
}

.video-picker-form {
    --color: #326EA7;
    overflow: hidden;
    
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: var(--color);
}

.video-picker-form .video-picker-form-filter-input {
    border: none !important;
    border-radius: 0px !important;
}
.video-picker-form .video-picker-form-filter-input .bt {
    background-color: rgb(231, 231, 231);
    color: rgb(0, 0, 0);
    border: none !important;
    border-radius: 0px !important;
}
.video-picker-form .video-picker-form-filter-input .bt.active {
    background-color: rgb(207, 207, 207);
    color: rgb(0, 0, 0);
}

.video-picker-form .select {
    border: initial;
    border-radius: 0px !important;
    border-bottom: 1px solid;
}

.video-picker-form .picker-label .picker-label-content {
    background-color: rgb(239, 239, 239);
    border-radius: var(--half-padding);
    cursor: pointer;
    transition: 0.125s background-color, 0.125s color, 0.125s opacity;
}
.video-picker-form .picker-label .picker-label-content:hover {
    opacity: 0.75;
}

.video-picker-form .video-picker-form-video-input {
    color: rgb(127, 127, 127);
}

.video-picker-form .checkbox-master-controller .checkbox-label {
    flex-direction: row-reverse;
}

/* Selected video  */
.video-picker-form .picker-label.active .picker-label-content {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.video-picker-form .picker-label.active .video-picker-form-video-input {
    color: white;
}

/*
    Workshop Picker
*/

.workshop-picker-form-controller .quick-box-content {
    border-radius: var(--half-padding) !important;
}

.workshop-picker-form {
    --color: #326EA7;
    overflow: hidden;
    
    --background-color: rgb(255, 255, 255);
    --scrollbar-color: var(--color);
}

.workshop-picker-form .workshop-picker-form-filter-input {
    border: none !important;
    border-radius: 0px !important;
}
.workshop-picker-form .workshop-picker-form-filter-input .bt {
    background-color: rgb(231, 231, 231);
    color: rgb(0, 0, 0);
    border: none !important;
    border-radius: 0px !important;
}
.workshop-picker-form .workshop-picker-form-filter-input .bt.active {
    background-color: rgb(207, 207, 207);
    color: rgb(0, 0, 0);
}

.workshop-picker-form .select {
    border: initial;
    border-radius: 0px !important;
    border-bottom: 1px solid;
}

.workshop-picker-form .picker-label .picker-label-content {
    background-color: rgb(239, 239, 239);
    border-radius: var(--half-padding);
    cursor: pointer;
    transition: 0.125s background-color, 0.125s color, 0.125s opacity;
}
.workshop-picker-form .picker-label .picker-label-content:hover {
    opacity: 0.75;
}

.workshop-picker-form .workshop-picker-form-workshop-input {
    color: rgb(127, 127, 127);
}

.workshop-picker-form .checkbox-master-controller .checkbox-label {
    flex-direction: row-reverse;
}

/* Selected workshop  */
.workshop-picker-form .picker-label.active .picker-label-content {
    background-color: var(--color);
    color: rgb(255, 255, 255);
}
.workshop-picker-form .picker-label.active .workshop-picker-form-workshop-input {
    color: white;
}

@media (max-width: 1380px) {
    .user-picker-form { width: 360px !important; }
    .group-picker-form { width: 360px !important; }
    .competence-picker-form { width: 360px !important; }
    .clickmeeting-conference-picker-form { width: 360px !important; }
    .course-picker-form { width: 360px !important; }
    .video-picker-form { width: 360px !important; }
    .workshop-picker-form { width: 360px !important; }
}

@media (max-height: 800px) {
    .user-picker-form { height: 540px !important; }
    .group-picker-form { height: 540px !important; }
    .competence-picker-form { height: 540px !important; }
    .clickmeeting-conference-picker-form { height: 540px !important; }
    .course-picker-form { height: 540px !important; }
    .video-picker-form { height: 540px !important; }
    .workshop-picker-form { height: 540px !important; }
}

/* https://grow-it.pl/Modules/Picker/ColorPicker/ColorPicker.css */

.color-picker {
    box-shadow: 0px var(--half-padding) var(--base-padding) rgba(0, 0, 0, 0.25);
}

.color-picker-content {
    box-shadow: 0px var(--half-padding) var(--base-padding) rgba(0, 0, 0, 0.25);
    position: relative;
    padding-top: calc( 100% / 16 * 10);
    width: 360px;
}

.color-picker-pointer {
    --color: rgba(0, 0, 0, 0.25);
    border: 2px solid var(--color);
    box-shadow: 0px 0px var(--quarter-padding) var(--color), 0px 0px var(--quarter-padding) var(--color) inset;
    border-radius: 100%;
    opacity: 0.5;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
}

.color-picker .button {
    box-shadow: 0px var(--half-padding) var(--base-padding) rgba(0, 0, 0, 0.25);
    border-radius: var(--base-padding);
}

.grid-color-picker-border {
    border: 1px solid #e2e4e7;
    display: block;
}

.grid-color-picker-button {
    display: block !important;
    position: relative;
    overflow: hidden;
}

.grid-color-picker-button.active {
    outline: 2px solid crimson;
    z-index: 1;
}


.color-picker-button::after {
    content: '';
    display: block;
    background-color: var(--value);
    position: absolute;
    left: var(--half-padding);
    bottom: 0px;
    width: calc(100% - var(--half-padding) * 2 );
    height: 4px;
}

/* https://grow-it.pl/Modules/Picker/DateTimePicker/DateTimePicker.css */

.date-time-picker {
    user-select: none;
}

.date-time-picker-content .date-time-picker-main-content {
    display: flex;
    align-items: flex-start;
}

.date-time-picker .date-picker-header-content {
    display: flex;
}

.date-time-picker .cell {
    padding: 4px;
    position: relative;
}

.date-time-picker .cell .cell-content {
    background-color: transparent;
    border-radius: 4px;
    position: relative;
    width: 40px;
    height: 40px;
}

.date-time-picker .cell .cell-text {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.date-time-picker .time-picker-header-content {
    display: flex;
    align-items: center;
}

.date-time-picker .cell[clickable="true"] .cell-content {
    background-color: rgb(247, 247, 247);
}

.date-time-picker .cell[clickable="true"] .cell-content:hover {
    background-color: rgb(110, 167, 50) !important;
    color: rgb(255, 255, 255) !important;
    cursor: pointer;
}

/*
    Date Picker
*/

.date-picker .date-picker-row {
    display: flex;
}

.date-picker .cell[is-today="true"] .cell-content {
    outline: 2px solid rgb(110, 167, 50);
}

.date-picker .cell[is-current-month="true"] .cell-content {
    background-color: rgb(247, 247, 247);
}

.date-picker .cell[is-current-month="true"][is-week="true"] .cell-content {
    background-color: rgb(223, 223, 223);
}

.date-picker .cell[is-selected="true"] .cell-content {
    background-color: rgb(110, 167, 50) !important;
    color: rgb(255, 255, 255) !important;
}

.date-picker .cell[date] .cell-content:hover {
    background-color: rgb(110, 167, 50) !important;
    color: rgb(255, 255, 255) !important;
    cursor: pointer;
}

/*
    Time Picker
*/

.time-picker .cell[is-current="true"] .cell-content {
    outline: 2px solid rgb(110, 167, 50);
}

.time-picker .cell[is-current="false"] .cell-content {
    background-color: rgb(247, 247, 247);
}

.time-picker .cell[hour] .cell-content:hover {
    background-color: rgb(110, 167, 50) !important;
    color: rgb(255, 255, 255) !important;
    cursor: pointer;
}

.time-picker .cell[minute] .cell-content:hover {
    background-color: rgb(110, 167, 50) !important;
    color: rgb(255, 255, 255) !important;
    cursor: pointer;
}

/* https://grow-it.pl/Modules/Popup/Popup.css */

.popup-background {
    background-color: rgba(0, 0, 0, 0.25);
    --color: rgb(252, 182, 22);
    opacity: 0;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 150;
}

.popup-box {
  /* #e31e24 */
  background-color: rgb(255, 255, 255);
  border-radius: var(--base-padding);
  box-shadow: 0px 0px var(--base-padding) rgba(0, 0, 0, 0.25);
  width: 450px;
}
.popup-box[type="option"] {
  --color: rgb(110, 167, 50);
}

.popup-box .popup-box-header {
  background-color: rgb(247, 247, 247);
  color: rgb(111, 111, 111);
  border-radius: var(--base-padding) var(--base-padding) 0px 0px;
}

.popup-box .popup-box-header .popup-box-icon {
  color: var(--color);
}

.popup-box .popup-box-content {
  border-radius: var(--base-padding) var(--base-padding) 0px 0px;
}

.popup-box .popup-box-footer {
  display: flex;
  justify-content: space-around;
}

.popup-box .popup-button-confirm {
  background-color: var(--color);
  color: white;
}

.popup-box .popup-button {
  background-color: var(--color);
  color: white;
}

.popup-box {
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.125);
    background-color: white;
    position: fixed;
    left: 50%;
    top: 20px;
    transform: translateX(-50%);
    z-index: 150;
}

.popup-center {
  background-color: rgba(0, 0, 0, 0.25);
  position: fixed;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
  z-index: 1000;
}

.popup-center .popup-center-content {
  background-color: white;
  border-radius: 24px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* https://grow-it.pl/Modules/Popup/DragWindow/Templates/DragWindow.css */

.drag-window {
    background-color: white;
    box-shadow: 0px var(--half-padding) var(--base-padding) rgba(0, 0, 0, 0.25);
    border-radius: var(--base-padding);
    display: flex;
    flex-direction: column;
    position: fixed;
    left: 25%;
    top: 25%;
    width: 50%;
    height: 50%;
    min-width: 630px;
    min-height: 630px;
    max-width: 100vw;
    max-height: 100vh;
    overflow: hidden;
}

.drag-window .drag-window-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.drag-window .drag-window-content {
    flex-grow: 1;
    height: 0px;
}


.drag-window .drag-window-content > * {
    width: 100%;
    height: 100%;
}

.drag-window:not([drag="true"]):not([resize="true"]) .drag-window-header-content {
    cursor: grab;
}
.drag-window[drag="true"] {
    cursor: grabbing;
}
.drag-window[drag="true"] .drag-window-content,
.drag-window[resize="true"] .drag-window-content {
    pointer-events: none;
}

.drag-window .drag-window-resize {
    position: absolute;
    min-width: var(--base-padding);
    min-height: var(--base-padding);
    z-index: 10;
}

.drag-window .drag-window-resize[direction="top"] {
    cursor: n-resize;
    cursor: resize;
    left: var(--base-padding);
    top: 0px;
    width: calc(100% - calc(var(--base-padding) * 2));
}
.drag-window .drag-window-resize[direction="bottom"] {
    cursor: s-resize;
    left: var(--base-padding);
    bottom: 0px;
    width: calc(100% - calc(var(--base-padding) * 2));
}
.drag-window .drag-window-resize[direction="left"] {
    cursor: w-resize;
    left: 0px;
    top: var(--base-padding);
    height: calc(100% - calc(var(--base-padding) * 2));
}
.drag-window .drag-window-resize[direction="right"] {
    cursor: e-resize;
    right: 0px;
    top: var(--base-padding);
    height: calc(100% - calc(var(--base-padding) * 2));
}

.drag-window .drag-window-resize[direction="top left"] {
    cursor: nw-resize;
    left: 0px;
    top: 0px;
}
.drag-window .drag-window-resize[direction="top right"] {
    cursor: ne-resize;
    right: 0px;
    top: 0px;
}
.drag-window .drag-window-resize[direction="bottom left"] {
    cursor: sw-resize;
    left: 0px;
    bottom: 0px;
}
.drag-window .drag-window-resize[direction="bottom right"] {
    cursor: se-resize;
    right: 0px;
    bottom: 0px;
}

/* https://grow-it.pl/Modules/Role/Permission/Permission.css */

.permission-panel-maximized[permission="0"] .panel-card-page .bt:not(:first-child) {
    pointer-events: none;
    opacity: 0.5;
}
.permission-panel-maximized:not([permission="0"]) .form-placeholder {
    display: none;
}
.permission-panel-maximized[permission="0"] .form-item {
    display: none;
}

.permission-panel-maximized[status=""] .permission-button-form-controller { display: block !important; }
.permission-panel-maximized[status="active"] .permission-button-active-controller { display: block !important; }

/* https://grow-it.pl/Modules/Role/PermissionCategory/PermissionCategory.css */

.permission-category-panel-maximized[permission-category="0"] .panel-card-page .bt:not(:first-child) {
    pointer-events: none;
    opacity: 0.5;
}
.permission-category-panel-maximized:not([permission-category="0"]) .form-placeholder {
    display: none;
}
.permission-category-panel-maximized[permission-category="0"] .form-item {
    display: none;
}

.permission-category-panel-maximized[status=""] .permission-category-button-form-controller { display: block !important; }
.permission-category-panel-maximized[status="active"] .permission-category-button-active-controller { display: block !important; }

/* https://grow-it.pl/Modules/Role/Role/Role.css */

.role-panel-maximized[role="0"] .panel-card-page .bt:not(:first-child) {
    pointer-events: none;
    opacity: 0.5;
}
.role-panel-maximized:not([role="0"]) .form-placeholder {
    display: none;
}
.role-panel-maximized[role="0"] .form-item {
    display: none;
}

.role-panel-maximized[status=""] .role-button-form-controller { display: block !important; }
.role-panel-maximized[status="active"] .role-button-active-controller { display: block !important; }

/* https://grow-it.pl/Modules/Role/RoleHierarchy/Templates/RoleHierarchyLevel.css */

.role-hierarchy-level .role-hierarchy-level-content {
    overflow: hidden;
    transition: 0.4s height;
}

/* https://grow-it.pl/Modules/Role/RolePermission/RolePermission.css */

.role-permission-input .bt {
    border: 1px solid transparent !important;
}

.role-permission-input .bt.active[value="true"] {
    background-color: rgb(110, 167, 50);
    color: white;
}
.role-permission-input .bt.active[value="false"] {
    background-color: crimson;
    color: white;
}

.user-permission-input .bt {
    border: 1px solid transparent !important;
}

.user-permission-input .bt.active[value="true"] {
    background-color: rgb(110, 167, 50);
    color: white;
}

.user-permission-input .bt.active[value="inherit"] {
    background-color: rgb(218, 165, 32);
    color: white;
}
.user-permission-input .bt.active[value="inherit"][role-value="true"] {
    background-color: white;
    border-color: rgb(110, 167, 50) !important;
    color: rgb(110, 167, 50);
}
.user-permission-input .bt.active[value="inherit"][role-value="false"] {
    background-color: white;
    border-color: rgb(220, 20, 60) !important;
    color: rgb(220, 20, 60);
}

.user-permission-input .bt.active[value="false"] {
    background-color: crimson;
    color: white;
}

/*
    Groups
*/

.roles-permission-input .bt.active[value="true"] {
    background-color: rgb(110, 167, 50);
    color: white;
}
.roles-permission-input .bt.active[value="false"] {
    background-color: crimson;
    color: white;
}

.users-permission-input .bt.active[value="inherit"] {
    background-color: rgb(218, 165, 32);
    color: white;
}
.users-permission-input .bt.active[value="true"] {
    background-color: rgb(110, 167, 50);
    color: white;
}
.users-permission-input .bt.active[value="false"] {
    background-color: crimson;
    color: white;
}

/* https://grow-it.pl/Modules/Role/css/style.css */

.role-users-content{
    border: 1px solid black;
    padding:10px;
    border-radius: 5px;
}

.user-role-trash {
    font-size: 15px;
    color: red;
    padding: 5px 5px;
    cursor: pointer;
}

.tab-box-header .tab-button {
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0);
    flex-grow: 1;
    display: inline-block;
    position: relative;
    padding: var(--half-padding);
    bottom: 2px;
    opacity: 1 !important;
}

.tab-box-header .tab-button.active {
    /* border: 1px solid rgb(0, 104, 180);
    background: white; */
    /* border-bottom: none !important; */
    border-radius: var(--border-radius) var(--border-radius) 0px 0px;
    bottom: -1px;
    z-index: 1;
    width: 160px;
}
.tab-box-header .tab-button:not(.active) {
    background: white;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 0px;
    border-radius: var(--border-radius) var(--border-radius) 0px 0px;
    bottom: 0px;
    z-index: 1;
    /* min-width: 100px;
    max-width: 300px; */
    width: 160px;
}

.grow-it-navigation-users .tab-button.active {
    background: rgba(0, 128, 0, 0.05);
    /* border: 1px solid rgb(183, 183, 183);
    border-bottom: 0px;*/
    border-radius: var(--border-radius) var(--border-radius) 0px 0px;
    bottom: -1px;
    z-index: 1;
}

.role-permissions tr td:nth-child(2),.role-permissions tr th:nth-child(2){
    border-right: 1px solid var(--primary-color-dark);
} 


.user-permission tr td:nth-child(2),.user-permissions tr th:nth-child(2){
    border-right: 1px solid var(--primary-color-dark);
} 

.role-checkbox .label{
    justify-content: center;
}

.permission-checkbox .label{
    justify-content: center;
}

.browse-as{
    border-bottom: 1px solid grey;
    width: fit-content;
    padding: 5pt;
    color: grey;
    cursor: pointer;
    
}

.add-new-role, .add-new-permission
 {
    border-bottom: 1px solid darkgreen;
    width: fit-content;
    padding: 5pt;
    color: darkgreen;
    cursor: pointer;
    width: 150px;
}

.add-new-role:hover,
.add-new-permission:hover
 {
    border-bottom: 1px solid green;
    color: green;
    /* background: rgb(143, 188, 143, 0.1); */
}

.permission-permission-select
 {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-radius: 0;
    color: rgb(0,0,0);
    width: 100%;
    padding: 0.12pt;
}

.permission-permission-select .select{
    color: black !important;
    padding: 3.75pt;
    width: 95%;
}

/* .role-permission-filter-div{
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 100px;
    padding: var(--half-padding);
} */

/* .role-permission-filter-div input{
    width: 99%;
} */

.permissions-switch {
    min-width: 50px;
    justify-content: center;
}
.permissions-switch .permissions-switch-name {
    width: 0px;
    overflow: hidden;
    transition: 0.25s width;
}

.permissions-switch.active .permissions-switch-name,
.permissions-switch:hover .permissions-switch-name {
    width: 130px;
}


.permissions-switch.active {
    /* background: rgba(0,104,180,0.1); */
    border-radius: 5px;
    color: rgb(0,104,180);
    border: 1px solid  rgba(0,104,180,0.2);
    width: auto;
}
.permissions-switch:not(.active) {
    color: rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    border: 1px solid  rgba(0,0,0,0.1);
    width: auto;
}

.manage-user-permissions{
    /* border-bottom: 1px solid rgba(0,0,0,0.1); */
    text-align: center;
}

.role-name-div{
    border-bottom: 1px solid rgba(0,0,0,0.1);
    /* border-radius: 100px;
    padding: var(--half-padding); */
    background: rgba(0,0,0,0.01);
}

/* .role-name-div input{ width: 90%;} */

.submit-add-role, 
.submit-add-role2{
    display: block;
    /* background: rgb(0, 104, 180);
    color: rgb(255, 255, 255); */
    border-radius: 15px;
    cursor: pointer;
    display: inline-block;
    font-size: 16pt;
    line-height: 12px;
    padding: 6pt 20pt;
    transition: 0.4s opacity;
}

.permission-form{ width: 400px;}

.permission-form .name-role-label{
    border-bottom: 1px solid rgba(0,0,0,0.1);
    /* border-radius: 100px; 
    text-align: center;*/
    background: rgba(0,0,0,0.01);
}

.selected-role-permission-input,
.selected-user-permission-input {
    border: 1px solid rgba(0,0,0,0.1);
    padding: var(--half-padding);
    /* border-left: 0;
    border-right: 0;
    border-top: 0; */
    border-radius: 5px;
}

.border-bottom-button{
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 2.37pt;
}

.user-permission-filter-div,
.role-permission-filter-div
{
    display: flex;
    justify-self: center;
    width: 95%;
}

.filter-user, 
.filter-role{
    width: 100%;
    padding: 0 calc(var(--base-padding) /2);
}


.role-permission-filter-div-box{
    width: 300px !important;
}

.select.role-select.role-filter {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-radius: 0;
}

.button-select-all{
    text-transform: none;
}

.user-column .text-overflow {
    text-overflow: unset;
    white-space: unset;
    text-align: left;
}

.role-permission .tab-box-header  .active{
    background: rgb(242, 242, 242);
}

.role-deactive{
    background: #ee591f !important;
    color: white;
    border-radius: 5px !important;
    padding: var(--half-padding) var(--base-padding);
}

.role-active{
    border: 1px solid #91bd09 !important;
    background: #91bd09;
    color: white;
    border-radius: 5px !important;
    padding: var(--half-padding) var(--base-padding);
}

.color-table-th{
    background: rgb(242, 242, 242);
}


.from-role-active{
    border: 1px solid #91bd09 !important;
    color: black;
    background: white !important;
    border-radius: 5px !important;
    padding: var(--half-padding) var(--base-padding);
}

.from-role-deactive{
    border: 1px solid #ee591f !important;
    color: black;
    border-radius: 5px !important;
    background: white !important;
    padding: var(--half-padding) var(--base-padding);
}


/* .user-permissions-content tr td:nth-child(1) {
    position: sticky; left: 0; 
    z-index: 10;
    background-color: white;
}
.user-permissions-content tr td:nth-child(2){
    position: sticky; left: 200px; 
    z-index: 10;
    background-color: white;
} */

.grow-it-add-new-role .label{
    padding: 4px 8px;
}

.submit-add-role button{
    padding: 6pt 12pt;
}

/* .border-grow-it{
    border-left: 1px solid rgb(0,104,180);
    border-top: 1px solid  rgb(0,104,180);
    border-bottom: 1px solid  rgb(0,104,180);
}

.border-grow-it-2{
    border-top: 1px solid  rgb(0,104,180);
    border-bottom: 1px solid  rgb(0,104,180);
}
.border-grow-it-3{
    border-top: 1px solid  rgb(0,104,180);
    border-bottom: 1px solid  rgb(0,104,180);
    border-right: 1px solid  rgb(0,104,180);
} */

.select-options-content .option {
    /* padding: var(--half-padding) 0 !important; */
}
    
::-webkit-scrollbar {
    width: 2px;
    height: 2px;
}

/* .user-picker-form {
    width: 360px;
    height: 430px;
} */

.grow-it-delete-roles{
    color: red;
    font-weight: bold;
    border: 1px solid rgba(0,0,0,0.2);
    font-size: 10px;
    width: fit-content;
    border-radius: 5px;
    display: none;
}

.button.sphere {
    background: white;
    color: rgb(0,104,180);
    border: 1px solid rgba(135,135,135,0.5);
    border-radius: 100%;
    font-size: 16pt;
    line-height: 50px;
    padding: 0px !important;
    vertical-align: middle;
    text-align: center;
    width: 50px;
    height: 50px;
    transform: scale(1);
    transition: 0.4s transform;
}

/* https://grow-it.pl/Modules/Settings/Settings.panel.css */

.settings-background {
    background-color: rgb(255, 255, 255);
    color:  black;
}

/* https://grow-it.pl/Modules/Statistics/Statistics.css */

.statistics-background {
    --background-color: rgb(63, 63, 63);
    background-color: var(--background-color);
    color: white;
}

svg text {
    font-size: 10px;
}

.statistics-panel .bt-group .bt.active {
    color: white !important; 
}

/* https://grow-it.pl/Modules/Table/TableEditable.css */

table.editable {
    width: auto !important;
    height: auto !important;
    min-width: 180px;
}

/* https://grow-it.pl/Modules/Table/TableSelectable.css */

table[selected-item-count=""] .select-tools,
table[selected-item-count="0"] .select-tools,
table:not([selected-item-count]) .select-tools {
    display: none;
}

table tr[selected] td:first-child {
    background-color: rgb(50, 110, 167) !important;
    color: white !important;
}
table tr[selected] td:first-child .checkbox {
    color: white !important;
}

table.group-table .select-tools,
table.course-table .select-tools,
table.quiz-table .select-tools,
table.competence-table .select-tools,
table.workshop-table .select-tools,
table.clickmeeting-conference-table .select-tools,
table.video-table .select-tools,
table.article-table .select-tools,
table.category-table .select-tools {
    display: none !important;
}

/* https://grow-it.pl/Modules/Table/TableSortable.css */

/*  Old */

table {
    background-color: var(--primary-color-light);
    border-collapse: collapse;
    width: 100%;
}

table tr th {
    color: rgb(170, 170, 170);
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 400;
    padding: var(--base-padding);
}

table tr:not(:last-child) th {
    border-bottom: 1px solid rgba(0, 0, 0, 0.0625);
}


table tr:not(:last-child) td {
    border-bottom: 1px solid rgba(0, 0, 0, 0.0625);
}

table tr td {
    font-size: var(--note-size);
    padding: var(--base-padding);
}

/*  New  */

table tr th {
    cursor: pointer;
    background-color: rgb(247, 247, 247);
    color: rgb(0, 0, 0);
    border: 1px solid rgba(0, 0, 0, 0.0625);
}

table tr td {
    border: 1px solid rgba(0, 0, 0, 0.0625);
}

table tr th[sort] {
    color: rgb(63, 63, 63);
    position: relative;
}

table tr th[sort]::after {
    position: absolute;
    top: 50%;
    right: 0px;

    text-transform: initial;
    font-style: normal;
    font-family: 'GrowIcons';
    line-height: 1;
    display: inline-block;
    padding: 0px 5px;
    transform: translateY(-50%) scale(1.6);
    transform-origin: 50% 56%;
}

table tr th[sort="asc"]::after {
    content: '\005C';
}

table tr th[sort="desc"]::after {
    content: '\005E';
}

/*  Soft    */

table.soft tr th {
    background-color: rgb(255, 255, 255);
    color: rgb(110, 167, 50);
    border: none;
    position: relative;
}
/* table.soft tr th:not(:first-child)::before {
    display: block;
    content: '';
    height: calc( var(--base-padding) * 2 );
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 0px;
    border-left: 1px solid rgba(0, 0, 0, 0.125);
} */

table.soft tr td {
    background-color: rgb(255, 255, 255);
    border: none;
    position: relative;
    transition: 0.1s background-color;
}

table.soft tr td * {

}
/* table.soft tr td:not(:first-child)::before {
    display: block;
    content: '';
    height: calc( var(--base-padding) * 2 );
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 0px;
    border-left: 1px solid rgba(0, 0, 0, 0.125);
} */

table tr:hover td {
    /* background-color: var(--primary-color-dark); */
    background-color: rgb(247, 247, 247);
}

/*
    Table labels
*/

table.labels {
    background: none !important;
    border-collapse: separate;
    border-spacing: 0px var(--half-padding) !important;
}

table.labels tr:not(.sticky-top):not(.sticky-bottom) {
    position: relative;
    z-index: 0;
}

table.labels tr:first-child {
    background-color: rgb(255, 255, 255) !important;
    
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    left: 0px;
    width: 100%;
}
/* table.labels tr:first-child th {
    border-bottom: 1px solid rgba(0, 0, 0, 0.125) !important;
} */

table.labels th .icon {
    opacity: 0.25;
}
table.labels th .table-button-export .icon {
    opacity: 1;
}

table.labels th {
    background-color: var(--background-color) !important;
    border: none !important;
    font-size: var(--paragraph-font-size) !important;
    line-height: var(--paragraph-line-height) !important;
    font-weight: bold !important;
    text-align: left;
    text-transform: none !important;
    padding: var(--base-padding) !important;
}

table.labels td {
    border: none !important;
    border-top: 1px solid rgba(0, 0, 0, 0.125) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125) !important;
    background-color: rgb(255, 255, 255);
    font-size: var(--paragraph-font-size) !important;
    line-height: var(--paragraph-line-height) !important;
    padding: var(--base-padding) !important;
}

table.labels td:first-child {
    border-left: 1px solid rgba(0, 0, 0, 0.125) !important;
    border-top-left-radius: var(--base-padding) !important;
    border-bottom-left-radius: var(--base-padding) !important;
}
table.labels td:last-child {
    border-right: 1px solid rgba(0, 0, 0, 0.125) !important;
    border-top-right-radius: var(--base-padding) !important;
    border-bottom-right-radius: var(--base-padding) !important;
}

.table-4 {
    min-width: 135px;
}
.table-4 {
    max-width: 270px;
}
.table-5 {
    min-width: 160px;
}
.table-5 {
    max-width: 320px;
}

@media (max-width: 1460px) {
    /* table.labels th {
        font-size: var(--note-font-size) !important;
        line-height: var(--note-line-height) !important;
        padding: var(--half-padding) !important;
    }

    table.labels td {
        font-size: var(--note-font-size) !important;
        line-height: var(--note-line-height) !important;
        padding: var(--half-padding) !important;
    } */

    /* .table-4 {
        width: 75px;
    }
    .table-5 {
        width: 100px;
    } */
}

/* https://grow-it.pl/Modules/TextEditor/TextEditor.css */

.text-editor {
    background: white;
    --bt-color: #dadada6c;
    color: black;
    border-radius: var(--half-padding) !important;
    border: 1px solid var(--bt-color);
}


.clear-html p {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
}

.clear-html ol {
    display: block;
    list-style-type: decimal;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
}

.clear-html ul {
    display: block;
    list-style-type: disc;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
}

.clear-html li {
    display: list-item;
}

.clear-html blockquote {
    display: inline;
}

.clear-html blockquote::before {
    content: open-quote;
}

.clear-html blockquote::after {
    content: close-quote;
}

.clear-html img {
    display: inline-block;
    vertical-align: top;
    width: auto;
    max-width: 100%;
}

.clear-html sub {
    font-size: calc( var(--font-size) * 0.625 );
    position: relative;
    top: calc( -0.15 * var(--font-line-height) );
}

.clear-html sup {
    font-size: calc( var(--font-size) * 0.625 );
    position: relative;
    top: calc( 0.15 * var(--font-line-height) );
}

.clear-text sub {
    font-size: calc( var(--font-size) * 0.625 );
    position: relative;
    top: calc( -0.15 * var(--font-line-height) );
}
.clear-text sup {
    font-size: calc( var(--font-size) * 0.625 );
    position: relative;
    top: calc( 0.15 * var(--font-line-height) );
}

/* https://grow-it.pl/Modules/User/User/User.css */

.user-panel-maximized[user="0"] .panel-card-page .bt:not(:first-child) {
    pointer-events: none;
    opacity: 0.5;
}
.user-panel-maximized:not([user="0"]) .form-placeholder {
    display: none;
}
.user-panel-maximized[user="0"] .form-item {
    display: none;
}

.user-panel-maximized[status=""] .user-button-form-controller { display: block !important; }
.user-panel-maximized[status="locked"] .user-button-locked-controller { display: block !important; }
.user-panel-maximized[status="active"] .user-button-active-controller { display: block !important; }
.user-panel-maximized[status="true"] .user-button-true-controller { display: block !important; }

.panel-object.user[user]:not([status="true"]) .user-button-activate { display: none !important; }
.panel-object.user[user]:not([status="active"]) .user-button-lock { display: none !important; }
.panel-object.user[user]:not([status="locked"]) .user-button-unlock { display: none !important; }


.avatar {
    border-radius: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    vertical-align: middle;
    width: 100px;
    height: 100px;
}

/* https://grow-it.pl/Modules/User/UserSuperior/UserSuperior.css */

.user-superior-input-controller {
    position: relative;
    height: 53px;
    z-index: 5;
}

.user-superior-input-controller .user-list {
    background-color: rgb(255, 255, 255);
    position: absolute;
    max-height: 360px;
    overflow-y: scroll;
    width: 100%;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.125);
    z-index: 1;
}

.user-inferior-input-controller {
    position: relative;
    height: 53px;
    z-index: 5;
}

.user-inferior-input-controller .user-list {
    background-color: rgb(255, 255, 255);
    position: absolute;
    max-height: 360px;
    overflow-y: scroll;
    width: 100%;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.125);
    z-index: 1;
}

/* https://grow-it.pl/Modules/Utilities/ProgressBar.css */

.progress-bar {
    --progress: 0;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px var(--half-padding) var(--base-padding) rgba(0, 0, 0, 0.125);
    border-radius: var(--base-padding);
    height: var(--base-padding);
    width: 100%;
}
.progress-bar::before {
    display: block;
    content: '';
    border-radius: var(--base-padding);
    background-color: royalblue;
    height: var(--base-padding);
    width: calc(var(--progress) * 100%);
}
.progress-bar .progress-value {
    position: absolute;
    left: calc(var(--progress) * 100%);
    bottom: 100%;
    transform: translate(-50%, -25%);
}