html {
	height:100%;
}
body
{
	font-family: Arial, sans-serif;
	font-size: 9pt;
}

sup {
	font-size:0.6em;
	line-height:1em;
}

#header {
	display: block;
	margin-bottom: 25px;
	min-height: 76px;
	max-height: 76px;
	margin-bottom: 10px;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 5001;
}
#header > .background-wrapper
{
	position: absolute;
	height: 100%;
	width: 100%;
	overflow: hidden;
	background-color: #001437;
	color: #B5B9BC;
}
#header > .background-wrapper > .background-image
{
	position: relative;
}
#header > .background-wrapper > .background-image img {
	width: 150%;
	margin-top: -65%;
	margin-left: 20%;
	position: absolute;
	top: 0;
	left: 0;
	max-width: none;
}
#header .header-wrapper {
	position: relative;
	padding-left: 67px;
	padding-top: 7px;
}
#header .header-wrapper img {
	height: 60px;
}

#header > .header-wrapper > .header-logo > .header-logo-banner {
	display: auto;
}
#header > .header-wrapper > .header-logo > .header-logo-symbol {
	display: none;
}

.fa--rotate90 {
	transform:rotate(90deg);
	text-align:left;
	width: 16px;
}

.ui-widget
{
	font-family: Arial, sans-serif;
	font-size: 1em;
}
.ui-widget-content 
{
    background: #ffffff;
}

.ui-dialog .ui-dialog-titlebar 
{
/*    padding: .4em .4em .4em 1em;*/
	padding: 3px 10px;
	background: #dfeffc url("../Images/wave_dark.png") 50% 50% repeat-x;
}
.ClsDlgMax
{
	max-width: 100%; /* damit breite Tabellen nicht aus dem Fenster laufen */
}

.ClsDlgWithMax
{
	width: 100%; /* damit Eingabefelder die komplette Breite verwenden */
}
.ClsWid5em,
span.ClsWid5em input {
	width: 5em;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active	/* Text blau! für aktive Tabs und sortierte Spalten */
{
	color: #2e6e9e;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight /* Hintergrund gelb! */
{
    background: #fbec88 url("../Images/wave_yellow.png") 50% 50% repeat-x;
}

.ui-widget-header .ui-state-active, .ui-datatable-tablewrapper .ui-state-active				/* Hintergrund gelb! */
{
	background: #fbec88 url("../Images/wave_yellow.png") 50% 50% repeat-x; 
	/*background: #FCF3BA;*/
}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited						/* aktiver Text blau! */
{
	color: #2e6e9e;
}
.ui-state-active .ui-icon 																	/* aktive Icons blau! */
{
	background-image: url("../Images/ui-icons_6da8d5_256x240.png");
    background-color: transparent;
}
.ui-state-hover .ui-icon
{
	background-image: url("../Images/ui-icons_217bc0_256x240.png");
    background-color: transparent;
}

/* --------------- CeLo --------------- */
.ClsAppToolbar img {
	border-radius: 5px;
}
.ClsAppToolbar img.hoverable:hover {
	cursor: pointer;
	box-shadow: 0px 0px 3px 1px white;
}
.ClsAppToolbar, .ClsLogin > .ui-widget-header
{
	user-select: none;
	border: none;
	font-size: 20px;
	font-weight: normal;

	background: #dfeffc url("../Images/wave_dark.png") 50% 50% repeat-x;
	color: white;
	
	margin-left: 1px;
	margin-right: 1px;
}
.ClsLogin
{
	width: 38.5em;
	background: white;
	border: solid 1px #DDD;
	border-radius: 6px;
	padding: 3em;
	margin-left: calc(60% - 21em);
	box-shadow: 0px 0px 16px 2px #444;
	padding-top: 2em;
	margin-top: 3em;
	transition-property: margin-left;
	transition-duration: 0.5s;
}
.ClsLogin .ui-panel-titlebar .ui-panel-title {
	font-size: 18px;	
}
.ClsLogin .ui-panelgrid-cell > .ClsWidth250 {
	width: 235px;
	margin-right:15px;
}
.ClsFlagOn, .ClsFlagOff {
	margin-left: 2px;
	margin-right: 2px;
}
.ClsFlagOn {
	cursor: default;
}
.ClsFlagOff {
	opacity: 0.5;
	cursor: pointer;
}


.ClsAppToolbar > .ui-toolbar-group-right
{
	padding: 7px;
}
.ClsAppTitle
{
	font-size: 20px;
	font-weight: bold;

	padding: 3px 10px 2px 13px;
	margin: 4px 0px 2px 0px;
	vertical-align: middle;
}
.ClsProjComm
{
	font-size: 18px;
	
	font-weight: bold;
	padding: 0px 10px 0px 32px;
    vertical-align: middle;
}
.ClsLogin > .ui-widget-header
{
    color: #030303;
}
.ClsAppTitle > a > .ui-icon
{
	background-image: url("../Images/ui-icons_217bc0_256x240.png");
    background-color: transparent;
}
.ui-toolbar-group-right .ui-state-hover
{
    color: #ff873f;				/* orange */
}
.ClsAppTitle > a:hover
{
    border: none;
    background: #d0e5f5 url("../Images/ui-bg_glass_75_d0e5f5_1x400.png") 50% 50% repeat-x;
    border-radius: 5px;
}

.ClsLayoutView
{
/*	background-attachment: scroll;
	background-clip: border-box;
	background-color: transparent;
    background-image: url("../Images/wave_orange.png");
    background-origin: padding-box;
    background-position: 50% 50%;
    background-repeat: repeat-x;
    background-size: auto;

    background: #d0e5f5 url("../Images/ui-bg_glass_75_d0e5f5_1x400.png") 50% 50% repeat-x;
 	color: #ff873f;
	background: #dfeffc url("../Images/wave_dark.png") 50% 50% repeat-x;
*/    
	background: #dfeffc url("../Images/ui-bg_gloss-wave_55_5c9ccc_500x100.png") 50% 50% repeat-x;
	color: #ffffff;
    
	border: 1px solid #4297d7;
	font-size: 16px;
	font-weight: bold;
	padding: 6px 2px 6px 12px;
	margin: 1px 0px 5px 0px;
	vertical-align: middle;
}

.ui-timepicker-timeinput{
	background: #ffffff;
	border: 1px solid #a6c9e2;
}

.ui-timepicker-timeinput > div.ui-hour-picker > input.ui-inputfield {
	border: #ffffff;
}

.ui-timepicker-timeinput > div.ui-minute-picker > input.ui-inputfield {
	border: #ffffff;
}

.ClsTxtDarkblue
{
	color: #2e6e9e;
}

.ClsViewLayer
{
	background: #dfeffc url("../Images/ui-bg_gloss-wave_55_5c9ccc_500x100.png") 50% 50% repeat-x;
	color: #ffffff;
    
	border: 1px solid #4297d7;
	/*font-size: 14px;*/
	/*font-weight: bold;*/
	padding: 3px 2px 3px 12px;
	margin: 1px 0px 5px 0px;
	vertical-align: middle;
}

/* --------------- Toolbar --------------- */
div.ClsToolBar
{
/*	background: #dfeffc url("../Images/ui-bg_gloss-wave_55_5c9ccc_500x100.png") 50% 50% repeat-x;*/
	background: #dfeffc url("../Images/wave_dark.png") 50% 50% repeat-x;
	color: #ffffff;
	padding: 6px 0px 5px 0px;
	margin: 2px 0px 10px 0px;
	border: none;
}
.ClsTBHome
{
	margin-top: -2px;
	margin-left: 15px;
	vertical-align: middle;
}
.ClsToolBar > .ClsTBHome
{
	color: #ff873f;
}
.ClsTBChkBox
{
	margin-left: 5px;
	vertical-align: middle;
	padding: 0px 0px 0px 10px;
}
.ClsTBChkBox > .ui-chkbox-label
{
	font-size: 14px;
    margin: 2px 0 0 3px;
}
.ClsTBChkBoxLight
{
	margin-left: 5px;
	vertical-align: middle;
	padding: 0px 0px 0px 10px;
}
.ClsTBChkBoxLight > .ui-chkbox-label
{
    margin: 0px 0 0 0px;
}

.ClsCheckboxEmpty > .ui-chkbox-box > .ui-chkbox-icon
{
	background-color: white;
}
.ClsCheckboxPartial > .ui-chkbox-box > .ui-chkbox-icon
{
	background-color: lightGray;
}
.ClsCheckboxFull > .ui-chkbox-box > .ui-chkbox-icon
{
	background-color: transparent;
}

.ClsTBButIcon
{
/*	margin: 5px 0px 5px 0px;*/
}
.ClsTBButIcon > span.ui-button-text
{
	padding: 3.5px;
}
.ClsTBButText > span.ui-button-text
{
	font-size: 14px;
	font-weight: normal;
	padding: 2px 10px;
}
.ClsToolBar > .ClsTBText
{
	font-size: 14px;
	padding: 3px 10px 0px 0px;
}

/* --------------- Menu --------------- */
.ui-layout-container > .ClsMenuBar
{
	border: none; 
	padding: 3px 4px;
}
.ClsMenuBar .ui-menubar, .ui-menubar .ui-menuitem
{
	font-size:14px; /*1.1em; 0.99em;*/							/* Menu-Bug in Firefox s. RTC 229121 */
}
.ClsMenuBar .ui-menubar
{
	padding: 4px 10px;
/*	background: #dfeffc url("../Images/ui-bg_gloss-wave_55_5c9ccc_500x100.png") 50% 50% repeat-x;*/
	background: #dfeffc url("../Images/wave_dark.png") 50% 50% repeat-x;
}
.ui-menu .ui-menuitem a.ui-menuitem-link 
{
    padding: 2px 5px; /*.3em;*/
  	width: calc(100% - 10px);
    white-space: nowrap;
}
.ui-menuitem .ui-button-text
{
    padding: 2px 5px; /*.3em;*/
}
.ui-menu > .ui-menu-list > .ui-menu-parent > .ui-menuitem-link > .ui-menuitem-text
{
	color: #ffffff;
}
.ui-menu > .ui-menu-list > .ui-menu-parent > .ui-state-hover > .ui-menuitem-text, .ClsMenuBut.ui-state-hover, .ui-tabs-nav > .ui-state-hover > a, .ClsTBButText.ui-state-hover > span.ui-button-text
{
	color: #ff873f;				/* orange */
}
.ui-layout-container > .ui-contextmenu,
 .ui-menuitem > .ui-menu-list,
 li.ui-menuitem > ul.ui-menu-list.ui-menu-child
{
	width: auto;
    white-space: nowrap;
}
.ClsMenuBut
{
	padding: 0px 5px;
}
.ClsMenuBut > .ui-button-text
{
	font-weight: normal;
}

/* --------------- Tree --------------- */
.ClsTreeView
{
	margin-top: -12px;
}
.ui-layout-container .ui-layout-pane-west
{
	margin: 2px 5px 2px 5px;
}
.ui-widget-content .ui-tree
{
	border: none;
 	width: 100%;
}
.ui-tree > .ui-tree-scroller
{
	height: 4px;
}
.ClsTreeNodeHidden
{
	display : none;
}

.ui-tree > .ui-tree-container 
{
	margin: 4px 0px;
}

.ui-tree .ui-treenode 
{
	list-style: none outside none;
	margin: 0px;
    padding: 0px;	/* mit Scroll 0px */
    text-overflow: ellipsis;
    overflow: hidden;
}
.ui-tree .ui-treenode-leaf	/*,.ui-tree .ui-treenode-parent*/
{
	margin-top: -3px; /*-3*/
}
.ui-tree .ui-treenode-parent
{
/*	margin-top: 2px;*/
}
.ui-tree .ui-treenode-label 
{
    padding: 0px 3px;
    display: inline;
}
.ui-tree .ui-treenode-label,
.ui-tree .ui-treenode-content
{
	line-height: 18px;
}

.ClsTreeOmElementOdd
{
	background-color: #eff3f9;
}
.ClsTreeOmElementEven
{
	background-color: #dce3ee;
}

div .ui-galleria-content {
    display: flex;
    align-items: center;
    justify-content: center;
}

.ui-button.ui-button-icon-only.ClsOmEvtButton,
.ui-button-icon-only.ClsBorderlessButton
{
	float:right;
	background:transparent;
	border:none;
	text-align:center;
}

.ui-button.ui-button-icon-only.ClsAlarmButton
{
	float:right;
	background:transparent;
	border:none;
	text-align:left;
	width: 8px;
    margin-left: -8px;
    margin-top: -3px;
}

.ui-button.ui-button-icon-only.ui-state-hover.ClsOmEvtButton 
{
	color: #ff873f;	
}
/* --------------- Tabs --------------- */
.ui-tabs.ui-hidden-container.ui-tabs-top
{
	border: none;
}

.ui-datatable-tablewrapper
{
 	width: 100%;
}
.ui-tabs > .ui-tabs-nav						/* Tab-Titel */ 
{
	background: #dfeffc url("../Images/wave_dark.png") 50% 50% repeat-x;
}
.ui-tabs-top.ui-tabs > .ui-tabs-nav 
{
	padding: 3px 3px 0px 3px;
}
.ui-tabs > .ui-tabs-nav > li > a				/* Tab-Titel */ 
{
    padding: 3px 15px; /*.25em 1em;*/
    font-size: 14px;
    font-weight: normal;
}
.ui-tabs .ui-tabs-panel							/* Einrückung der Tab-Seiten */ 
{
	padding: 8px 5px 4px 5px
}

/* --------------- Tabelle --------------- */
td.ClsTdEllipsis				/* Zelleninhalt wird abgeschnitten und stattdessen ... eingeblendet */
{
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 0px;
}
.ClsHeaderInput
{
	padding: 1px 4px;
	margin-top: -1px;
}

.ClsTblNoHeader thead {
    display:none;
}

.ui-datatable thead th			/* Header linksbündig und unten */
{
    text-align: left;
    vertical-align: bottom;
}
.ui-datatable .ui-column-filter
{
 	width: 100%;
  	margin: 0px;
}
/* Filtereingabefelder weniger hoch */
th > .ui-column-filter, th > .ui-column-customfilter > .ui-selectonemenu > .ui-selectonemenu-label,
th > .ui-column-customfilter > div.clr-field .ui-colorpicker.ui-inputfield
{
	padding: 2px 4px 2px 4px;
}
th > .ui-column-filter, .ui-selectonemenu > .ui-selectonemenu-label,
th > .ui-column-customfilter > div.clr-field .ui-colorpicker.ui-inputfield
{
 	width: 90%; /* fallback if needed */
  	width: calc(100% - 10px);
}
.ui-datatable .ui-column-customfilter {
	margin: 0px;
}

/* Combobox in Tabellenzelle mit 100% */
.ui-cell-editor-input > .ui-selectonemenu > .ui-selectonemenu-label
{
	padding: 2px 4px;
	width: 100%;
	overflow: visible;	/* sonst "hidden" und die Zeile zu hoch! */ 
}
.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon 
{
    margin-top: 2px;
}
.ui-column-customfilter > .ui-selectonemenu	/* combobox im Filterheader */
{
	padding-right: 4px;
 	width: 90%; /* fallback if needed */
  	width: calc(100% - 10px);
}
.ClsPGCellRight > .ui-selectonemenu			/* combobox mit Label */
{
	padding-right: 4px;
}

.ui-datatable thead th, .ui-datatable tfoot td, .ui-datatable tfoot th 	/* Tabellen-Head/Foot schmaler */
{
    padding: 4px 5px 2px;
}
thead > tr > th.ui-filter-column > input.ui-column-filter				/* Filter-Header: da Input tiefer stehen als Combo-box korrigieren */
{
	margin-bottom: 2px;
}
.ui-datatable tbody td 	/* Tabellen-Zellen schlanker */
{
    padding: 3px 5px 1px 5px;	/* oben mehr als unten, wegen vertical=top */
    vertical-align: top;
}
.ui-datatable .ui-datatable-header				/* Tabellen-Header */
{
	text-align: left;
}
.ui-datatable .ui-datatable-footer				/* Tabellen-Footer */
{
	font-size: 0.9em;	/* so passt der Button in den Paginator */
/*   padding: 2px 5px;*/
}
.ui-datatable > .ui-paginator-bottom				/* Tabellen-Footer */
{
	font-size: 0.9em;	/* so passt der Button in den Paginator */
	padding-top: 2px;
	padding-bottom: 3px;
}
/*@media all and (max-width:640px)*/
.ui-paginator > .ui-paginator-pages 
{
    display: inline-block;
    padding: 0px;
    margin-top: 1px;
}
.ui-paginator-bottom > a > span.ui-icon
{
    margin-top: -2px;
    padding: 1px 0px;
}

.ui-paginator .ui-paginator-next, .ui-paginator .ui-paginator-last, .ui-paginator .ui-paginator-first, .ui-paginator .ui-paginator-prev
{
    border: none;
}
.ui-paginator .ui-paginator-page
{
    border: none;
}


/* ------------------------------- */
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button
{
	font-family:Arial, sans-serif;
	font-size:1em;
}

.ui-fieldset .ui-fieldset-legend				/* Titel der Gruppen */
{
	padding: 4px 10px 4px 10px;
}

.ui-chkbox .ui-state-default
{
	background: #dfeffc url("../Images/ui-bg_glass_85_dfeffc_1x400.png") 50% 50% repeat-x;
}
.ui-chkbox .ui-state-hover, .ui-chkbox .ui-state-focus
{
	background: #d0e5f5 url("../Images/ui-bg_glass_75_d0e5f5_1x400.png") 50% 50% repeat-x;
}

.ui-selectonemenu-panel.ClsHideDisabled .ui-selectonemenu-item.ui-state-disabled	/* versteckt Select-Options, die disabled sind */
{
    display: none;
}

/* top:50% eliminiert */
.ui-button-icon-only .ui-icon, .ui-button-text-icon-left .ui-icon, .ui-button-text-icon-right .ui-icon 
{
    top: auto;
    margin-top: 2px;
}
.ui-button-icon-only .fa.ui-icon, .ui-button-text-icon-left .fa.ui-icon, .ui-button-text-icon-right .fa.ui-icon 
{
    margin-top: 4px;
}

.ui-fileupload-buttonbar > .ui-button-text-icon-left > .ui-button-text 
{
    padding: 2px 1em 2px 2.1em;
}
.ui-fileupload-buttonbar > .ui-button-text-icon-left > .ui-icon
{
    top: auto;
    margin-top: 0px;
}

.ui-datatable.ui-datatable-sticky > table > thead  /* it is not working yet */
{
    position: sticky;		
    top: 5rem;
	width: 66%;
 }
    
/* --------------- Stile für Icons ---------------------------------------------- */
.ui-widget-content .rsicon, .ui-button > span.rsicon
{
	border-radius: 0;
	background-image: url("../Images/Icons.png"); 
}

.rsicon-prj		{ background-position: -16px 0; }		/* identisch zu icn1 */
.rsicon-fld		{ background-position: -32px 0; }		/* identisch zu icn2 */
.rsicon-dep		{ background-position: -48px 0; }		/* identisch zu icn3 */
.rsicon-itm		{ background-position: -304px 0; }
.rsicon-si		{ background-position: -320px 0; }
.rsicon-st		{ background-position: -64px 0; }		/* identisch zu icn4 */

.rsicon-grp1	{ background-position: -80px 0; }		/* identisch zu icn5 */
.rsicon-grp2	{ background-position: -128px 0; }		/* identisch zu icn8 */
.rsicon-grp3	{ background-position: -176px 0; }		/* identisch zu icn11 */

.rsicon-icn1	{ background-position: -16px 0; }		/* Projekt */
.rsicon-icn2	{ background-position: -32px 0; }		/* Ordner */
.rsicon-icn3	{ background-position: -48px 0; }		/* Depot */
.rsicon-icn4	{ background-position: -64px 0; }		/* graues leeres Kästchen */
.rsicon-icn5	{ background-position: -80px 0; }		/* System, verbaut */
.rsicon-icn6	{ background-position: -96px 0; }		/* System, freier Slot */
.rsicon-icn7	{ background-position: -112px 0; }		/* System, nicht in Ausstattung */
.rsicon-icn8	{ background-position: -128px 0; }		/* Gerät, verbaut */
.rsicon-icn9	{ background-position: -144px 0; }		/* Gerät, freier Slot */
.rsicon-icn10	{ background-position: -160px 0; }		/* Gerät, nicht in Ausstattung */
.rsicon-icn11	{ background-position: -176px 0; }		/* LRU, verbaut */
.rsicon-icn12	{ background-position: -192px 0; }		/* LRU, freier Slot */
.rsicon-icn13	{ background-position: -208px 0; }		/* LRU, nicht in Ausstattung */
.rsicon-icn14	{ background-position: -224px 0; }		/* graues Gerät */
.rsicon-icn15	{ background-position: -240px 0; }		/* 3 Fragezeigen */
.rsicon-icn16	{ background-position: -400px 0; }		/* Ausrufezeichen */
.rsicon-icn17	{ background-position: -416px 0; }		/* Gelbes Fragezeichen */
.rsicon-icn18	{ background-position: -432px 0; }		/* grünes Häkchen */

.rsicon-tr-red	{ background-position: -256px 0; }
.rsicon-tr-yel	{ background-position: -272px 0; }
.rsicon-tr-grn	{ background-position: -288px 0; }

.rsicon-oper-gg	{ background-position: -336px 0; }
.rsicon-oper-gn	{ background-position: -344px 0; }
.rsicon-oper-ng	{ background-position: -352px 0; }
.rsicon-oper-rr	{ background-position: -360px 0; }
.rsicon-oper-rn	{ background-position: -368px 0; }
.rsicon-oper-nr	{ background-position: -376px 0; }
.rsicon-oper-gr	{ background-position: -384px 0; }
.rsicon-oper-rg	{ background-position: -392px 0; }
.rsicon-oper-nn	{ background-position:    0px 0; }


div.rsicon		/* wenn wir Icon alleine z.B. in Tabellen darstellen */
{
	display: inline-block;
	width: 16px;
	height: 16px;
}

div.ClsMaRi4					/* Tabellenzelle: Icon an Text */
{
	margin-top: -1px;
	margin-right: 4px;
	vertical-align: middle;
}
div.ClsMaRi8					/* Tabellenzelle: Icon an Text */
{
	margin-top: -1px;
	margin-right: 8px;
	vertical-align: middle;
}
span.ClsVertAlignMid, div.ClsVertAlignMid	/* Tabellenzelle: Texte und Icons */
{
	vertical-align: middle;
}

button.ui-button.ClsButNavi
{
	float: right;
	width: 24px;
	height: 20px;
	margin-top: -1px;
	font-size: 12px;
}
button.ui-button.ClsButNavi > span.ui-icon
{
	margin-top: 3px;
}
button.ui-button.ClsButNavi.ui-state-hover
{
    color: #ff873f;				/* orange */
}


/* --------------- Dialog (auch Login) --------------- */
.ClsButOKCancel							/* OK/Cancel abgesetzt */
{
	margin-top: 1.5em;
}

.ui-widget-content > .ClsPGCellLeft		/* Padding Celle links */
{
	padding: 2px 10px 2px 0px;
}

.ui-widget-content > .ClsPGCellRight	/* Padding Celle rechts */
{
	padding: 2px 0px 2px 0px;
}

.ui-panelgrid-cell > .ClsWidth250		/* Länge Eingabefelder */
{
	width: 250px;
}

.ui-panelgrid-cell > .ClsWidth600		/* Länge Eingabefelder */
{
	width: 600px;
}

.ui-cell-editor > .ui-cell-editor-input > input
{
 	width: 100%; /* fallback if needed */
  	width: calc(100% - 4px);
}
.ui-cell-editor > .ui-cell-editor-input > select
{
	width: 100%;
}
.ui-cell-editor > .ui-cell-editor-input > select
{
	padding-top: 1px;
	padding-bottom: 1px;
}
.ui-datatable .ui-cell-editor > .ui-cell-editor-input > input, .ui-datatable .ui-cell-editor > .ui-cell-editor-input > select
{
	padding-top: 2px;
	padding-bottom: 2px;
}

.ClsExpiredTxt
{
	padding: 12px 0px 6px 15px;
}

div.ClsDlgFirstLine, table.ClsDlgFirstLine 
{
	margin-top:	6px;
}
div.ui-datatable.ClsDlgFirstLine 
{
	margin-top:	12px;
}
span.ClsDlgFirstLine > input, span.ClsDlgFirstLine > label
{
	margin-top:	6px;
}

.ui-panelgrid > tbody > tr > .ClsTblSep
{
	padding-left: 0px;
	padding-right: 0px;
}

div.ui-chkbox 
{
    margin-left: 6px;
	margin-top: 4px;
}
.ui-chkbox .ui-chkbox-label 
{
    margin-left: 6px;
    margin-top: 2px;
}

.ui-tabs-header.ui-state-default.ui-tabs-selected.ui-state-active > a
{
	cursor: default;
}

.ClsTabIco
{
	display: none;
}

.ClsTabTxt
{
	display: inline-block;
}

button[id='idFrmItems:idTblItems:idBtnToggleMenuBar']
{
	display: none;
}

button.ClsTBHome
{
	display: inline-block;
}

.ui-tooltip-text > ul {
	padding-left: 16px;
	margin: 0.5em 0em;
}

.ui-widget-content .ClsAboutTitle
{
	font-size: 24px;
	color: #ff873f; /*#2e6e9e;*/
	padding: 7px 0px 0px 0px;
}

.ClsDisclaimerBar
{
	background: linear-gradient(#FFEEE5, #FFDFCC, #FFD7BF);
	text-align:right;
	padding: 4px 12px;
	width: 100%;
	position: fixed;
	bottom: 0px;
	right: 0px;
}
.ClsDisclaimerBar a {
	color: black;
	text-decoration: none;
}
.ClsParaJustified p {
	text-align: justify;
}
.ClsScrollPanel {
	padding: 3px 12px;
}
.ClsPara {
	padding:0.5em 0em;
}
a.ClsLink {
	color: #2e6e9e !important;
}
a.ClsLink:hover {
	color: #ff873f !important;
}

.ClsSubMenu{
	color: black;
}

/* ----- Operability (Icons sind nur 8px breit) ---------- */
.ClsOper
{
	display: inline-block;
	width: 8px;
	height: 16px;
	margin-right: 3px;
	vertical-align: middle;
}

/* ---- Urgency -> Handlungsbedarf ------ */
.ClsUrgency {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 3px;
	vertical-align: middle;
	line-height: 16px;
}
.ui-state-highlight .ui-button-icon-left.ui-icon.ui-c.ClsUrgency,
.ui-treenode-content.ui-tree-selectable .ui-treenode-label.ui-state-highlight .ClsUrgency,
.ui-widget-content.ui-datatable-selectable.ui-state-highlight .ClsUrgency
{
	border-radius: 8px;
	background-color: white !important;
	box-shadow: 0px 0px 12px;
}
.ClsUrgencyRed		{ color: #AA0000; }
.ClsUrgencyOrange	{ color: #FF873F; }
.ClsUrgencyGreen	{ color: #00BF00; }
.ClsUrgencyGray		{ color: #D0D0D0; }

/* ---------- Planning Upper Part ----- */
div #idPlan {
    position : absolute;
    width	 : 102%;
    height   : calc( 100% - 70px );
}

/* ---------- Upper Timeline ---------- */ 
.ItemsTimeline {
	display	 : inline-block;
    overflow 	: hidden;
    height      : calc( 100% - 60px - 24px );
    width	   	: 33%;
    padding-top : 27px;
}

.ItemsTimelineNoScr {
	display	 	: inline-block;
	overflow 	: hidden;
  	height		: 100%;
    width	   	: 33%;
    padding-top : 27px;
}

[id='idFrmItemsOps:idTPlan'].ItemsTimeline .vis-timeline.vis-bottom.vis-ltr {
	height: 100% !important;
}

.ItemsTimeline .vis-panel.vis-left.vis-vertical-scroll {
	visibility 	: hidden;
}

.ItemsTimeline .timeline-menu.timeline-menu-axis-top {
	bottom		: revert;
	margin		: 0px;
}

/* ---------- Upper DataTable --------- */ 
.ItemsTable {
    overflow : hidden;
    float	 : left;
    width	 : 65%;
    height	 : 100%;
}

[id='idFrmItemsOps:idTblItemsOps_data'] .ui-datatable-scrollable-body {
	height: 100% !important;
}

/* ---------- Planning Lower Part ----- */
div #idOps {
    position : absolute;
	width	 : 102%;
	height   : 100%;
}

[id='idFrmOpsTabs:idTabs'] {
	height:calc(100% - 70px);
	padding: 0px;
}

[id='idFrmOpsTabs:idTabs'] .ui-tabs-panels {
	height:100%;
}

[id='idFrmOpsTabs:idTabs:idOperations'] {
	height: 100%;
}

[id='idFrmOpsTabs:idTabs:idOpConflicts'] {
	height: 100%;
}

[id='idFrmOpsTabs:idTabs:idOpDesign'] {
	height: 100%;
}

[id='idFrmOpsTabs:idTabs:idOpReserv'] {
	height: 100%;
}

[id='idFrmOpsTabs:idTabs:idTblOpReserv'].ReservTree .ui-treetable-scrollable-body {
	height: calc(100% - 100px) !important;
}

[id='idFrmOpsTabs:idTabs:idOpPacking'] {
	height: 100%;
}

[id='idFrmOpsTabs:idTabs:idTblOpPack'].PackTree .ui-treetable-scrollable-body {
	height: calc(100% - 100px) !important;
}

[id='idFrmOpsTabs:idTabs:idOpReturnal'] {
	height: 100%;
}

[id='idFrmOpsTabs:idTabs:idTblOpReturn'].ReturnTree .ui-treetable-scrollable-body {
	height: calc(100% - 100px) !important;
}

[id='idFrmOpsTabs:idTabs:idOpHist'] {
	height: 100%;
}

/* ---------- Lower Timeline ---------- */ 
.ItemsTimelineOps {
	display	 	: inline-block;
    overflow 	: hidden;
	height      : calc( 100% - 35px - 24px );
    width	   	: 33%;
    padding-top : 35px;
}

.ItemsTimelineOpsNoScr {
    display	 	: inline-block;
    overflow 	: hidden;
	height      : 100%;
    width	   	: 33%;
    padding-top : 35px;
}

[id='idFrmOpsTabs:idTabs:idTOps'].ItemsTimelineOps .vis-timeline.vis-bottom.vis-ltr {
	height: 100% !important;
}

.ItemsTimelineOps .vis-panel.vis-left.vis-vertical-scroll {
	visibility 	: hidden;
}

.ItemsTimelineOps .timeline-menu.timeline-menu-axis-top {
	bottom		: revert;
	margin		: 0px;
}

/* ---------- Lower DataTable --------- */ 
[id='idFrmOpsTabs:idTabs:idTOps_data'] .ui-datatable-scrollable-body {
	height: 100% !important;
}

[id='idFrmOpsTabs:idTabs:idTblOpConf_data'] .ui-datatable-scrollable-body {
	height: 100% !important;
}

/* ---------- Other tabs -------------- */ 
.ConflictsTable {
    overflow : hidden;
    height: 100%;
}

.ReservTree {
	overflow : hidden;
    height: 100%;
}

.PackTree {
	overflow : hidden;
    height: 100%;
}

.ReturnTree {
	overflow : hidden;
    height: 100%;
}

.HistTable {
	overflow : hidden;
    height: calc(100% + 50px) !important;
}
/* ---------- DONE Planning ----------- */


.ClsAppTitlePl
{
       font-size: 20px;
       font-weight: bold;

       padding: 0px 10px 2px 7px;
       vertical-align: middle;
}

.HistTable .ui-datatable-scrollable-body > table.ui-datatable-resizable {
	width:	fit-content !important;
}

.ClsTlLatest
{
	font-weight: bold;
}

.ClsTlLast
{
	border-top-style:hidden;
}

.ClsTlSel
{
	background: #fbec88
}

.ClsTli0 {	padding-left:	 0px; }
.ClsTli1 {	padding-left:	20px; }
.ClsTli2 {	padding-left:	40px; }
.ClsTli3 {	padding-left:	60px; }
.ClsTli4 {	padding-left:	80px; }
.ClsTli5 {	padding-left:  100px; }
.ClsTli6 {	padding-left:  120px; }
.ClsTli7 {	padding-left:  140px; }
.ClsTli8 {	padding-left:  160px; }
.ClsTli9 {	padding-left:  180px; }

.ClsTlEvent.vis-item.vis-range
{
	color:#000000;
	border: 0px hidden #ffffff;
	background: none;
}

body .vis-item.vis-range .vis-item-content
{
	width: 100%
}
/* ---------- sys info ---------- */
.ClsSysInfo .ui-accordion-content {
	padding: 0px;
}
.ClsSysInfoJvm {
	padding: 0px;
}
.ClsSysInfoJvm div
{
	border:solid 2px grey;
	color:black;
	text-align: center;
}
/* ---------- Dialogue Edit Item  ---------- */
.ClsDlgEditItem .ui-accordion-content {
	padding: 0px;
}

/* ---------- fix toggle switch ---------- */
body .ui-toggleswitch .ui-toggleswitch-slider
{
	-moz-transition: background-color .3s;
  -o-transition: background-color .3s;
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  border-radius: 30px;
  background: #ccc;
}

/* ---------- fix toggle switch ---------- */

body .ui-toggleswitch .ui-toggleswitch-slider::before
{
  background-color: #fff;
  height: 1.250em;
  width: 1.250em;
  left: .25em;
  bottom: .25em;
  border-radius: 50%;
  -webkit-transition: .3s;
  transition: .3s;
}

.ui-toggleswitch-slider::before {
  position: absolute;
  content: "";
  height: 1.250em;
  width: 1.250em;
  left: .25em;
  bottom: .25em;
  border-radius: 50%;
  -webkit-transition: .3s;
  transition: .3s;
}

body .ui-toggleswitch.ui-widget.ui-toggleswitch-checked .ui-toggleswitch-slider {
  background-color: #ff873f;
}
/* ---------- end of toggle switch ---------- */

.ClsColrPickCell {
	text-align:center;
	margin-top:4px
}
.ClsColrPickCell div {
	display:inline-block;
	width:1em;
	height:1em;
	border:solid 1px black;
}

/* static message */
.ui-messages-info-detail,  .ui-message-info-detail,
.ui-messages-warn-detail,  .ui-message-warn-detail,
.ui-messages-error-detail, .ui-message-error-detail,
.ui-messages-fatal-detail, .ui-message-fatal-detail {
	display: block;
	margin-left: 26px;
}

.ui-growl-clickable {
	cursor: pointer;
	transition-property: background;
	transition-duration:0.5s;
	background: #f9e2d1;
	margin: 0px;
	border: solid 1px #f9e2d1;
	color: #2e6e9e; 
	opacity: 0.9;
}

.ui-error-code {
	margin-top:1em;
	border-top: dotted 2px #880000;
	color: #880000;
	font-family: Consolas, Courier New;
}

.ui-error-hint {
	margin-top:1em;
	border-top: dotted 2px #2779AA;
	color: #2779AA;
	white-space: pre-line;
}
/*2779AA*/
.ui-error-details
{
	margin-top:1em;
	overflow-y: auto;
	max-height: 125px;
	padding: 0.5em;
	box-shadow: 0px 0px 6px grey;
	border-radius: 6px; 
}

.ui-shadow-none {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;	
}

body .ui-layout-resizer {
    background-color: #fff;
}

/* ----- Planning view ----------------- */
.ClsO1 {
	background-color:#f2f261;
}
.ClsO2 {
	background-color:#7af063;
}
.ClsO3 {
	background-color:#63f0c1;
}
.ClsO4 {
	background-color:#63a9f0;
}
.ClsO5 {
	background-color:#9161f2;
	color:#fff;
}
.ClsO6 {
	background-color:#bdbdbd;
}
.ClsOC {
	background-color:#ba0609;
	color:#fff;
}
.ClsOL {
	background-color:#e05f03;
	color:#fff;
}

.ClsIOpRows
{
	height: 20px;
}

.ClsOpRows
{
	height: 28px;
}

.ClsSsoCfg .ui-inputtext,
.ClsSsoCfg .ui-inputtextarea,
.ClsSsoCfg .ui-password {
	width: 31.125em;
	font-family: Consolas, Courier New, Arial, sans-serif;
}
.ClsSsoCfg .ui-semi-width {
	width: 15em;
}
.ClsSsoCfg .ui-semi-width:first-child {
	margin-right: 0.25em;
}
.ClsSsoCfg .ui-inputfield.ui-width-minus-button {
	width: calc(100% - 3.5em);	
}
.ClsSsoCfg .ui-inputfield[readonly] {
	color: #888;
}
   
.ClsBtnLogin {
	margin-right:15px;
	margin-bottom:3px;
	height: 30px;
	width: 100px;
}

.ClsButtonFlat.ui-button
{
	border: none;
	background: transparent;
}

.ui-columntoggler .ui-columntoggler-items .ui-columntoggler-all {
	display: none;	/* not compatible with Cupertino-Theme */
}

/* customize datePicker component */
.ui-datepicker-group button,
.ui-timepicker-timeinput button {
	background: none;
	border: none;
}

.ui-timepicker-timeinput button {
	filter: brightness(75%);
}

.fa-fw {
	margin-right: 3px;
}

/* watermark/placeholder in grey (default color is too intense/black) */
input::placeholder 
{
   color: #CCC;
   opacity: 1;	/* override firefox's default value */
}
 
/* ----- End of Planning view ---------- */

/* ----- General row colors ------------ */
.ClsCNew {					/* new entry */
	background-color: #e1f7e3;
}
.ClsCDel {					/* entry marked to be deleted */
	background-color: #f9e2d1;
}
.ClsCPack {					/* entry packed */
	background-color: #CCFFEC;  
}
.ClsCShip {					/* entry shipped */
	background-color: #CEE6FF; 
}
.ClsCRet {					/* entry returned */
	background-color: #DDCEFF; 
}
.ClsCOld {					/* marking an old entry, e.g. in alarms */
    background-color: #ececec;
    color: #666666;    
}
.ClsCOra {					/* dark orange, marking expired entries, e.g. in alarms */
	background-color:#f9e1c1;
}
.ClsCYel {					/* yellow entry, e.g. marking pre-existing entries in fixed metadata values */
	background: #fff7c4;
}
.ClsCErr {					/* red errors */
	background: red;
}
.ClsCWar {					/* orange warnings */
	background: orange;
}
.ClsCInf {					/* light blue infos */
	background: grey;
}
.ClsCDis {					/* disabled entry */
	color:#b9b9b9;
}
.ui-menu .ui-divider-horizontal {
	width: calc(100% - 0.5rem);
}
.ui-divider.ui-divider-solid.ui-divider-horizontal {
	padding: 2px 0px 8px;
}
.ui-divider.ui-divider-solid.ui-divider-horizontal::before {
	color: #d7ebf9;
	border-width: 2px;
}
/* ----- End of general row colors ----- */
