/*
Autor: JK

Bereiche:
    1. Allgemein
    2. Sidebarmenu
    3. Toolbar
    4. Modaledialoge
    5. Grids
    6. Controls
    7. Controlarten
        7.1 Controls Kontextmenü
        7.2 Tree Controls
        7.3 Tree Controlarten
    8. Controlausnahmen
        8.1 Analyse
        8.2 03/Quickorder
        8.3 Login-Maske
        8.4 Dateivorschau
        8.5 Passwort Reset
    9. Temporär entfernt

Hinweis: Neue Klassen/Selektoren werden den Bereichen nach einsortiert und jede Klasse/Selektor wird mit einem Kommentar beschrieben.

*/

/*-----------------------------------------------------------------------------------1. Allgemein----------------------------------------------------------------------------------*/

/*Bestimmt die Größe des Body und des HTML Dokuments*/
html, body {
    height: 100%;
    margin: 0;
}

/*Bestimmt für alle Element der Anwendung die Schriftart und die Schriftgröße*/
* {
    font-family: Arial;
    font-size: 12px;
}

/*Entfernt für alle Element das Outline*/
*:focus{
    outline: none;
}

/*Klasse von dem Body im iFrame Workspaceframe*/
#BODYCONTENT {
    background-color: #f0f0f0;
}

/*Klasse von dem Body im iFrame menusFrame*/
#body {
    background-color: #ffffff;
}

/*Element wird allgemein für Überschriften genutzt*/
A {
    text-decoration: none;
    padding-left: 2px;
}

/*Klasse des Elements welches allgemein für Überschriften genutzt wird*/
.A {
    float: left;
    width: 99%;
    padding-right: 5px;
    margin-bottom: 10px;
    font-weight: 600;
}

/*Betrifft die A-Element innerhalb des Menubereiches, visited betrifft den Text "Passwort vergessen" auf der Login Maske*/
A:link, A:visited {
    text-decoration: none;
    color: #000;
}

/*Ausnahme für das Hilfefenster, welches über die Toolbar aufgerufen wird*/
.hlp_link:link, .hlp_link:visited {
    text-decoration: underline;
    color: #0000EE;
    font-weight: normal;
}
/*Zusatz Klasse für A-Überschriften, welche einen zusätzlichen Abstand erzeugt*/
.extra_ABSTAND {
    padding-left: 7px;
}

/*Bezieht sich auf jedes Table Element*/
TABLE {
    text-align: left;
    background-color: transparent;
}

/*Bestimmt die Schriftfarbe in der Toasternachricht*/
.ToasterMessage {
    color: #fff !important;
    margin-left: 37px;
}

/*Ausnahme für den Analyse-Bereich (07/editor), bestimmt die Breite der Form*/
.svs_filter_form {
    width: calc(100% - 1px);
}

/*Klasse vom dem Body des Html-Dokuments*/
.svs_body {
    overflow: hidden;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #f0f0f0;
}

/*Container welcher direkt nachdem Body folgt und den Struktur der Seite vorgibt*/
.svs_grid_container {
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: 75px calc(100% - 100px) 25px;
    grid-template-rows: 75px auto 25px;
    height: 100%;
    grid-template-areas: "header header" "navbar content" "footer footer";
    overflow: hidden;
    -ms-grid-columns: minmax(200px, 11%) minmax(500px, 89%);
    grid-template-columns: minmax(200px, 11%) minmax(500px, 89%);
}
/*Ausnahme fürs IPAD*/
@media only screen and (device-width: 768px) {
    .svs_grid_container {
        grid-template-rows: 75px calc(100% - 100px) 25px;
    }    
}

/*Ausnahme Pack-Anwendung, Container welcher die Reihen-Container der Scanplätze enthält*/
.svs_scanplatz_flexcontainer{
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: 25% 25% 25% 25%;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    height: 100%; 
    width: 100%; 
}

/*Ausnahme Pack-Anwendung, Reihencontainer für die einzelnen Scanplätze*/
.svs_scanplatz_container{
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 12.5%, 12.5%, 12.5%, 12.5%, 12.5%, 12.5%, 12.5%, 12.5%;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    height: 100%; 
    width: 100%; 
}

/*Ausnahme Pack-Anwendung, rechteckiger Scanplatz*/
.svs_scanplatz{
    background-color: white;
    margin: 5px;
    -moz-box-shadow: 1px 1px 10px #999 !important;
    -webkit-box-shadow: 1px 1px 10px #999 !important;
    box-shadow: 1px 1px 10px #999 !important;
    border-radius: 5px !important;
    border: 1px solid transparent !important;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
}

/*Ausnahme Pack-Anwendung, Blendet die Toolbarcontrols entsprechend aus*/
.svs_pickliste_form #TOOLBAR1_INFOBAR{
    display: none;
}

/*Ausnahme Pack-Anwendung, passt die Größe der Toolbarcontrols entsprechend an*/
.svs_pickliste_form #TOOLBAR1_TMAINGRID2{
    flex: 1;
}

/*Ausnahme Pack-Anwendung, entfernt die maximale Breite der Img-Buttons innerhalb der Toolbar*/
.svs_pickliste_form #TOOLBAR1_BUTTONFLOATER{
    max-width: unset !important;
}

/*Ausnahme Pack-Anwendung, Setzt die mindesthöhe der Scanplatz Anzeige*/
#V_SCANPLATZ{
    min-height: 30px !important;
}

/*Positioniert den Header innerhalb des Grid Containers*/
.svs_header {
    grid-area: header;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
}

/*Positioniert das Logo im Header*/
.svs_logo {
    position: absolute;
    top: 0;
    left: 0;
    margin: 10px;
}

/*Erstellt innerhalb des Headers den roten Balken*/
.svs_header_pic{
    height: 0px;
    border-left: 3000px solid white;
    border-bottom: 75px solid #E4032E;
}

/*Ausnahme für den IE11 Browser, Erstellt innerhalb des Headers den roten Balken*/
@media all and (-ms-high-contrast:none) {
    .svs_header_pic{
        border-left: 100vw solid white;
    }
}

/*Positioniert den Content-Bereich innerhalb des Grid Containers*/
.svs_content {
    grid-area: content;
    background-color: #f0f0f0;
    -ms-grid-row: 2;
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
}
/*Ausnahme fürs Ipad*/
@media only screen and (device-width: 768px) {
  .svs_content{
      overflow: auto;
      -webkit-overflow-scrolling: touch;
  }
}

/*Bestimmt die Bereiche innerhalb des Sidebarmenus*/
.svs_menu_container {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: minmax(200px, 1fr);
    grid-template-columns: minmax(200px, 1fr);
    -ms-grid-rows: calc(100% - 30px) 30px;
    grid-template-rows: auto 30px;
    grid-template-areas: "menu" "logout";
    height: calc(100vh - 17px);
    margin-top: -14px;
}
/*Ausnahme fürs Ipad*/
@media only screen and (device-width: 768px) {
    .svs_menu_container {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/*Positioniert den Footer innerhalb des Grid Containers*/
.svs_footer {
    width: 100%;
    background-color: white;
    grid-area: footer;
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*Bestimmt die maximale Breite des iFrames*/
iframe {
    max-width: 100%;
    max-height: 100%;
}
/*Ausnahme fürs IPAD*/
@media only screen and (device-width: 768px) {
    iframe#dialog1Frame{
        grid-area: test;
        border: none; 
        margin: 0; 
        padding: 0;
    }
}

/*Legt die Größe der Form des Content-Bereiches fest*/
.form {
    height: 100%;
    width: 100%;
}

/*Klassen für den Hilfe Dialog*/
.closeDiv{
    cursor: move; 
    color: #b3b3b3; 
    font-size: 20px; 
    grid-area: close; 
    display: grid; 
    grid-template-columns: auto 30px;
    grid-template-areas: "content close";
}

.previewFrame{
    width: calc(100% - 12px); 
    height: calc(100% - 12px); 
    padding: 5px; 
    grid-area: content; 
    border: none;
}

.closeDialogLink{
    cursor: pointer; 
    color: #b3b3b3 !important; 
    font-size: 20px; 
    grid-area: close; 
    margin-top: 5px;
}

.helpDiv{
    min-height: 200px; 
    min-width: 100px;
    grid-area: sidebar; 
    position: sticky; 
    left: 5px; top: 5px; 
    z-index: 99999; 
    background-color: #ffffff; 
    grid-template-rows: 30px auto; 
    grid-template-areas: "close" "content"; 
    display: grid; 
    border: 1px solid rgb(179, 179, 179); 
    grid-template-columns: auto; 
    resize: both; 
    overflow: auto;
}

/*-----------------------------------------------------------------------------------2. Sidebarmenu--------------------------------------------------------------------------------*/

/*Close-Button für das Sidebarmenu in der 100% Ansicht*/
.svs_close_sidebar {
    position: fixed;
    top: 1vh;
    right: 3vh;
    font-size: 13.5pt;
    color: red;
    cursor: pointer;
    display: none;
}

/*Positioniert das Sidebarmenu innerhalb des Grid Containers*/
.svs_sidebarmenu {
    background-color: white;
    grid-area: navbar;
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: 100%;
    grid-template-areas: "sidebar";
}

/*Platziert den Container für die Menupunkte*/
#SVSNETMENUDIV {
    grid-area: menu;
    -ms-grid-row: 1;
    overflow-y: auto;
    padding-top: 14px;
}

/*Bestimmt die Breite des Containers der Menuitems des Sidebarmenus*/
#dhxMainCont {
    width: 100% !important;
    height: 100% !important;
}

/*Positioniert den Logout-Button innerhalb des Sidebarmenus*/
.svs_logout_btn {
    grid-area: logout;
    -ms-grid-row: 2;
    text-align: center;
    cursor: pointer;
    margin-top: 5px;
    position: relative;
}

/*Bestimmt die Höhe der Form des Sidebarmenus*/
.svs_menu_form {
    height: 100%;
}

/*-----------------------------------------------------------------------------------3. Toolbar------------------------------------------------------------------------------------*/

/*Positioniert die Img-Buttons in der Toolbar*/
.toolbarIMG {
    margin: 10px 15px 10px 0px;
}

/*Button welcher das Sidemenu umschaltet*/
.svs_toolbar_button_toggle {
    top: 16px;
    right: 1vw;
    width: 44px;
    position: fixed;
    z-index: 99999;
    cursor: pointer;
    display: none;
}

/*Das Design des Buttons bzw. die drei Striche*/
.svs_toolbar_iconbar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
    background: red;
    margin-top: 4px;
}

/*Der Container welcher alle Controls in dieser Spalte der Toolbar umgibt (alt svs_TOOLBAR_WRAPone)*/
.svs_toolbar_container {
    height: 60px;
    padding-top: 20px;
}

/*Der Container für die 1. Spalte in der Toolbar*/
.svs_toolbar_container:nth-child(3n + 1) {
    flex: 0 0 30%;
    margin-left: 18px;
    overflow: hidden;
    padding-right: 3px;
}

/*Der Container für die 2. Spalte in der Toolbar*/
.svs_toolbar_container:nth-child(3n + 2) {
    flex: 1;
}

/*Der Container für die 3. Spalte in der Toolbar*/
.svs_toolbar_container:nth-child(3n + 3) {
    flex: 0 0 23%;
    margin-right: 18px;
}

/*Ausnahme für Masken ohne Eingabe für Artikel/Kundenummer und der Info-Controls und für große und kleine Modaledialoge, Für die dritte Spalte der Container welcher alle Controls in dieser Spalte der Toolbar umgibt (alt svs_TOOLBAR_WRAPone) für die Img-Buttons*/
#MAININPUTGRID .svs_toolbar_container:only-of-type {
    width: 100%;
    flex: unset;
    margin-left: unset;
}

/*Ausnahme für den IE11 Browser, Ausnahme für Masken ohne Eingabe für Artikel/Kundenummer und der Info-Controls und für große und kleine Modaledialoge, Für die dritte Spalte der Container welcher alle Controls in dieser Spalte der Toolbar umgibt (alt svs_TOOLBAR_WRAPone) für die Img-Buttons*/
@media all and (-ms-high-contrast:none) {
    #MAININPUTGRID .svs_toolbar_container:only-of-type {
        flex: inherit;
        margin-left: inherit;
    }
}

/*Dynamische Klasse wird durch die Funktion svs_toolbar_line hinzugefügt, bestimmt die Position des Toolbar Striches unterhalb der Controls, für Masken mit + Eingabefeld + Infofelder + Tabreiter, z.B. 01/0101*/
.svs_toolbar_line {
    padding-top: 80px;
    border-bottom: 1px solid grey;
    background-image: none !important;
}

/*Dynamische Klasse wird durch die Funktion svs_toolbar_line hinzugefügt, bestimmt die Position des Toolbar Striches unterhalb der Controls, für Masken mit + Eingabefeld + Infofelder - Tabreiter, z.B. 01/0601*/
.svs_toolbar_line_notab {
    padding-top: 113px;
    border-bottom: 1px solid grey;
    background-image: none !important;
}

/*Dynamische Klasse wird durch die Funktion svs_toolbar_line hinzugefügt, bestimmt die Position des Toolbar Striches unterhalb der Controls, für Masken mit - Eingabefeld - Infofelder - Tabreiter, z.B. 08/16*/
.svs_toolbar_line_nothing {
    padding-top: 116px;
    border-bottom: 1px solid grey;
    background-image: none !important;
}

/*Container welcher das Input-Control für die Informations-Anzeige in der Toolbar umgibt (alt svs_TOOLBAR_BUTTON_INSIDE_SONCENT_KONTROLprocent )*/
.svs_toolbar_input_container_info {
    width: 80%;
    height: 25px;
    margin: auto;
}

/*Container welcher das Input-Control für die Img-Buttons in der Toolbar umgibt (alt svs_TOOLBAR_BUTTON_INSIDE_SONCENT_KONTROLprocent)*/
.svs_toolbar_input_container_img {
    width: auto;
    height: auto;
}

/*Container welcher das Label in der Toolbar umgibt (alt svs_TOOLBAR_LABELpx)*/
.svs_toolbar_label_container {
    width: 30%;
    height: 18px;
    float: left;
    padding-left: 0.3%;
}

/*Container welcher das Input-Control in der Toolbar umgibt (alt svs_TOOLBAR_KONTROLprocent)*/
.svs_toolbar_input_container {
    width: 65.8%;
    height: 25px;
    float: right;
}

/*Ausnahme für den IE11 Browser, Container welcher das Input-Control in der Toolbar umgibt (alt svs_TOOLBAR_KONTROLprocent)*/
@media all and (-ms-high-contrast:none) {
    .svs_toolbar_input_container {
        padding-top: 1px;
    }
}

/*Flexbox für die gesamte Toolbar*/
.svs_toolbar {
    overflow: visible;
    margin-bottom: 2px;
    background: #f0f0f0;
    top: 0px;
    z-index: 940;
    visibility: hidden;
    position: fixed;
    width: 100vw;
}

/*Bereich hinter der Toolbar, damit diese durch die Positionierung fixed nicht den Inhalt überdeckt*/
.svs_toolbar_background {
    height: 120px;
    width: 98%;
    min-width: 660px;
    float: left;
    padding-right: 2%;
    position: relative;
    background: #f0f0f0;
}

/*Ausnahme für Modaledialoge, Bereich hinter der Toolbar, damit diese durch die Positionierung fixed nicht den Inhalt überdeckt*/
form.svs_modaldialog div.svs_toolbar_background {
    height: 90px;
}

/*Ausnahme für den Modalendialog der Medienbibliothek, Bereich hinter der Toolbar, damit diese durch die Positionierung fixed nicht den Inhalt überdeckt*/
form.svs_medienbib div.svs_toolbar_background {
    height: 0px;
}

/*Ausnahme für Modaledialoge, Toggle Button des Sidebarmenus*/
form.svs_modaldialog #TOOLBAR1_CMDTOGGLEMENU {
    display: none !important;
}

/*Ausnahme für den Dialog der Medienbibliothek, Toggle Buttons des Sidebarmenus*/
form.svs_medienbib #TOOLBAR1_CMDTOGGLEMENU {
    display: none !important;
}

/*Flexbox Container, umgibt alle Controls und ordnet diese an in der Toolbar*/
.svs_toolbar_flex_container {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    left: -0.08%;
    justify-content: space-evenly;
    position: relative;
    height: 0px;
}

/*Ausnahme für den Microsoft Edge Browser, Flexbox Container, umgibt alle Controls und ordnet diese an in der Toolbar*/
@supports (-ms-ime-align:auto) {
    .svs_toolbar_flex_container {
        justify-content: space-around;
    }
}

/*Ausnahme für den Internet Explorer Browser, Flexbox Container, umgibt alle Controls und ordnet diese an in der Toolbar*/
@media screen\0 {
    .svs_toolbar_flex_container {
        justify-content: space-around;
    }
}

/*Flexbox Container, umgibt alle Img-Buttons in der Toolbar und ordnet diese an*/
.svs_img_btn_flex_container {
    display: flex;
    flex-flow: row-reverse wrap;
    justify-content: flex-start;
    padding-right: 3.4%;
}

/*Ausnahme für Masken mit allen Controls in der Toolbar, Flexbox Container, umgibt alle Img-Buttons in der Toolbar und ordnet diese an*/
#TOOLBAR1_TMAINGRID2 + #TOOLBAR1_INFOBAR + #TOOLBAR1_BUTTONFLOATER div.svs_img_btn_flex_container {
    padding-right: 0;
}

/*Ausnahme für Modaledialoge, Flexbox Container, umgibt alle Img-Buttons in der Toolbar und ordnet diese an*/
.form.svs_modaldialog div.svs_img_btn_flex_container {
    padding-right: 0;
}

/*Ordnet den Img-Button zum Schließen in der Toolbar an*/
#TOOLBAR1_CMDCANCELCLOSE {
    order: -2;
}

/*Ordnet den Img-Button für das Kontextmenü in der Toolbar an*/
#TOOLBAR1_CMDTOGGLECONTEXT{
    order: -2;
}

/*Ordnet den Img-Button zum Löschen in der Toolbar an*/
#TOOLBAR1_CMDDELETE{
    order: -1;
}

/*Start Progress-Circle Start*/

.set-size {
    font-size: 10em;
}

.charts-container:after {
    clear: both;
    content: '';
    display: table;
}

.pie-wrapper {
    height: 23px;
    width: 23px;
    float: left;
    margin: 10px 15px 10px 0px;
    position: relative;
    cursor: pointer;
}

.pie-wrapper:nth-child(3n + 1) {
    clear: both;
}

.pie-wrapper .pie {
    height: 100%;
    width: 100%;
    clip: rect(0, 1em, 1em, 0.5em);
    left: 0;
    position: absolute;
    top: 0;
}

.pie-wrapper .pie .half-circle {
    height: 100%;
    width: 100%;
    border: 0.1em solid #3498db;
    border-radius: 50%;
    clip: rect(0, 0.5em, 1em, 0);
    left: 0;
    position: absolute;
    top: 0;
}

.pie-wrapper .label {
    background: #f0f0f0;
    border-radius: 50%;
    bottom: 0.4em;
    color: #ecf0f1;
    cursor: default;
    display: block;
    font-size: 0.25em;
    left: 0.4em;
    line-height: 2.8em;
    position: absolute;
    right: 0.4em;
    text-align: center;
    top: 0.4em;
}

.pie-wrapper .label .smaller {
    color: #bdc3c7;
    font-size: .45em;
    padding-bottom: 20px;
    vertical-align: super;
}

.pie-wrapper .shadow {
    height: 100%;
    width: 100%;
    border: 0.1em solid #bdc3c7;
    border-radius: 50%;
}

.pie-wrapper.style-2 .label {
    background: none;
    color: #7f8c8d;
}

.pie-wrapper.style-2 .label .smaller {
    color: #bdc3c7;
}

.pie-wrapper--solid {
    border-radius: 50%;
    overflow: hidden;
    border:1px solid rgb(179, 179, 179);
    border-width: 1px !important;
}

.pie-wrapper--solid:before {
    border-radius: 0 100% 100% 0 / 50%;
    content: '';
    display: block;
    height: 100%;
    margin-left: 50%;
    -webkit-transform-origin: left;
            transform-origin: left;
}

.pie-wrapper--solid .label {
    background: transparent;
}

/*Spezifische Klassen für die jeweilige Prozentangabe*/

.pie-wrapper--solid[data-tooltip="0"] {
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #e4032e), color-stop(0%, #f0f0f0));
    background: linear-gradient(to right, #e4032e 0%, #f0f0f0 0%);
}

.pie-wrapper--solid[data-tooltip="10"], .pie-wrapper--solid[data-tooltip="20"], .pie-wrapper--solid[data-tooltip="25"], .pie-wrapper--solid[data-tooltip="30"], .pie-wrapper--solid[data-tooltip="40"]{
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, #f0f0f0), color-stop(50%, #e4032e));
    background: linear-gradient(to right, #f0f0f0 50%, #e4032e 50%);
}

.pie-wrapper--solid[data-tooltip="10"]:before {
    background: #f0f0f0;
    -webkit-transform: rotate(-324deg);
            transform: rotate(-324deg);
}

.pie-wrapper--solid[data-tooltip="20"]:before {
    background: #f0f0f0;
    -webkit-transform: rotate(-288deg);
            transform: rotate(-288deg);
}

.pie-wrapper--solid[data-tooltip="25"]:before {
    background: #f0f0f0;
    -webkit-transform: rotate(-270deg);
            transform: rotate(-270deg);
}

.pie-wrapper--solid[data-tooltip="30"]:before {
    background: #f0f0f0;
    -webkit-transform: rotate(-252deg);
            transform: rotate(-250deg);
}

.pie-wrapper--solid[data-tooltip="40"]:before {
    background: #f0f0f0;
    -webkit-transform: rotate(-216deg);
            transform: rotate(-216deg);
}

.pie-wrapper--solid[data-tooltip="50"], .pie-wrapper--solid[data-tooltip="60"], .pie-wrapper--solid[data-tooltip="70"]{
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, #f0f0f0), color-stop(50%, #e4032e));
    background: linear-gradient(to right, #f0f0f0 50%, #e4032e 50%);
}

.pie-wrapper--solid[data-tooltip="50"]:before {
    background: #e4032e;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
}

.pie-wrapper--solid[data-tooltip="60"]:before {
    background: #e4032e;
    -webkit-transform: rotate(36deg);
            transform: rotate(36deg);
}

.pie-wrapper--solid[data-tooltip="70"]:before {
    background: #e4032e;
    -webkit-transform: rotate(72deg);
            transform: rotate(72deg);
}

.pie-wrapper--solid[data-tooltip="75"]:before {
    background: #f3e03b;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
}

.pie-wrapper--solid[data-tooltip="80"]:before {
    background: #f3e03b;
    -webkit-transform: rotate(108deg);
            transform: rotate(108deg);
}

.pie-wrapper--solid[data-tooltip="90"]:before {
    background: #f3e03b;
    -webkit-transform: rotate(144deg);
            transform: rotate(144deg);
}

.pie-wrapper--solid[data-tooltip="75"], .pie-wrapper--solid[data-tooltip="80"], .pie-wrapper--solid[data-tooltip="90"]{
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, #f0f0f0), color-stop(50%, #f3e03b));
    background: linear-gradient(to right, #f0f0f0 50%, #f3e03b 50%);
}

.pie-wrapper--solid[data-tooltip="100"]{
    background: -webkit-gradient(linear, left top, right top, color-stop(100%, #008000), color-stop(100%, #f0f0f0));
    background: linear-gradient(to right, #008000 100%, #f0f0f0 100%);
}

/*End Progress-Circle End*/

/*-----------------------------------------------------------------------------------4. ModaleDialoge------------------------------------------------------------------------------*/

/*Übergeordnetes Div von Modalendialogen*/
#MODALDIALOG {
    position: absolute;
    box-sizing: border-box;
    touch-action: none;
    opacity: 1;
    resize: both;
    overflow: hidden;
    z-index: 950;
    top: 0px;
}
.ModalLeftOverwrite {
    margin-left: 0px !important;
}
/*Vergibt die Größe für Modaledialoge mit Width & Height auf Auto*/
#MODALDIALOG.svs_div_modaldialog {
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    margin: 10px !important;     
}

/*Ausnahme wird zum Initialisieren der Dialoge benötigt, Übergeordnetes Div von Modalendialogen*/
#MODALDIALOG.init {
    left: unset !important; 
}

/*Ausnahme wird zum Initialisieren der Dialoge benötigt, Übergeordnetes Div von Modalendialogen*/
#MODALDIALOG.init2 {
    left: 0px !important; 
    top: 0px !important; 
}

/*Ausnahme für den IE11 Browser, Ausnahme wird zum Initialisieren der Dialoge benötigt, Übergeordnetes Div von Modalendialogen*/
@media all and (-ms-high-contrast:none) {
    #MODALDIALOG.init {
        left: auto !important;
    }
    #MODALDIALOG.svs_div_modaldialog {
        left: auto !important;
    }
}

/*Ausnahme wird benötigt um den Modalendialog responsive zu machen, eine Ebene unter dem Div des Modalendialogs und dort das letzte Div*/
#MODALDIALOG > div:last-of-type {
    height: calc(100% - 23px) !important;
    width: 100% !important;
    overflow: hidden !important;
    max-height: 99%;
}
/*Ausnahme fürs IPAD*/
@media only screen and (device-width: 768px) {
    #MODALDIALOG > div:last-of-type {
        overflow: auto !important;
        -webkit-overflow-scrolling: touch;
    }
}

/*Ausnahme wird benötigt um den Modalendialog responsive zu machen, eine Ebene unter dem Div zuvor und dort auf die Form bezogen*/
#MODALDIALOG > div:last-of-type > form {
    height: 100%;
    width: 100%;
}

/*Ausnahme fürs IPAD*/
@media only screen and (device-width: 768px) {
    #MODALDIALOG > div:last-of-type > form {
        overflow:hidden;
    }
}


/*Ausnahme wird benötigt um den Modalendialog responsive zu machen, eine Ebene unter dem Div zuvor und eine weitere Ebene tiefer und dort das letzte Div*/
#MODALDIALOG > div:last-of-type > form > div:last-of-type {
    height: 100%;
    width: 100%;
}

/*Ausnahme fürs IPAD*/
@media only screen and (device-width: 768px) {
    #MODALDIALOG > div:last-of-type > form > div:last-of-type {
        height: 100%;
        width: 100%;
    }
}

/*Klasse für das iFrame des Modalendialogs nachdem Initialisieren des Dialogs, kommt aus der Funktion svs_modal_init*/
.svs_resize {
    height: calc(100% - 0px) !important;
    width: 100% !important;
}

/*Wird mit Div des Modalendialogs hinzugefügt während des Resizings, kommt aus der Funktion svs_modal_opened*/
.svs_modal_resize{
    height: calc(100% - 20px) !important;
    width: calc(100% - 20px) !important;    
}

/*Wird mit Div des Modalendialogs hinzugefügt wenn sich dieses Div innerhalb eines Dialogs befindet damit der innere seine Größe nicht verändert*/
.svs_modal_noresize{
    resize: none !important;
}

/*Container welcher das Input-Control umgibt, für Movearrows (z.B. auf 20/020101 zu finden)*/
.svs_input_container_img {
    width: auto;
    min-width: 15px;
    float: left;
    margin-left: 0em;
}

/*Ausnahme für Mandanten Haufe, Maske 03/2002, Hintergrund des Modalendialogs*/
.SVS_modal {
    display: none; 
    position: fixed; 
    z-index: 999;
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgba(0,0,0,0.4); 
}

/*Ausnahme für Mandanten Haufe, Maske 03/2002, der eigentliche Modaledialog*/
.SVS_modal-content {
    background-color: #fefefe;
    margin: 15% auto; 
    padding: 20px;
    font-size: 20pt;
    border: 1px solid #888;
    width: 40%; 
}

/*Ausnahme für Mandanten Haufe, Maske 03/2002, X zum Schließen des Modalendialogs*/
.SVS_modalclose {
    color: #aaa;
    float: right;
    font-size: 20pt;
    font-weight: bold;
}

/*Ausnahme für Mandanten Haufe, Maske 03/2002, X zum Schließen des Modalendialogs*/
.SVS_modalclose:hover,
.SVS_modalclose:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/*-----------------------------------------------------------------------------------5. Grids--------------------------------------------------------------------------------------*/

/*Innerer Container der Grids*/
.svs_GRIDSTYLE {
    width: 100% !important;
    height: 100% !important;
}

.svs_GRIDSTYLE.svs_pickliste {
    height: calc(100% - 35px) !important;
}

/*Ausnahme für den disabled Zustand der Grid-Filter*/
.svs_GRIDSTYLE input:disabled{
    background-color: rgb(211, 211, 211) !important;
}

/*Ausnahme für den disabled Zustand des Containers für den Inhalt des Grids ohne Filter*/
.svs_GRIDSTYLE.svs_disabled .objbox{
    background-color: rgb(211, 211, 211) !important;
}

/*Ausnahme für den disabled Zustand des Containers für den Inhalt des Grids ohne Filter, verhindert das z.B. auf den Masken 01/0102-0103 Inhalte des Grids sichtbar sind im disabled Zustand*/
.svs_GRIDSTYLE.svs_disabled .objbox *{
    visibility: hidden;
}

/*Ausnahme für den disabled Zustand des Containers für den Inhalt des Grids ohne Filter*/
.svs_GRIDSTYLE .objbox.svs_disabled{
    background-color: rgb(211, 211, 211) !important;
}

/*Ausnahme für den disabled Zustand des Containers für den Inhalt des Grids ohne Filter, verhindert das z.B. auf den Masken 01/0102-0103 Inhalte des Grids sichtbar sind im disabled Zustand*/
.svs_GRIDSTYLE .objbox.svs_disabled *{
    visibility: hidden;
}

/*Ausnahme für den disabled Zustand des Containers für den Inhalt des Grids ohne Filter*/
.svs_GRIDSTYLE .objbox.svs_disabled_single{
    background-color: rgb(211, 211, 211) !important;
}

/*Ausnahme für den disabled Zustand des Containers für den Inhalt des Grids ohne Filter, verhindert das z.B. auf den Masken 01/0102-0103 Inhalte des Grids sichtbar sind im disabled Zustand*/
.svs_GRIDSTYLE .objbox.svs_disabled_single *{
    visibility: hidden;
}

/*Tabelle innerhalb des Grids unter der Klasse svs_gridstyle angeordnet*/
.hdr {
    width: 100% !important;
    padding-right: 0px !important;
    margin-right: 0px !important;
}

/*Container welcher ein einspaltiges Grid umgibt (alt one-third-screen-container)*/
.svs_grid_container_1 {
    width: calc(100% / 3 - 23px);
    height: 100%;
    min-height: 150px;
    position: relative;
}

/*Ausnahme für Container die in einem Container sind (z.B. 01/0101), Container welcher ein einspaltiges Grid umgibt (alt one-third-screen-container)*/
.svs_grid_container_1 div.svs_grid_container_1 {
    width: 100% !important;
}

/*Ausnahme für einspaltige Container die in einem zwei spaltigen Container sind (z.B. 06/0403), Container welcher ein einspaltiges Grid umgibt (alt one-third-screen-container)*/
div.svs_grid_container_2 div.svs_grid_container_1 {
    width: 49.158% !important;
}

/*Ausnahme für Modaledialoge, Container welcher ein einspaltiges Grid umgibt (alt one-third-screen-container)*/
form.svs_modaldialog div.svs_flex_container div.svs_grid_container_1 {
    width: calc(100% / 3 - 23px);
}

/*Ausnahme für den Firefox Browser und die Maske 01/0101, bestimmt die Größe des Grids im Container*/
@-moz-document url-prefix() {
    div.svs_grid_container_1 a.A + iframe#PREVIEW + div.svs_grid_container_1 a.A + div.svs_GRIDSTYLE {
        height: calc(100% - 2px) !important;
    }
}

/*Container welcher ein zweispaltiges Grid umgibt (alt WRAPnull-extra-breit)*/
.svs_grid_container_2 {
    width: calc(100% / 1.5 - 28px);
    height: 100%;
    min-height: 150px;
    margin-bottom: 12px;
    position: relative;
}

/*Ausnahme für einspaltige Container welche sich in einem zweispaltigen Container befinden (z.B. 06/0403), Container welcher ein zweispaltiges Grid umgibt (alt WRAPnull-extra-breit)*/
div.svs_container + div.svs_grid_container_1 + div.svs_grid_container_2 {
    display: flex;
    justify-content: space-between;
    flex-flow: row wrap;
}

/*Ausnahme für einspaltige Container welche sich in einem zweispaltigen Container befinden (z.B. 06/0403), Container welcher ein zweispaltiges Grid umgibt (alt WRAPnull-extra-breit)*/
div.svs_flex_container > a.A + div.svs_grid_container_1 + div.svs_grid_container_2:last-of-type {
    margin-bottom: 0px;
}

/*Container welcher die Breite der dreispaltigen Grids bestimmt(alt x-achse-vollbild-grid-container-fur-akkordion)*/
.svs_grid_container_3 {
    width: calc(100% - 34px);
    height: 100%;
    min-height: 150px;
    margin-bottom: 12px;
    position: relative;
}

/*Ausnahme für den IE11 Browser, Container welcher die Breite der dreispaltigen Grids bestimmt(alt x-achse-vollbild-grid-container-fur-akkordion)*/
@media all and (-ms-high-contrast:none) {
    .svs_grid_container_3 {
        width: 98.7%;
    }
}

/*Ausnahme für den Analyse-Bereich (z.B. 07/result) um die Möglichkeit der Quickfilter Darstellung miteinzubeziehen, Container welcher die Breite der dreispaltigen Grids bestimmt(alt x-achse-vollbild-grid-container-fur-akkordion)*/
div.A + div.svs_quick_flex_container + div.svs_grid_container_3 {
    height: calc(100% - 77px) !important;
}

/*Ausnahme für Masken auf denen nur ein Grid vorhanden ist, Container welcher die Breite der dreispaltigen Grids bestimmt(alt x-achse-vollbild-grid-container-fur-akkordion)*/
div.svs_flex_container.svs_grid_height > div.svs_grid_container_3 {
    height: calc(100% - 13px);
}

/*Ausnahme für den Analyse-Bereich (z.B. 07/schedule) um die Möglichkeit der Darstellung mit dem Control über dem Grid, Container welcher die Breite der dreispaltigen Grids bestimmt(alt x-achse-vollbild-grid-container-fur-akkordion)*/
form.svs_modaldialog div#SVS_SCHEDULE + div.svs_grid_container_3 {
    height: calc(100% - 49px) !important;
}

/*Ausnahme für den Analyse-Bereich (07/settings), bestimmt die Breite für den Grid Container*/
div.svs_grid_container_3 div.svs_grid_container_1 {
    width: 48% !important;
}

/*Ausnahme für den Analyse-Bereich (07/settings), bestimmt die Höhe des Grids*/
div.svs_grid_container_3 div.svs_grid_container_1 div.svs_GRIDSTYLE {
    height: 80% !important;
}

/*Ausnahme für den Analyse-Bereich (07/editor), bestimmt die Größe des rechten Grids in Abhängigkeit mit der Existenz des divs mit den Filter-Controls*/
div.filter + div#GRIDANALYSE {
    height: calc(80.1% - 53px) !important;
}

/*Ausnahme für den Analyse-Bereich (07/editor), bestimmt die Größe des rechten Grids für die Darstellung ohne Filter-Controls über dem Grid*/
div#GRIDANALYSE {
    height: 80.1%;
}

/*Abstand zum Toolbarstrich für Masken auf denen direkt nach der Flexbox ein dreispaltiges Grid kommt ohne Überschrift(z.B. 01/1001)*/
.svs_grid_gap {
    top: 14px;
}

/*Bestimmt die Höhe von dreispaltigen Grids auf Masken und in Modalendialogen mit den Größen 800x500 oder autoxauto auf denen sich keine weiteren Controls befinden (z.B. 01/0104 zu finden)*/
.svs_grid_height {
    height: calc(100% - 143px);
    position: relative;
    top: 1.8%;
}

/*Ausnahme für den IE11 Browser, Bestimmt die Höhe von dreispaltigen Grids auf Masken und in Modalendialogen mit den Größen 800x500 oder autoxauto auf denen sich keine weiteren Controls befinden (z.B. 01/0104 zu finden)*/
@media all and (-ms-high-contrast:none) {
    .svs_grid_height {
        height: calc(100% - 138px);
    }
}

/*Ausnahme für Modaledialoge Größe 800x500, Bestimmt die Höhe von dreispaltigen Grids auf Masken und in Modalendialogen mit den Größen 800x500 oder autoxauto auf denen sich keine weiteren Controls befinden (z.B. 01/0104 zu finden)*/
.form.svs_modaldialog div.svs_grid_height {
    height: calc(100% - 100px);
    top: 8px;
    min-height: 0px;
}
/*Ausnahme für Masken wie z.B. 010105 mit Suche Grid welches ausgeblendet werden kann*/
#SUCHE[style*="display:block"] + div.svs_grid_height {
    height: calc(100% - 164px);
    position: relative;
    top: 0%;
}
/*Bestimmt die Größe der Grid-Filter*/
div.gridbox td.filter input, div.gridbox td.filter select {
    width: 100% !important;
    height: 20px;
    box-sizing: border-box;
    padding-left: 4px;
}

/*Klasse der Tabelle der Einträge des Kontextmenüs der Grids, bezüglich der Begrenzung der Einträge und die Auswahl der Grid-Seite*/
.buttons_cont {
    width: 100%;
}

tr.lvziel > td {
    color: blue !important;
    font-weight: bold !important;
}
tr.lvquelle > td {
    color: green !important;
    font-weight: bold !important;
}
tr.rowsbold > td {
    font-weight: bold !important;
}
/*-----------------------------------------------------------------------------------6. Controls-----------------------------------------------------------------------------------*/

/*Ausnahme für Controls mit den Klassen svs_WEBTEXTEDIT_extra, svs_WEBTEXTEDIT_search, svs_WEBDATE_ABSTAND und für Quickfilter mit dem dotnettype WEBDATECHOOSER*/
.svs_outline_ctrl {
    outline: none !important;
    box-shadow: 0px 0px 5px #e4032e !important;
}

/*Ausnahme für die Gridfilter, hier wird der Hintergrund des Controls farblich angepasst*/
div.svs_GRIDSTYLE .svs_outline_ctrl {
    box-shadow: none !important;
    background-color: rgba(255, 209, 210, 0.3) !important;
}

/*Rahmen der Grid-Filter*/
td.filter > input {
    border: 1px solid rgb(179, 179, 179);
}

/*Für alle Controls die Eigenschaften beim Fokusieren*/
input:focus, textarea:focus, select:focus, button:focus {
    outline: none;
    box-shadow: 0px 0px 5px #e4032e;
}

/*Für alle Controls welche disabled oder auf readOnly gesetzt wurden die Eigenschaften beim Fokusieren

  DP 16.12.2021: Änderung von input:read-only:focus zu input[readonly]:focus, 
                 weil im Admin Panel die inputs trotz nicht vorhandener readonly Eigenschaft
                 diesen Style bekommen haben.
*/
input[readonly]:focus, textarea:read-only:focus, select:disabled:focus, button:disabled:focus {
    box-shadow: none;
}

/*Für alle Grid-filter die Eigenschaften beim Fokusieren*/
td.filter > input:focus, td.filter > textarea:focus, td.filter > select:focus, td.filter > button:focus {
    outline: none !important;
    border: 1px solid rgb(179, 179, 179);
    box-shadow: none;
}

/*Für alle Dropdown-Grid-Filter entfernt die alle Eigenschaften beim Fokusieren*/
td.filter > div > div.dhx_combo_box > input:focus, input.dhx_combo_input:focus {
    outline: none;
    box-shadow: none;
}

/*Ausnahme für den Firefox-Browser entfernt Browsereigene Styles*/
select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000;
}

/*Ausnahme für den Firefox-Browser entfernt Browsereigene Styles*/
input[type="submit"]::-moz-focus-inner {
    border: 0;
}

/*Ausnahme für den Firefox-Browser entfernt Browsereigene Styles*/
input[type="button"]::-moz-focus-inner {
    border: 0;
}

/*Hintergrundfarbe für disabled DropdownControls*/
select:disabled {
    background-color: rgb(211, 211, 211);
}

/*Bestimmt die Darstellung von Input Controls des Typen Submit und Button*/
input[type="submit"]:disabled, input[type="button"]:disabled {
    color: graytext;
}

/*Betrifft den Button der Quickfilter*/
input.btn {
    border: 1px solid silver;
    background-color: #F5F5F5;
    margin-top: 14px !important;
}

/*Ausnahme für den Firefox Browser, Betrifft den Button der Quickfilter*/
@-moz-document url-prefix() {
    input.btn {
        transform: translateY(1px);
    }
}

/*Container der Quickfilter Controls*/
.QuickFilter {
    margin: -2px 5px 0px 0px;
}

/*Farbe des makierten Texts in Controls*/
::selection {
    background-color: #ffd1d2;
    color: #000;
}

/*Container welcher den Label und Input Container umgibt (alt WRAPNULL)*/
.svs_container {
    width: calc(100% / 3 - 23px);
    height: 25px;
}

/*Ausnahme für Container die in einem Container sind (z.B. 01/0215), Container welcher den Label und Input Container umgibt (alt WRAPNULL)*/
.svs_container div.svs_container {
    width: 100% !important;
}

/*Ausnahme für Modaledialoge, wird zu Dialoge mit einspaltigen Controls genutzt, dafür muss ein svs_container die anderen umschließen*/
form.svs_modaldialog div.svs_flex_container div.svs_container:only-of-type {
    width: calc(100% - 34px);
}

/*Ausnahme für den Analyse-Bereich (07/editor), Container welcher den Label und Input Container umgibt (alt WRAPNULL)*/
div.filter div div.svs_flex_container div.svs_container {
    width: calc(100% / 3 - 5px) !important;
}

/*Ausnahme für den Analyse-Bereich (07/settings) Controls unterhalb des linken Grids, Container welcher den Label und Input Container umgibt (alt WRAPNULL)*/
div.svs_filter_container div.svs_container {
    width: 100% !important;
}

/*Container als Platzhalter fungiert, um z.B. zweispaltigen Inhalt darzustellen*/
.svs_placeholder {
    width: calc(100% / 3 - 23px);
    height: 25px;
}

/*Flexbox Container, umgibt alle Controls und ordnet diese an*/
.svs_flex_container {
    display: flex;
    width: 100%;
    left: -0.05%;
    justify-content: space-evenly;
    position: relative;
    flex-flow: row wrap;
}

/*Ausnahme für den IE11 Browser, Flexbox Container, umgibt alle Controls und ordnet diese an*/
@media all and (-ms-high-contrast:none) {
    .svs_flex_container {
        justify-content: space-around;
    }
}

/*Ausnahme für den Microsoft Edge Browser, Flexbox Container, umgibt alle Controls und ordnet diese an*/
@supports (-ms-ime-align:auto) {
    .svs_flex_container {
        justify-content: space-around;
    }
}

/*Ausnahme für den Firefox Browser, Flexbox Container, umgibt alle Controls und ordnet diese an*/
@-moz-document url-prefix() {
    .svs_flex_container {
        left: -0.055%;
    }
}

/*Ausnahme für die Startseite, Flexbox Container, umgibt alle Controls und ordnet diese an*/
div.containerForFlexboxes div.svs_flex_container {
    background: #f0f0f0;
    justify-content: flex-start;
}

/*Ausnahme für den Modalendialog filteringSelectDialog, Flexbox Container, umgibt alle Controls und ordnet diese an*/
form.svs_modaldialog div.svs_container + a.A + div.svs_flex_container {
    justify-content: space-between;
    width: 95%;
}

/*Ausnahme für das Sidebarmenu, Flexbox Container, umgibt alle Controls und ordnet diese an*/
#KEEPALIVE + div.svs_flex_container {
    justify-content: unset;
    flex-flow: column;
    left: unset;
}

/*Ausnahme für das Sidebarmenu, Flexbox Container, umgibt alle Controls und ordnet diese an*/
@media all and (-ms-high-contrast:none) {
    #KEEPALIVE + div.svs_flex_container {
        justify-content: inherit;
        left: inherit;
    }
}

/*Ausnahme für den Analyse-Bereich (07/editor), Container welcher die svs_container umgibt und diese anordnet*/
div.filter div div.svs_flex_container {
    justify-content: space-between;
}

/*Container welcher das Label der Input-Controls umgibt (alt LabelPX)*/
.svs_label_container {
    overflow: hidden;
    white-space: nowrap;
    width: 30%;
    height: 18px;
    float: left;
    padding-left: 0.3%;
}

/*Ausnahme für Grids, färbt im disabled Zustand den Hintergrund des Bildes zum Aufklappen*/
.dhx_combo_input:disabled ~ img{
    background-color: rgb(211, 211, 211) !important;
}

/*Ausnahme für das Editorobj, Container welcher das Label der Input-Controls umgibt (alt LabelPX)*/
.svs_grid_container_3 div.svs_label_container {
    width: 100%;
    /*JK, sollte die Höhe hier angepasst werden, bitte bei der Klasse svs_editorobj die kalkulierte Höhe angegleichen*/
    height: 20px;
    float: none;
    padding-left: 0%;
}

/*Ausnahme für den Analyse-Bereich (07/editor), Container welcher das Label der Input-Controls umgibt (alt LabelPX)*/
div.filter div div.svs_flex_container div.svs_container div.svs_label_container {
    width: 34%;
}

/*Ausnahme für den Analyse-Bereich (07/settings) Controls unterhalb des linken Grids, Container welcher das Label der Input-Controls umgibt (alt LabelPX)*/
div.svs_filter_container div.svs_container div.svs_label_container {
    width: 30%;
    height: 18px;
    float: left;
    padding-left: 0.3%;
}

/*Ausnahme für zweispaltige Textarea-Felder z.B. 25/0102, Container welcher das Label der Input-Controls umgibt (alt LabelPX)*/
div.svs_grid_container_2 > div.svs_label_container {
    width: 10%;
}

/*Container für zweispaltige Textarea-Felder*/
.textarea_container_2 {
    margin-bottom: 0px;
    min-height: 0px;
    width: calc(100% / 1.5 - 28px) !important;
    height: 63px !important;
}

/*Ausnahme für zweispaltige Textarea-Felder, angepasste Breite für den Label-Container*/
.textarea_container_2 > .svs_label_container {
    width: 10% !important;
}

/*Ausnahme für zweispaltige Textarea-Felder, angepasste Breite für den Input-Container*/
.textarea_container_2 > .svs_input_container {
    width: 83% !important;
}

/*Container welcher das Input-Control umgibt (alt KONTROLprocent)*/
.svs_input_container {
    width: 65.5%;
    height: 22px;
    float: right;
}

/*Ausnahme für zweispaltige Textarea-Felder z.B. 25/0102, Container welcher das Input-Control umgibt (alt KONTROLprocent)*/
div.svs_grid_container_2 > div.svs_label_container + div.svs_input_container {
    width: 83%;
}

/*Ausnahme für den Modalendialog filteringSelectDialog, Container welcher das Input-Control umgibt (alt KONTROLprocent), für den Button cmdOK*/
form.svs_modaldialog div.svs_container + a.A + div.svs_flex_container div.svs_input_container {
    float: left;
}

/*Ausnahme für den Modalendialog filteringSelectDialog, Container welcher das Input-Control umgibt (alt KONTROLprocent), für den Button cmdCancel*/
form.svs_modaldialog div.svs_container + a.A + div.svs_flex_container div.svs_container + div.svs_container div.svs_input_container {
    position: relative;
    left: 0.5%;
    float: right;
}

/*Ausnahme für Controls die genauso groß wie einspaltige Grids sein sollen (z.B. 02/0201), Container welcher das Input-Control umgibt (alt KONTROLprocent)*/
.svs_grid_container_1 div.svs_input_container {
    width: 100%;
    height: 100%;
    float: none;
}

/*Ausnahme für den Analyse-Bereich (07/settings) Controls unterhalb des linken Grids, Container welcher das Input-Control umgibt (alt KONTROLprocent)*/
div.svs_filter_container div.svs_container div.svs_input_container {
    width: 68%;
    height: 22px;
    float: right;
}

/*Umgibt die Flexbox-Container der Startseite*/
.containerForFlexboxes {
    width: 100%;
    height: calc(100% - 12px);
    background: #f0f0f0;
    position: relative;
    top: 12px;
}

/*Flexbox der Favoriten auf der Startseite*/
.flexbox {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background: #f0f0f0;
    padding-left: 0.75vw;
}

/*MS Umstellung WEBTEXTEDIT zu TEXTBOX -> bei mehr als einem Control in "input_container" handelt es sich um Textbox und Button - Textbox.width wird um Button.width verkleinert und erhält float*/
div.svs_input_container > input:not(:only-child):first-child {
    width: calc(100% - 18px) !important;
    float: left;
}

/*MS Umstellung WEBTEXTEDIT zu TEXTBOX -> allgemeine Klasse für die Buttons neben der Textbox*/
.TextboxButton {
    border-style: solid;
    border-width: 1px 1px 1px 0px;
    border-color: rgba(179, 179, 179, 1);
    width: 18px;
    height: 100%;
}

/* Chrome, Safari, Edge, Opera */           /*dies entfernt bei TextBox type Number die Pfeile*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */                               /*dies entfernt bei TextBox type Number die Pfeile*/
input[type=number] {
    -moz-appearance: textfield;
}

/*Ausnahme für Mengen Control der Maske 030104*/
#TEXTBOX1:disabled{
    background-color: rgb(211, 211, 211);
}

/*Ausnahme für User Controls der Maske 0801*/
#VPASSWORD:disabled{
    background-color: rgb(211, 211, 211);
}

/*Ausnahme für User Controls der Maske 0801*/
#VUSERNAME:disabled{
    background-color: rgb(211, 211, 211);
}

/*Ausnahme für User Controls der Maske 0801*/
#VPASSWORDREPEAT:disabled{
    background-color: rgb(211, 211, 211);
}

/*Ausnahme für User Controls der Maske 0801*/
#VEMAIL:disabled{
    background-color: rgb(211, 211, 211);
}

/*-----------------------------------------------------------------------------------7. Controlarten-------------------------------------------------------------------------------*/
/*Ausnahme für den readOnly Zustand einiger Controls*/
.svs_DROPDOWN:read-only, .svs_button:read-only, textarea:disabled {
    color: black;
}

/*Ausnahme für den disabled Zustand der Buttons*/
input[type=button]:disabled{
    background-color: buttonface;
}


/*Bestimmt die Größe des Input-Controls Dropdownlist*/
.svs_DROPDOWN, 
/*Bestimmt die Größe des Input-Controls WebDateChooser*/
.svs_WEBDATE_ABSTAND,
/*Bestimmt die Größe des Input-Controls WebNumericEdit Alternativ z.B. in 01/03*/
.svs_NUMERICEDIT,
/*Bestimmt die Größe des Input-Controls WebNumericEdit*/
.svs_WEBNUMERIC,
/*Bestimmt die Größe des Input-Controls TextBox*/
.svs_WEBTEXTEDIT,
/*Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
.svs_WEBTEXTEDIT_extra,
/*Bestimmt die Größe des Input-Controls TextBox mit Fragezeichen(mit extra Funktionen) z.B. 01/0204*/
.svs_WEBTEXTEDIT_question,
/*Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
.svs_WEBTEXTEDIT_search,
/*Bestimmt die Größe des Input-Cotrols TextBox Alternativ als Textarea Feld ohne Bezug auf die Klasse aspfield (alt Webtextedit)*/
.svs_WEBTEXTAREAEDIT,
/*Bestimmt die Größe des Input-Controls Textarea Aspfield*/
.aspfield,
/*Bestimmt die Größe des Input-Controls Textbox in der Toolbar welches sich im Div mit der ID = toolbar1_tMainGrid2 befindet, oder Controls mit einem Fragezeichen wie auf 01/0201 zu finden*/
.dijitTextBox, .dijitComboBox, .dijitSpinner,
/*Ausnahme für Masken mit Quickfilter, Bestimmt die Größe der Controls*/
.QuickFilter select, .QuickFilter input{
    width: 100% !important; 
    border: 1px solid #b3b3b3 !important;
}
/*Bestimmt die Größe des Input-Controls Dropdownlist*/
.svs_DROPDOWN, 
/*Bestimmt die Größe des Input-Controls WebDateChooser*/
.svs_WEBDATE_ABSTAND,
/*Bestimmt die Größe des Input-Controls WebNumericEdit Alternativ z.B. in 01/03*/
.svs_NUMERICEDIT,
/*Bestimmt die Größe des Input-Controls WebNumericEdit*/
.svs_WEBNUMERIC,
/*Bestimmt die Größe des Input-Controls TextBox*/
.svs_WEBTEXTEDIT,
/*Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
.svs_WEBTEXTEDIT_extra,
/*Bestimmt die Größe des Input-Controls TextBox mit Fragezeichen(mit extra Funktionen) z.B. 01/0204*/
.svs_WEBTEXTEDIT_question,
/*Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
.svs_WEBTEXTEDIT_search,
/*Bestimmt die Größe des Input-Cotrols TextBox Alternativ als Textarea Feld ohne Bezug auf die Klasse aspfield (alt Webtextedit)*/
.svs_WEBTEXTAREAEDIT,
/*Bestimmt die Größe des Input-Controls Textarea Aspfield*/
.aspfield,
/*Bestimmt die Größe des Buttons*/
.svs_button,
/*Bestimmt die Größe des Input-Controls Textbox in der Toolbar welches sich im Div mit der ID = toolbar1_tMainGrid2 befindet, oder Controls mit einem Fragezeichen wie auf 01/0201 zu finden*/
.dijitTextBox, .dijitComboBox, .dijitSpinner,
/*Ausnahme für Masken mit Quickfilter, Bestimmt die Größe der Controls*/
.QuickFilter div.dijitReset:last-of-type, .QuickFilter select, .QuickFilter input{
    box-sizing: border-box;
    height: 22px;
}

/*Bestimmt die Größe des Input-Controls WebNumericEdit Alternativ z.B. in 01/03*/
.svs_NUMERICEDIT,
/*Bestimmt die Größe des Input-Controls WebNumericEdit*/
.svs_WEBNUMERIC,
/*Bestimmt die Größe des Input-Controls TextBox*/
.svs_WEBTEXTEDIT,
/*Ausnahme für Masken mit Quickfilter, Bestimmt die Größe der Controls*/
.QuickFilter select, .QuickFilter input{
    padding-left: 4px;
}

/*Bestimmt die Größe des Input-Controls Textbox in der Toolbar welches sich im Div mit der ID = toolbar1_tMainGrid2 befindet, oder Controls mit einem Fragezeichen wie auf 01/0201 zu finden*/
.dijitTextBox, .dijitComboBox, .dijitSpinner,
/*Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
.svs_WEBTEXTEDIT_extra,
/*Bestimmt die Größe des Input-Controls TextBox mit Fragezeichen(mit extra Funktionen) z.B. 01/0204*/
.svs_WEBTEXTEDIT_question,
/*Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
.svs_WEBTEXTEDIT_search{
    padding-left: 0px;
}

/*Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
.svs_WEBTEXTEDIT_extra,
/*Bestimmt die Größe des Input-Controls TextBox mit Fragezeichen(mit extra Funktionen) z.B. 01/0204*/
.svs_WEBTEXTEDIT_question,
/*Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
.svs_WEBTEXTEDIT_search{
    display: flex;
    background-color: #fff;
}

/*Bestimmt die Größe des Input-Cotrols TextBox Alternativ als Textarea Feld ohne Bezug auf die Klasse aspfield (alt Webtextedit)*/
.svs_WEBTEXTAREAEDIT,
/*Bestimmt die Größe des Input-Controls Textarea Aspfield*/
.aspfield{
    position: sticky;
    z-index: 900;
    padding: 3px 0px 1px 4px;
    resize: vertical;
    overflow: auto;
}

/*Ausnahme für den Tableeintrag innerhalb des Controls, Bestimmt die Größe des Input-Controls TextBox mit Fragezeichen(mit extra Funktionen) z.B. 01/0204*/
.svs_WEBTEXTEDIT_question td[align=center]{
    border-width: 0px;
}

/*Ausnahme für das Img innerhalb des Controls, Bestimmt die Größe des Input-Controls TextBox mit Fragezeichen(mit extra Funktionen) z.B. 01/0204*/
.svs_WEBTEXTEDIT_question td[align=center] > img{
    transform: translate(1px, -1px);
}

/*Bestimmt die Größe des Input-Controls WebDateChooser*/
.svs_WEBDATE_ABSTAND {
    padding-left: 1px;
}

/*Ausnahme für den EDGE Browser, Bestimmt die Größe des Input-Controls WebDateChooser*/
@supports (-ms-ime-align:auto) {
    .svs_WEBDATE_ABSTAND {
        height: auto !important;
    }
}

/*Ausnahme für den IE11 Browser, Bestimmt die Größe des Input-Controls WebDateChooser*/
@media all and (-ms-high-contrast:none) {
    .svs_WEBDATE_ABSTAND {
        height: auto !important;
    }
}

/*Bestimmt die Größe des Buttons*/
.svs_button{
    width: 100% !important;
}

/*Ausnahme für die Kalender-Auswahl, Breite des Kalenders im Container*/
div > div > table > tbody > tr + tr > td > table {
    width: calc(100% - 1px);
    border: none;
}

/*Ausnahme für die Kalender-Auswahl, Hover Effekt für die Tage*/
div > div > table > tbody > tr + tr > td > table > tbody > tr > td:hover {
    background-color: #f0f0f0;
}

/*Ausnahme für Trees, verhindert den Hover-Effekt von der Kalender-Auswahl*/
div.containerTableStyle > table > tbody > tr + tr > td > table > tbody > tr > td:hover {
    background-color: unset !important;
}

/*Ausnahme für die Kalender-Auswahl, SA SO werden rot*/
div > div > table > tbody > tr + tr > td > table > tbody > tr > td:nth-child(6n),
div > div > table > tbody > tr + tr > td > table > tbody > tr > td:nth-child(7n) {
    color: #C66200;
}

/*Ausnahme für die Kalender-Auswahl, Breite des Input Controls im Container*/
table.svs_WEBDATE_ABSTAND > tbody > tr > td > input {
    width: 100% !important;
    height: calc(100% - 2px) !important;
}

/*Ausnahme für die Kalender-Auswahl, Breite des Input Controls im Container*/
table.svs_WEBDATE_ABSTAND > tbody > tr > td > input:focus {
    outline: none;
    box-shadow: none;
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
table.svs_WEBTEXTEDIT_extra > tbody {
    display: flex;
    width: 100%;
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
table.svs_WEBTEXTEDIT_extra > tbody > tr {
    display: flex;
    width: 100%;
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
table.svs_WEBTEXTEDIT_extra > tbody > tr > td:first-of-type {
    width: calc(100% - 16px);
}

/*Ausnahme für den IE11 Browser, CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
@media all and (-ms-high-contrast:none) {
    table.svs_WEBTEXTEDIT_extra > tbody > tr > td:first-of-type {
        width: 96%;
    }
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
table.svs_WEBTEXTEDIT_extra > tbody > tr > td:first-of-type > input {
    box-sizing: border-box;
    height: 20px;
    padding-left: 4px;
}

/*CSS Fokus Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
table.svs_WEBTEXTEDIT_extra > tbody > tr > td:first-of-type > input:focus {
    outline: none;
    box-shadow: none;
}

/*Ausnahme für den IE11 Browser, CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
@media all and (-ms-high-contrast:none) {
    table.svs_WEBTEXTEDIT_extra > tbody > tr > td:first-of-type > input {
        height: 19px !important;
    }
}

/*CSS Selektor, betrifft das Img-Control im Input-Control, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
table.svs_WEBTEXTEDIT_extra > tbody > tr > td:last-of-type > img {
    padding-top: 50%;
}

/*Ausnahme für den IE11 Browser, CSS Selektor, betrifft das Img-Control im Input-Control, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
@media all and (-ms-high-contrast:none) {
    table.svs_WEBTEXTEDIT_extra > tbody > tr > td:last-of-type > img {
        padding-top: 0px;
    }
}

/*Ausnahme für den IE11 Browser, CSS Selektor, betrifft den Container für das Img-Control im Input-Control, Bestimmt die Größe des Input-Controls TextBox Alternativ für ISBN-Felder z.B. 01/0201*/
@media all and (-ms-high-contrast:none) {
    table.svs_WEBTEXTEDIT_extra > tbody > tr > td:last-of-type, table.svs_WEBTEXTEDIT_extra > tbody > tr > td:last-of-type:hover {
        border-width: 2px !important;
    }
}

/*Bestimmt die Größe des Input-Controls TextBox in der Toolbar*/
.svs_WEBTEXTEDIT_toolbar {
    background-color: #f0f0f0 !important;
    border: none !important;
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
table.svs_WEBTEXTEDIT_search > tbody, table.svs_WEBTEXTEDIT_question > tbody {
    display: flex;
    width: 100%;
}

/*Ausnahme für den IE11 Browser, CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
@media all and (-ms-high-contrast:none) {
    table.svs_WEBTEXTEDIT_search > tbody, table.svs_WEBTEXTEDIT_question > tbody {
        display: table;
    }
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
table.svs_WEBTEXTEDIT_search > tbody > tr, table.svs_WEBTEXTEDIT_question > tbody > tr {
    display: flex;
    width: 100%;
}

/*Ausnahme für den IE11 Browser, CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
@media all and (-ms-high-contrast:none) {
    table.svs_WEBTEXTEDIT_search > tbody > tr, table.svs_WEBTEXTEDIT_question > tbody > tr {
        display: table;
    }
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
table.svs_WEBTEXTEDIT_search > tbody > tr > td:first-of-type, table.svs_WEBTEXTEDIT_question > tbody > tr > td:first-of-type {
    width: calc(100% - 16px);
}

/*CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
table.svs_WEBTEXTEDIT_search > tbody > tr > td:first-of-type > input, table.svs_WEBTEXTEDIT_question > tbody > tr > td:first-of-type > input {
    box-sizing: border-box;
    height: 20px;
    padding-left: 4px;
    width: 100% !important;
}

/*CSS Fokus Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
table.svs_WEBTEXTEDIT_search > tbody > tr > td:first-of-type > input:focus, table.svs_WEBTEXTEDIT_question > tbody > tr > td:first-of-type > input:focus {
    outline: none;
    box-shadow: none;
}

/*Ausnahme für den IE11 Browser, CSS Selektor, betrifft den Inhalt des Controls ohne Border, Bestimmt die Größe des Input-Controls TextBox mit Suchlupe z.B. 01/1401*/
@media all and (-ms-high-contrast:none) {
    table.svs_WEBTEXTEDIT_search > tbody > tr > td:first-of-type > input, table.svs_WEBTEXTEDIT_question > tbody > tr > td:first-of-type > input {
        height: 19px;
    }
}

/*Ausnahme für den Firefox Browser, Bestimmt die Größe des Input-Controls TextBox Alternativ als Textarea Feld ohne Bezug auf die Klasse aspfield (alt Webtextedit)*/
@-moz-document url-prefix() {
    .svs_WEBTEXTAREAEDIT {
        transform: translateY(-1px);
    }
}

/*Ausnahme für Textareafelder die genauso so groß wie einspaltige Grids sein sollen(z.B. 02/0201), Bestimmt die Größe des Input-Controls TextBox Alternativ als Textarea Feld ohne Bezug auf die Klasse aspfield (alt Webtextedit)*/
.svs_grid_container_1 div.svs_input_container textarea {
    height: 100%;
}

/*Ausnahme für Textareafelder die genauso so groß wie einspaltige Grids sein sollen(z.B. 02/0201), Bestimmt die Größe des Input-Controls TextBox Alternativ als Textarea Feld ohne Bezug auf die Klasse aspfield (alt Webtextedit)*/
.svs_grid_container_1 > a.A + div.svs_input_container textarea {
    height: calc(100% - 24px);
    min-height: calc(100% - 24px) !important;
}

/*Ausnahme für den Firefox Browser und für Textareafelder die genauso so groß wie einspaltige Grids sein sollen(z.B. 02/0201), Bestimmt die Größe des Input-Controls TextBox Alternativ als Textarea Feld ohne Bezug auf die Klasse aspfield (alt Webtextedit)*/
@-moz-document url-prefix() {
    .svs_grid_container_1 > a.A + div.svs_input_container textarea {
        height: calc(100% - 25px);
        min-height: calc(100% - 25px) !important;
    }
}

/*Ausnahme für den Firefox Browser, Bestimmt die Größe des Input-Controls Textarea Aspfield*/
@-moz-document url-prefix() {
    .aspfield {
        transform: translateY(-1px);
    }
}

/*Div welches die einzelnen Elemente des Editorobj's umgibt*/
.svs_editorobj {
    width: calc(100% - 2px);
    /*JK, die Höhe des Label Containers des Editorbjs wird hier abgezogen, bitte Anpassen sollte sich diese ändern*/
    height: calc(100% - 20px);
    border: #909090 1px solid;
}

/*Ausnahme für den Firefox Browser, Div welches die einzelnen Elemente des Editorobj's umgibt*/
@-moz-document url-prefix() {
    .svs_editorobj {
        /*JK, die Höhe des Label Containers des Editorbjs wird hier abgezogen, bitte Anpassen sollte sich diese ändern*/
        height: calc(100% - 19px);
    }
}

/*Ausnahme für das Editorobj, Container für Toolbar und iFrame*/
.svs_editorobj > div:first-of-type {
    width: 100% !important;
    height: 100% !important;
}

/*Ausnahme für das Editorobj, Container für Textarea-Control*/
.svs_editorobj > div:last-of-type {
    width: calc(100% - 2px) !important;
    height: calc(100% - 28px) !important;
}

/*Ausnahme für das Editorobj, Textarea Control*/
.svs_editorobj > div:last-of-type textarea {
    width: calc(100% - 6px) !important;
    height: calc(100% - 6px);
    font-family: Arial;
}

/*Fokus Selektor, Ausnahme für das Editorobj, Textarea Control*/
.svs_editorobj > div:last-of-type textarea:focus {
    outline: none;
    box-shadow: 0px 0px 5px #e4032e;
    border: 1px solid #707070;
}

/*Disabled Selektor, Ausnahme für das Editorobj, Textarea Control*/
.svs_editorobj > div:last-of-type textarea:disabled {
    resize: none !important;
    background: rgb(211, 211, 211) !important;
}

/*Ausnahme für den Firefox Browser, Bestimmt die Größe des Buttons*/
@-moz-document url-prefix() {
    .svs_button {
        border: 1px solid #707070;
        background-color: #e2e2e2;
    }
}

/*Ausnahme für den IE11 Browser, Bestimmt die Größe des Buttons*/
@media all and (-ms-high-contrast:none) {
    .svs_button {
        border: 1px solid #707070;
        background-color: #e2e2e2;
    }
}

/*Ausnahme für den Edge Browser, Bestimmt die Größe des Buttons*/
@supports (-ms-ime-align:auto) {
    .svs_button {
        border: 1px solid #707070;
        background-color: #e2e2e2;
    }
}

/*Ausnahme fürs IPAD*/
@media only screen and (device-width: 768px) {
    /*Close Button des Modalendialogs*/
	.tundra .dijitDialogCloseIcon{
		background: none;
        top: 0px;
	}
    /*X Innerhalb des CloseButtons*/
	.tundra .dijitDialogCloseIcon > span{
        display: block;
		font-size: 18px;
	}
}

/*Bestimmt die Größe der eigentlich Textbox in der Toolbar welche sich im Div mit der ID = toolbar1_tMainGrid2 befindet, Controls wie das mit dem Fragezeichen auf 01/0201 oder Controls wie auf 02/0403*/
.svs_container div.dijitReset:last-of-type, .svs_WEBTEXTEDIT div.dijitReset:last-of-type {
    height: 100%;
}

/*Bestimmt die Größe der eigentlich Textbox in der Toolbar welche sich im Div mit der ID = toolbar1_tMainGrid2 befindet, Controls wie das mit dem Fragezeichen auf 01/0201 oder Controls wie auf 02/0403*/
.svs_container div.dijitReset:last-of-type > input, .svs_WEBTEXTEDIT div.dijitReset:last-of-type > input {
    height: calc(100% - 1px);
    padding-left: 4px !important;
    width: calc(100% - 4px) !important;
}

/*Bestimmt die Größe der eigentlich Textbox in der Toolbar welche sich im Div mit der ID = toolbar1_tMainGrid2 befindet, Controls wie das mit dem Fragezeichen auf 01/0201 oder Controls wie auf 02/0403*/
.svs_container div.dijitReset:last-of-type > input:focus, .svs_WEBTEXTEDIT div.dijitReset:last-of-type > input:focus {
    outline: none;
    box-shadow: none;
}

/*Ausnahme für Masken mit Quickfilter, Bestimmt die Größe der WebdateChoose Controls*/
.QuickFilter table[dotnettype="WEBDATECHOOSER"] {
    border: 1px solid #b3b3b3 !important;
}

/*Ausnahme für Masken mit Quickfilter, Bestimmt die Größe der WebdateChoose Controls*/
.QuickFilter table[dotnettype="WEBDATECHOOSER"] input {
    border: none !important;
}

/*Ausnahme für Masken mit Quickfilter, Bestimmt die Größe der WebdateChoose Controls*/
.QuickFilter table[dotnettype="WEBDATECHOOSER"] input:focus {
    outline: none;
    box-shadow: none;
}

/*Bestimmt die Größe der eigentlich Textbox in der Toolbar welche sich im Div mit der ID = toolbar1_tMainGrid2 befindet*/
.QuickFilter div.dijitReset:last-of-type > input {
    height: calc(100% - 2px);
    padding-left: 4px !important;
    width: calc(100% - 4px) !important;
    border: none !important;
}

/*Fokus Selektor, Bestimmt die Größe der eigentlich Textbox in der Toolbar welche sich im Div mit der ID = toolbar1_tMainGrid2 befindet*/
.QuickFilter div.dijitReset:last-of-type > input:focus {
    outline: none;
    box-shadow: none;
}

/*Positioniert die Checkbox innerhalb des input_containers*/
.svs_CHECKBOX_ABSTAND {
    margin-left: -4px;
}

/*-----------------------------------------------------------------------------------7.1 Controls Kontextmenü----------------------------------------------------------------------*/

/*Container des Kontextmenüs der Controls*/
.rcMenuContainer {
    position: absolute;
    border: 1px solid rgb(179, 179, 179);
    background: #efebe7;
    padding: 2px;
    width: 200px;
    z-index: 999;
}

/*Positioniert die Einträge des Kontextmenüs innerhalb des Containers*/
.rcMenuItem {
    padding: 3px;
}

/*Hover Klasse für die Einträge des Kontextmenüs*/
.rcMenuItemHover {
    background: rgba(255, 209, 210, 1);
    padding: 3px;
}

/*Strich innerhalb des Kontextmenüs welcher die Einträge voneinander trennt*/
.rcMenuSeparator {
    color: black;
    height: 3px;
}

/*Klasse für das Image innerhalb der Einträge des Kontextmenüs*/
.rcImage {
    padding-right: 4px;
}

/*-----------------------------------------------------------------------------------7.2 Tree Controls-----------------------------------------------------------------------------*/

/*Bestimmt die Größe des Tree's, umgibt den weißen Bereich des Tree's*/
.svs_tree_container {
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: white;
}

/*Selektiert das erste Div nach dem svs_tree_container*/
.svs_tree_container > div:first-of-type {
    height: 100%;
}

/*Ausnahme für Tree mit Input Controls, Bestimmt die Größe des Tree's, umgibt den weißen Bereich des Tree's (z.B. 01/0208)*/
.svs_tree_input_container + div.svs_tree_container {
    /*Höhe des input Container + 5px werden von der Höhe abgezogen*/
    height: calc(100% - 35px);
}

/*Ausnahme für Tree mit Input Controls und Überschrift im Container, Bestimmt die Größe des Tree's, umgibt den weißen Bereich des Tree's (z.B. 01/0208)*/
div.svs_grid_container_1 > a.A + div.svs_tree_input_container + div.svs_tree_container {
    /*Höhe des input Container + 5px werden von der Höhe abgezogen + Höhe der Überschrift*/
    height: calc(100% - 55px);
}

/*Ausnahme für Tree mit Überschrift im Container, Bestimmt die Größe des Tree's, umgibt den weißen Bereich des Tree's*/
div.svs_grid_container_1 > a.A + div.svs_tree_container:last-of-type {
    /*5px werden von der Höhe abgezogen + Höhe der Überschrift*/
    height: calc(100% - 25px);
}

/*Container welche die Controls oberhalb vom Tree umschließt*/
.svs_tree_input_container {
    /*Falls hier die Höhe geändert werden sollte, muss die Höhe von der Klasse svs_tree_container ebenfalls angepasst werden*/
    height: 30px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

/*Ausnahme für den Firefox Browser, Container welche die Controls oberhalb vom Tree umschließt*/
@-moz-document url-prefix() {
    .svs_tree_input_container {
        width: calc(100% + 1px);
    }
}

/*-----------------------------------------------------------------------------------7.3 Tree Controlarten-------------------------------------------------------------------------*/

/*Bestimmt die Größe des Input-Controls Textbox oberhalb des Tree's*/
.svs_tree_textedit {
    width: 56.857%;
    height: 22px;
    box-sizing: border-box;
    padding-left: 4px;
    border: 1px solid #b3b3b3 !important;
}

/*Ausnahme für den disabled Zustand, Bestimmt die Größe des Input-Controls Textbox oberhalb des Tree's*/
.svs_tree_textedit:disabled {
    background-color: rgb(211, 211, 211);
}

/*Bestimmt die Größe der Buttons oberhalb des Tree's*/
.svs_tree_button {
    width: 18.148%;
    box-sizing: border-box;
    height: 22px;
}

/*Ausnahme für den Firefox Browser, Bestimmt die Größe der Buttons oberhalb des Tree's*/
@-moz-document url-prefix() {
    .svs_tree_button {
        border: 1px solid #707070;
        background-color: #e2e2e2;
    }
}

/*Ausnahme für den IE11 Browser, Bestimmt die Größe des Buttons*/
@media all and (-ms-high-contrast:none) {
    .svs_tree_button {
        border: 1px solid #707070;
        background-color: #e2e2e2;
    }
}

/*Ausnahme für den Edge Browser, Bestimmt die Größe des Buttons*/
@supports (-ms-ime-align:auto) {
    .svs_tree_button {
        border: 1px solid #707070;
        background-color: #e2e2e2;
    }
}

/*-----------------------------------------------------------------------------------8 Control Ausnahmen---------------------------------------------------------------------------*/

/*Ausnahme für die Quickfilter, Flexbox Container, umgibt alle Controls der Quickfilter*/
.svs_quick_flex_container {
    height: auto;
    display: flex;
    flex-flow: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: calc(100% - 34px);
    padding-bottom: 3px;
}

/*Ausnahme für die Gridfilter, für Dropdown Controls*/
.svs_outline_ctrl + input + input + img.dhx_combo_img {
    background-color: rgba(255, 209, 210, 0.3) !important;
}

/*ID mit Bezug auf das Control auf der Maske/Modalendialog 03180102*/
#V_KDNR_t {
    width: 100% !important;
}

/*Ändert die Schriftfarbe des Ausgabetextes (z.B. auf Maske 20/020101 zu finden)*/
.svs_redfont {
    color: red !important;
}

/*Ändert die Schriftfarbe in dem a Element hinter dem Ausgabetext (z.B. auf Maske 20/020101 zu finden)*/
.svs_redfont a {
    color: red !important;
}

/*Bestimmt die Größe des SVSLogos auf der Maske (10/0101)*/
.svs_logo_img {
    width: 15.915vw;
    height: 93px;
}

/*Ausnahme für die Maske 02/0101, Positioniert den Container der Signalleuchten*/
.svs_input_container.svs_rub{
    display: flex;
    justify-content: flex-start;
    position: relative;
    flex-flow: row wrap;
}

/*Bestimmt die Größe und die Position der Signalleuchten*/
.svs_input_container.svs_rub > div{
    font-size: 35px;
    padding-right: 40px;
    margin-top: -8px;
}

/*Ausnahme für die letzte Signalleuchte, Bestimmt die Größe und die Position der Signalleuchten*/
.svs_input_container.svs_rub > div:last-of-type{
    padding-right: 0px;
}

/*Ausnahme Startseite, erzeugt bei der Deutschlandkarte einen Hovereffekt welcher die Bundesländer anzeigt*/
.svghide {
    display: none;
}

/*Ausnahme für die Maske 24010701 dient zu Darstellung der Ladezeit erstellt eine ... Animation*/
.import_lbl:after {
    content: ' .';
    animation: dots 1s steps(5, end) infinite;
}
/*Ausnahme für die Maske 24010701 dient zu Darstellung der Ladezeit erstellt eine ... Animation*/
@keyframes dots {
    0%, 20% {
        color: rgba(0,0,0,0);
        text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0);
    }

    40% {
        color: white;
        text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0);
    }

    60% {
        text-shadow: .25em 0 0 white, .5em 0 0 rgba(0,0,0,0);
    }

    80%, 100% {
        text-shadow: .25em 0 0 white, .5em 0 0 white;
    }
}
/*Ausnahme für die Maske 24010701 ersettz den Flexboxcontainer der Maske*/
.import_container {
    display: grid;
    grid-gap: 5px;
    grid-template-rows: 175px auto;
    grid-template-areas:
        "text"
        "button";
    grid-template-columns: minmax(200px, 1fr);
    height: 100%;
}
/*Ausnahme für die Maske 24010701 ersetzt Labelcontainer der Maske*/
.import_lbl_container {
    grid-area: text;
    margin: auto
}
/*Ausnahme für die Maske 24010701 ersetz Contaolcontainer der Maske*/
.import_btn_container {
    grid-area: button;
    margin: auto;
}
/*-----------------------------------------------------------------------------------8.1 Analyse-----------------------------------------------------------------------------------*/
/*Ausnahme für die Maske 07/settings, bestimmt die Größe der Form*/
.formAnalyse {
    width: 100%;
    height: 85%;
}

/*Ausnahme für den Bereich Analyse und die Masken 12/****, bezieht sich auf den Container in dem die Überschriften der Akkordeons enthalten sind*/
div.tabmenu {
    white-space: nowrap;
}

/*Ausnahme für den Bereich Analyse und die Masken 12/****, bezieht sich auf die Überschriften der Akkordeons innerhalb des Containers*/
div.tabmenu a {
    text-decoration: none;
    padding-right: 0px;
    padding-left: 10px;
}

/*Ausnahme für den Analyse-Bereich (z.B. 07/schedule) um die Möglichkeit der Darstellung mit dem Control über dem Grid, Flexbox Container, umgibt alle Controls und ordnet diese an*/
.svs_schedule {
    display: flex;
    width: 100%;
    justify-content: space-evenly;
    flex-flow: row wrap;
}

/*-----------------------------------------------------------------------------------8.2 03/Quickorder-----------------------------------------------------------------------------*/

/*Bestimmt das Layout der Tabelle*/
table.svstable {
    border-collapse: collapse;
    border: 1px solid rgb(179, 179, 179);
    width: 100%;
}

/*Bestimmt den Abstand der Zellen in der Tabelle*/
tr.svstable, th.svstable, td.svstable {
    padding: .25em;
}

/*Bestimmt den Rahmen der Zellen in der Tabelle*/
td.svstable {
    border-left: 1px solid #dadada;
}

/*Bestimmt den Rahmen der Zellen in der Tabelle in der ersten Spalte*/
td.svstable:first-of-type {
    border-left: 1px solid rgb(179, 179, 179);
}

/*Bestimmt die Hintergrundfarbe jeder zweiten Zelle | Hover Selektor, Bestimmt die Hintergrundfarbe der letzten Zelle*/
tr.svstableodd, tr:hover.svstableselect {
    background-color: rgba(255, 209, 210, 0.6);
}

/*Hover Selektor, Bestimmt die Hintergrundfarbe der Zellen | Bestimmt die Hintergrundfarbe der letzten Zelle*/
tr:hover.svstableodd, tr:hover.svstable, tr.svstableselect {
    background-color: #ffd1d2;
}

/*Verhindert das der Tabellenkopf die Hintergrundfarbe ändert*/
tr:hover.svstable:first-of-type {
    background-color: transparent;
}

/*-----------------------------------------------------------------------------------8.3 Login-Maske-------------------------------------------------------------------------------*/

/*Ausnahme Login-Maske, Betrifft alle Controls, bestimmt die Breite und den inneren Abstand*/
.svs_login_input {
    width: 100% !important;
    padding-left: 4px;
    box-sizing: border-box;
    border: 1px solid #b3b3b3 !important;
}

/*Ausnahme Login-Maske, betrifft den Button "Anmelden"*/
.loginButton {
    background-color: #E4032E !important;
    background-image: none !important;
    color: #FFFFFF !Important;
}
/*Ausnahme Login-Maske, betrifft den Img-Button mit dem Fragezeichen neben der Label "Passwort vergessen"*/
.cmdPWD {
    margin: 10px 0px 10px 10px;
}

/*-----------------------------------------------------------------------------------8.4 Dateivorschau-----------------------------------------------------------------------------*/

/*Bestimmt die Größe der Kopfleisten Hintergrund des Preview Dialogs*/
.svs_preview_header {
    height: 50px;
    width: 100%;
    position: fixed;
    top: 0;
    background-color: #f0f0f0;
}

/*Wird in der previewDocument.aspx.vb erzeugt und dient dazu zwischen der Anzeige im Modalendialog und auf der Maske zu unterscheiden*/
.svs_preview_modal {
    display: none;
}

/*Ausnahme für Dateivorschau über den Modalendialog der Medienbibliothek*/
.svs_preview_modal + .svs_preview_header {
    background-color: #fff;
}

/*Bestimmt die Größe und Position von des Texts von dem Previewdialog*/
.svs_preview_txt {
    float: left;
    position: relative;
    top: 14px;
    text-decoration: underline;
    font-weight: 550;
}

/*-----------------------------------------------------------------------------------8.5 Passwort Reset----------------------------------------------------------------------------*/

/*Die Form welche die ganze Maske umgibt*/
.svs_pwd_form {
    height: 100vh;
    width: 100vw;
    min-height: 500px;
    min-width: 768px;
}

/*Die Form welche die ganze Maske umgibt*/
form.svs_pwd {
    font-family: Arial;
}

/*Der Container des SVSLogo´s*/
form.svs_pwd div.svs_container_logo {
    height: 20vh;
    width: 100vw;
}

/*Das SVSLogo*/
form.svs_pwd div.svs_container_logo img.svs_logo {
    height: 100px;
    width: 250px;
    padding-left: 30px;
    padding-top: 10px;
}

/*Der FlexContainer mit dem Content(großer Content_Container um den Content zu zentrieren)*/
form.svs_pwd div.svs_flex_container {
    height: 80vh;
    width: 100vw;
    justify-content: center;
    align-items: center;
}

/*Der gesamte Content_Container(kleiner Content_Container um noch kleinere Container vertikal anzuordnen)*/
form.svs_pwd div.svs_content_container {
    height: 310px;
    width: 500px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

/*Alle normalen Container die Label & ValueFields horizontal anordnen*/
form.svs_pwd div.svs_container {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
}

/*Der Header_Container(braucht padding und Height)*/
form.svs_pwd div.svs_container_header {
    padding-bottom: 25px;
    height: 40px
}

/*Der Container im Header_Container(braucht Text-align und Width)*/
form.svs_pwd div.svs_important_label {
    width: 100%;
    text-align: left;
    height: auto;
    white-space: normal;
}

/*Der Button Container(ordnet Buttons nebeneinander an)*/
form.svs_pwd div.svs_container_button {
    display: flex;
    justify-content: space-between
}

/*Beschreibt das Aussehen der Buttons*/
form.svs_pwd div.svs_container_button [class*="svs_buttons"] {
    width: 33.334%;
    height: 24px;
}

/*Ausnahme für den Firefox Browser, Beschreibt das Aussehen der Buttons*/
@-moz-document url-prefix() {
    form.svs_pwd div.svs_container_button [class*="svs_buttons"] {        
        border: 1px solid #b3b3b3;
    }
}

/*Ausnahme für den IE11 Browser, Beschreibt das Aussehen der Buttons*/
@media all and (-ms-high-contrast:none) {
    form.svs_pwd div.svs_container_button [class*="svs_buttons"] {
        border: 1px solid #b3b3b3;
        background-color: #e2e2e2;
    }
}

/*Ausnahme für den Edge Browser, Beschreibt das Aussehen der Buttons */
@supports (-ms-ime-align:auto) {
    form.svs_pwd div.svs_container_button [class*="svs_buttons"] {
        border: 1px solid #b3b3b3;
        background-color: #e2e2e2;
    }
}

/*Der Container für rote Messages(braucht padding und Height)*/
form.svs_pwd div.svs_container_message {
    padding-top: 25px;
    height: 40px;
}

/*TH 17.07.2019: Wird benötigt für Links. Diese werden sonst per Standard schwarz*/
.ToasterMessage u:read-only {
    color: #fff;
}

.ToasterMessage a {
    color: #fff;
    text-decoration: none;
}

/*-----------------------------------------------------------------------------------9. Temporär entfernt--------------------------------------------------------------------------*/
/*
A:active {
    color: red;
}
INPUT {
    text-decoration: none;
}
.bordertopy_menu {
    background-position: 100% 0;
    background-repeat: no-repeat;
    text-align: right;
    height: 35px;
    width: 100%;
}
.bordertopx {
    background-image: none !important;
}

.bordertopy {
    background-image: none !important;
}
.borderbottomy {
    background-image: none !Important;
}
TABLE .panel .Kopf {
    color: white;
    background-color: #6699CC;
    border-right: #a9a9a9 0px solid;
    border-top: #a9a9a9 0px solid;
    border-left: #a9a9a9 0px solid;
    border-bottom: #a9a9a9 0px solid;
}
.MainGrid { 
}
.toolbar_botton {
    margin-top: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
    float: left;
}
#hr {
    width: 100%;
    margin-top: -4px;
    margin-bottom: -4px;
    height: 6px;
    color: #CCC;
}
.Texte {
    color: White;
    border: none;
}
.main {
    width: 100%;
    height: 100%;
}
.content {
    width: 100%;
    height: 80%;
}
#honorare {
    margin-top: 15px;
    *margin-top: 0px;
}
.label {
    width: 100%;
    margin-left: 5px;
    margin-top: 12px;
}

.label_toolbar {
    margin-left: 5px;
    width: 100%;
}

.input_new {
    width: 56%;
    float: right;
    margin-right: 6px;
    margin-top: -14px;
    margin-bottom: 4px;
}

.input_new_org_untertitel {
    width: 56%;
    float: right;
    margin-right: 6px;
    margin-top: -14px;
    margin-bottom: 4px;
}

.label_tabArtikel {
    width: 100%;
    margin-left: 5px;
    margin-top: 10px;
}

.label_org_untertitel {
    width: 100%;
    margin-left: 5px;
    margin-top: 40px;
}

.input_new_toolbar {
    margin-right: 10px;
    margin-top: -12px;
    margin-left: 32%;
    width: 56%;
}

.input_new_toolbar_right {
    float: right;
    margin-right: 15px;
    margin-top: -12px;
    width: 65%;
}

.input_preise {
    width: 66%;
    float: right;
    margin-right: 5px;
    margin-top: -16px;
    margin-bottom: 5px;
}

.datechooser {
    margin: 10px 0px 16px 0px;
    *margin-bottom: 0px;
}
.main1 {
}

.main2 {
    margin-left: 35px;
    width: 90%;
    *width: 100%;
    height: 30px;
    *height: 37px;
    float: right;
}
#DIALOG0 {
    display: inline-block;
}

#pnl_ALPHANUM {
    margin-bottom: -21px;
    *margin-bottom: 0px;
}

#pnl_NUMERIC {
    margin-top: -54px;
    *margin-top: 0px;
}

.analyse_hinzufügen_btn {
    margin-top: 19px;
    float: left;
}

.aspfield_edit {
    text-align: left !important;
}
button .login {
    border-color: Black;
    background-color: #F5F5F5;
}

.AusgabeFeld {
    height: 45px;
}
.SuchFeld {
    margin-left: 10px !important;
}
div.panel {
    padding: 0 18px;
    display: none;
    background-color: white;
}

div.panel.show {
    display: block !important;
}
.modaldialog-grid-container {
    width: 99%;
    height: 402px;
    border: none;
    float: left;
    background-color: transparent;
}

.diese-klasse-verhindert-das-uberdecken-des-form-bereiches {
    float: left;
    width: 100%;
    height: 90px;
}
.w-h-100 {
    width: 100% !important;
    height: 100% !important;
}

.w18 {
    width: 18% !important;
}

.w60 {
    width: 60% !important;
}

.w100 {
    width: 100% !important;
}

.h18 {
    height: 18% !important;
}

.h22 {
    height: 22% !important;
}

.h23 {
    height: 23% !important;
}

.h30 {
    height: 30% !important;
}

.h36 {
    height: 36% !important;
}

.h38 {
    height: 38% !important;
}

.h42 {
    height: 42% !important;
}

.h45 {
    height: 45% !important;
}

.h49 {
    height: 49% !important;
}

.h50 {
    height: 50% !important;
}

.h58 {
    height: 58% !important;
}

.h59 {
    height: 59% !important;
}

.h60 {
    height: 60% !important;
}

.h80 {
    height: 80% !important;
}

.h81 {
    height: 81% !important;
}

.h83 {
    height: 83% !important;
}

.h88 {
    height: 88% !important;
}

.h280px {
    height: 280px !important;
}

.h30px {
    height: 30px !important;
}

.h40-w {
    height: 40px;
    width: 30.9vw;
}

.padding-right-percent-1 {
    padding-right: 1% !important;
}

.margin-0 {
    margin: 0px !important;
}

.margin-top-0 {
    margin-top: 0px !important;
}

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

.margin-top-5 {
    margin-top: 5px !important;
}

.margin-left-1 {
    margin-left: 1% !important;
}
.margin-bottom-5 {
    margin-bottom: 5px !important;
}

.margin-bottom-10 {
    margin-bottom: 10px !important;
}

.margin-bottom-20 {
    margin-bottom: 20px !important;
}

.margin-bottom-30 {
    margin-bottom: 30px !important;
}
.full-screen-container {
    width: 100%;
    height: 100%;
    height: auto;
    border: none;
    float: left;
    margin: 2px 0px 3px 0px;
    background-color: transparent;
}
.WRAPnull {
    width: 31.3%;
    min-width: 470px;
    height: 40px;
    float: left;
    padding-right: 2%;
}
tr a.svstable {
    color: #000000;
}


table a.svstable {
    text-decoration: underline;
}

table a:visited.svstable {
    text-decoration: none;
}

caption.svstable {
    height: 45px;
    line-height: 44px;
    color: #60634E;
    font-weight: bold;
    text-align: center;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #ffffff url(captop.jpg) no-repeat;
    background-position: 50% top;
    border-left: 2px solid #616161;
    border-right: 2px solid #616161;
}

thead th.svstable {
    color: #000;
    background: #ffffff url(tbar.gif) repeat-x;
    height: 33px;
}

thead th:hover.svstable {
    background: #ffffff url(tbov.gif) repeat-x;
}

tfoot tr.svstable {
    background: #fff url(bbar.gif) repeat-x;
}

tfoot td.svstable, tfoot th.svstable {
    color: #000;
    border: 0px;
}

tr.svstable {
    vertical-align: top;
}
tr.svstableerr {
    background-color: #ff0000;
}
.svs_TOOLBAR_WRAPone {
    width: 31.3%;
    min-width: 470px;
    height: 60px;
    float: left;
    padding-right: 2%;
    padding-bottom: 00px;
    padding-top: 20px;
}

.svs_TOOLBAR_WRAPnull {
    width: 100%;
    min-width: 470px;
    height: 40px;
    float: left;
    padding-right: 2%;
}
.WRAPnullDouble {
    width: 62.6%;
    min-width: 660px;
    height: 40px;
    float: left;
    padding-right: 2%;
}

.svs_MD_WRAPnull {
    width: 31.3%;
    min-width: 80px;
    height: 40px;
    float: left;
    padding-right: 2%;
}

.svs_MD_LABELpx {
    min-width: 75px;
    width: 30%;
    height: 18px;
    float: left;
    padding-left: 2.5%;
}

.svs_MD_KONTROLprocent {
    min-width: 50px;
    width: 60%;
    height: 20px;
    float: right;
}

.LABELpx {
    min-width: 100px;
    width: 30%;
    height: 18px;
    float: left;
    padding-left: 2.5%;
}

.KONTROLprocent {
    min-width: 210px;
    width: 67%;
    height: 20px;
    float: right;
}
.scrollbar {
    overflow: auto;
    position: relative;
    height: 500px;
    width: 800px;
}

.scrollbarGrid {
    width: 1024px;
    height: 100%;
    position: relative;
}
.Header {
    background-color: #6699CC;
    color: white;
    background-image: url(../../images/svs/bg_list.gif);
    border: #a9a9a9 0px solid;
    margin-bottom: 0px;
    margin-top: 0px;
    text-indent: 5px;
    vertical-align: baseline;
    float: none;
    width: 100%;
    height: 15px;
}

.full {
    height: 100% !important;
    width: 100% !important;
}

.Row.full, .full-screen-container.full {
    height: 100% !important;
    width: 99.5% !important;
}

nav a:focus, nav a:hover, nav a:active {
    color: red;
}
Hover Effekt für die Einträge des Sidebarmenus | derzeit nicht erwünscht
A:link:hover {
    text-decoration: underline;
    color:red;
}
.toolbarButtons {
    width: 100%;
}
.DefaultTabStyle {
    color: #000000;
    text-decoration: none;
    border-bottom: solid 1px #F0F0F0;
}

.HoverTabStyle {
    color: #000000;
    text-decoration: none;
    border-bottom: solid 1px #E4032E;
}

.SelectedTabStyle {
    color: #E4032E;
    text-decoration: none;
    border-bottom: solid 1px #F0F0F0;
}
span.spanStyleSignal { 
    color: Green;
    line-height: 12px;
    font-weight: bolder;
    font-size: 70px;
}
#V__SIGNAL_REMI {
    font-size: 35px;
    height: 98%;
    width: 33%;
    margin-top: -30px;
}

#V__SIGNAL_UMS {
    font-size: 35px;
    height: 100%;
    margin-left: 50px;
    margin-top: -34px;
    width: 33%;
}

#V__SIGNAL_BON {
    font-size: 35px;
    height: 100%;
    margin-left: 100px;
    margin-top: -34px;
    width: 33%;
}
.svs_rub {
    margin-left: 0% !important;
    padding-top: 22px;
}
#RUB {
    height: 34px;
    width: 200px;
    margin-left: 130px;
}
.whitebg { 
    background-color: #ffffff !important;
}

.whitebgfont {
    background-color: #ffffff !important;
}

.whitebgfont:active {
    color: red;
}
.Hinweistext {
    width: 98%;
    height: auto;
    margin: 5px;
}

.titleForTheFirstWidgetFrame {
    width: 100%;
    height: 20px;
}

.titleForTheSecondWidgetFrame {
    width: 100%;
    height: 20px;
    margin-top: 3px;
}
.rcMenuItemText { JK 12.07.2019 wird derzeit nicht verwendet, Referenziert auf if (window.CONTEXTMENU_ATT) { } aus der common.js, dort wird der type definiert
    border: 0px;
    padding: 2px;
}

.rcMenuItemTextExt {
    border: 1px dotted grey;
    padding: 2px;
}
*/