:root {
    --primary-color: #CF1C34;
    --background-selected-color: #F8DDE0;
    --urgent-color: #CF1C34;
    --background-alt-color: #F3F3F3;
    --white-grey: #F3F3F3;
    --grey-light: #E7E7E7;
    --grey-medium: #D8D8D8;
    --grey-dark: #8C8C8C;
    --black: #191919;
    --white: #FFFFFF;
    --font-family: "Calibri";
    --text-font-weight-bold: bold;
    --dxgrid-header-font-weight: 700;
    --text-color: #3F3F3F;
    --calendar-blue: #337ab7;
    --datetime-color-blue: #3B92D9;
    --grid-color-highlight-material: #f5f3e9;
    --grid-color-highlight-material-alt: #fffcf2;
    --grid-color-highlight-quantity: #ecf0f4;
    --grid-color-highlight-quantity-alt: #f5f9fd;
    --grid-color-text-header: #F3F3F3 ;
    --grid-color-text-header-alt:#CF1C34 ;
    --planning-color-dark-green: #089128;
    --planning-color-orange: #F27414;
    --planning-color-yellow: #F2CB2B;
    --error-message-font-color: #CF1C34;
}

.windowBackground
{
    height: auto;
    width: auto;

    background-color: #F3F3F3;
    padding-top: 8px;
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 8px;

}

.windowContent
{
    background-color: white;

    border-radius: 3px;
    box-shadow: 0 0 5px 1px #D8D8D8 ;

    padding-top: 8px;
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 8px;
}

.reportCall
{
    padding-bottom: 15px; 
    padding-top: 15px; 
    padding-right: 15px; 
    padding-left: 15px; 
    background-color: #F3F3F3;
    background-image: none;
    border-radius: 5px;
    min-height: 44px;
}

.reportHeader
{
    font-family: 'Montserrat', sans-serif;
    font-size: 18pt;
    font-weight: 700;
}

.btnReportStart
{
    background-image: none; 
    background-color: var(--primary-color);
    font-family: 'Montserrat', sans-serif;
    font-size: 8pt;
    font-weight: 300;
    color: white;
    width: 165px;
    height: 30px;
    border: none;
    border-radius: 4px;
}

.btnExportXmlFile
{
    background-image: none; 
    background-color: var(--primary-color);
    font-family: 'Montserrat', sans-serif;
    font-size: 8pt;
    font-weight: 300;
    color: white;
    width: 165px;
    height: 30px;
    float: right;
    border: none;
    border-radius: 4px;

    margin-left: 5px;
}

.se-pre-con {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(images/preloader_10.gif) center no-repeat #fff;
}

/******************************************* Redesgin region Login 23.06.2021 ************************************************************/
.bodyLogin 
{
    font-family: 'Montserrat'; 
    background-color: white;
    align-content:center; 
    margin: 0px;
}
.mainTableLogin
{
    background-color: white;
    position : relative;
    width : 70%;
    max-width: 1320px !important;
    max-height: 600px;
    height : 70%;
    box-shadow : 1px 1px 5px 5px #D8D8D8;
    border-spacing: 0;
    padding: 0;
    border-width: 0;
}
.loginForm{
    height: 100%;
}
.leftTableCell{
    width: 40%;
    background-color: var(--primary-color);
}
.rightTableCell{
    width: 60%;
    background-color: white;
}
.divLoginHost
{ 
    position:relative; 
    height: 80px;
    background-color:white;
    margin-bottom: 22px;
}
.leftTable
{
    background-color: var(--primary-color);
    color: aliceblue;
    text-align:center;
    height : 100%;
    width : 100%;
}
.leftTableBottom{
    padding-top:0px;
}
.rightTable {
    width: 70%;
    height: 70%;
}
.main {
    width : 100%;
    height : 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.linde{
    display:none !important;
    width: 100%;
    font-size: 400%;
    font-weight: 700;
}
.h2Login{
    width: 100%;
    font-size: 150%;
    font-weight: 600;
}
.h1 {
    width: 100%;
    font-size: 400%;
    font-weight: 700;
}
.h2 {
    width: 100%;
    font-size: 150%;
    font-weight: 600;
}
.h3 {
    width: 100%;
    font-size: 110%;
    font-weight: 500;
}
.buttomText {
    color: #8c8c8c;
    font-size: 12pt;
    text-decoration:none;
}
.placeholder {
    color: orangered;
}
.rightTableCell .valMessage{
    color:var(--primary-color) !important;
    font-size: 14px;
}

.oldContent{ visibility:hidden;}

#tbLogin .RadTextBoxRedesign {
    width: calc(100% - 44px) !important;
}

/***********************************************************Report Grid**************************************************************/

.RadGrid_Redesign { /*MainGrid*/
    border-radius:5px;
    background-color: #F3F3F3;
}
.RadAjaxPanel{
    border-color:white;
}
.rgGroupPanel{/*the first Row, contains unwanted instractions*/
    display:none;
}
.RadGrid_Redesign .radGridCmdItemTableLeft{ /*enhanced in the secound row "Aktualisieren .... "*/
    width:25%;
    color: red;
    font-size: 16px;
}
.RadGrid_Redesign .rgMasterTable { /*the Center Grid .. from the first red row*/
    border-collapse: collapse !important;
    border-spacing: unset !important;
    border-radius: 5px !important;
    border-top-color: white;
    border-top-width: 0px !important;
    border-bottom-color: var(--grey-medium) !important;
    border-bottom-width: 1px !important;
    border-left-color: var(--grey-medium) !important;
    border-left-width: 1px !important;
    border-right-color: var(--grey-medium) !important;
    border-right-width: 1px !important;
    background-color: var(--background-alt-color);
}

.RadGrid_Redesign .rgDetailTable {
    border-spacing: unset !important;
    border-radius: 5px !important;
    border-top-color: white;
    border-top-width: 0px !important;
    border-bottom-color: var(--grey-medium) !important;
    border-bottom-width: 1px !important;
    border-left-color: var(--grey-medium) !important;
    border-left-width: 1px !important;
    border-right-color: var(--grey-medium) !important;
    border-right-width: 1px !important;
    background-color: var(--background-alt-color);
}
.RadGrid_Redesign a{/*The group of Links .. FirstRow  */
    color: #8C8C8C;
    text-decoration: none;
    width: 100%;
}
.RadGrid_Redesign .radGridCmdItemTableRight{
    font-size:16px;
    color:white;
}
.RadGrid_Redesign .rgCommandRow{
    background-color: white !important;
    border:hidden;
}
.RadGrid_Redesign .rgCommandCell{/*Row of Titles .. Secound red Row */
    height: 40px;
    border-radius: 5px;
    border-color: whitesmoke;
}
.RadGrid_Redesign .rgFilterBox ,
.RadGrid_Redesign .riTextBox
{/*The Search Boxes .. at third Row*/
    width:60%;
    border-radius:5px;
    border-color: #D8D8D8;
}
.riSingle RadInput .RadInput_Redesign{ /*Filter Row Mange Cell*/
    width: 70% !important;
}
.RadGrid_Redesign .rgRow { /*All Rows of Gray color*/
    background-color: #F3F3F3 !important;
}
.RadGrid_Redesign .rgAltRow{/*All Rows of white color*/
    background-color: white !important;
}
.RadGrid_Redesign .rgAltRow>td,
.RadGrid_Redesign .rgRow>td{
    border-color: #D8D8D8;
}
.RadGrid_Redesign .rgHeader{/*Column Header Cell*/
    color: white;
    background-color: var(--primary-color);
}
.RadGrid_Redesign .rgHeader a{
    color: white;
}
thead tr th:first-child{
    border-radius: 5px 0px 0px 0px !important;
}
thead tr th:last-child {
    border-radius: 0px 5px 0px 0px !important;
}
.RadGrid_Redesign .tbody {/*Rows of Data*/
    border-color: #D8D8D8;
}
.RadGrid_Redesign .rgPager{/*Navigation Row*/
    background-color: #f3f3f3;
    border-color : #D8D8D8;
    height:50px !important;
}
.RadGrid_Redesign .pagerTableClass{
    width:100%;
    border-color : #D8D8D8;
    border-width:0px !important;
    border-style:none !important;
}
.RadGrid_Redesign .rgPager .radtextBoxPageSize{
    padding :0px 0px 3px 6px !important;
    font-family: 'Montserrat';
}
.RadGrid_Redesign .rgPager .radtextBoxPageIndex{
    padding :0px 0px 3px 6px !important;
    font-family: 'Montserrat';
}
.RadGrid_Redesign .rgPager .pagerTableCellRight{
    width:130px;
    padding-right: 5px;
    padding-left :2px;
    vertical-align: inherit;
}
.RadGrid_Redesign .rgPager td:has(.pager_imgBtn_setrecordcount) {
    min-width: 70px;
}

.RadGrid_Redesign .rgPager .RadInput_Redesign{
    background-color: #f3f3f3;
}
.pagerTableClass .PagerCellText{
        width: 105px !important;
}
.pagerTableClass .PagerNaviText{
        width: 95px;
}
.pagerTableClass .PagerCellBtnNext{
    width: 20px !important;
    padding-left:15px;
    padding-right: 40px;
}
div.RadGrid .rgSelectedRow,
div.RadGrid .rgSelectedRow > td { /*Seleted Row Style Oerwriting , also wit .RadGrid_Redesign  .rgSelectedRow*/
    background-color: var(--background-selected-color) !important;
}
.RadGrid_Redesign .rgFooter td{
    display: none;
}
.RadGrid_Redesign .lbResultCount,
.RadGrid_Redesign .lbGoToPage{
   margin-right: 7px;
}
.RadGrid_Redesign .rgNoRecords{
    height: 25px;
    border-style: ridge;
    border-color: #D8D8D8;
    border-width: 1px;
}
.RadGrid_Redesign .rgNoRecords div{
    margin-left: 5px;
    font-weight: 700;
}
.RadGrid_Redesign .rgDetailTable {
    border-color: var(--white);
    padding: 8px;
    background-color: white;
    border-radius: 5px;
    margin: 8px;
    box-shadow: 0 0 5px 1px #D8D8D8;
}
.RadGrid_Redesign .rgDetailTable:hover {
    box-shadow: 0 0 5px 1px var(--grey-dark);
}
.RadMenu {
    background-color: white !important;
    box-shadow: 0px 7px 5px #d8d8d8;
    border-radius:5px;
}
.RadMenu a.rmLink{
    text-decoration : none;
    font-family : 'Montserrat';
    color: unset;
    padding-top: 10px !important;
    padding-bottom:10px !important;
    border-top : 2px !important;
    border-top-color : #d8d8d8 !important;
    border-top-style : solid !important;

}
.RadMenu a.rmText{
    margin:0px !important;
    text-align: center !important;
}
.RadMenu .rmFirst a.rmLink{
    border-top :0px !important;
}
.RadMenu .rmFocused a.rmLink{
    background-color: red !important;
}
.RadMenu .rmGroup a.rmSelected,
.RadMenu .rmGroup a.rmExpanded {
    background-color: var(--background-selected-color) ;
}

/******************************************* Redesign region Margo Surface 17.11.2022 ************************************************************/

.tabBarMasks{
    height:40px; 
    margin-bottom:0px;
    margin-left:0px; 
    position:absolute; 
    z-index:0; 
    background-color: var(--primary-color); 
    border: none; 
    border-radius: 0px;
    top: 0px;
}

.tabBarLogo{
    height: 30px; 
    margin-top: -12px; 
    color: white; 
    z-index: -1; 
    float: right; 
    font-weight: bold; 
    font-size: 28px;
    position: absolute;
    user-select: none;
}

.whiteBar{
    height:5px; 
    margin-top: 28px; 
    background-color: white; 
    position:absolute; 
    z-index: 51
}

.sidepanel{
    height: 100%;
    width: 0;
    position: fixed; /* Stay in place */
    z-index: 10000; /* Stay on top */
    /*top: 0;
    left: 0;*/
    background-color: #1F2837; /* darkblue */
    overflow-x: hidden; /* Disable horizontal scroll */
    box-sizing: border-box;
    padding-top: 15px;
    padding-bottom: 15px; /* -5px as long as the last item has 5px margin-bottom */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */
}

/* The sidepanel left */
.sidepanel a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidepanel a:hover {
    color: #f1f1f1;
}

.tabsList {
    transition: 0.5s;
    z-index: 2;
    margin-top: -2px;
    height: 38px;
/*    overflow: auto;
    white-space: nowrap;*/
}
.maskTabsList {
    transition: 0.5s;
    display: inline-block;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    height: 32px;
    position: relative;
    padding-top: 10px;
    top: -3px;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.maskTabsList::-webkit-scrollbar {
    display:none
}
.scrollButtons {
    position: relative;
    top: -21px;
    display: none;
}

.panelButtons{
    background-color: inherit;
    outline: none;
    font-size: 20px;
    font-family: Calibri;
    font-weight: bold;
    border-color: white;
    user-select: none;
}

.panelButtons:hover{
    color: white !important;
}

.navButton{
    color: white;
    border-width: 0px 0px 2px 0px;
}

.sysButton{
    color: #8C8C8C;
    border-width: 0px;
}

.panelMenu{
    justify-content: space-evenly;
    display: flex;
    margin-bottom: 20px;
}

.sidepanel .treeViewPanel{
    color: white !important;
    font-family: Calibri !important;
    font-size: 18px !important;
}

.RadComboBox.sideBarSearch .rcbArrowCell a {
    display:none !important;
}

.RadComboBox_Office2010Blue.sideBarSearch .rcbInputCell, 
.RadComboBox_Office2010Blue.sideBarSearch .rcbArrowCell{
    background-image: none !important;
}

.RadComboBox_Office2010Blue.homePanelSearch .rcbInputCell, 
.RadComboBox_Office2010Blue.homePanelSearch .rcbArrowCell{
    background-image: none !important;
}

.sideBarSearch .rcbInput{
    background-color: #363e4b !important;
    color: white !important;
    padding: 2px 0px 1px 20px !important;
    box-sizing: border-box;
    height: 30px !important;
    margin: 15px 0 30px !important;
    font-family: Calibri !important;
    font-size: 18px !important;
    background: no-repeat 91% 50% url(images/suche-weiss-16px.png);
}
#formHome .RadComboBoxDropDown .rcbItem,
#formHome .RadComboBoxDropDown .rcbHovered{
    font-size: 16px !important;
    font-family: Calibri !important;
}

#formHome #radComboBoxTreeSearch_DropDown .rcbHovered{
    color: black;
    background-color: white;
}

#formHome #radComboBoxTreeSearch_DropDown .rcbLoading{
    color: black;
    background-color: white;
}

#formHome #radComboBoxHomePanel_DropDown .rcbHovered{
    color: #333;
    background-color: rgba(0,0,0,.04);
}

#formHome #radComboBoxHomePanel_DropDown .rcbLoading{
    color: #333;
    background-color: rgba(0,0,0,.04);
}

.RadComboBox.sideBarSearch table td.rcbInputCell{
    padding: 0px !important;
}

/*div.RadTreeView .rtMinus,*/
.sidepanel  div.RadTreeView .rtImg
{
    /*display: none;*/
    width: 20px;    
    height: 20px;
    margin-right: 4px;
}

.sidepanel  div.RadTreeView .rtIn{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 90%;
}

.sidepanel div.RadTreeView .rtPlus{
    /*float: right;*/
    background-image: url(images/pfeil-rechts-weiss-16px.png) !important;
    height: 24px;
    width: 24px;
    background-position: center !important;
    cursor: pointer;
    margin: 0px !important;
    padding: 4px;
}
.sidepanel div.RadTreeView .rtMinus{
    /*float: right;*/
    background-image: url(images/pfeil-unten-weiss-16px.png) !important;
    height: 24px;
    width: 24px;
    background-position: center !important;
    cursor: pointer;
    margin: 0px !important;
    padding: 4px;
}
.sidepanel div.RadTreeView .rtTop,
.sidepanel div.RadTreeView .rtMid,
.sidepanel div.RadTreeView .rtBot
{
    padding: 5px 0 5px;
    margin-left: 20px;
}   
table.RadSplitter{
    border-left-width: 0px !important;
    width: 100% !important;
}
.DockRadPane{
    width: 100% !important;
}
/*div.RadTreeView .rtTop,
div.RadTreeView .rtMid,
div.RadTreeView .rtBot
{
    border-width: 0px 0px 1px;
    border-color: white;
    border-style: solid;    
}*/   

.rspPane.rspFirstItem.rspLastItem{
    border-right-width: 0px !important;
    border-bottom-width: 0px !important;
}
/* Nav-Search Side Panel*/
#formHome > .rcbSlide:has(#radComboBoxTreeSearch_DropDown) {
    margin-top: -30px;
    z-index: 10001 !important;
    background-color: transparent;
}

#formHome #radComboBoxTreeSearch_DropDown{
    background-color: #363e4b !important;
    color: white !important;
}
/* Nav-Search Home Panel*/
#formHome > .rcbSlide:has(#radComboBoxHomePanel_DropDown) {
    /*margin-top: -30px;*/
    z-index: 10001 !important;
    background-color: transparent;
}

#formHome #radComboBoxTreeSearch_DropDown{
    background-color: #363e4b !important;
    color: white !important;
}
.sidepanel .rtHover .rtIn,
.sidepanel .rtSelected .rtIn{
    background-image: none !important;
    background-color: white !important;
    border-color: black !important;
}

.sidepanel .rtUL {
    margin-bottom: 0px !important;
}

div:not(:has(.rtPlus)):not(:has(.rtMinus)) > .rtIn
{
    /*color: red !important;*/
}

.sidepanel .rtUL>.rtLI .rtLI.rtLast:not(.rtFirst) {
    border-width: 0px 0px 1px;
    border-color: white;
    border-style: solid;
}

.sidepanel div:has(> .rtPlus),
.sidepanel div:has(> .rtMinus) {
    border-width: 0px 0px 1px;
    border-color: white;
    border-style: solid;
}

.sidepanel .rtLast > .rtBot:has(.rtPlus) {
    margin-bottom: 2px;
}

.sidepanel  .rtLI.rtLast:has(.rtUL):has(.rtMinus) {
    padding-bottom: 2px;
}

.panelHeader {
    font-weight: bold;
    color: black;
    margin-left: 8px;
}

#plShow td + td {
    font-weight: normal;
}

/* Styling Home Panel Search */
#plShow td.rcbArrowCell.rcbArrowCellRight{
    display: none;
}

.homePanelSearch {
    margin-top: 5px;
    margin-bottom: 10px;
}

.RadComboBox_Office2010Blue.homePanelSearch .rcbInputCell {
    border-style: solid;
    border-width: 1px;
    border-color: #E7E7E7;
    border-radius: 5px;
    height: 30px;
}

.homePanelSearch .rcbInput {
    background: no-repeat 98% 50% url(images/suche-grau-16px.png);
    font-family: Calibri !important;
    font-size: 18px !important;
    font-weight: normal !important;
    margin-left: 8px !important;
}

.homePanelSearch > table {
    border-collapse: separate !important;
}

#radComboBoxHomePanel_DropDown {
    width: 765px !important;
    border-color: #E7E7E7;
}

.RadComboBoxDropDown .rcbHovered > .rcbImage,
.RadComboBoxDropDown .rcbItem > .rcbImage {
    margin: 0 4px 6px 0;
}

#ctl00_bodyPromMaster {
    background-color: var(--background-alt-color);
}

.clearSelection,
.clearSelection>input {
    background-image: none !important;
}

#clearSelectionHomePanel,
#clearSelectionHomePanel>input {
    color: var(--grey-dark) !important;
    position: absolute;
    right: 32px;
    top: 33px;
}

#clearSelectionSidePanel,
#clearSelectionSidePanel>input {
    color: white !important;
    position: absolute;
    right: 28px;
    top: 41px;
}

