:root {
    --alert-required-color: #fcf7f3;
    --alert-warning-color: #e77408;
    --alert-alert-color: #f95357;
    --alert-info-color: #2b95f7;
    --color-default: #00A89E;
    --sirka10: 300px;
    --color-background: var(--secondary-13-color);
    --color-background-Old: #03A599;
    --body1: normal 16px/24px "OpenSans";
    --body1-letter-spacing: .5px;
    --body2: normal 14px/24px "OpenSans";
    --body2-letter-spacing: .25px;
    --body2-line-condensed: normal 14px/20px "OpenSans";
    --body2-line-condensed-letter-spacing: -.1px;
    --body3: bold 14px/24px "OpenSans";
    --body3-letter-spacing: .25px;
    --body3-line-condensed: bold 14px/20px "OpenSans";
    --body3-line-condensed-letter-spacing: .25px;
    --body4: 600 14px/24px "OpenSans";
    --body4-letter-spacing: .25px;
    --body4-bold: 700 12px/16px "OpenSans";
    --body4-bold-letter-spacing: 0;
    --body4-italic: italic normal 12px/16px "OpenSans";
    --body4-italic-letter-spacing: 0;
    --body222: normal 24px/24px "OpenSans";
    --button1: bold 14px/24px "OpenSans";
    --button1-letter-spacing: 1.25px;
    --border-radius1: 4px;
    --border-radius2: 8px;
    --button-primary-color: var(--white-color);
    --button-height: 40px;
    --button-horizontal-padding: var(--spacing06);
    --button-border-radius: var(--border-radius1);
    --fixed-spacing02: 8px;
    --fixed-spacing04: 16px;
    --font-family: "OpenSans";
    --font-size-header-1: 24px;
    --font-size-normal-1: 14px;
    --font-size-normal-2: 12px;
    --font-weight-normal: normal;
    --grid-header-background-color-active: var(--secondary-13-color);
    --headline5: normal 24px/32px "OpenSans";
    --headline6-bold: bold 18px/24px "OpenSans";
    --checkbox-height: 32px;
    --icon-size-2: 12px;
    --icon-size-3: 16px;
    --icon-size-4: 24px;
    --icon-size-5: 32px;
    --icon-safespace-size-3: 24px;
    --input-background-color: var(--input-background-color-active);
    --input-background-color-active: var(--white-color);
    --input-border: 1px solid var(--secondary-10-color);
    --input-button-color: var(--secondary-7-color);
    --input-color: var(--typography-primary-color);
    --input-desktop: normal 11px/14px "OpenSans";
    --input-desktop-letter-spacing: 0;
    --input-disabled-background-color: var(--secondary-12-color);
    --input-hover-border: 1px solid var(--secondary-7-color);
    --input1: normal 14px/24px "OpenSans";
    --input1-letter-spacing: .15px;
    --input1-line-height: 20px;
    --input2: normal 12px/16px "OpenSans";
    --input2-letter-spacing: 0;
    --input3: 600 12px/16px "OpenSans";
    --input3-letter-spacing: 0;
    --label-box1: bold 12px/16px "OpenSans";
    --label-box1-letter-spacing: 0;
    --label-color: var(--typography-primary-color);
    --label-desktop: normal 11px/14px "OpenSans";
    --label-desktop-letter-spacing: 0;
    --label1: normal 12px "OpenSans";
    --label1-compact: normal 12px/18px "OpenSans";
    --label1-letter-spacing: 0;
    --label1: normal 12px / var(--label1-line-height) "OpenSans";
    --label1-line-height: 24px;
    --label12: normal 12px / var(--label1-line-height) "OpenSans";
    --label2: normal 14px/24px "OpenSans";
    --label2-letter-spacing: .25px;
    --login-middle-panel-width: 362px;
    --listbox-checkBox-hover-border: 1px solid var(--secondary-3-color);
    --listbox-checkBox-checked-border: 1px solid var(--primary-8-color);
    --main-layout-background-color: var(--secondary-4-color);
    --menu-background-color-hover: var(--secondary-223-color);
    --menu-line-height: 40px;
    --native-input-horizontal-padding: var(--spacing02);
    --native-input-padding: 0 var(--native-input-horizontal-padding);
    --native-input-horizontal-padding: var(--spacing02);
    --native-input-height: 30px;
    --native-input-height20: 20px;
    --panel-background-color-active: var(--white-color);
    --proces-warning: #fff7f7;
    --primary-2-color: #e8f5e9;
    --primary-4-color: #81c784;
    --primary-7-color: #4aaa4e;
    --primary-8-color: #43a047; /*zelena*/
    --primary-9-color: #2e7d32; /*zelena*/
    --secondary-3-color: #455a64;
    --secondary-4-color: #546e7a;
    --secondary-5-color: #546e7a;
    --secondary-7-color: #90a4ae;
    --secondary-8-color: #b0bec5; /*svetle seda*/
    --secondary-10-color: #cfd8dc;
    --secondary-12-color: #eceff1; /*svetle seda*/
    --secondary-13-color: #f5f7f9;
    --secondary-222-color: #C8E6C9;
    --secondary-223-color: #455A64;
    --secondary-224-color: #F3FDF4; /*svetle zelena*/
    --secondary-231-color: #f7f7f7; /*svetle seda*/
    --sidebar-panel-width: 230px;
    --sidebar-panel-width-slim: 64px;
    --slide-panel-horizontal-padding: var(--spacing11);
    --slide-panel-horizontal-padding: var(--spacing11);
    --spacing01: 5px;
    --spacing02: var(--fixed-spacing02);
    --spacing04: var(--fixed-spacing04);
    --spacing05: 10px;
    --spacing06: 24px;
    --spacing07: 28px;
    --spacing10: 40px;
    --spacing11: 44px;
    --subtitle2: bold 14px/24px "OpenSans";
    --topbar-text-color: var(--secondary-8-color);
    --typography-primary-color: var(--secondary-3-color);
    --white-color: #ffffff;
}

.dx-scheduler-group-header {
    /* Příklad: úprava horního odsazení */
    margin-top: 0 !important;
    /* Nebo vynucení stejné výšky jako buňky */
    height: 100% !important;
}

.dx-scheduler-group-header {
    margin-top: 0 !important;
    height: 100% !important;
}

.dx-scheduler-date-table-cell {
    padding-top: 0 !important;
}

.emptyClass {
}

.tooltip-wrapper {
    position: relative;
    display: inline-block;
    overflow: visible;
}

.tooltip-text {
    overflow: visible;
    white-space: pre-line; /* nebo normal */
    max-width: 600px;
    word-break: break-word;
    position: absolute; /* DŮLEŽITÉ! */

    top: 100%;
    left: 20px;
    transform: none;
    /*left: 0px;
    top: 100%;
    transform: translateX(-100%);
    transform: translateX(-50%);  Vycentrování tooltipu */
    display: none;
    opacity: 0;
    transition: opacity 0.2s;
    background-color: var(--secondary-231-color);
    color: var(--label-color);
    border-radius: 4px;
    padding: 6px 12px;
    z-index: 1000;
    white-space: normal;
    min-width: 400px;
}

.tooltip-wrapper:hover .tooltip-text,
.tooltip-wrapper:focus-within .tooltip-text {
    overflow: visible;
    display: block;
    opacity: 1;
}

    .sliders-container {
    display: flex;
    flex-direction: column; /* Dropdowny budou zarovnané vertikálně */
    position: absolute; /* Referenční bod pro absolutní pozicování dropdownů */
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 10px;
    z-index: 100;
    width: 160px; /* Pevná šířka kontejneru */
    overflow: hidden; /* Skryje obsah přesahující hranice */
    height: 210px;
    max-height: 210px;
}
.sliders-container-row {
    display: flex;
    flex-direction: row; /* Dropdowny budou zarovnané vertikálně */
    justify-content: center;
    padding-bottom:6px;
}

.slider-group {
    position: relative; /* Nastaví referenční bod pro dropdown */
    width: 55px; /* Zarovná šířku se slider-container */
    margin-bottom: 10px; /* Mezera mezi skupinami */
    min-height: 160px;
    max-height: 160px;
    display: flex;
    flex-direction: column;
    margin-right: 6px;
    margin-left: 6px;
}


.sliderDropDown {
    /*position: absolute;  Dropdown bude zarovnaný relativně vůči slider-group */
    top: 0; /* Dropdown začne na vrcholu rodiče */
    left: 0; /* Zarovná dropdown k levému okraji rodiče */
    z-index: 200; /* Zajistí viditelnost nad ostatními prvky */
    width: 100%; /* Přizpůsobí šířku rodiči */
    max-height: 146px; /* Omezuje výšku dropdownu */
    min-height: 146px; /* Omezuje výšku dropdownu */
    overflow-y: auto; /* auto Svislý posuvník pro delší obsah */
    overflow-x: hidden; /* Skryje vodorovný posuvník */
    background-color: white;
    /*border: 1px solid #ccc;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border-radius: 5px;*/
}

.TimeEditUL.no-bullets {
    list-style: none; /* Skryje odrážky seznamu */
    margin: 0;
    padding: 5px; /* Přidá prostor kolem obsahu */
    width: 100%; /* Zarovná šířku s dropdownem */
}

.TimeEditLI {
    padding: 1px 1px; /* Vnitřní odsazení */
    cursor: pointer;
}

.TimeEditLI:hover {
    background-color: #f0f0f0; /* Zvýraznění při najetí myší */
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 3px;
}

::-webkit-scrollbar-track {
    background: transparent;
}


.monthly-calendar {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 310px;
    min-width: 310px;
    margin: 0 auto;
}

.nav-button {
    background-color: transparent;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
}

.month-label {
    font-size: 1.2rem;
    font-weight: bold;
}

.week-days {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.day-name {
    flex: 1;
    padding: 5px;
    text-align: center;
    font-weight: bold;
    color: #666;
    max-width: 40px;
    min-width: 40px;
    margin:1px;
}

.week {
    display: flex;
    justify-content: space-between;
}

button.day {
    flex: 1;
    padding: 5px;
    border: 1px solid #ddd;
    background-color: white;
    cursor: pointer;
    max-width: 40px;
    min-width: 40px;
    margin: 1px;
}

button.weekend-day {
    background-color: #f8f8f8;
}

button.selected-day {
    background-color: #007BFF;
    color: white;
    font-weight: bold;
}

button.outside-month {
    background-color: #f0f0f0;
    color: #aaa;
    cursor: default;
}


.NavLinkFM .tooltiptextSideBar {
    visibility: hidden;
    max-width: 300px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    padding-left: 10px;
    padding-right: 10px;
}

    .NavLinkFM .tooltiptextSideBar::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 100%;
        margin-top: -6px;
        border-width: 6px;
        border-style: solid;
        border-color: transparent black transparent transparent;
    }

.NavLinkFM:hover .tooltiptextSideBar {
    visibility: visible;
}

.NavLinkFMLeft {
    left: 235px;
}
.NavLinkFMLeftWrapperSlim {
    left: 68px;
}

.rotace180 {
    transition-duration: 300ms;
    transform: rotate(-180deg);
}

.dx-blazor-reporting .dx-designer.my-reporting-element-container {
    width: 100%;
    height: calc(100vh - 730px);
}

.my-reporting-element-container {
    width: 100%;
    height: calc(100vh - 730px);
}

.transition-duration {
    transition-duration: 300ms;
}


.warningProces {
    background-color: #fcebeb;
}

.disabled_1 {
    align-items: center;
    display: flex;
    font: var(--label2);
    color: var(--secondary-8-color);
}

.enabled_1 {
    align-items: center;
    display: flex;
    font: var(--label2);
    color: var(--input-color);
}



.gridheight {
    height: 200px !important;
    border: 1px solid red;
}

input[type="time"]::-webkit-calendar-picker-indicator {
    width: 15px;
    padding: 0px;
    margin: 0px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 0px;
    background: url('data:image/svg+xml; utf8, <svg width="16" height="16" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">     <path d="M15.4687 21.7781L6.21866 12.5382C5.92491 12.2423 5.92491 11.764 6.21866 11.4681L7.45616 10.2219C7.74991 9.92604 8.22491 9.92604 8.51866 10.2219L15.9999 17.6806L23.4812 10.2219C23.7749 9.92604 24.2499 9.92604 24.5437 10.2219L25.7812 11.4681C26.0749 11.764 26.0749 12.2423 25.7812 12.5382L16.5312 21.7781C16.2374 22.074 15.7624 22.074 15.4687 21.7781Z" ></path></svg>');
}


.custom-grid-header {
    font: var(--label1);
}

.custom-grid-cell {
    border-width: 0px;
    border: none;
}

.font_12 {
    font: var(--label1);
}

#popupPokus {
    height: calc(100vh - 400px);
    min-height: calc(100vh - 400px);
    min-width:1000px;
}

#seznamZadanek {
    height: calc(100vh - 230px);
}

#seznamPolozek {
    height: calc(100vh - 500px);
}

#grdSterilizacePolozkyPrijemkySeznam {
    height: calc(100vh - 290px);
}

#treeListWorkplaceSeznam {
    height: calc(100vh - 190px);

}


#seznamPrijemek {
    height: calc(100vh - 185px);
}

#seznamZakaznikPopup {
    height: calc(100vh - 350px);
    min-width: 1000px;
    max-width: 1000px;
}

.popupZmenaNemocnice {
    height: 500px;
    min-width: 1000px;
    max-width: 1000px;
}

#seznamZadanekPolozky {
    height: calc(100vh - 390px);
}

#seznamZadanekPolozkyBezEAN {
    height: calc(100vh - 350px);
}

#seznamZadanekPolozkyDekontBezEAN {
    height: calc(100vh - 390px);
}

#seznamZadanekPolozkyDekont {
    height: calc(100vh - 450px);
}

#grdZadankaPridejPolozky {
    height: calc(100vh - 280px);
}

#grdSterilizacePracovisteUzivatelePopup {
    height: calc(100vh - 320px);
}

#grdTypySterilizaceZarizeni {
    height: calc(100vh - 330px);
}

#grdUzivatelPolSterilizacePracovistePopup {
    height: calc(100vh - 300px);
}

#grdSPRozsirenyProgram {
    height: calc(100vh - 230px);
}

#grdSeznamSterilizaceTypy {
    height: calc(100vh - 230px);
}

#grdSeznamUzivatele {
    height: calc(100vh - 230px);
}

#grdvydejkaSeznamSPP {
    height: calc(100vh - 490px);
}

#grdSeznamSterilizaceTypyDetail {
    /*mmax-height: 250px;*/
}

#grdSeznamPracoviste {
    height: calc(100vh - 230px);
}

#grdSeznamPracovistePopup {
    height: calc(100vh - 370px);
}

#grdVybranePolozkyCiselnik {
    height: calc(100vh - 200px);
}

#grdVybranePolozkyCiselnikPopup {
    height: calc(100vh - 275px);
}

#grdPrisalovkaPolozkyAddCiselnikPopup {
    height: calc(100vh - 275px);
}

#grdseznamUzivPrava {
    height: 400px;
    max-height: 400px;
    min-height: 400px;
}

#grdUzivateleAddPrava {
    height: calc(100vh - 360px);
    max-height: calc(100vh - 360px);
    min-height: calc(100vh - 360px);
}

#grdUzivateleAddPravaNezarazena {
    height: calc(100vh - 360px);
    max-height: calc(100vh - 360px);
    min-height: calc(100vh - 360px);
}


#grdseznamOddeleniSterilizace {
    height: 400px;
    max-height: 400px;
    min-height: 400px;
}

#grdZarizeniVsazkaPopup {
    height: calc(100vh - 260px);
    max-height: calc(100vh - 260px);
    min-height: calc(100vh - 260px);
}

#grdseznamZakaznici {
    height: 400px;
    max-height: 400px;
    min-height: 400px;
}

#grdHistorieSeznamZadanek {
    height: 700px;
    max-height: calc(100vh - 450px);
    min-height: calc(100vh - 450px);
}

#grdPrehledPlneni {
    height: 700px;
    max-height: calc(100vh - 450px);
    min-height: calc(100vh - 450px);
}

#seznamOperaci {
    height: calc(100vh - 150px);
}

#seznamOperaci_operacniDen {
    height: calc(100vh - 150px);
}

#OperacniDenZFE_SP_FE {
    height: calc(100vh - 150px);
}

#seznamPlanovaniZFE {
    height: calc(100vh - 150px);
}

#OperacniProgram {
    height: calc(100vh - 250px);
}

#grdOddeleniSeznam {
    height: calc(100vh - 230px);
}

#grdPracovisteVyberPopup {
    height: calc(100vh - 300px);
    min-width: 1000px;
    max-width: 1000px;
}

#grdOddeleniVyberPopup {
    height: calc(100vh - 300px);
    min-width: 1000px;
    max-width: 1000px;
}

#grdSeznamTypObalu {
    height: calc(100vh - 230px);
}

#seznamPracovisteSterilizace {
    height: calc(100vh - 170px);
}

#grdSeznamPracovisteSterilizacePopup {
    height: 680px;
    max-height: 680px;
    min-height: 680px;
}

.popupSeznamPracovisteSterilizace {
    min-height: 1000px;
    max-height: 1000px;
    min-width: 1200px !important;
    max-width: 1200px !important;
    height: 1000px;
}

#grdprisalovaSterilizacePol {
    height: 222px;
}

#grdSterilizacePolProcesyHistorie {
    height: 500px;
}

#grdMedixSterilRequestView {
    height: 850px;
}

#CSPracovisteSeznamProcesu {
    height: 500px;
}

#grdZarizeniProgramy {
    height: 500px;
}

#grdSeznamZarizeni {
    height: calc(100vh - 170px);
}

#grdSeznamZarizeniPopup {
    height: calc(740px);
}

#grdWMSRegistrace {
    height: calc(100vh - 230px);
}

#grdWMSSeznamVydejka {
    height: calc(100vh - 350px);
}

#VytvorenOd4 {
    height: 32px;
}

.width500px {
    min-width: 500px;
}

.width200px {
    min-width: 500px;
}

.myContainerCol {
    --bs-gutter-x: 7px;
}

.popupNormal {
    min-height: calc(100vh - 200px);
    min-width: 600px;
    max-width: 600px;
    height: calc(100vh - 200px);
}

.uzivatelPolPopup {
    min-height: calc(100vh - 200px);
    min-width: 1200px;
    max-width: 1200px;
    height: calc(100vh - 200px);
}

.uzivatelPolAddPravaPopup {
    min-height: calc(100vh - 200px);
    height: calc(100vh - 200px);
    min-width: 1200px;
    max-width: calc(100vw - 100px);
}

.nastaveniPopup {
    min-height: calc(100vh - 200px);
    min-width: 1200px;
    max-width: 1200px;
    height: calc(100vh - 200px);
}

.superAdminPopup {
    min-height: calc(100vh - 200px);
    min-width: 1200px;
    max-width: 1200px;
    height: calc(100vh - 200px);
}

.popupSterilizacePracoviste {
    min-height: calc(100vh - 500px);
    min-width: 1000px !important;
    max-width: 1000px !important;
    height: calc(100vh - 500px);
}

.popupWorkplace {
    min-height: calc(100vh - 500px);
    min-width: 1000px !important;
    max-width: 1000px !important;
    height: calc(100vh - 500px);
}

.popupWMSSchvaleniDetail {
    min-height: calc(100vh - 200px);
    min-width: 1200px !important;
    max-width: 1200px !important;
    height: calc(100vh - 200px);
}

.popupWMSVyrazeniDuvod {
    min-height: calc(100vh - 600px);
    min-width: 800px !important;
    max-width: 800px !important;
    height: calc(100vh - 600px);
}

.popupWMSResterilizace {
    min-height: calc(100vh - 600px);
    min-width: 800px !important;
    max-width: 800px !important;
    height: calc(100vh - 600px);
}

.popupPracovistePol {
    min-height: calc(100vh - 400px);
    min-width: 1000px !important;
    max-width: 1000px !important;
    height: calc(100vh - 400px);
}

.popupPracoviste {
    min-height: calc(100vh - 200px);
    min-width: 1000px !important;
    max-width: 1000px !important;
    height: calc(100vh - 200px);
}

.popupZarizeni {
    min-height: 800px;
    max-height: 800px;
    min-width: 1000px !important;
    max-width: 1000px !important;
    height: 800px;
}

.popupZarizeniSeznam {
    min-height: 800px;
    max-height: 800px;
    min-width: 1200px !important;
    max-width: 1200px !important;
    height: 800px;
}

.popupZmenaHesla {
    min-height: calc(100vh - 500px);
    min-width: 400px;
    max-width: 400px;
    height: calc(100vh - 500px);
}

.popupMedixSterilRequestView {
    min-height: calc(100vh - 200px);
    min-width: 1200px;
    max-width: 1200px;
    height: calc(100vh - 200px);
}

.popupTypyObalu {
    min-height: 500px;
    min-width: 600px;
    max-width: 600px;
    height: 500px;
}

.popupSPDetail {
    min-height: calc(100vh - 200px);
    min-width: 1000px;
    max-width: 1000px;
    height: calc(100vh - 200px);
}

.popupZadankaHistorie {
    min-height: calc(100vh - 200px);
    min-width: 1000px;
    max-width: 1000px;
    height: calc(100vh - 200px);
}

.popupPrehledPlneni {
    min-height: calc(100vh - 200px);
    min-width: 1000px;
    max-width: 1000px;
    height: calc(100vh - 200px);
}

.popupOddeleniVyber {
    min-height: calc(100vh - 200px);
    min-width: 1000px;
    max-width: 1000px;
    height: calc(100vh - 200px);
}

.popupPrisalovaAddPolozky {
    min-height: calc(100vh - 200px);
    max-width: calc(100vw - 100px);
    min-width: 1200px;
    height: calc(100vh - 200px);
}

.popupSterilizacePolProcesyHistorie {
    min-height: calc(100vh - 200px);
    max-width: 900px;
    min-width: 900px;
    height: calc(100vh - 200px);
}

.popupZakaznikDetail {
    min-height: calc(100vh - 200px);
    max-width: calc(100vw - 100px);
    min-width: 1200px;
    height: calc(100vh - 200px);
}

.popupZarizeniVsazky {
    min-height: calc(100vh - 200px);
    max-width: 1200px;
    min-width: 1200px;
    height: calc(100vh - 200px);
}


.popupTypySterilizace {
    min-height: 600px;
    max-width: 600px;
    min-width: 600px;
    height: 600px;
}

.popupUzivatelPrisalovkaTest {
    min-height: 800px;
    max-height: 800px;
    max-width: 1200px;
    min-width: 1200px;
    height: 800px;
}

.popupSterilizacePracovisteUzivatele {
    min-height: calc(100vh - 200px);
    max-width: 1200px;
    min-width: 1200px;
    height: calc(100vh - 200px);
}

.popupTypySterilizaceZarizeni {
    min-height: calc(100vh - 220px);
    max-width: 1400px;
    min-width: 1400px;
    height: calc(100vh - 220px);
}

.popupSterilizaceZakaznikUzivatele {
    min-height: calc(100vh - 220px);
    max-width: 1200px;
    min-width: 1200px;
    height: calc(100vh - 220px);
}

.popupMedixSterilRequestView {
    min-height: calc(100vh - 300px);
    min-width: 1200px;
    max-width: 1200px;
    height: calc(100vh - 300px);
}

.popupViewer {
    min-height: calc(100vh - 300px);
    min-width: 1200px;
    max-width: 1200px;
    height: calc(100vh - 300px);
}

.popupPrisalovaChybaPopis {
    min-height: calc(100vh - 600px);
    min-width: 800px;
    max-width: 800px;
    height: calc(100vh - 600px);
}

.popupWarning {
    min-width: 800px;
    max-width: 800px;
    max-height: 1000px;
    height: 100%;
}

.popupWarningTextArea {
    height: 100%;
    width: 99%;
    min-height: 100%;
}

.popupNepodporovanyProhlizec {
    min-width: 800px;
    max-width: 800px;
}

.popupChybaTextArea {
    height: 205px;
    width: 99%;
}

.prisalovaSterilizacePoznamka {
    height: 107px;
}

.container123 {
    max-width: 100%;
}

.popupNepodporovanyProhlizecTextArea {
    height: 60px;
    width: 99%;
    
}

.myRow {
    display: flex;
    flex-wrap: wrap;
    width:100%;
}

.custom-grid {
    font: var(--label1);
    display: flex;
    flex-direction: column;
    width: 100%;
    --dxbl-grid-font-family: "OpenSans";
    --dxbl-grid-color: var(--secondary-3-color);
    --dxbl-grid-header-bg: var(--grid-header-background-color-active);
    --dxbl-grid-header-font-size: 12px;
    --dxbl-grid-border-left: 0px;
    --dxbl-grid-border-color: var(--secondary-12-color);
    --dxbl-grid-focus-color: var(--label-color) !important;
    --dxbl-grid-selection-focus-color: var(--label-color) !important;
    --dxbl-grid-selection-focus-bg: var(--primary-2-color);
}

    .custom-grid .dxbl-grid-focused-row {
        color: var(--label-color) !important;
    }

    .custom-grid .dxbl-grid-selected-row {
        background-color: var(--primary-2-color);
        color: var(--label-color) !important;
    }

        .custom-grid .dxbl-grid-selected-row:hover {
            background-color: var(--secondary-222-color);
            color: var(--label-color) !important;
        }

.custom-grid-DataRow {
    height:35px;
}

    .custom-grid-DataRow:checked {
        background-color: var(--primary-2-color);
        color: var(--label-color) !important;
    }

    .custom-grid-DataRow:hover {
        background-color: var(--secondary-224-color);
    }

.ddxbl-grid .dxbl-grid-table > tbody > tr:first-child > td {
    border-top-width: 0;
    border-left: none;
}

.dxbl-grid .dxbl-grid-empty-data > span {
    display: none;
}

.dxbl-grid .dxbl-grid-empty-data::after {
    content: '';
}

.custom-grid .dxbl-grid-table > tbody > tr > td {
    border-left: none;
}

.custom-grid .card {
    border-left-width: 0px;
}

.ccustom-grid > .card > .dxbs-grid-vsd {
    flex: 1 1 auto;
    height: 100%;
}

.ccustom-grid > .card > div:not(.dxbs-grid-vsd) {
    flex: 1 0 auto;
}

.custom-grid-column-externi {
    background-color: var(--secondary-231-color);
}
.custom-grid-column-alert {
    background-color: var(--alert-required-color);
}

.GridSelectedFocusRow, .GridSelectedFocusRow > th, .GridSelectedFocusRow > td {
    height: 34px;
    background-color: var(--primary-2-color);
    color: var(--label-color) !important;
}

.dxbl-grid .dxbl-grid-table .dxbl-grid-focused-row:not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before 
{
    background-color: var(--primary-2-color);
}

.myPopUpBodyContent {
    display: grid;
    align-items: center;
    justify-items: center;
    position: fixed;
    left: 0;
    top: 0;
    overflow: auto;
    height: 100%;
    width: 100%;
    z-index: 1210;
    background-color: rgba(0, 0, 0, 0.4);
}

.zIndex_1020 {
    z-index: 1020;
}

.zIndex_100 {
    z-index: 100;
}

.zIndex_1040 {
    z-index: 1040;
}

.zIndex_1210 {
    z-index: 1210;
}
.zIndex_1211 {
    z-index: 1211;
}
.zIndex_1212 {
    z-index: 1212;
}
.zIndex_1213 {
    z-index: 1213;
}

.myPopUpBodyContentVyber {
    display: grid;
    align-items: center;
    justify-items: center;
    position: fixed;
    left: 0;
    top: 0;
    overflow: auto;
    height: 100%;
    width: 100%;
    z-index: 1250;
    background-color: rgba(0, 0, 0, 0.4);
}


.myPopUpBodyContent1056 {
    display: grid;
    align-items: center;
    justify-items: center;
    position: fixed;
    left: 0;
    top: 0;
    overflow: auto;
    height: 100%;
    width: 100%;
    z-index: 1256;
    background-color: rgba(0, 0, 0, 0.4);
}

.myPopUp {
    /*flex: 1;
    padding: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: var(--white-color);
    height: calc(100vh - 3.5rem);
    max-width: 1000px;
    border-radius: var(--border-radius2);
    border: none;
    margin: auto;*/

    outline: 0;
    margin: 16px;
    box-sizing: border-box;
    opacity: 1;
    position: relative;
    left: auto;
    top: auto;
    padding: 0;
    align-self: center;
    justify-self: center;
}

.myPopUpHeader {
    border-top-left-radius: var(--border-radius2);
    border-top-right-radius: var(--border-radius2);
    cursor: default;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    position: relative;
    background-color: var(--primary-8-color, unset);
    color: var(--white-color);
    padding-top: 8px;
    padding-bottom: 8px;
    font-family: var(--font-family);
    font-size: var(--font-size-header-1);
    font-weight: var(--font-weight-normal);
}

.myPopUpHeaderLabel {
    margin-left: 20px;
}

.myPopUpHeaderButton {
    margin-right: 12px;
}

.myPopUpFooter {
    background-color: var(--white-color);
    border-bottom-right-radius: var(--border-radius2);
    border-bottom-left-radius: var(--border-radius2);
    box-shadow: 0px -2px 10px rgba(0, 0, 0, .12);
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 10px;
    padding-right: 10px;
}

.myPopUpFooterIn {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
}

.myPopUpFooterButtonZpet {
    border-color: var(--secondary-7-color);
    border-style: solid !important;
    border-width: 1px !important;
}

.myPopUpBody {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: var(--white-color);
    border: none;
    padding-right: 10px;
    padding-left: 10px;
}

.myPopUp > .modal-content {
    min-width: 500px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.FMWInputDate {
    display: flex;
    height: 400px;
    width: 320px;
    flex-grow: 1;
    position: absolute;
    z-index: 100;
    flex-direction: column;
}

.labelDropDown {
    display: flex;
    height: 400px;
    
    flex-grow: 1;
    position: absolute;
    z-index: 100;
    flex-direction:column;
}

.DropDown {
    display: flex;
}




label *, label * {
    font: normal 11px/14px OpenSans;
    cursor: pointer;
}

label:disabled {
    color: var(--secondary-12-color);
}

.labelDropDown_disabled {
    color: var(--secondary-12-color);
    background-color: var(--input-disabled-background-color);
}


input[type="checkbox"] {
    opacity: 0;
    position: absolute;
}

    input[type="checkbox"] + span {
        font: normal 11px/14px OpenSans;
        color: #333;
    }

label:hover span::before {
    -moz-box-shadow: 0 0 2px #ccc;
    -webkit-box-shadow: 0 0 2px #ccc;
    box-shadow: 0 0 2px #ccc;
}

label:hover span, label:hover span {
    color: #000;
}

.padding-right-17 {
    padding-right: 17px;
}

input[type="checkbox"] + span::before {
    content: "";
    width: 16px;
    height: 16px;
    margin: 0 4px 0 0;
    border: solid 1px #a8a8a8;
    line-height: 14px;
    text-align: center;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    background: white;
}

input[type="checkbox"]:checked + span::before {
    color: #666;
}

input[type="checkbox"]:disabled + span {
    cursor: default;
    /*-moz-opacity: .4;
    -webkit-opacity: .4;*/
    opacity: .6;
}

input[type="checkbox"]:checked + span::before {
    content: "\2714";

    font-size: 12px;
}


.myInput[label_check_container] + span::before {
    border-radius: 1.7px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 16px;
    min-width: 16px;
    background-color: var(--white-color);
    margin-left: 8px;
    margin-right: 6px;
}

.myInput[label_check_container]:hover + span::before {
    box-shadow: 0 0 0 20px var(--secondary-12-color);
    clip-path: circle(90%);
}

.myInput[label_check_container]:hover:disabled + span::before {
    box-shadow: 0 0 0 20px var(--secondary-12-color);
    clip-path: circle(90%);
}

.myInput[label_radio_container] {
    align-self: center;
    margin-right: 4px;
    accent-color: var(--color-default);
    height: 16px;
    width: 16px;
}


.myInput[label_radio_container] + span::before {
    border-radius: 1.7px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 16px;
    min-width: 16px;
    background-color: var(--white-color);
    margin-left: 8px;
}

.myInput[label_radio_container]:hover + span::before {
    box-shadow: 0 0 0 20px var(--secondary-12-color);
    clip-path: circle(90%);
}

.myInput[label_radio_container]:hover:disabled + span::before {
    box-shadow: 0 0 0 20px red;
    clip-path: circle(90%);
}

.dropdown-item-keyindex-background-color {
    background-color: var(--primary-4-color);
}

.state-required {
    background-color: var(--alert-required-color);
}

.input-disabled {
    background-color: var(--input-disabled-background-color);
}

.state-not-required {
    background-color: var(--input-background-color);
}

.menuFM {
    display: block;
    transition: all 0.3s;
    cursor: pointer;
    padding: 12px;
    box-sizing: border-box;
}
/***  desired colors for children  ***/
.menuFM {
    color: #000;
    background: transparent;
}

    .menuFM:hover {
        color: #fff;
    }

    .menuFM span {
        margin-right: 8px;
        font-weight: bold;
        line-height: 20px;
        vertical-align: top;
    }

    .menuFM svg {
        max-height: 26px;
        width: auto;
        display: inline;
    }
        /****  magic trick  *****/
        .menuFM svg path {
            fill: currentcolor;
        }

.OperacniDenZFE_SP_label {
    margin: 0 auto;
    text-align: left;
    width: 100%;
}

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

.imageSPDetail {
    max-width: 970px;
}

.mt_4 {
    margin-top: 4px;
}

.mt_6 {
    margin-top: 6px;
}

.mt_8 {
    margin-top: 8px;
}

.mt_12 {
    margin-top: 12px;
}

.mt_25 {
    margin-top: 25px;
}

.mb_4 {
    margin-bottom: 4px;
}

.mb_10 {
    margin-bottom: 10px;
}

.mr_8 {
    margin-right: 8px;
}

.pr_4 {
    padding-right: 4px;
}

.pr_11 {
    padding-right: 11px;
}

.pr_15 {
    padding-right: 15px;
}

.ml_0 {
    margin-left: 0px;
}

.ml_8 {
    margin-left: 8px;
}

.pl_0 {
    padding-left: 0px;
}

.pl_4 {
    padding-left: 4px;
}

.pl_8 {
    padding-left: 8px;
}

.pl_11 {
    padding-left: 11px;
}

.pl_12 {
    padding-left: 12px;
}

.pt_6 {
    padding-top: 6px
}

.pt_14 {
    padding-top: 14px
}

.sidebarAppFlex[appFlex] {
    padding-top: 0px;
    padding-left: 0px;
    grid-area: sidebar;
    background-color: var(--main-layout-background-color);
}

.contentAppFlex[appFlex] {
    grid-area: content;
}

.headerAppFlex[appFlex] {
    grid-area: header;
}

.bodyAppFlex[appFlex] {
    background-color: var(--panel-background-color-active);
    border-radius: var(--border-radius2);
    min-height: 300px;
    height: 100%;
    width: 100%;
}

.bodyAppFlexTabGroups[appFlex] {
    background-color: var(--panel-background-color-active);
    border-radius: var(--border-radius2);
    min-height: 300px;
    height: calc(100% - 8px);
    width: 100%;
}

.rect {
    width: 100%;
    height: 100%;
    fill: #69c;
    stroke: #069;
    stroke-width: 5px;
    opacity: 0.5
}

.wrapper[appFlex] {
    box-sizing: border-box;
    margin: 0px;
    padding: 0;
    display: grid;
    height: 100%;
    grid-template-columns: minmax(var(--sidebar-panel-width), var(--sidebar-panel-width)) minmax(800px, auto) minmax(10px, 10px);
    grid-template-rows: 56px 1fr minmax(10px, 10px);
    grid-template-areas:
        "header  header"
        "sidebar content";
}

.wrapperSlim[appFlex] {
    box-sizing: border-box;
    margin: 0px;
    padding: 0;
    display: grid;
    height: 100%;
    grid-template-columns: minmax(var(--sidebar-panel-width-slim), var(--sidebar-panel-width-slim)) minmax(800px, auto) minmax(10px, 10px);
    grid-template-rows: 56px 1fr minmax(10px, 10px);
    grid-template-areas:
        "header  header"
        "sidebar content";
}

.container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
    padding-right: 0px;
}

.application[appFlex] {
    box-sizing: border-box;
    height: calc(100vh);
    overflow: hidden;
    width: calc(100vw);
    margin: 0;
    padding: 0;
    min-width: 1000px;
    background-color: var(--main-layout-background-color);
}

.procesLabel {
    align-self: flex-end;
    display: flex;
    min-width: 110px;
}

.prisalovkaTabControl {
    min-width: 170px;
}

.operacniProgram {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    height: 500px;
}

.box-sizing-border-box {
    box-sizing: border-box;
}

.headerText {
    font: var(--body2);
    letter-spacing: var(--body2-letter-spacing);
    color: var(--topbar-text-color);
    background-color: transparent;
}

.headerTextMenu {
    font: var(--body2);
    letter-spacing: var(--body2-letter-spacing);
    color: var(--topbar-text-color);
    background-color: transparent;
    padding-left: 10px;
}

.headerTextPageName {
    font: var(--body222);
    margin-left: 32px;
    color: var(--white-color);
}

.nav-link {
    margin: 0 0 0 10px;
    padding: 0;
}

.NavLinkFM {
    margin-left: 15px;
    display: flex;
    flex-direction: row;
    place-items: center;
    height: var(--menu-line-height);
    color: var(--white-color);
    margin: 0;
    padding-left: 12px;
}

    .NavLinkFM:hover {
        color: var(--primary-8-color);
        background: var(--menu-background-color-hover);
    }

        .NavLinkFM:hover .headerTextMenu {
            color: var(--white-color);
        }

    .NavLinkFM span {
        margin-right: 8px;
        font-weight: bold;
        vertical-align: top;
    }

    .NavLinkFM svg {
        max-height: 24px;
        width: auto;
    }
        /****  magic trick  *****/
        .NavLinkFM svg path {
            fill: currentcolor;
        }

body {
    font-family: OpenSans;
    background-color: #fff;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    line-height: normal;
    min-width: 1024px;
    min-height: 600px;
    border: none;
    position: absolute;
}

.container[formFlexContainer] {
    display: flex;
    width: 100%;
    min-width: 100%;
    height: 100%;
    background: var(--secondary-13-color);
}

.left-side[login_left_side] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-items: center;
    width: 590px;
}

.right-side[login_right_side] {
    display: flex;
    flex-grow: 1;
    background-position-x: 98%;
    background-repeat: no-repeat;
    background-size: cover;
    margin: var(--spacing04) var(--spacing04) var(--spacing04) 0;
    border-radius: var(--spacing02);
    background-image: linear-gradient(270deg,rgba(196,196,196,0) 40%,var(--white-color) 100%),url('../Images/LoginPozadi.png');
}

.right-panel {
    display: flex;
    margin-right: var(--spacing01);
    align-items: center;
}

    .right-panel.hidden {
        visibility: hidden;
    }

.right-panel:hover {
    visibility: visible;
}   

.logo-container {
    width: 100%;
    padding-bottom: var(--spacing10);
    display: flex;
    justify-content: center;
}

.fons-enterprise-logo-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: var(--spacing02) var(--spacing04) var(--spacing04) var(--spacing04);
    position: relative;
    z-index: 1;
}

.fons-enterprise-logo {
    height: 72px;
    width: 100%;
    width: var(--login-middle-panel-width);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

.fons-enterprise-logo-headerFM {
    width: 205px;
    padding-left: 15px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    justify-content: center;
    align-items: center;
}

.fons-enterprise-logo-headerFM.wrapperSlim {
    width: 42px !important;
}

.middle-login {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    min-height: 40%;
    width: var(--login-middle-panel-width);
}

.spacer {
    display: flex;
    flex: 1;
    background-color: aqua;
}

.safespace {
    display: flex;
    align-items: center;
    justify-content: center;
    transition-property: transform;
    transform-origin: center center;
}

svg-icon {
    display: flex;
}

.input.option-hover-effect:hover:not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) {
    border: var(--input-hover-border);
}

.hideArrows::-webkit-outer-spin-button, .hideArrows::-webkit-inner-spin-button {
    -moz-appearance: textfield;
    -webkit-appearance: none;
}

.hideArrows, .hideArrows:focus, .hideArrows:hover {
    -moz-appearance: textfield;
}

.dateButtonClear::-webkit-inner-spin-button, .dateButtonClear::-webkit-calendar-picker-indicator {
    -webkit-appearance: none;
    display: none;
}

.label_textArea_container[Container] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    letter-spacing: var(--label1-letter-spacing);
    position: relative;
    padding-left: 4px;
    padding-right: 4px;
    /*height: 100%;*/
}


.label_date_container[Container] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    letter-spacing: var(--label1-letter-spacing);
    position: relative;
    padding-left: 4px;
    padding-right: 4px;
}

.label_date_container[required] {
    color: var(--alert-warning-color);
    font-size: 14px;
}

.label_date_container[label] {
    font: var(--label1);
    padding: 0 var(--spacing02);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto;
    width: var(--forced-label-width, auto);
    color: var(--label-color);
    height: var(--native-input-height20);
}

.label_date_container[input_text]:hover:not(:focus-within):not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) {
    border: var(--input-hover-border);
}

    .label_date_container[input_text]:hover:not(:focus-within):not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) > .right-panel.hidden {
        visibility: visible;
    }

.label_date_container[input_text] {
    font: var(--input1);
    letter-spacing: var(--input1-letter-spacing);
    line-height: var(--input1-line-height);
    --current-input-horizontal-padding: var(--native-input-horizontal-padding);
    padding: var(--native-input-padding);
    height: var(--native-input-height);
    border-radius: var(--button-border-radius);
    display: flex;
    box-sizing: border-box;
    overflow: hidden;
    align-items: center;
    color: var(--typography-primary-color);
}

.label_date_container[text] {
    border: 0;
    background-color: transparent;
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--input-color);
    height: 100%;
    font-weight: inherit;
    width: 100%;
}

    .label_date_container[text]:focus {
        outline: none;
    }

.label_text_container[input_text]:hover:not(:focus-within):not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) {
    border: var(--input-hover-border);
    /*overflow: visible;*/
}

    .label_text_container[input_text]:hover:not(:focus-within):not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) > .right-panel.hidden {
        visibility: visible;
    }

.label_textArea_container[Container] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    letter-spacing: var(--label1-letter-spacing);
    position: relative;
    padding-left: 4px;
    padding-right: 4px;
    /*height: 100%;*/
}


.label_text_container[Container] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    white-space: nowrap;
    text-overflow: ellipsis;
    /*overflow: hidden; zruseno kvuli tooltipu na vice radku*/
    width: 100%;
    letter-spacing: var(--label1-letter-spacing);
    position: relative;
    padding-left: 4px;
    padding-right: 4px;
}

.label_text_container[required] {
    color: var(--alert-warning-color);
    font-size: 14px;
}

.label_text_container[label] {
    font: var(--label1);
    padding: 0 var(--spacing02);
    /*overflow: hidden; zruseno kvuli tooltipu na vice radku*/
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto;
    width: var(--forced-label-width, auto);
    color: var(--label-color);
    height: var(--native-input-height20);
}


.label_text_container_HeaderFM {
    color: var(--topbar-text-color) !important;
    background-color: transparent;
    width: auto !important;
    flex-grow: 0 !important;
}

    .label_text_container_HeaderFM:hover {
        color: var(--white-color) !important;
    }

.input_text_container_HeaderFM {
    border: 0 !important;
}

    .input_text_container_HeaderFM:hover {
        color: var(--white-color) !important;
        background-color: var(--secondary-3-color) !important;
    }


.input_text_container_HeaderFM_hover {
    color: var(--white-color) !important;
    background-color: var(--secondary-3-color) !important;
}

.cursorPointer {
    cursor: pointer;
}

.label_text_container[text] {
    border: 0;
    background-color: transparent;
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--input-color);
    height: 100%;
    font-weight: inherit;
    width: 100%;
    
}

    .label_text_container[text]:focus {
        outline: none;
    }

.label_text_container[textArea] {
    /*border: var(--input-border);
    border-radius: var(--border-radius1);*/
    background-color: transparent;
    flex-grow: 1;
    color: var(--input-color);
    font-weight: inherit;
    width: 100%;
    resize: none;
    font-family: var(--font-family);
    font-size: var( --font-size-normal-1);
    font-weight: var(--font-weight-normal);
}

    .label_text_container[textArea]:focus {
        outline: none;
    }

    .label_text_container[textArea]:focus-within {
        border: 1px solid var(--primary-8-color);
    }


.textArea_Border_Yes {
    border: var(--input-border);
    border-radius: var(--button-border-radius);
}
    .textArea_Border_Yes:hover:not(:focus-within):not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) {
        border: var(--input-hover-border);
    }

.textArea_Border_No {
    border: none;
}

    .textArea_Border_No:hover:not(:focus-within):not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) {
        border: none;
    }

.border_Yes {
    border-radius: var(--button-border-radius);
    border: var(--input-border);
}

.border_No {
    border: none;
}
    .border_No:focus-visible {
        border: none !important;
    }

    .border_No:focus {
        border: none !important;
    }

    .border_No:focus-within {
        border: none !important;
    }

    .border_No:active {
        border: none !important;
    }

    .border_No:has(:focus) {
        border: none !important;
    }


.input.label-vertical {
    width: 100%;
}

.label_text_container[input_text] {
    font: var(--input1);
    letter-spacing: var(--input1-letter-spacing);
    line-height: var(--input1-line-height);
    --current-input-horizontal-padding: var(--native-input-horizontal-padding);
    padding: var(--native-input-padding);
    height: var(--native-input-height);
    border-radius: var(--button-border-radius);
    display: flex;
    box-sizing: border-box;
    overflow: hidden;
    align-items: center;
    color: var(--typography-primary-color);
}

.myContainer[label_listBox_container] {
    align-self: flex-end;
    height: 100%;
    width: 100%;
}

    .myContainer[label_listBox_container]:hover:not(:focus-within):not(.state-readonly):not(.state-focused):not(.state-validation-warning):not(.state-validation-error) {
        background-color: var(--primary-2-color);
    }

.listBoxUL[label_listBox_container] {
    height: 100%;
}

.listBox[label_listBox_container] {
    font: var(--input1);
    letter-spacing: var(--input1-letter-spacing);
    --current-input-horizontal-padding: var(--native-input-horizontal-padding);
    border-radius: var(--button-border-radius);
    border: var(--input-border);
    display: flex;
    box-sizing: border-box;
    align-items: center;
    background-color: var(--input-background-color);
    color: var(--typography-primary-color);
    overflow-y: auto;
}

.label-container[label_listBox_container] {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-left: var(--spacing02);
    box-sizing: border-box;
    height: 100%;
    width: 100%;
}

.myLabel[label_listBox_container] {
    font: var(--label2);
    overflow: hidden;
    white-space: nowrap;
    padding: 0 var(--spacing02) 0 var(--spacing02);
    /* width: auto; */
    width: var(--forced-label-width, auto);
    color: var(--label-color);
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
}

.myLabelColorOK {
    color: var(--label-color);
}
.myLabelColorKO {
    color: var(--alert-warning-color);
}

.listBoxContainer[label_listBox_container] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font: var(--label1);
    height: 100%;
    letter-spacing: var(--label1-letter-spacing);
    padding-bottom: var(--spacing02);
}

.checkBox[label_listBox_container] {
    display: none;
}

.label-container[label_listBox_container] .checkbox-indicator {
    border: var(--listbox-checkBox-hover-border);
    align-self: center;
    height: 16px;
    width: 16px;
    float: left;
    background-color: var(--white-color);
}

    .label-container[label_listBox_container] .checkbox-indicator:hover {
        border: var(--listbox-checkBox-hover-border);
    }

.label-container[label_listBox_container] input:checked ~ .checkbox-indicator {
    border: var(--listbox-checkBox-checked-border);
    content: url('data:image/svg+xml; utf8, <svg width="16" height="16" viewBox="0 0 32 32" fill="%2343a047" xmlns="http://www.w3.org/2000/svg"> <path d="M27.2404 5.21673L10.8001 21.657L4.7594 15.6162C4.46652 15.3234 3.99165 15.3234 3.69871 15.6162L1.93096 17.384C1.63808 17.6769 1.63808 18.1517 1.93096 18.4447L10.2698 26.7835C10.5626 27.0764 11.0375 27.0764 11.3305 26.7835L30.0688 8.04516C30.3616 7.75229 30.3616 7.27741 30.0688 6.98448L28.301 5.21673C28.0081 4.92385 27.5333 4.92385 27.2404 5.21673Z" fill="%2343a047"></path> </svg>');
}

.template-wrapper-login {
    width: var(--login-middle-panel-width);
}

.label_text_container[input_text]:focus-within {
    border-bottom: 2px solid var(--primary-8-color);
    color:red;
}

    .label_text_container[input_text]:focus-within > .right-panel {
        visibility: visible;
    }

    .label_text_container[input_text]:hover > .right-panel {
        visibility: visible;
    }


.button {
    font: var(--button1);
    letter-spacing: var(--button1-letter-spacing);
    height: var(--button-height);
    padding: 0 var(--button-horizontal-padding);
    border-radius: var(--button-border-radius);
    border: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .button.input-delete {
        background-color: transparent;
        border: 0;
        padding: 0 0;
        outline: none;
        box-sizing: border-box;
        height: var(--icon-size-3);
        width: var(--icon-size-3);
        max-width: var(--icon-size-3);
    }

    .button.input-1 {
        background-color: transparent;
        border: 0;
        padding: 0 0;
        outline: none;
        box-sizing: border-box;
        height: var(--icon-size-4);
        width: var(--icon-size-4);
        max-width: var(--icon-size-4);
    }

    .button.primary {
        background-color: var(--primary-8-color);
        color: var(--button-primary-color);
    }

        .button.primary:hover:enabled {
            background-color: var(--primary-7-color);
        }

        .button.primary:active:enabled {
            background-color: var(--primary-9-color);
        }

    .button.full-width {
        width: 100%;
    }

    .button.login-middle-panel {
        width: var(--login-middle-panel-width);
    }

    .button .label {
        display: flex;
        display: block;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .button.first-button {
        margin-top: var(--spacing07);
    }

.message-container {
    display: flex;
    flex-direction: column;
    width: var(--login-middle-panel-width);
    align-items: center;
    padding-top: var(--spacing05);
    width: 100%;
    overflow: auto;
}

.messages {
    font: var(--body3);
    letter-spacing: var(--body3-letter-spacing);
}

.bottom-container {
    display: flex;
    justify-items: center;
    position: relative;
    align-self: flex-end;
    width: 100%;
    color: var(--secondary-4-color);
    padding: 0 var(--slide-panel-horizontal-padding) 48px var(--slide-panel-horizontal-padding);
}

    .bottom-container[verze] {
        display: flex;
        justify-items: center;
        position: relative;
        align-self: flex-end;
        width: 100%;
        color: var(--secondary-4-color);
        padding: 0 var(--slide-panel-horizontal-padding) 0 var(--slide-panel-horizontal-padding);
    }

.bottom {
    display: flex;
    justify-content: center;
    width: 100%;
    color: var(--secondary-4-color);
}

.bottom-verze {
    font: var(--label1);
    display: flex;
    justify-content: center;
    justify-items: center;
    color: var(--secondary-4-color);
    padding: 0 var(--spacing02);
    width: 400px;
    height: 25px;
}

.label-container.option-left[label_check_container] {
    justify-content: flex-start;
}

.label-container[label_check_container] {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-end;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    height: 100%;
    width: 100%;
}

.myLabel[label_check_container] {
    font: var(--label1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 var(--spacing02) 0 0;
    /* width: auto; */
    width: var(--forced-label-width, auto);
    height: var(--checkbox-height);
    color: var(--label-color);
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
}

.state-container[label_check_container] {
    border-radius: 50%;
    height: var(--checkbox-height);
    width: var(--checkbox-height);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
}

.myContainer[label_check_container] {
    align-self: flex-end;
    height: 100%;
    width: 100%;
}

.checkbox-wrapper[label_check_container] {
    border-radius: 1.7px;
    border: 1.7px solid var(--secondary-10-color);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 16px;
    background-color: var(--white-color);
}


.fake-input[label_check_container] {
    opacity: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}

.state-container[label_check_container]:not(.state-readonly) .checkbox-wrapper.state-checked:not(.state-ignore-checked-border) {
    border-color: var(--primary-7-color);
}

.state-container[label_check_container]:hover:not(.state-readonly):not(.state-ignore-hover) {
    background-color: var(--secondary-12-color);
}

html {
    font-family: OpenSans !important;
    font-style: normal;
    font-weight: 300;
    font-size: 1rem !important;
    height: 100%;
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

.myHeader {
    max-width: 2500px;
    width: 100%;
}

logo-container {
    width: 100%;
    padding-bottom: var(--spacing10);
    display: flex;
    justify-content: center;
}

.middle {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    min-height: 40%;
}

.login-container {
    display: flex;
    flex-direction: column;
    width: var(--login-middle-panel-width);
}

svg-icon[size2] {
    height: var(--icon-size-2);
    width: var(--icon-size-2);
}

svg-icon[size3] {
    height: var(--icon-size-3);
    width: var(--icon-size-3);
}

svg-icon[size4] {
    height: var(--icon-size-4);
    width: var(--icon-size-4);
}

.icon-safespace[size3] {
    height: var(--icon-safespace-size-3: 24px);
    width: var(--icon-safespace-size-3: 24px);
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-header {
    font: normal 24px/32px "OpenSans";
}

.dxbl-checkbox {
    --dxbl-checkbox-check-element-checked-color: black;
    --dxbl-checkbox-check-element-checked-bg: var(--color-background);
    --dxbl-checkbox-check-element-checked-border-color: black;
    --dxbl-checkbox-check-element-checked-shadow-color: black;
    --dxbl-checkbox-check-element-checked-hover-bg: var(--color-background);
    --dxbl-checkbox-checked-focus-shadow-color: black;
    --dxbl-checkbox-check-element-disabled-color: black;
    --dxbl-checkbox-check-element-disabled-bg: var(--color-background);
    --dxbl-checkbox-check-element-unchecked-bg: var(--color-background);
    --dxbl-checkbox-check-element-unchecked-hover-bg: var(--color-background);
    --dxbl-checkbox-check-element-unchecked-border-color: black;
    --dxbl-checkbox-check-element-unchecked-hover-border-color: black;
    --dxbl-checkbox-check-element-unchecked-border-width: black;
    --dxbl-checkbox-unchecked-focus-shadow-color: black;
    --dxbl-checkbox-switch-checked-bg: black !important;
    --dxbl-checkbox-radio-button-checked-border-color: black !important;
    --dxbl-checkbox-radio-button-check-bg: black !important;
}

.dxbl-row {
    margin-right: calc(0.5 * var(--dxbl-row-item-spacing-x));
}

.dxbl-tabs > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active::after, .dxbl-tabs > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active::after {
    background-color: var(--primary-8-color);
}

.dxbl-scroll-viewer {
    --dxbl-scroll-viewer-vert-scroll-bar-width: 10px;
    --dxbl-scroll-viewer-vert-scroll-bar-hover-width: 10px;
}

.dxbl-scroll-viewer-vert-scroll-bar > .dxbl-scroll-viewer-scroll-thumb, .dxbl-scroll-viewer-hor-scroll-bar > .dxbl-scroll-viewer-scroll-thumb {
    background-color: var(--primary-8-color);
    --dxbl-scroll-viewer-vert-scroll-bar-width: 10px;
    --dxbl-scroll-viewer-vert-scroll-bar-hover-width: 10px;
}

.dxbl-fl .dxbl-fl-gt .dxbl-tabs {
    --dxbl-tabs-color: black;
    --dxbl-tabs-bg: var(--white-color);
    /*--dxbl-tabs-font-family: black;*/
    /*    --dxbl-tabs-font-size: 14px; */
    /*--dxbl-tabs-line-height: #{$dx-tabs-line-height};*/
    /*--dxbl-tabs-padding-top: #{$dx-tabs-padding-top};*/
    /*--dxbl-tabs-padding-x: #{$dx-tabs-padding-x};*/
    --dxbl-tabs-bottom-border-color: var(--secondary-10-color);
    /*--dxbl-tabs-bottom-border-style: #{$dx-tabs-bottom-border-style};*/
    /*--dxbl-tabs-bottom-border-width: #{$dx-tabs-bottom-border-width};*/
    /*--dxbl-tabs-tab-padding-x: #{$dx-tabs-tab-padding-x};*/
    /*--dxbl-tabs-tab-padding-y: #{$dx-tabs-tab-padding-y};*/
    /*--dxbl-tabs-tab-border-style: #{$dx-tabs-tab-border-style};*/
    --dxbl-tabs-tab-border-color: transparent;
    /*--dxbl-tabs-tab-border-width: #{$dx-tabs-tab-border-width};*/
    --dxbl-tabs-tab-selected-bg: var(--white-color);
    --dxbl-tabs-tab-selected-color: black;
    --dxbl-tabs-tab-hover-color: black;
    --dxbl-tabs-tab-hover-bg: var(--color-background);
    /*--dxbl-tabs-image-spacing: #{$dx-tabs-image-spacing};*/
    --dxbl-tabs-scroll-btn-color: black;
    --dxbl-tabs-scroll-btn-hover-color: black;
    --dxbl-tabs-scroll-btn-disabled-color: black;
}

.dxbl-listbox {
    --dxbl-listbox-item-selected-bg: var(--color-background) !important;
    --dxbl-listbox-item-selected-bg: var(--color-background) !important;
    --dxbl-listbox-item-active-bg: var(--color-background) !important;
    --dxbl-listbox-item-selected-hover-bg: var(--color-background) !important;
    --dxbl-listbox-item-multi-selected-hover-bg: var(--color-background) !important;
}

.dxbl-text-edit {
    --dxbl-text-edit-focus-border-color: rgb(3, 165, 153,0.25);
}

.dx-datagrid-checkbox-size.dx-checkbox-checked .dx-checkbox-icon {
    border: 1px solid red;
}

.my-menu .dropdown-menu > ul {
    max-height: 600px;
    overflow-y: auto;
    place-items: flex-end;
    justify-items: flex-end;
}

.formCaption {
    text-align: center;
    display: block;
    font-size: 1.25em;
    margin-top: 1.25em;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}

.my-menu {
    max-height: 600px;
    overflow-y: auto;
    place-items: flex-end;
    justify-items: flex-end;
}

    .my-menu .dropdown-menu {
        width: 250px !important;
        align-items: end;
        place-items: flex-end;
        justify-items: flex-end;
    }

.MainGridLayout {
    height: calc(100%);
    width: calc(100%);
    max-width: 2500px;
}

.FooterGridLayout {
    height: calc(30px);
    max-height: calc(30px);
    vertical-align: bottom;
}

.mainForm {
    /*    height: calc(100%-50px);*/
    padding-top: 1px;
    padding-left: 15px;
    padding-right: 1em;
    max-width: 100%;
    min-width: 1000px;
    /*margin: auto;*/
}

.mainFormTab {
    /*    height: calc(100%-50px);*/
    max-width: 100%;
    min-width: 1000px;
    /*margin: auto;*/
}

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

ul.no-bullets {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

DxMenu {
    width: 100px;
    min-width: 100px;
}

CaptionCss {
    width: 0px;
    min-width: 0px;
}

.formLayoutCaption {
    border: 1px solid navy;
    border-radius: 3px;
    -moz-border-radius: 3px;
    padding-bottom: 0.5rem;
}

.myBorder {
    border: 1px solid navy;
}

.myBorderYellow {
    border: 1px solid yellow;
}

border1px {
    border: 1px;
}

.paddingElement0 {
    padding: 0px;
    text-align: left;
}

.contentCenter {
    padding-top: 0.3rem;
    padding-bottom: 0px;
    vertical-align: middle;
    align-self: center;
}

.elementSize {
    height: 1rem;
    max-height: 1rem;
    min-height: 1rem;
}

.paddingForm-group {
    padding-left: 10px;
    padding-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin: 0px;
    font: var(--label1);
}

.paddingForm-group-2 {
    --dxbl-text-padding-x: 0.1rem;
    padding-left: 10px;
    padding-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin: 0px;
    font: var(--label1);
}

    .paddingForm-group-2 .form-group {
        --dxbl-text-padding-x: 0.1rem;
        margin-bottom: 0 !important;
        margin-top: 0 !important;
    }

.dxbl-fl .dxbl-fl-cpt {
    --dxbl-text-padding-x: 0.1rem;
    padding-bottom: 0px;
}

.form-group {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}

.fixedSmaz {
    padding-bottom: 0;
    width: 110px;
    max-width: 110px;
    min-width: 110px;
}

.fixed {
    padding-bottom: 0;
    width: var(--sirka10);
    max-width: var(--sirka10);
    min-width: var(--sirka10);
}

.Sirka60 {
    padding-bottom: 0;
    width: 60px;
    max-width: 60px;
    min-width: 60px;
}

.Sirka70 {
    padding-bottom: 0;
    width: 70px;
    max-width: 70px;
    min-width: 70px;
}

.Sirka80 {
    padding-bottom: 0;
    width: 80px;
    max-width: 80px;
    min-width: 80px;
}

.Sirka90 {
    padding-bottom: 0;
    width: 90px;
    max-width: 90px;
    min-width: 90px;
}

.Sirka100 {
    padding-bottom: 0;
    width: 100px;
    max-width: 100px;
    min-width: 100px;
}

.Sirka110 {
    padding-bottom: 0;
    width: 110px;
    max-width: 110px;
    min-width: 110px;
}

.Sirka120 {
    padding-bottom: 0;
    width: 120px;
    max-width: 120px;
    min-width: 120px;
}

.Sirka130 {
    padding-bottom: 0;
    width: 130px;
    max-width: 130px;
    min-width: 130px;
}

.Sirka140 {
    padding-bottom: 0;
    width: 140px;
    max-width: 140px;
    min-width: 140px;
}

.Sirka150 {
    padding-bottom: 0;
    width: 150px;
    max-width: 150px;
    min-width: 150px;
}

.Sirka160 {
    padding-bottom: 0;
    width: 160px;
    max-width: 160px;
    min-width: 160px;
}

.Sirka170 {
    padding-bottom: 0;
    width: 170px;
    max-width: 170px;
    min-width: 170px;
}

.Sirka180 {
    padding-bottom: 0;
    width: 180px;
    max-width: 180px;
    min-width: 180px;
}

.Sirka190 {
    padding-bottom: 0;
    width: 190px;
    max-width: 190px;
    min-width: 190px;
}

.Sirka200 {
    padding-bottom: 0;
    width: 200px;
    max-width: 200px;
    min-width: 200px;
}

.Sirka210 {
    padding-bottom: 0;
    width: 210px;
    max-width: 210px;
    min-width: 210px;
}

.Sirka220 {
    padding-bottom: 0;
    width: 220px;
    max-width: 220px;
    min-width: 220px;
}

.fixedOLD {
    padding-bottom: 0;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}

.dx-menu-item.notoggle > .dropdown-menu {
    transform: matrix(1, 0, 0, 1, -112, -1) !important;
}

.dx-menu-item.notoggle a > span.dropdown-toggle {
    display: none;
}

.dxbs-menu > .nav .dx-menu-item.notoggle {
    display: none;
}

.dxbs-menu > .nav .dx-menu-item.search-menu-item {
    display: none;
}

.dxbs-menu > .nav .separator {
    display: none;
}

.dx-menu-item .search {
    min-width: 123px
}

.dxbs-menu-item-tmpl > .search {
    padding: 0.25rem;
    position: relative;
}

.user-profile .logo-container {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

.user-profile .log-off-btn {
    padding-top: 0.815rem;
    padding-bottom: 0.815rem;
    border-top: 1px solid #e5e5e5;
}

.user-profile .menu-icon-user-profile {
    opacity: 0.25;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

.verticalAlignTop {
    vertical-align: top;
}

.verticalAlignCentral {
    vertical-align: central;
}

.textAlignRight {
    text-align: right;
}

.textAlignCenter {
    text-align: center;
}

.heightMax {
    height: 100%;
}

.height10px {
    height: 10px;
}

.height12px {
    height: 12px;
}

.height14px {
    height: 14px;
}

.height25px {
    height: 25px;
}

.height32px {
    height: 32px;
}

.height35px {
    height: 35px;
}

.height40px {
    height: 40px;
}

.height48px {
    height: 48px;
}

.height100px {
    height: 100px;
}

.height325px {
    height: 325px;
}

.paddingRight17px {
    padding-right: 17px;
}

.paddingRight {
    padding-right: 30px;
}

.paddingBottom14px {
    padding-bottom: 14px;
}

.fl-custom-class {
}

    .fl-custom-class .card-header {
        min-height: 0px;
        height: 0px;
        max-height: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        margin-bottom: 0px;
        margin-top: 0px;
        border-top: none !important;
        border-top-style: none !important;
    }

    .fl-custom-class .tab-content {
        /*padding-top: 5px;*/
        margin-top: 0px;
    }

    .fl-custom-class .nav-tabs {
        line-height: 1rem;
    }

    .fl-custom-class .nav-item {
    }

    .fl-custom-class .dxbs-fl-gd {
        margin-bottom: 0px !important;
        margin-top: 0px !important;
        padding-top: 0px !important;
        line-height: 1rem;
        border: 0px !important;
        border-top-style: none !important;
    }

    .fl-custom-class .dxbs-fl-gt {
        margin-bottom: 0px !important;
        margin-top: 0px !important;
        padding-top: 0px !important;
        line-height: 1rem;
        border-top: none !important;
        border-top-style: none !important;
    }

    .fl-custom-class .dxbs-fl-gd > .card > .row {
        padding-bottom: 0px !important;
        padding-top: 5px !important;
        margin-top: 0px !important;
        margin-bottom: 0px !important;
        border-top: none !important;
        border-top-style: none !important;
    }

    .fl-custom-class .dxbs-fl-gd > .card {
        padding-bottom: 0px !important;
        padding-top: 0px !important;
        margin-top: 0px !important;
        margin-bottom: 0px !important;
        border-top: none !important;
        border-top-style: none !important;
    }

.cb_datum_custom {
}

    .cb_datum_custom .card-header {
        min-height: 1.5rem;
        height: 1.5rem;
        max-height: 1.5rem;
    }
/*    .fl-custom-class .form-group * {
        padding-top: 0px;
        padding-bottom: 0px;
    }*/
fl-custom-class-group {
}

.buttonCSSDetail {
    border-width: 0px;
    border-style: none;
    margin: 0px 3px 0px 3px;
    padding: 0px 0px 0px 0px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    background: url("../images/Detail.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    margin-right: 8px;
}

.buttonCSS {
    display: flex;
    border-width: 0px;
    border-style: none;
    height: 33px;
    margin: 0px 3px 0px 3px;
    padding: 0px 0px 0px 0px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    background-color: var(--white-color);
    color: var(--secondary-3-color);
    font: var(--body2);
    letter-spacing: var(--body2-letter-spacing);
}

    .buttonCSS.primary {
        background-color: var(--primary-8-color);
        color: var(--button-primary-color);
    }

        .buttonCSS.primary:hover:not(:disabled):not(:active) {
            background-color: var(--primary-7-color);
        }

        .buttonCSS.primary:disabled {
            background-color: var(--white-color);
            color: var(--secondary-10-color);
            border: 1px solid var(--secondary-10-color);
        }

        .buttonCSS.primary:active:enabled {
            background-color: var(--primary-9-color);
        }

    .buttonCSS.secondary {
        border: 1px solid var(--secondary-7-color);

    }

        .buttonCSS.secondary:disabled {
            color: var(--secondary-10-color);
            border-color: var(--secondary-10-color);
        }

        .buttonCSS.secondary:hover:not(:disabled):not(:active) {
            color: black;
            background-color: var(--secondary-12-color);
        }

        .buttonCSS.secondary:active {
            background-color: var(--primary-2-color);
        }

    .buttonCSS.IconGrid {
        border: none;
        background-color: transparent;
    }

        .buttonCSS.IconGrid:disabled {
            color: var(--secondary-10-color);
            border-color: var(--secondary-10-color);
        }

        .buttonCSS.IconGrid:hover:not(:disabled):not(:active) {
            color: black;
            background-color: var(--secondary-12-color);
        }

        .buttonCSS.IconGrid:active {
            background-color: var(--primary-2-color);
        }

.tabGroup {
    display: flex;
    align-items: center;
    flex-direction: row;
    position: relative;
    border-bottom: 1px solid var(--secondary-10-color);
    min-width: 100%;
}

.tabButtonCSS {
    display: flex;
    border-width: 0px;
    border-style: none;
    height: 33px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    padding: 0.25rem 1rem 0.25rem 1rem;
    border-radius: 0px;
    -moz-border-radius: 0px;
    background-color: var(--white-color);
    color: var(--secondary-3-color);
    font: var(--body2);
    letter-spacing: var(--body2-letter-spacing);
}

    .tabButtonCSS.primary {
        font: var(--body2);
        background-color: var(--white-color);
        border-bottom-color: var(--primary-8-color);
        border-bottom-style: solid;
        border-bottom-width: 2px;
        align-content: flex-start;
    }

        .tabButtonCSS.primary:hover:not(:disabled):not(:active) {
        }

        .tabButtonCSS.primary:active:enabled {
            border-bottom-color: var(--primary-8-color);
            border-bottom-style: solid;
            border-bottom-width: 1px;
        }

    .tabButtonCSS.secondary {
        font: var(--body2);
        /*border: 1px solid var(--secondary-7-color)*/
    }

        .tabButtonCSS.secondary:hover:not(:disabled):not(:active) {
            color: black;
            background-color: var(--secondary-12-color);
        }

        .tabButtonCSS.secondary:active {
            background-color: var(--primary-2-color);
        }

    .tabButtonCSS.IconGrid {
        border: none;
        background-color: transparent;
    }

        .tabButtonCSS.IconGrid:disabled {
            color: var(--secondary-10-color);
            border-color: var(--secondary-10-color);
        }

        .tabButtonCSS.IconGrid:hover:not(:disabled):not(:active) {
            color: black;
            background-color: var(--secondary-12-color);
        }

        .tabButtonCSS.IconGrid:active {
            background-color: var(--primary-2-color);
        }


.tabGroupForm {
    display: flex;
    align-items: end;
    flex-direction: row;
    position: relative;
    /*border-bottom: 1px solid var(--secondary-10-color);*/
    min-width: 100%;
    background-color: var(--secondary-12-color);
    height: 40px;
    border-radius: 8px 8px 0px 0px;
}

.tabButtonCSSForm {
    display: flex;
    border-width: 0px;
    border-style: none;
    height: 33px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    padding: 0.25rem 1rem 0.25rem 1rem;
    border-radius: 0px;
    -moz-border-radius: 0px;
    background-color: var(--white-color);
    color: var(--secondary-3-color);
    font: var(--body2);
    letter-spacing: var(--body2-letter-spacing);
    height:40px;
}

    .tabButtonCSSForm.primary {
        font: var(--headline6-bold);
        
        background-color: var(--white-color);
        border-bottom-color: var(--primary-8-color);
        border-bottom-style: solid;
        border-bottom-width: 3px;
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
        align-content: flex-start;
        height: 48px;
    }

        .tabButtonCSSForm.primary:hover:not(:disabled):not(:active) {
        }

        .tabButtonCSSForm.primary:active:enabled {
            border-bottom-color: var(--primary-8-color);
            border-bottom-style: solid;
            border-bottom-width: 1px;
        }

    .tabButtonCSSForm.secondary {
        font: var(--body2);
        background-color: var(--secondary-12-color);
        /*border: 1px solid var(--secondary-7-color)*/
        height: 40px;
        border-radius: 8px 0px 0px 0px;
    }

        .tabButtonCSSForm.secondary:hover:not(:disabled):not(:active) {
            color: black;
            background-color: var(--secondary-8-color);
        }

        .tabButtonCSSForm.secondary:active {
            background-color: var(--primary-2-color);
        }

    .tabButtonCSSForm.IconGrid {
        border: none;
        background-color: transparent;
    }

        .tabButtonCSSForm.IconGrid:disabled {
            color: var(--secondary-10-color);
            border-color: var(--secondary-10-color);
        }

        .tabButtonCSSForm.IconGrid:hover:not(:disabled):not(:active) {
            color: black;
            background-color: var(--secondary-12-color);
        }

        .tabButtonCSSForm.IconGrid:active {
            background-color: var(--primary-2-color);
        }

.tabControlText {
    display: flex;
    flex-grow: 1;
    height: 100%;
    align-items: center;
    padding-left: 4px;
}

.label[buttonCSS] {
    display: flex;
    flex-grow: 1;
    height: 100%;
    align-items: center;
    padding-left: 4px;
}

.icon[buttonCSS] {
    display: flex;
    flex: 1;
    align-items: center;
    align-self: center;
    padding-left: var(--spacing02);
    height: var(--icon-size-4);
    width: 100%;
    background-color: transparent;
}

.iconSize[buttonCSS] {
    height: var(--icon-size-4);
    width: var(--icon-size-4);
}

.icon[labelDropDown] {
    display: flex;
    flex: 1;
    align-items: center;
    align-self: center;
    height: var(--icon-size-4);
    width: 100%;
    background-color: transparent;
    padding-left: 5px;
}

.iconMainDropDown {
    color: var(--white-color);
    padding-right: 10px;
    place-content: flex-end !important;
}

.iconSize[labelDropDown] {
    height: var(--icon-size-4);
    width: var(--icon-size-4);
}

.iconSize[NepodporovanyProhlizecIcon] {
    height: var(--icon-size-5);
    width: var(--icon-size-5);
    color: var(--alert-alert-color);
}

.iconSize[InformaceIcon] {
    height: var(--icon-size-5);
    width: var(--icon-size-5);
    color: var(--alert-info-color);
}

.iconSize[accordion] {
    height: var(--icon-size-5);
    width: var(--icon-size-5);
}

#accordionPanel {
}

#accordionButton {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1rem 1.25rem;
    color: #212529;
    text-align: left;
    background-color: var(--secondary-13-color);
    border: 0;
    border-radius: 0;
    font: var(--subtitle2);
    height: 40px;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
}

#accordionHeader {
    margin-bottom: 0;
}

.label[accordionHeader] {
    font: var(--subtitle2);
    letter-spacing: var(--subtitle2-letter-spacing);
    padding-left: 4px;
}

#accordionItem {
        background-color: #fff;
        border: 1px solid rgba(34, 34, 34, 0.125);
        margin-bottom: 4px;
    }

    #accordionItem.Collapse {
        border-radius: var(--border-radius2);
    }

#accordionItem.notCollapse {
    border-top-left-radius: var(--border-radius2);
    border-top-right-radius: var(--border-radius2);
}


#accordionBody {
    padding: 1rem 1.25rem;
}


.buttonCSS.detail {
    background: url("../images/Detail.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    margin-right: 8px;
}

.buttonCSS.obrazek {
    background: url("../images/Image.svg") no-repeat center;
}

.buttonCSS.cmdImageLeft {
    background-image: url("../Images/ArrowDoubleLeft1_32.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    margin-right: 8px;
    opacity: 0,4;
}

.buttonCSS:hover:not(:disabled):not(:active) {
    opacity: 1;
    color: black;
    background-color: var(--secondary-12-color);
}

.buttonCSS.cmdImageStart {
    background-image: url("../Images/ArrowDoubleLeft2_32.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    margin-right: 8px;
}

.buttonCSS.cmdImageRight {
    background-image: url("../Images/ArrowDoubleRight1_32.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    margin-right: 8px;
}

.buttonCSS.cmdImageEnd {
    background-image: url("../Images/ArrowDoubleRight2_32.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    margin-right: 8px;
}

.buttonCSS:disabled {
    color: var(--secondary-10-color);
}

.buttonCSS:hover:not(:disabled):not(:active) {
    color: black;
    background-color: var(--secondary-12-color);
}

.buttonCSS:active {
    background-color: var(--primary-2-color);
}

.buttonCSS.smallIconGrid {
    width: 40px;
}

.buttonCSS.small {
    width: 50px;
}

.buttonCSS.normal {
    width: 75px;
}

.buttonCSS.large {
    width: 100px;
}

.buttonCSS.extralarge {
    width: 125px;
}

.buttonCSS.maxlarge {
    width: 150px;
}

.buttonCSS.maxmaxlarge {
    width: 175px;
}

.buttonCSS.max200pxlarge {
    width: 200px;
}

.buttonCSS.max225pxlarge {
    width: 225px;
}
/*   .buttonCSS:hover {
        border: 1px solid #0099cc;
        background-color: #99CCFF;
        color: #ffffff;
        padding: 2px 2px;
    }

    .buttonCSS:disabled,
    button[disabled] {
        border: 1px solid #999999;
        background-color: #7A7A7A;
        color: #ffffff;
    }
*/
.icon {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    height: 24px;
    width: 24px;
}

.icon-navbar {
    -webkit-mask-image: url("../images/navbar.png");
    mask-image: url("../images/navbar.png");
    background-color: transparent !important;
}

.icon-logo {
    -webkit-mask-image: url("../images/logo.svg");
    mask-image: url("../images/logo.svg");
}

.icon-home {
    -webkit-mask-image: url("../images/Home.svg");
    mask-image: url("../images/Home.svg");
}

.icon-phone {
    -webkit-mask-image: url("../images/Phone.svg");
    mask-image: url("../images/Phone.svg");
}

.icon-calendar {
    -webkit-mask-image: url("../images/Calendar.svg");
    mask-image: url("../images/Calendar.svg");
}

.label2 {
    font-size: 1rem;
}

.labelGroup1 {
    font: var(--label1);
    font-size: 12px;
}

.labelBoldCSS {
    font-style: normal !important;
    font-weight: 600 !important;
    border-width: 1px;
    font-size: 20px;
}

.labelBold {
    font-weight: 600 !important;
}

.labelBoldCSS_Red {
    font-weight: 600 !important;
    color: var(--alert-alert-color) !important;
}
/* VYTAHNUTO Z BLAZING-BERRY A ZMENENO
    var(--color-background) ZA #5f368d*/
.primary {
    background-color: var(--color-background);
    font-size: 1rem;
}

a {
    color: var(--color-background);
    font-size: 1rem;
}

    a:hover {
        color: #3a2156;
    }

.col-form-label-sm {
    font-size: 1rem;
}

th {
    font-weight: 500;
    font-size: 1rem;
}

.table-sm, .table-sm td, .table-sm th {
    font-size: 1rem;
}

.table-statim, .table-statim > th, .table-statim > td {
    background-color: #FF8B8A;
}

    .table-statim:hover {
        background-color: yellow;
    }



.table-warning, .table-warning > th, .table-warning > td {
    height: 35px;
    background-color: var(--alert-warning-color);
}

.table-splneno, .table-splneno > th, .table-splneno > td {
    background-color: #E0F8F2;
}

.barvaSteril_Kontejner, .barvaSteril_Kontejner > th, .barvaSteril_Kontejner > td {
    background-color: #FFEBCD;
}

.barvaSteril_Nastroj {
    background-color: #CCFFFF;
}

.barvaSteril_NastrojTyp {
    background-color: #BDE6FF;
}

.dropdown-item {
    color: #212529;
    font-size: 1rem;
}

    .dropdown-item:hover, .dropdown-item:focus {
        color: #16181b;
        background-color: #ececec;
    }

    .dropdown-item.active, .dropdown-item:active {
        background-color: var(--color-background);
    }

    .dropdown-item.disabled, .dropdown-item:disabled {
        color: #888;
    }

.dropdown-content a:hover {
    background-color: #ddd
}

.dropdown-content a {
    color: black;
}

.dropdown-content {
    color: yellow;
}

.dropdown-menu a:hover {
    background: #ececec;
    background: linear-gradient(left, #ececec, #999);
    background: -moz-linear-gradient(left, #ececec, #999) !important;
    background: -webkit-gradient(linear, 100% 100%, 0% 0%, from(#ececec), to(#999)) !important;
    /*color: #f8f9fa !important;*/
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: var(--color-background); /*var(--color-background)*/
    background-color: var(--color-background); /*var(--color-background)*/
    font-size: 1rem;
}

.custom-control-input:focus ~ .custom-control-label::before {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.25);
    box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.25);
    font-size: 1rem;
}

.headerCheckbox {
    margin-right: 3px;
    padding-right: 0px;
    margin-top: 0px !important;
    padding-top: 0px !important;
    border: 0.01rem !important;
    z-index: auto;
    height: 1rem;
    min-height: 1rem;
    width: 1rem;
    min-width: 1rem;
    -webkit-box-shadow: 0 0 0 0.02rem rgba(3, 165, 153, 0.25);
    box-shadow: 0 0 0 0.02rem rgba(3, 165, 153, 0.25);
    opacity: 1 !important;
    position: relative !important;
    vertical-align: text-bottom;
}

    .headerCheckbox:checked + span::before {
        content: none !important;
    }

    .headerCheckbox + span::before {
        content: none !important;
    }

.headerCheckboxSpan {
    font-family: var(--font-family);
    font-size: var(--f);
    font-weight: var(--font-weight-normal);
}

.ddxbs-checkbox .custom-control {
    border-color: black;
    z-index: auto;
    height: 1.28125rem;
    min-height: 1.28125rem;
}

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: black;
    background-color: var(--color-background);
    font-size: 1rem;
}

.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: rgba(3, 165, 153, 0.5);
    font-size: 1rem;
}

.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: rgba(3, 165, 153, 0.5);
    font-size: 1rem;
}

.form-control:focus {
    border-color: #2dfbed;
    outline: 0;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.25);
    box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.25);
    font-size: 1rem;
}

.form-control-sm {
    font-size: 1rem;
}
/*#9f77cb*/
.custom-select:focus {
    border-color: var(--color-background);
    outline: 0;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.25);
    box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.5);
    font-size: 1rem;
}

.custom-range::-webkit-slider-thumb {
    background-color: var(--color-background);
}

.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    background-color: var(--color-background);
    font-size: 1rem;
}

.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #2dfbf0;
    font-size: 1rem;
}

.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
    color: #fff;
    background-color: #b99cd9;
    border-color: #b99cd9;
}

.custom-control-input[disabled] ~ .custom-control-label, .custom-control-input:disabled ~ .custom-control-label {
    color: #888;
}

    .custom-control-input[disabled] ~ .custom-control-label::before, .custom-control-input:disabled ~ .custom-control-label::before {
        background-color: #e9ecef;
    }

.custom-range::-ms-thumb {
    background-color: var(--color-background);
}
/*.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: #495057; 
    background-color: #fff;
    border-color: var(--color-background);
    font-size: 1rem;
}

    .nav-tabs .nav-link.active,
    .nav-tabs .nav-link.active:hover,
    .nav-tabs .nav-link.active:focus {
        border-color: var(--color-background);
        font-size: 1rem;
    }


.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: #fff;
    background-color: var(--color-background);
}
*/
/*dxbs-grid-selected-row
.dxbs-grid-table {
    --dx-grid-selection-color: var(--color-background);
    
}
*/
.page-link {
    color: var(--color-background);
    background-color: #fff;
    border: 1px solid #dee2e6; /*seda*/
    font-size: 1rem;
}

    .page-link:hover {
        color: #025a54;
        background-color: #e9ecef; /*seda*/
        border-color: #dee2e6;
    }

    .page-link:focus {
        -webkit-box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.25);
        box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.25);
    }
/*page v gridu*/
.pagination-sm .page-link {
    font-size: 1rem;
}

.page-item.active .page-link {
    background-color: var(--color-background);
    border-color: var(--color-background);
}

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

a.badge-primary:hover, a.badge-primary:focus {
    color: #fff;
    background-color: #462868;
}

a.badge-primary:focus, a.badge-primary.focus {
    outline: 0;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(95, 54, 141, 0.5);
    box-shadow: 0 0 0 0.2rem;
}

.progress-bar {
    background-color: var(--color-background);
}

.custom-control-input[disabled] ~ .custom-control-label::before, .custom-control-input:disabled ~ .custom-control-label::before {
    background-color: #D9DAD9;
}

.bg-primary {
    background-color: var(--color-background) !important;
    font-size: 1rem;
}

    .bg-primary.disabled, .bg-primary:disabled {
        color: #fff;
        background-color: var(--color-background);
        border-color: var(--color-background);
    }

    .bg-primary:hover {
        color: #fff;
        /*background-color: #038279;*/
        background-color: #99CCFF;
        border-color: #04958b;
    }

    .bg-primary:focus, .bg-primary.focus {
        color: #fff;
        background-color: #038279;
        border-color: #04958b;
        -webkit-box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.5);
        box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.5);
    }

.border-primary {
    border-color: var(--color-background) !important;
}

.text-primary {
    color: var(--color-background) !important;
    font-size: 1rem;
}

.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    background-color: var(--color-background);
    font-size: 1rem;
}

.list-group-item.active {
    background-color: var(--color-background);
    border-color: var(--color-background);
    font-size: 1rem;
}

.dx-blazor-tagbox .dx-blazor-tag .btn.dxbs-cmd-btn.dxbs-tag-remove-btn:focus, .dx-blazor-tagbox .dx-blazor-tag .btn.dxbs-cmd-btn.dxbs-tag-remove-btn:hover {
    color: #fff !important;
}

    .dx-blazor-tagbox .dx-blazor-tag .btn.dxbs-cmd-btn.dxbs-tag-remove-btn:focus:before, .dx-blazor-tagbox .dx-blazor-tag .btn.dxbs-cmd-btn.dxbs-tag-remove-btn:hover:before {
        background-color: var(--color-background);
    }

.dxbs-focus-hidden .btn-primary:focus, .dxbs-focus-hidden .btn-primary.focus {
    border-color: var(--color-background);
    -webkit-box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2) !important;
    font-size: 1rem;
}

    .dxbs-focus-hidden .btn-primary:focus:not(:hover):not(.hover):not(:active):not(.active), .dxbs-focus-hidden .btn-primary.focus:not(:hover):not(.hover):not(:active):not(.active) {
        color: #fff;
        background-color: var(--color-background);
    }

.btn-primary {
    color: #fff;
    background-color: var(--color-background);
    border-color: var(--color-background);
    font-size: 1rem;
}

    .btn-primary:hover {
        color: #fff;
        /*background-color: #038279;*/
        background-color: #99CCFF;
        border-color: #04958b;
    }

    .btn-primary:focus, .btn-primary.focus {
        color: #fff;
        background-color: #038279;
        border-color: #04958b;
        -webkit-box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.5);
        box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.5);
    }

    .btn-primary.disabled, .btn-primary:disabled {
        color: #fff;
        background-color: rgba(3, 165, 153, 0.5);
        border-color: var(--color-background);
    }
    /*button stisknuto*/
    .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
        color: #fff;
        background-color: #99CCFF;
        /*        background-color: #04958b;*/
        border-color: #039b91;
    }

        .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
            -webkit-box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.5);
            box-shadow: 0 0 0 0.2rem rgba(3, 165, 153, 0.5);
        }

    .btn-primary, .btn-primary.disabled, .btn-primary:disabled {
        -webkit-box-shadow: 0px 1px 4px 0px rgba(95, 54, 141, 0.5);
        box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);
    }

.DxSpinEdit {
    margin: 0px 3px 0px 3px;
    padding: 0px 0px 0px 0px;
    border-width: 0px;
    border-style: none;
}

.small {
    width: 50px;
}

.normal {
    width: 75px;
}

.large {
    width: 100px;
}

.extralarge {
    width: 125px;
}

.nadpisLogo {
    font-style: normal;
    font-weight: 300;
    font-size: 112px;
    /*   font-family: OpenSans !important;*/
    border-width: 1px;
    color: var(--color-background);
    vertical-align: middle;
    text-align: center;
}

    .nadpisLogo.white {
        color: white;
    }

    .nadpisLogo.default {
        color: var(--color-default);
    }

.nadpisLogoImage {
    content: url("../Images/Samostany_symbol_negativni_RGB.png");
    vertical-align: middle;
}

.tableLogo {
    height: 100%;
    width: 100%;
    text-decoration: none;
    min-width: 1000px;
}

.table-centr {
    margin-left: auto;
    margin-right: auto;
}

.td-central {
    vertical-align: middle;
    text-align: center;
}

.td-button {
    width: 35px;
    min-width: 35px;
    max-width: 35px;
}

.bodyLogin {
    min-width: 1024px;
    min-height: 600px;
    height: 100%;
    width: 100%;
    font-style: normal;
    font-weight: 100;
    font-size: 14px;
    background-position-y: top;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('../Images/LoginPozadi.png');
    background-attachment: fixed;
    background-size: 100% 100%;
    /*top: 2rem;*/
    margin: 0;
    padding: 0;
    border: none;
    position: absolute;
}

.buttonLogin {
    font-style: normal;
    font-weight: 100;
    font-size: 20px;
    background-color: var(--color-background);
    color: #ffffff;
    padding: 0px 0px 0px 10px;
    margin: 0px 0px 0px 0px;
    width: 250px;
    border: 1px solid #848686;
    border-radius: 3px;
    -moz-border-radius: 3px;
    height: 35px;
    vertical-align: middle;
    text-align: center;
}

    .buttonLogin:disabled {
        background-color: #888;
        color: #ffffff;
    }

.prihlasenyUzivatelCSS {
    background-color: transparent;
    padding: 0px 0px 0px 10px;
    margin: 0px 0px 0px 0px;
    vertical-align: middle;
    text-align: center;
    border: none;
}

.headerLabelCSS {
    font-style: normal;
    font-weight: 600;
    border-width: 1px;
    font-style: normal;
    font-size: 14px;
}

.buttonLogoutCSS {
    background-image: url('../Images/logout.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    padding: 0px 0px 0px 10px;
    margin: 0px 0px 0px 10px;
    vertical-align: middle;
    text-align: center;
    width: 2rem;
    height: 100%;
    border: none;
}

.buttonEyeCSS {
    background-image: url('../Images/eye.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    padding: 0px 0px 0px 10px;
    margin: 0px 0px 0px 0px;
    vertical-align: middle;
    text-align: center;
    width: 2rem;
    height: 2rem;
    border: none;
}

.buttonEyeNOCSS {
    background-image: url('../Images/eyeNO.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    padding: 0px 0px 0px 10px;
    margin: 0px 0px 0px 0px;
    vertical-align: middle;
    text-align: center;
    width: 2rem;
    height: 2rem;
    border: none;
}

.textLogin {
    font-style: normal;
    font-weight: 100;
    font-size: 20px;
    width: 250px;
    color: #9c9a9a;
    background-color: #FFFFFF;
    border: 1px solid #848686;
    border-radius: 3px;
    -moz-border-radius: 3px;
    height: 35px;
    padding: 0px 0px 0px 10px;
    margin: 0px 0px 0px 0px;
    vertical-align: bottom;
    text-align: left;
}

.navbar.header-navbar {
    flex-grow: 0;
    flex-wrap: nowrap;
    border: none;
    background-color: inherit;
    border-radius: 0;
    height: 2rem;
    min-height: 2rem;
    box-shadow: 0px 2px 6px 0px rgba(3, 165, 153, 1);
    justify-content: flex-start;
}

.header-navbar .navbar-toggler {
    outline: none;
    border-radius: 0;
    padding-left: .75rem;
    padding-right: .75rem;
    align-self: stretch;
}

    .header-navbar .navbar-toggler .navbar-toggler-icon {
        background-image: url('../Images/navbar.png');
        background-color: transparent !important;
        height: 2rem;
        width: 2rem;
    }

.content {
    padding: 1.1rem 2rem 0 2rem;
}

.sidebar {
    min-width: 250px;
    max-width: 250px;
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.16);
    max-height: calc(100vh - 3.5rem);
    transition: transform 0.1s ease-out;
    overflow: auto;
}

    .sidebar.collapse {
        display: none;
    }

    .sidebar.expand {
        display: block;
    }

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

.title {
    text-overflow: ellipsis;
    overflow: hidden;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.app-sidebar > .nav-pills > .nav-item:first-of-type {
    padding-top: 1rem;
}

.app-sidebar > .nav-pills > .nav-item:last-of-type {
    padding-bottom: 1rem;
}

.app-sidebar .nav-pills > .nav-item a {
    border-radius: 0px;
    display: flex;
    align-items: center;
}

.app-sidebar > .nav-pills > .nav-item > a {
    padding: .25rem 1rem .25rem .125rem;
}

.fit-width {
    max-width: 100%;
}

.footCSS {
    font-style: normal;
    font-weight: 100;
    font-size: 14px;
    border-width: 0px;
    border: none;
    width: 100%;
    height: 30px;
    background-color: #F4F4F4;
    color: #73736D;
    z-index: 1500;
}

@media (max-width: 3500px) {
    .title {
        font-size: inherit;
    }

    .main {
    }

    .sidebar {
        display: none;
    }

        .sidebar.expand {
            position: fixed;
            top: 2rem;
            left: 0;
            min-width: 100vw;
            background-color: #fff;
            z-index: 1050;
        }

    .app-sidebar > .nav-pills > .nav-item:last-of-type {
        padding-bottom: 0;
    }
}

@media (max-width: 350px) {
    .title {
        font-size: inherit;
    }
}
/* open-sans-300 - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/open-sans-v16-latin-ext-300.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-300.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-300.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-300.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-300italic - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: italic;
    font-weight: 300;
    src: url('../fonts/open-sans-v16-latin-ext-300italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-300italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-300italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-300italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/open-sans-v16-latin-ext-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-regular.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-italic - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/open-sans-v16-latin-ext-italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/open-sans-v16-latin-ext-600.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-600.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-600.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-600.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600italic - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: italic;
    font-weight: 600;
    src: url('../fonts/open-sans-v16-latin-ext-600italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-600italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-600italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-600italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700 - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/open-sans-v16-latin-ext-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-700.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-700.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-700.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700italic - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: italic;
    font-weight: 700;
    src: url('../fonts/open-sans-v16-latin-ext-700italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-700italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-700italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-700italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: normal;
    font-weight: 800;
    src: url('../fonts/open-sans-v16-latin-ext-800.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-800.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-800.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-800.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800italic - latin-ext */
@font-face {
    font-family: 'OpenSans';
    font-style: italic;
    font-weight: 800;
    src: url('../fonts/open-sans-v16-latin-ext-800italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/open-sans-v16-latin-ext-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v16-latin-ext-800italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-800italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v16-latin-ext-800italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v16-latin-ext-800italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}