body,div,h1,h2,h3,td,th,tr,form,fieldset,
#allhead body, #allhead span,
#allhead h1, #allhead h2, #allhead h3, #allhead h4, #allhead h5, #allhead h6,
#allhead p, #allhead blockquote, #allhead pre, #allhead a, #allhead em, #allhead font, #allhead img, #allhead dl, #allhead dt,#allhead dd,#allhead ol,#allhead ul,#allhead li,
#allhead fieldset,#allhead form,#allhead label,#allhead legend,#allhead table,#allhead caption,#allhead tbody,#allhead tfoot,#allhead thead,#allhead tr,#allhead th,#allhead td
{
	font-family: "Lucida Grande", Helvetica, Verdana, Tahoma, sans-serif;
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	border-collapse: collapse;
	border-spacing: 0;
	list-style: none;
}

/** 
 * Schriften definieren wir einmal für alle Elemente... und müssen dann aber für alle darin geschachtelten Elemente die Schriftgröße erben lassen.
 * Ansonsten gibt es Probleme mit Texten aus dem RichEditor und an anderen Stellen, wo wir mit der Schriftgröße spielen.
 */
* {
	color: #000;
	font-family: "Lucida Grande", Helvetica, Verdana, Tahoma, sans-serif;
	font-size: 12px;
	line-height: 16px;
}
* * {
	color: inherit;
	font-size: inherit;
}
tt, pre, .css {
	font-family: Monaco, "Courier New", Courier, Fixed;
}

img {
	border: none;
}
a {
	border: none;
	cursor: pointer !important;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a label {
	cursor: pointer !important;
}

#header .highlite,
#header .highlite a,
#header .highlite span {
	color: #003399;
}

#navSub .projectHeader, #navSub .reportHeader  { background:#c5dfae; } /* project box */


.columnHeader:hover {color:#FF6600;}
.tabs div,.tabs div h3 span {background-color:#e4e4e8;}
.tabs .act {border-left:8px solid #8AC2D6;padding-left:222px;}
.tabs h3 {border-color:#000;}

/*TO DO:*/ #menu ul.mainmenu li input.disabled, #menu ul.mainmenu li span.disabled, #menu ul.mainmenu li a.disabled {color:#656F6F;}
/* Left nav */
.rich-tab-header {border-color:#ccc;}
.rich-tabpanel-content , .rich-tab-active, .rich-tab-bottom-line {border-color:#6CAD2F;}
.rich-tab-active {background:#C5DFAE; background:-webkit-gradient(linear, left top, left bottom, from(#9AD167), to(#fff));background:-moz-linear-gradient(top,  #9AD167,  #fff);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9AD167', endColorstr='#ffffff');}
.rich-tab-inactive {background:#eee; background:-webkit-gradient(linear, left top, left bottom, from(#ddd), to(#eee)); background:-moz-linear-gradient(top,  #ddd,  #eee); }
.rich-tab-inactive:hover {background: rgb(201,208,219); } 
.rich-tab-disabled {background:#eee; background:-webkit-gradient(linear, left top, left bottom, from(#ddd), to(#eee)); background:-moz-linear-gradient(top,  #ddd,  #eee); color:#888; }

#navSubSub li {background-color:#e4e4e8;background-image:url(/EurekaRLPPlus/javax.faces.resource/gfx/img/navsubsub-ul-li_bg.png.xhtml);border-color:#a1a1a3;}
#navSubSub li:hover{background-color: #c5dfae;}
#navSubSub .selected {background-color:#C5DFAE;} /* Schönes Blau: #8ac2d6 */
#navSubSub .selected  input.asLink {color:#000; font-weight: bold;}
#navSubSub input.asLink, #navSubSub a {color:#000;} /* buttons "asLink" */
#navSubSub input[disabled].asLink, #navSubSub a[disabled] {color:#aaa;}
input[type='submit'],input[type='button'],.tabs input { background-color:#DEE5EB;color:#000;}
input[type='submit']:hover {color:#000;}
input.important[type='submit'],input.important[type='button'], .tabs input.important {background-color:#8AC2D6;}
input.important2[type='submit'],input.important2[type='button'], .tabs input.important2 {background-color:#a2d96d; border-color:#5c902a;}

/* Links */
dl.zuwes dt {border-top: 1px dotted #aaa; font-weight:bold; clear:both; float:left; width:25%; padding:3px 0; margin:0;}
dl.zuwes dd {border-top:1px dotted #aaa; padding:3px 0; float:right; width:75%; margin:0;}

/* Formulare */
#contentMain fieldset {border-color:#cbcbcd;}
input,
textarea,
select {
	border: 1px solid #bbb;
	background-color: #e3f1d7; 
	color: black; 
	border-radius: 3px;
	-o-border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
/*buttons*/
input[type='submit'],
input[type='button'],
.tabs input {
	border-color:#bbb;
}

.css {
	white-space: pre;
}

#header {
	margin-right: 120px;
}
#header * {
	font-size: 11px !important;
}

/* LINKS */
#allhead a {font-weight:bold;text-decoration:none;}

#setSums a, #setAverage a, #setGroupBy a {font-weight:bold;text-decoration:none; color: black;}


/* HEADLINES
----------------------------- */
h4 {font-size:20px;line-height:20px;color:#D8DFD1;text-transform:uppercase;padding:0;padding-left:207px;margin:-5px;}


/* BASIC STRUCTURE / Layout */
#header {padding:10px;}
#logo {position:absolute; right:5px; top:-5px; z-index: -1;}
#content {margin:20px 8px;}
#navSubSub {padding-right:20px;float:left;margin-right: 20px}
body.form #contentMain {float:none; margin-left:250px;}
body.form #contentMainNoMargin {float:none;}


/* TABLES */
#pageCreator th, #pageCreator td {text-align:left;} /* Nicht für alle TH und TD öffnen... sonst gehen bestimmte Alignments nicht mehr! */
table, td, th, fieldset, tbody  {margin-left:0;margin-right:0;padding-left:0;padding-right:0;border-collapse:collapse;}

#pageCreator .tableOneRow th {text-align: center;} 

.innerTextLink a:active, .innerTextLink a:link, .innerTextLink a:visited {text-decoration:underline;}
.innerTextLink a:hover { text-decoration:underline;}


/* Runde Buttons  UK */
.tabs input,
.tabs input {
	border-width:1px;
	border-style:solid;
	margin:5px;
	-o-border-radius: 2px; 
	-moz-border-radius: 2px; 
	-webkit-border-radius: 2px; 
	border-radius:2px; 
	-o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
	cursor:pointer;
}

#navSubSub input,#navSubSub input, #menu input {-moz-box-shadow:none;}


.tableControl,.actionButtons {width:100%;}
.tableControl a {padding-left:10px;}
.tableControl {text-align:right;}
.footer {text-align:center; }

.rich-table {width:100%;}

/* Überschriften sollten zumindest ein grundlegendes Styling erhalten... */
h1, h2, h3, h4, h5, h6 { margin: 0 0 0.25em 0; }
h1 { font-size: 1.5em; line-height: 1.7em; }
h2 { font-size: 1.4em; line-height: 1.6em; }
h3 { font-size: 1.3em; line-height: 1.5em; }
h4 { font-size: 1.2em; line-height: 1.4em; }
h5 { font-size: 1.1em; line-height: 1.3em; }
h6 { font-size: 1.0em; line-height: 1.2em; }

/* PROJECT TABS "Aktionsleiste" */
.tabs {margin:0 8px;}
.tabs div {clear:both;overflow:hidden;margin-bottom:1px;padding:6px 12px 6px 230px;}
.tabs h3 {border-bottom-width:1px;border-bottom-style:dotted;width:200px;float:left;display:inine;font-style:italic;font-weight:normal;margin:5px 0 0 -218px;}
.tabs h3 span {padding-bottom:1px;margin-bottom:-1px;}

.message {border:1px solid #FFCC00; padding:5px; margin-top:5px; margin-bottom:5px; background-color:#F0F8FF; /* font-size:12px; */}
ul.message {border:1px solid #f00; padding:5px; margin-top:5px; margin-bottom:5px; background-color:#fdd; /* font-size:12px; */}
ul.message li {font-weight:bold; color:#000; margin-left:20px;}
.name {vertical-align:top; font-weight:bold; width:115px; float:left; padding:5px; margin-top:3px; clear:left;}
.value {float:left; padding:5px;} /* Wofür wird das genutzt? Die Klasse ist viel zu allgemein für einen solchen Style... */
.error {float:left; padding:5px;} /* Wofür wird das genutzt? Die Klasse ist viel zu allgemein für einen solchen Style... */
.errors {color:red; vertical-align:middle;}
img.errors {padding-right:5px;}
.errors input {border:1px solid red;}
.errors textarea {border:1px solid red;}
.required {color:red; padding-left:2px;}
.rich-stglpanel-body {overflow:auto;}
.floatLeft {float:left;}
.clearfix {clear:both;}

table.plandata {}
table.plandata td {padding:3px 5px; border:1px solid #ccc; white-space:nowrap;}
table.plandata th {font-weight:bold; background:#ddd; padding:5px; border:1px solid #888;}
table.plandata th.totals {background:#ccc;}
table.plandata th.subtotals {background:#ddd;}
table.plandata td.totals {background:#eee;}
table.plandata td.subtotals {background:#f3f3f3;}
table.plandata td.differs {background:#ffffcc;}
table.plandata td.warning {background:#ffaaaa;}
table.plandata tr.totals {background:#eee; font-weight:bold;}

label.label_bold {font-weight:bold; padding:0 5px 0 0;}
label.label_normal {font-weight:normal; padding:0 5px 0 0;}

input.money {
    width: 100%;
    text-align: right;
}
td > input.money { /* A1E-6928 */
    width: auto;
}

input.input_money, input.input_money_readonly {text-align:right; border:1px solid #bbbbbb;}
input.input_money_readonly {background-color:#dddddd;}

input.amount {width:100%; text-align:right;}
.named {float:left; margin-top:5px;}
input[type="checkbox"].small {margin:0;}
.logo {text-align:center; margin:10px;}
.logo h2 {margin:auto;}

#plandata .rich-calendar-input {width:80px;}

/* FILE:richFacesITBS.css */
#infos {margin:0 5px; width:0px; min-width:0px; max-width:300px;}
#infos select {border-color:gray; border-style:solid; border-width:1px; :}
.notBold label {font-weight:normal;}

/**
 * @see common.js jQuery.fn.autocomplete()
 * @see http://stackoverflow.com/a/37089477/173689
 */ 
.invisible  {
	margin: -1px;
	padding: 0;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip: rect(0, 0, 0, 0);
	position: absolute;
}
.transparent {
	opacity: 0;
}

.dr-pmenu-disabled-element {color:#aaa;}
.vtop {vertical-align:top;}
table.tableProjects {white-space:nowrap;}
table.tableProjects td {overflow:hidden; max-width:200px;}
.panelProjects {/* hier NICHT aktivieren! overflow:scroll; */}
table.errors,table.hints {margin:10px;}
.margin10 {margin:10px;}
.dr-table-footer-continue .sub,.dr-table-footer .sub {background:#eee; font-weight:normal;}

.leftmiddle {text-align:left; vertical-align:middle !important;}
.rightmiddle {text-align:right; vertical-align:middle !important;}
tr.odd {background:#fff;}
tr.even {background:#eee;}
input.selectVoucher {margin:0 0 0 20px; float:right; font-size:0.8em;}
.rich-calendar-exterior {background-color:#FFFFFF;}
.rich-ordering-list-row-selected {background-color:#CED7EF;}
.rich-datascr-inact,.dr-dscr-inact {color:#C0C0C0;}
.rich-datascr { display: inline-block; }
.fakeInputNumber {display:block; width:100px; background-color:#DDDDDD; border:1px solid #BBBBBB; text-align:right;}
.fakeInputString {display:block; width:100px; min-height:15px; font-size:12px; background-color:#DDDDDD; border:1px solid #BBBBBB; text-align:left;}
/**
 * Die folgenden Definitionen sind für die statische Variante für die öffentlich-rechtlichen Mittel
 * beim ESF Zwischenbericht hinzugekommen. Ich versuche dort mit möglichst wenig class Definitionen
 * auszukommen und ein entsprechendes Look&Feel für das Formular hinzubekommen.
 */
table.formgenerator {empty-cells:show; border-collapse:collapse; border-spacing:0;}
table.interimreport td,table.interimreport th {text-align:left; vertical-align:top;}
table.interimreport .number {min-width:100px;}
table.interimreport .label {min-width:250px; text-align:left !important;}
table.interimreport .infos {text-align:center;}
table.interimreport .third {width:150px;}
table.interimreport .input {}
table.interimreport .output {}
table.interimreport .input span,table.interimreport .output span {display:block; width:100px; min-height:15px; background-color:#DDDDDD; border:1px solid #BBBBBB;}
table.interimreport .input input[type="text"] {width:100px !important;}
table.interimreport .currency span,table.interimreport .currency input[type="text"] {text-align:right;}

.selected {
	background: #def;
}

.orgUnitForm {
	max-width: 600px;
}

#panelOrgUnit table {
	border-collapse: separate;
}

.orgUnitForm caption {
	padding: 5px;
	background: rgb(240, 240, 240);
	font-style: italic;
}

.orgUnitForm img {
	border: none;
	margin: 0 1px;
	cursor: pointer;
	vertical-align: middle;
}

.orgUnitForm .info {
	font-style: italic;
	margin: 3px;
	vertical-align: baseline;
}

.orgUnitForm select,.orgUnitForm input[type="text"],.orgUnitForm input[type="password"],.orgUnitForm textarea {
	width: 275px;
	font-size: 12px;
}

.orgUnitForm  input[type="submit"],.orgUnitForm  input[type="button"] {
	font-size: 10px;
	margin: 2px;
}

.orgUnitForm .orgUnitToolBarButton {
	border: none;
	margin: 2px 10px;
	padding: 0;
	vertical-align: bottom;
}

.orgUnitForm img.lvl,
.orgUnitForm input[type="checkbox"].lvl {
	width: 16px;
	margin: 1px;
	float: right;
}
.orgUnitForm input[type="checkbox"].access {
	border: 1px solid #f00;
}
.orgUnitForm input[type="checkbox"].assign {
	border: 1px solid #07f;
}

.dr-tbpnl-tb-inact {background:#eee;}
.unsaved {border:3px solid #f00; -moz-border-radius:10px; -webkit-border-radius:10px; padding:5px;}
#pleaseWaitWhileLoading .dr-mpnl-pnl {overflow:hidden !important;}
*:first-child+html #pleaseWaitWhileLoading .dr-mpnl-pnl {overflow:hidden;}
.rotate90ccw {-webkit-transform:rotate(-90deg); -moz-transform:rotate(-90deg); filter:progid:DXImageTransform.Microsoft.BasicImage ( rotation = 3 );}
#iRSList .rich-calendar-input {width:80px !important;}
#iRSList th {background:#eee;} 
td.hidewrap {white-space:nowrap; overflow:hidden; max-width:500px;}td.hidewrap200 {white-space:nowrap; overflow:hidden; max-width:200px;}
.dr-mpnl-pnl-h {background-image:none; background:#eee;}
.dr-tree-i-hl:hover {text-decoration:none; background:#eef; color:inherit;}

.rich-tree-node a {
	width: 100%;
	display: block;
	text-decoration: none;
}
.rich-tree-node,
.rich-tree-node a {
	color: #000;
}
.rich-tree-node-highlighted {
	text-decoration: none;
	background-color: #eee;
}

/* FILE:navSub.css */
.rich-tabpanel {
	margin:0 8px 8px;
	width: 100%;
    box-sizing: border-box;
}
#formTasks .rich-tabpanel {
	width: 100%;
}
.rich-tabpanel table,
.rich-tabpanel td, 
.rich-tabpanel th, 
.rich-tabpanel fieldset, 
.rich-tabpanel tbody {
	 border-collapse: separate;
}
.rich-tabpanel-content {
	padding: 5px; 
	border-width: 1px;
	border-top-width: 0; 
	border-style: solid; 
	margin: 0 8px; 
	font-size: 12px;

	border-radius: 0 0 5px 5px;
	-o-border-radius: 0 0 5px 5px; 
	-moz-border-radius: 0 0 5px 5px; 
	-webkit-border-radius: 0 0 5px 5px; 

	box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
	-o-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
	-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
}
.rich-tab-bottom-line {
	border-radius: 0;
	-o-border-radius: 0; 
	-moz-border-radius: 0; 
	-webkit-border-radius: 0; 
}
.rich-tab-active {border-width:3px; border-style:solid;}
#navSub td {padding-top:0;}
#navSub .rich-tab-bottom-line td {padding-top:2px;}

#navSub td.rich-toolbar-item input[type="submit"].transferButton, #navSub td.rich-toolbar-item input[type="button"].transferButton {background-image:url(navSub_uebernehmen_icon.gif); background-repeat:no-repeat; background-position:center left; background-color:#2F628F; color:#FFFFFF;}
#navSub td.rich-toolbar-item input[type="submit"].selectProjectButton, #navSub td.rich-toolbar-item input[type="button"].selectProjectButton {background-image:url(navSub_Projektnr_auwaehlen.gif); background-repeat:no-repeat; background-position:center left; background-color:#2F628F; color:#FFFFFF;}
#navSub .projectNumberText {background-color:#D9DADB; /*#2F628F;*/ color:#2F628F; /*#FFFFFF;*/ margin:0; padding:0; border:1px solid #2F628F;}
#navSub .projectNumberLabel {font-size:10px; background-color:#2F628F; color:#FFFFFF; border:0;}
#navSub label {background-color:#EBECEC; color:#6B6B6B; padding:2px 4px 2px 0px; margin:0; border:1px solid #FFFFFF; border-right:0; font-size:11px;}*:first-child+html #navSub label {background-color:#2F628F; color:#FFFFFF; padding:3px 3px 1px 2px; margin:0; font-size:11px; font-weight:bold;}
#navSub .dr-pnl, #navSub .rich-panel {margin:0; margin-right:-40px; border:0; padding:0; padding-left:5px; padding-top:5px; padding-bottom:5px;}
#navSub .projectHeader, #navSub .reportHeader {
	margin:4px 8px 2px 8px;

	border-radius: 3px;
	-o-border-radius: 3px; 
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
}
#navSub .reportHeader .rich-panel-body, #navSub .projectHeader .rich-panel-body, #navSub .reportHeader .dr-pnl-b, #navSub .projectHeader .dr-pnl-b {padding:0;}
#navSub .reportHeader table, #navSub .projectHeader table {width:100%; border-spacing:0;}
#navSub .reportHeader table th, #navSub .projectHeader table th {margin:0; padding:0; padding-left:10px; padding-right:4px; border:0; white-space:nowrap; /*font-size:110%;*/}
#navSub .reportHeader table td, #navSub .projectHeader table td {font-weight:normal; margin:0; padding:0; padding-right:10px; border:0; white-space:nowrap; font-size:110%;}
#navSub .reportHeader table td.trenner, #navSub .projectHeader table td.trenner {/*background:#C9CACB;*/ background:#CACBC9; padding:0; padding-left:2px;}
#navSub .theProposal {}
#navSub .modProposal {}
#navSub .actions {font-weight:normal; color:#6B6B6B; margin:0; padding:0; /*	padding-top:4px; padding-bottom:5px;*/ border:0; text-align:left;}
#navSub .actions input[type="button"] {font-weight:normal; background-color:#D9DADB; color:#6B6B6B; margin:0; padding:0; border:0;}
#navSub .actions input[type="button"]:hover {background-color:#EBECEC; }

#navSub .verticalSpacer {height:10px; background:#D9DADB; margin-left:-22px;}
#navSub td.switchButton {text-align:right; width:100%;} 
#formProjectHeader th {border-left:1px solid #9cc37a !important;}
#formProjectHeader th:first-child {border:0px !important;}
#formProjectHeader a { font-size: 100%; }


/** Die Anzeige der normalen FacesMessages wird durch dieses CSS gesteuert... **/
.facesMSGs {
	color: #333;
	background-color: transparent !important;
	border: none !important;
	width: 100%;
	padding: 0;
	margin: 10px 0;
	list-style: none;
}
.facesMSGs li {
	padding: 3px 10px;
	margin: 1px 5px;
	color: #333;
	font-size: 12px !important;
	font-style: normal !important;
	font-weight: normal !important;
	float: none !important;
    border-radius: 5px;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.25);
}
.facesMSGs li.info {
	border: 1px solid #aaa;
	background: #eef;
}
.facesMSGs li.warn {
	border: 1px solid #aa0;
	background: #ffc;
}
.facesMSGs li.error {
	border: 1px solid #f00;
	background: #fcc;
}
.facesMSGs li.fatal {
	border: 1px solid #f00;
	background: #fcc;
}

#messageNotice, #messageProject, #messageWartung, #messagesHint {-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; margin:5px; padding:3px 10px;} 
#messagesHint {background-color:rgba(255,255,200,0.9); border:2px solid #aa0; color:#333; position:fixed; top:30px; left:30px; padding:10px; z-index:50;}
#messageNotice, #messageWartung {background:#fca; border:2px solid #f70; color:#333;}
#messageProject {background:#ffc; border:2px solid #f70; color:#333;}

#wartungsmeldung {
	font-size: 1.1em;
	background: #fec;
	background:         linear-gradient(top, #fec, #eca);
	background:      -o-linear-gradient(top, #fec, #eca);
	background:     -ms-linear-gradient(top, #fec, #eca);
	background:    -moz-linear-gradient(top, #fec, #eca);
	background: -webkit-linear-gradient(top, #fec, #eca);
	border: 1px solid #555;
	color: #333;
	margin: 5px;
	padding: 10px;
	text-align: center;
	display: block;
    border-radius: 5px;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
}

/* FILE:content.css */
#content td {vertical-align:top;}
#content .vMiddle form select, #content .vMiddle form input {vertical-align:middle; margin:5px 10px;}
#content .vMiddle td, #content .vMiddle th {vertical-align:middle; padding:2px 3px;}
.auditReportCategoryList, .auditReportCategoryList td {border-collapse:collapse; border:1px solid #C0C0C0; padding:1px 4px 1px 4px;}

form#pageCreator .action td {border:none;}
#mainGridRuec .unsizedValue INPUT[type = "text"] {width:500px; font-size:12px; background:#FFFFFF;}


#navSubSub input.asLink, #navSubSub a {text-decoration:none; font-size:10pt; font-weight:normal; display:block; width:100%; text-align:left;}

a[disabled],
input[disabled],
input[disabled].asLink {
	cursor: default;
}

#navSubSub ul {list-style:none; width:194px; padding:0;margin:0;}
#navSubSub li {width:100%; padding:3px 5px 3px 23px; border-bottom-style:dotted;border-width:1px;background-repeat:no-repeat;background-position:12px -53px;}
#navSubSub .selected {background-position:12px 7px;}
#navSubSub li:first-child {border-top-style:dotted;}



/* FILE:contentMain.css */
#contentMain {margin:0px; padding:0px; /* border:solid 2px #D9DADB; */}
#contentMain .buttonForWorkflowBefore {margin-top:20px; display:none;}
#contentMain .rich-panel {border:0;}
#contentMain .dr-pnl {}
#contentMain .dr-stglpnl {}
#contentMain .rich-stglpanel {}
#contentMain .rich-panel-header {display:none;}
#contentMain .rich-panel-header-block {display:block;}
#contentMain .actions {border:0; background-color:#FFFFFF; padding:0px 0px 0px 10px; width:auto;}
#contentMain .actions #actionsTitle {float:left; background-color:#D9DADB; font-size:12px; line-height:16px; font-weight:bold; padding:3px 10px 4px 15px; margin:0; margin-right:2px; letter-spacing:0.1em; border:0;}
#contentMain .actions input:disabled {color:#bbb;}
#contentMain .listTop {padding:20px 20px 20px 10px;}
#contentMain .default {}
#contentMain .series td {text-align:right;}
#contentMain .ersteSpalte td {width:250px; white-space:normal; display:block;}
#contentMain .ersteSpalte label {width:250px; white-space:normal; display:block;}
#contentMain .adjustValue {margin-left:25px;}
#contentMain .title {display:block; font-size:16px; padding:0; padding-bottom:10px; text-align:left; font-weight:bold;}

/* BOF: UK MOD Neu eingefügt für Formualare */
#contentMain fieldset > legend {font-size:12px;}
#pageCreator fieldset > legend {font-size:14px;}
#contentMain legend > label {margin:5px 0;}


/* EOF: UK MOD Neu eingefügt für Formualare */







#mainGrid .costfinance input {width:100px !important;}
#mainGrid .label, #mainGrid .formLabel {width:250px; white-space:normal; text-align:right; display:block;}
#mainGrid div.year {width:auto; display:inline; float:left; padding:1px 3px;}
#mainGrid input.year_readonly {text-align:right; border:1px solid #bbbbbb; background-color:#dddddd; width:80px !important; display:block;}
#mainGrid label.year {display:block; width:auto; text-align:left;}
#mainGrid input.year, #mainGrid span.year {width:80px !important; display:block;}
#mainGrid input.readonly, #mainGrid textarea.readonly, #mainGrid select.readonly {color:#aaa;}
#mainGrid input[type="text"], #mainGrid textarea, #mainGrid select {width:500px; font-size:12px; background:#FFFFFF;}
#mainGrid input[type="text"].input_money, #mainGrid .inputTable input[type="text"], #mainGrid .inputTable textarea, #mainGrid .inputTable input[type="radio"], #mainGrid .inputTable select {width:auto; text-align:right; background:#FFFFFF;}
#mainGrid input[type="text"].input_money_readonly {width:auto; text-align:right; background:#dddddd;}
#mainGrid input[type="text"].input_money_conflict {width:auto; text-align:right; background:#FA8072;}
#mainGrid .inputTable td {text-align:right;}
#mainGrid .rich-spacer, #mainGrid .rich-separator {display:none;}
#mainGrid input[type="button"], #mainGrid input[type="submit"] {padding:0 5px 0 20px; height:15px; text-align:center;}
#mainGrid .unsizedValue select, #mainGrid .unsizedValue input {width:auto;}
#mainGrid .unsizedValue label {font-weight:normal;}
#mainGrid .listActionLinks a {border:1px solid #D9DADB; margin:0; margin-right:10px; text-decoration:none; padding-right:4px; padding-left:20px; background-image:url(pfeil-button-in-liste.gif); background-repeat:no-repeat; background-position:center left; white-space:nowrap;}
#mainGrid .listActionLinks a:hover, #mainGrid .listActionLinks a:active {text-decoration:underline;}
#mainGrid .rich-table, #mainGrid .rich-table td, #mainGrid .rich-table th {border-color:#D9DADB;}
#mainGrid .rich-table-footercell, #mainGrid .tableTrenner {height:20px; background:#FFFFFF;}
#mainGrid .rich-table th {text-align:left;}
#contentMain .buttonForWorkflowAfter {margin-top:20px; position:relative; bottom:0px;}
/*history anfang*/
#contentMain .history {padding-left:20px; padding-top:40px;}
#contentMain .history TH {text-align:left;}
.historyModalPanel TH {text-align:left;}
#mainGrid .überschrift {font-size:14px; font-weight:normal;}
#searchProposalPanelContentDiv {overflow-y:scroll;}
#messagePanelContentDiv {overflow-y:scroll;}
#messagePanelProjectNotFoundContentDiv {overflow-y:scroll;}
#messagePanelDeleteVoucherContentDiv {overflow-y:scroll;}
#mainGrid .erstellenVonFuss td {font-weight:normal;}
#mainGrid .sizedValue input[type = "text"] {width:300px;}
#mainGrid .sizedValue textarea, #mainGrid .sizedValue select {width:300px;}
#formTrsEdit .rich-table {width:auto;}
#formTrsEdit .trsStunden {margin-left:250px;}
#mainGrid .listReports {border-collapse:separate;}

/* FILE:infos.css */
@CHARSET "ISO-8859-1"; #infos {}
#infos .open {border:2px solid #D9DADB; border-right:0; width:160px;}
#infos .closed {border:2px solid #D9DADB; border-right:0; width:15px;}

/* FILE:PopUpProposal */
#searchProposalContentDiv {border:1px solid black; background-color:#C4C2C2;}
#searchProposalContentTable {background-color:#C4C2C2;}
#searchProposalContentTable .searchProject {color:#2F628F; background-color:#EBECEC; margin:2px; padding:3px 5px 3px 5px; border:1px solid white;}
#searchProposalContentTable .searchProjectText, #searchProposalContentTable .countPage {color:#2F628F; padding-right:10px; padding-left:5px;}
#searchProposalContentTable .dr-table-headercell, 
#searchProposalContentTable .dr-table-cell, #searchProposalContentTable .rich-table-cell {border:2px solid white;}
#searchProposalContentTable .rich-table-subheadercell {border:2px solid white;}
#searchProposalContentTable .odd .projectNr, #searchProposalContentTable .odd .currentProposal, #searchProposalContentTable .odd .status, #searchProposalContentTable.odd .proposalName, #searchProposalContentTable .odd .zgs {color:#2F628F; background-color:white;}
#searchProposalContentTable .headProjectNr, #searchProposalContentTable .headCurrentProposal, #searchProposalContentTable .headStatus {background-color:#EBECEC;}
#searchProposalContentTable .even .projectNr, #searchProposalContentTable .even .currentProposal, #searchProposalContentTable .even .status {background-color:#EBECEC; color:#2F628F;}
#searchProposalContentTable .headProposalName, #searchProposalContentTable.headZgs {background-color:#DEE5EB;}
#searchProposalContentTable .even .proposalName, #searchProposalContentTable .even .zgs {background-color:#DEE5EB; color:#2F628F;}
#searchProposalContentTable .left {text-align:left;}
#searchProposalContentTable .right {text-align:right;}
#searchProposalContentTable .rightTable {display:inline;}
#searchProposalShadowDiv {display:none;}

/* FILE:trs.css */
#trsContentTable {background-color:#C4C2C2;}
#trsContentTable input[type="text"] {width:150px;}
#trsContentTable select {width:50px;}

#trsContentTable .searchTRSCount {color:#2F628F; background-color:#EBECEC; margin:2px; padding:3px 5px 3px 5px; border:1px solid white;}
#trsContentTable .searchTRSText, #trsContentTable .countPage {color:#2F628F; padding-right:10px; padding-left:5px;}
#trsContentTable .dr-table-headercell, 
#trsContentTable .dr-table-cell, #trsContentTable .rich-table-cell {border:2px solid white;}
#trsContentTable .rich-table-subheadercell {border:2px solid white;}
#trsContentTable .headFunktionen, #trsContentTable .headTRSName, #trsContentTable .headTRSVoname, #trsContentTable .headTRSAnonymized, #trsContentTable .headTRSzusatz, #trsContentTable .headTRSVLoeschen, #trsContentTable .headTRSBearbeiten {background-color:#EBECEC;}
#trsContentTable .left {text-align:left;}
#trsContentTable .right {text-align:right;}
#trsContentTable .rightTable {display:inline;}
#trsSearch {padding-left:16px;}
#trsSearch .vtop input[type="text"] {width:220px;}


/* FILE:voucher.css */
#voucherContentTable {background-color:#C4C2C2;}
#voucherContentTable input[type="text"] {width:130px;}
#voucherContentTable select {width:50px;}
#voucherContentTable .searchVoucherCount {color:#2F628F; background-color:#EBECEC; margin:2px; padding:3px 5px 3px 5px; border:1px solid white; }
#voucherContentTable .searchTRSText,#voucherContentTable .countPage {color:#2F628F; padding-right:10px; padding-left:5px;}
#voucherContentTable .dr-table-cell,#voucherContentTable .rich-table-cell {border:2px solid white;}
#voucherContentTable .rich-table-subheadercell {border:2px solid white;}
#voucherContentTable .headVoucher {background-color:#EBECEC;}
#voucherContentTable .left {text-align:left;}
#voucherContentTable .right {text-align:right;}
#voucherContentTable .rightTable {display:inline;}
#voucherSearch {padding-left:16px;}
#voucherSearch .vtop input[type="text"] {width:220px;}
.voucherFilter fieldset {display:inline; padding:5px; vertical-align:bottom;}
.voucherFilter fieldset legend {font-weight:bold;}
.voucherFilter fieldset input[type="submit"] {margin:10px 5px;}
.voucherFilter fieldset input:disabled {color:#ccc;}
#formBelege {margin-top:30px;}
.rightJustifiedfooter {margin-left:auto; margin-right:0px; padding:0;}.rightJustified {text-align:right;}
.leftJustified {text-align:left;}

/* FILE:import.css */
#newImport table.import {margin:10px 0; width:auto !important;}
#newImport table.import th {background:#ccc;}
#newImport div.progressbar {border:1px solid #aaa; -webkit-border-radius:3px; -moz-border-radius:3px; width:150px;}
#newImport table.legend {float:right; padding:5px; border:1px solid #aaa; -webkit-border-radius:3px; -moz-border-radius:3px;}
#newImport table.legend div.progressbar {width:50px;}
#newImport table.legend th {background-color:#ddd; padding:3px;}
#newImport div.progressbarlevel {display:inline-block; background:none; width:100%; height:12px;}
#newImport div.progressbarlevel span.info {color:#555; font-size:10px; font-style:italic; font-weight:normal; width:150px; display:inline-block; text-align:center; white-space:nowrap; overflow:hidden;}
#newImport td.label {background-color:#eee; font-weight:bold; text-align:right;}
#newImport div.pending {background-color:#ccc !important;}
#newImport div.running {background-color:#88f !important;}
#newImport div.success {background-color:#8f8 !important;}
#newImport div.warnings {background-color:#ff8 !important;}
#newImport div.failure {background-color:#f88 !important; width:100% !important;}
#newImport .msg {color:#555; background-color:#eef;}
#newImport .ERROR {background-color:#f88;}
#newImport .WARN {background-color:#ff8;}
#newImport .SUCCESS {background-color:#8f8;}
#newImport input[type="submit"] {margin:0 1px;}
#newImport .listActionLinks a {border:1px solid #D9DADB; margin:0; margin-right:10px; text-decoration:none; padding-right:4px; padding-left:20px; background-image:url(pfeil-button-in-liste.gif); background-repeat:no-repeat; background-position:center left; white-space:nowrap;}
#newImport .listActionLinks a:hover, #newImport .listActionLinks a:active {text-decoration:underline;}
#newImport form.import * {margin:5px;}
#newImport form.import input[type="submit"].validate {background:#eee url(/EurekaRLPPlus/javax.faces.resource/gfx/img/import/spell-check.png.xhtml) no-repeat 5px center; padding:3px 3px 3px 25px; border:1px solid #555;  	-webkit-border-radius:3px; -moz-border-radius:3px; cursor:pointer;}
#newImport form.import input[type="submit"].import {background:#eee url(/EurekaRLPPlus/javax.faces.resource/gfx/img/import/disk-black.png.xhtml) no-repeat 5px center; padding:3px 3px 3px 25px; border:1px solid #555; -webkit-border-radius:3px; -moz-border-radius:3px; cursor:pointer;}
#newImport .help {cursor:help;}

/* HELPERS, HELFERLEIN */
.left {
	text-align: left !important;
}

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

.valignMiddle {
	vertical-align: middle;
}

.nowrap {
	white-space: nowrap !important;
}
.wrap {
	white-space: normal !important;
}

/* Spezial-Variante f�r SELECT_MANY_CHECKBOX und SELECT_ONE_RADIO_VERTICAL
*/
.indentwrap {
	white-space: normal !important;
	display: table !important;
}
.indentwrap td {
	display: table-row !important;
}
.indentwrap td:hover {
	background: #ddd;
}
.indentwrap td label,
.indentwrap td input[type="checkbox"] {
    display: table-cell !important;
	margin: 3px 5px !important;
}
.bold, bold * {
	font-weight: bold;
	color: #000;
}

/**
 * Wir sind technisch dazu verdonnert, selbst einfache Links als Submit Buttons in Formularen abzubilden...
 * damit wir das trotzdem irgendwie vom Styling her hinbekommen, müssen wir hier einen extra Stil definieren!
 */
input.asLink {
	margin: 0;
	padding: 0;
	border: 1px solid transparent; /* EURNEU-6128: Es gibt einen Bug im FireFox v38 unter Windows (zumindest die ESR Version), in der ohne diese Border die Links / Buttons unsichtbar dargestellt werden! */
	background: none;
	cursor: pointer;
	font-weight: bold;
	white-space: inherit;
	text-align:left;
}
input.asLink + .list {
	display: block;
}
.hidewrap input.asLink,
.hidewrap200 input.asLink {
	white-space:nowrap;
}	

/* MENUS */
#header ul li {
	display: inline;
	margin: 0 3px;
}
#header ul li.highlite span,#header ul li.highlite a {
	font-weight: bold;
}
#header img {
	margin: 0 3px;
	vertical-align: bottom;
}


/** Ein wenig Tab-Styling... */
.rich-tab-active {font-weight:bold; cursor:pointer;}
.rich-tab-inactive {cursor:pointer;}
.rich-tab-disabled {cursor:default;}
.rich-tab-header {
	padding: 3px 6px !important;  
	border-width: 1px; 
	border-style: solid; 
	border-bottom-width: 0; 
	font-size: 12px !important;
	white-space: nowrap;

	border-radius: 5px 5px 0 0;
	-o-border-radius: 5px 5px 0 0; 
	-moz-border-radius: 5px 5px 0 0; 
	-webkit-border-radius: 5px 5px 0 0; 
}
.rich-tabhdr-side-cell, .rich-tabhdr-side-border {border:none; background-image:none;}
/** OrgUnitManager */
#formLogoUpload img.logo {max-width:300px; max-height:300px; margin:10px; display:block;}


/* FILE:task.css */
/**
 * Hier werden spezielle CSS Angaben für die Aufgabenliste im Dashboard verwaltet.
 */
.taskEdit {width:600px;}
.taskEditSub {width:600px;}
.taskPanel {width:500px;}
.taskEdit .taskSubject,.taskEdit textarea,.taskPanel textarea,.taskEdit select {width:100%;}
.taskEditSub td {white-space:nowrap;}
.taskEditSub span input {width:150px;}
.taskEdit select {width:450px;}

/*.taskListColumn {width:200px; white-space:nowrap; vertical-align:middle !important;}*/
/*.taskListColumn input {margin:0 2px;}*/
#tableOverView .idx,
#tableOverView .fix,
#tableOverView .dyn,
#tableOverView .date,
#tableOverView .act,
#formTasks .idx,
#formTasks .fix,
#formTasks .dyn,
#formTasks .date,
#formTasks .act {
	overflow: hidden;
	white-space: nowrap;
}
#tableOverView .idx,
#formTasks .idx {
	width: 1px;
	text-align: right;
}
#tableOverView .fix,
#formTasks .fix {
	width: 125px;	
	min-width: 125px;	
	max-width: 125px;	
}
#tableOverView .date,
#formTasks .date {
	width: 80px;	
	min-width: 80px;	
	max-width: 80px;
	text-align: center;
}
#tableOverView .dyn,
#formTasks .dyn {
	max-width: 50px; /* hier ist wirklich MAX gemeint! */	
}
#tableOverView .act,
#formTasks .act {
	width: 75px;	
	min-width: 75px;	
	max-width: 75px;	
}

#body .today   { color:#f70;}
#body .overdue { color:red; font-weight: bold; }
#body .future  { }
#body .min     { width: 1px; min-width: 1px !important; }
#body .center  { text-align: center !important; }
#body .left    { text-align: left !important; }
#body .top     { vertical-align: top !important; }

input.center {
	margin-left: auto;
	margin-right: auto;
    display: inherit; /* Damit das auch im Footer einer Rich-Table klappt... */
}

#formEditTask fieldset {
	width: 600px;
}

#formEditTask .tableEditTask fieldset {
	width: auto;
}
#formEditTask .tableEditTask {
	width: 100%;
}

/* FILE:forms.css */
/* 
 * Hier gehören alle allgemeinen Anpassungen und Stylings für Formulare rein. Bitte hier keine #-Selektoren verwenden!  
 */

/* FOMRS, Formulare */
label {
	font-weight:bold;
	display:inline-block;
	margin: 0 5px 0 0;
}
#loginSeite label {
	margin-top: 0;
}
.rich-tabpanel label {
	display: inline;
	margin-right: 8px;
}
.checkbox label,
input[type="radio"]+label,
input[type="checkbox"]+label {
	display: inline;
}

.multiCBX input[type="checkbox"]+label,
.radio input[type="radio"]+label {
	font-weight: normal;
}
.radio label {
	margin-right: 10px !important;
}

.checkbox {
	margin: 18px -10px 5px;
}
.checkbox input[type="checkbox"]+label {
	font-weight: normal;
}



/**
 * EURNEU-5104: Ich habe das zuletzt mit diesem Ticket noch mal überarbeitet.
 */
.infoText {
    display: inline-block;
    position: absolute;
    font-weight: normal;
}
#pageCreator .infoText {
    left: 254px; /* Genau auf die linke Linie des Blocks. */
}
#pageCreator .collapsed .infoText,
#pageCreator .collapsed .infoText::before {
    display: none; /* In zusammengeklappten Blöcken ausblenden! */
}
#formKHilfen .infoText {
    margin-left: -17px; /* Relativ zum Label etwas weiter links. */
    position: relative; /* A1E-1680: bei ‘absolute‘ scrollt die Lampe aus dem ‘::before‘ nicht richtig mit! */
}
.infoText::before {
    pointer-events: none;    
    font-family: FontAwesome;
    font-size: 16px;
    position: absolute;
    content: "\f0eb";
    color: #000;
    text-shadow: 1px 1px 5px rgba(0,0,0,0.5);
}
.infoText:hover::before {
    color: #f70;
}
.infoText .lamp,
.infoText .lamp:focus {
    outline: none;
    border: none;
    cursor: help;
}
.infoText .lamp {
    padding: 0;
    margin: 0px;
    width: 16px;
    height: 16px;
    background: transparent;
}
.infoText .tooltip {
    white-space: pre-wrap;
    display: block;
    position: absolute;
    min-width: 300px;
    max-width: 500px;
    background-color: #ffe;
    border-radius: 3px;
    border: 1px solid rgba(0,0,0,0.5);
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
    padding: 5px 10px;
    margin: 5px 0 0 -5px;
}



div.text input, div.select select, div.text select, div.textarea textarea {
    width: 100%;
}

div.text input[type="image"] {
    width: auto;
}

div.textarea textarea {
    min-width: 500px;
    min-height: 300px;
}

#pageCreator .checkboxRow td {
	padding: 3px;
}
#pageCreator .checkboxRow div.fc {
	margin: 1px;
}
 
fieldset.actions {border-top:none; border-bottom:1px dotted #888; border-left:none; border-right:none; padding:0 0 10px 0; margin:0 0 10px 0;}

#pageCreator .formdef {
	border: 1px solid #cbcbcd;
	border-radius: 5px;
	padding: 5px 10px;
	margin: 5px 0;
}
#pageCreator .formdef.collapsed {
	padding-bottom: 0;
}
#pageCreator .formdef.collapsed .content {
	height: 0;
	max-height: 0;
	overflow: hidden;
}
#pageCreator .formdef .heading {
	min-height: 15px;
	cursor: pointer;
	font-weight: bold;
	font-size: 1.1em;
	margin: -5px -10px 0 -10px;
	border-width: 1px;
	border-bottom-style: solid;
	border-color:#cbcbcd;
	border-radius: 5px 5px 0 0;
	display: block;
	padding: 3px 6px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);

	background:         linear-gradient(top, #f8f8f8, #e8e8e8);
	background:      -o-linear-gradient(top, #f8f8f8, #e8e8e8);
	background:     -ms-linear-gradient(top, #f8f8f8, #e8e8e8);
	background:    -moz-linear-gradient(top, #f8f8f8, #e8e8e8);
	background: -webkit-linear-gradient(top, #f8f8f8, #e8e8e8);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd'); /* Farben 6-stellig! */
}
#pageCreator .formdef img.toggle {
	margin: 0;
	width: 16px;
	height: 16px;
	cursor: pointer;
	float: right;
}
#pageCreator .formdef.expanded img.toggle {
	background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/toggle.png.xhtml);
}
#pageCreator .formdef.collapsed img.toggle {
	background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/toggle-expand.png.xhtml);
}





.fcHead {
	font-weight: bold;
	margin: 10px 0 0 0;
	display: inline-block;
}

.ui-tabs .ui-tabs-panel > div.footer,
.ui-tabs .ui-tabs-panel > .rf-p > .rf-p-b > div.footer, /* Diese Zeile ist nur für das Dashboard relevant... FIXME */
.rf-tab-cnt > .rf-p > .rf-p-b > div.footer,
.rf-tab-cnt > div.footer,
form > div.footer,
fieldset > div.footer {
	background: #eee;
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ddd) );
	background: -moz-linear-gradient(top, #eee, #ddd);
	border-top: 1px solid #cbcbcd;
	border-radius: 0 0 5px 5px;
	padding: 2px 3px;
	font-size: 14px;
	min-height: 14px;
	text-align: left;
}

fieldset > div.actionsStraight {
	background: #eee;
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ddd) );
	background: -moz-linear-gradient(top, #eee, #ddd);
	border-top: 1px solid #cbcbcd;
	border-bottom: 1px solid #cbcbcd;
	border-radius: 0;
	
	margin: 5px -10px -10px -10px;
	padding: 2px 3px;
	font-size: 14px;
	min-height: 14px;
	text-align: left;
}
.ui-tabs .ui-tabs-panel > .rf-p > .rf-p-b > div.footer { /* Dieser Block ist nur für das Dashboard relevant... FIXME */
    margin: 10px -10px -10px -10px;
}

fieldset > div.footer {
	margin: 10px -10px -10px -10px;
}
form > div.footer {
	margin: 15px -15px -15px -15px;
}
form > div.footer.five {
	margin: 5px -5px -5px -5px;
}
form > div.footer.eight {
	margin: 8px -8px -8px -8px;
}
form > div.footer.ten {
	margin: 10px -10px -10px -10px;
}
.ui-tabs .ui-tabs-panel > div.footer,
.rf-tab-cnt > div.footer {
	margin: 10px -10px -10px -10px;
}
.rf-tab-cnt > .rf-p > .rf-p-b > div.footer {
	margin: 10px -10px -10px -10px;
}

fieldset p:first-child,
fieldset legend + p {
	margin-top: 0;
}

textarea.code,
td.code,
td.code span {
	font-family: Monaco, "Courier New", Courier, monospace;
	white-space: pre;
}
td.code tt {
	color: #55f;
}
.code,
.syntax tt {
	background: #eef;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 1px 3px;
	margin: 1px;
    font-family: Monaco, "Courier New", Courier, monospace;
	font-style: normal;
	font-size: 11px;
	white-space: nowrap;
}
.syntax li {
	margin: 5px 0;
}

/* Wenn man eine Aufzählung hat, 
  eine Zeile dieser Aufzählung jeweils aus mehreren Teilen besteht 
  und einer dieser Teile ein längerer Text ist, der ggf. über mehrere Zeilen geht,
  ist das Styling etwas knifflig. */
.syntax  li div.inlineGroup {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
}

/* Auch damit das erste <tt>-Kästchen die gleiche Höhe hat, wie die, die nicht in einem <div> gewrappt sind, 
   muss man etwas basteln. */
.syntax  li div.inlineGroup > tt {
    height: 15px;
    padding: 0px 3px;
}

/* Formular-Tabellen */
.formTable {
	margin-top: 16px;
	white-space: nowrap;
}
.formTable td, .formTable th { padding:4px 16px 4px 2px;}
.formTable td:last-child, .form-table th:last-child {padding-right:4px;}
.formTable .textRight, .formTable .textRight input {text-align:right;}

.formTable th {font-weight:bold;vertical-align:middle;border-color:#999;border-width:1px 0;border-style:solid;padding:8px 16px 8px 2px;background-color:#eee;}

.formTable .smallWidth { width:100px;}
.formTable .mediumWidth { width:200px;}
.formTable .bigWidth { width:350px;}

.formTable.oddEven tr:nth-child(2n) td, td.odd { background-color:#efefef; }

.formTable input {
	width: 100%;
}
.formTable input[type="image"] {
	width: auto;
}

div.finance table tr td {
	padding: 1px 4px;
	vertical-align: middle !important;
}
div.finance table tr:first-child td {
	vertical-align: bottom !important;
}
div.finance input.money {
	align: right;
	width: 125px;
}
div.finance label.money {
	text-align: center;
	width: 125px;
}

.hidden {display:none;}
input[type="checkbox"].toggle {margin:0;}

textarea.comment {
    width: 500px;
    height: 150px;
}
#formKHilfen .khilfezahlfeld {
    vertical-align: middle;
    margin: 3px;
    display: inline-block;
}
#formKHilfen textarea.comment {
    height: auto;
    min-height: 20px;
    max-height: 100%;
}
.modal textarea.comment {
    width: 100%;
    box-sizing: border-box;
}
span.messageBody {display:block; width:500px; height:300px; max-height:300px; font-size:9pt; overflow:auto;}
input.signature {width:200px;}

table.notMaximized {
    width: auto !important;
    display: inline-block;
}

.notMaximized {
	display: inline;
}

form.zuwes {float:left;}
form.zuwes select, form.zuwes textarea, form.zuwes input[type="text"] {width:100%; font-size:9pt;}
form.zuwes h3 {font-size:110%; margin:0 10px;}
form.zuwes input.rich-calendar-input {width:150px;}
form.zuwes span.comment {margin:3px; white-space:normal; max-width:600px; display:block;}
form img { border: none; }

span.tt-zuwes {
	background: #ffe;
	border: 1px solid #888;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 3px 5px;
	margin: 3px;
	white-space: normal;
	display: block;
	font-weight: normal;
}

/**
 * Im folgenden kommen einige Elemente, die von 
Creator verwendet werden...
 */

/** Einige Sonderbehandlungen für die Anzeige von Jahresspalten... */
#pageCreator div.years {float:right; margin-top:-30px; margin-right:4px;	}
#pageCreator div.year {display:inline-block; width:86px;}
#pageCreator label.year, #pageCreator input[type="text"].year {width:80px; margin:0 2px; text-align:right;}
#pageCreator label.year {font-size:80%; text-align:center; display:inline-block; padding:0;}
/** Weitere Styles... */
#pageCreator textarea {height:150px; font-size:9pt;}
#pageCreator input.rich-calendar-input {width:150px;}
#pageCreator label.month {
	display: block;
	text-align: right;
	padding: 0;
	margin: 3px;
}

span.fieldError,
#pageCreator span.fieldError {
	display: inline-block;
	position: absolute;
	left: 5px;
	width: 235px !important;
	max-width: 235px;
	background-color: rgba(255,200,200,1);
	border: 1px solid rgba(255,0,0,0.9);
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
	padding: 5px 10px;
	margin-top: -4px !important;
	font-size: 80%;
	white-space: normal;
}
span.fieldError:before {
    content: "";
    display: block;
 	background: url(/EurekaRLPPlus/javax.faces.resource/3rd-Party/Fugue-Icons/cross-button.png.xhtml); no-repeat;
	width: 16px;
	height: 16px;
	float: right;
	margin: -1px -5px 0px 5px;
}
.clickToHide {
	cursor: crosshair;	
}


/**
 * ZUWES-867
 * Wir rendern die Teile unsichtbar... müssen sie aber momentan rendern, weil sonst WARN im LOG kommt.
 * Angezeigt werden die Texte als TITLE... also ToolTip! 
 */
#pageCreator span.moneyError {
	display: none;
}
span.fieldError + span > input, /* <rich:calendar> */
span.fieldError + input, /* normale Inputs */
span.fieldError + textarea, /* lange Inputs */
span.fieldError + div, /* Richtext */
span.fieldError + select, /* normale Selects */
span.errorField input.ui-inputfield, /* <rich:calendar> */
.errorField { 
	background: #faa !important;
	border-color: #f00 !important;
	cursor: help !important;
}
/**
 * Am Label mit errorField wollen wir nur den Cursor �ndern.
 */ 
label.errorField { 
    background: inherit !important;
    border-color: inherit !important;
    cursor: help !important;
}
input[type=checkbox].errorField {
    outline: 2px dashed rgba(255,0,0,0.5);
    outline-offset: 1px;
}
.rf-au.errorField input {
	background: #faa !important;
	cursor: help !important;
}
span.fieldError + span {
	display: block;  /* <rich:calendar> in die nächste Zeile ziehen... */
}

#pageCreator .costfinance input[type="text"] {width:80px;}
#pageCreator .costfinance a {text-decoration:none; font-size:90%;}
#pageCreator .costfinance a:hover {text-decoration:underline;}
#pageCreator .costfinance td:nth-child(2) {width:90%;}
#pageCreator .teilnehmer input[type="text"] {width:80px; margin:0 1px;}
#pageCreator .teilnehmer td:nth-child(1) {width:90%;}
#pageCreator .maximized {width:100%;}
#pageCreator .gutachten select {margin-bottom:10px;}
#pageCreator .gutachten-headline {font-size:120%; font-weight:bold; margin:10px 0; display:block;}
#pageCreator .gutachten-summe {font-weight:bold; margin:10px 0; display:block;}

/* Die Kommentare unter den Finanzierungs-Positionen bekommen ein eigenes Styling... */
#pageCreator textarea.finance {
	width: 98%;
	height: 30px;
}

/**
 * Der fixierte Text, den der Fachadmin ins Form packen kann, braucht etwas Finetuning...
 */
#pageCreator div.fixedRichText       { max-width:98%; }
#pageCreator div.fixedRichText h1    { color:#000; }
#pageCreator div.fixedRichText table { float:none; margin-top:10px; }

/**
 * Und jetzt Dinge für den PageflowManager...
 */

 
/* FILE:navSubSub.css aus der eureka+ 
wird grad nicht gebraucht */


#formShowMsg {width:600px;}

.total {background:#ddd; font-weight:bold;}
.subtotal {background:#eee; font-weight:bold;}
#formStatus .info {width:500px; display:block; font-size:90%;     font-style:italic;}
#formStatus .error {
    color:red;
}

/**
 * Die Gutachten Sternchen Komponente hat ein paar Styles...
 */
#pageCreator .surveyYesNo,
#pageCreator .surveyStars {
    width:600px;
}
#pageCreator .surveyStars .stars {
    text-align: left;
}
#pageCreator .surveyYesNo .yesno img,
#pageCreator .surveyStars .stars span {
    background-color: transparent !important;
    cursor: pointer;
    margin: 1px;
}
#pageCreator .surveyStars .stars span:before {
    font: normal normal normal 16px/1 FontAwesome;
    display: inline-block;
    width: 16px;
    height: 16px;
    color: #ff9300;
    content: "\f006";
}
#pageCreator .surveyStars .stars span.selected:before {
	content: "\f005";
}
#pageCreator .surveyStars .stars span:hover:before {
	content: "\f123";
}
#pageCreator .surveyStars .stars span.zero:before {
    color: #aaa;
    content: "\f05c";
}
#pageCreator .surveyStars .stars span.zero:hover:before {
    color: #f00;
    content: "\f05c";
}
#pageCreator .surveyYesNo .yesno img.selected {
	background-image:url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/tick.png.xhtml);
}
#pageCreator .surveyYesNo .yesno img.unselected {
	background-image:url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/cross.png.xhtml);
}
#pageCreator .surveyYesNo .yesno img.open {
	background-image:url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/default.png.xhtml);
}
#pageCreator .surveyYesNo .points,
#pageCreator .surveyStars .points {
    text-align: right;
    white-space: nowrap;
}

/* Spezialitäten für ComponentFinance */
#pageCreator input.sonstiges {}
#pageCreator input.sonstiges + .tooltip, #pageCreator input.zuwendung + .tooltip, #pageCreator input.eigenanteil + .tooltip {display:none; position:absolute;}
#pageCreator input.sonstiges:hover + .tooltip, #pageCreator input.zuwendung:hover + .tooltip, #pageCreator input.eigenanteil:hover + .tooltip {display:block;}

#pageCreator .multiNKL select,
#pageCreator .multiNKL input[type="text"] {
	width: 250px;
}
#pageCreator .multiNKLnumber select {
	width: 350px;
}
#pageCreator .multiNKLnumber input[type="text"] {
	width: 50px;
	text-align: right;
}
#pageCreator .multiNKL label {
	font-weight: bold;
	display: block;
	margin-top: 10px;
}
#pageCreator .multiNKL td {
	vertical-align: bottom !important;
}
#pageCreator .multiString input[type="text"] {
	width: 400px;
}
#pageCreator .multiString td {
	vertical-align: middle !important;
}
#pageCreator .multiString input[type="image"] {
	margin: 0 0 0 5px;
}
#pageCreator .risiko label {
	margin: 0;
	width: 100%;
	text-align: center;
}
#pageCreator .risiko input[type="text"] {
	text-align: center;
}
#pageCreator .risiko td {
	vertical-align: middle !important;
}
#pageCreator .risiko input[type="image"] {
	margin: 0 0 0 5px;
}
#pageCreator .risiko select {
	max-width: 300px;
}

#widgetNewMail td {vertical-align:middle;}
#widgetNewMail td.vtop {vertical-align:top;}

/* FILE:mail.css */
#formNewMail input[type="text"] {width:600px;}
#formNewMail td {vertical-align:middle;}
.mails .unread {font-weight:bold;text-align:left;}
.mails .read {text-align:left; font-weight:normal;}


/* KHilfen */
#formKHilfen {}
#formKHilfen table * {
	font-size: 11px;
}
#formKHilfen table tr.fehler {
	background: #faa !important;
}
#formKHilfen table tbody tr:nth-child(2n) {
	background-color: rgb(230,230,230);
}
#formKHilfen table tbody tr:nth-child(2n+1) {
	background-color: rgb(250,250,250);
}
#formKHilfen table td,
#formKHilfen table th {
	border: 1px solid #aaa;
	padding: 2px;
}
#formKHilfen table th {
	text-align: center;	
	vertical-align: top;
}
#formKHilfen table thead tr,
#formKHilfen table tfoot tr {
	background-color: rgb(220,220,220);
	background:         linear-gradient(top, rgb(240,240,240), rgb(200,200,200));
	background:      -o-linear-gradient(top, rgb(240,240,240), rgb(200,200,200));
	background:     -ms-linear-gradient(top, rgb(240,240,240), rgb(200,200,200));
	background:    -moz-linear-gradient(top, rgb(240,240,240), rgb(200,200,200));
	background: -webkit-linear-gradient(top, rgb(240,240,240), rgb(200,200,200));
}
#formKHilfen fieldset {
	margin: 0 0 5px 0;
}
#formKHilfen fieldset fieldset {
	background: #f7f7f7;
}
#formKHilfen input[type="text"] {
	min-width: 100px;
	width: 95%;
}
#formKHilfen .number {
	text-align: right;
	width: 100px;
	max-width: 100px;
}
#formKHilfen td.icon {
	vertical-align: middle;
}
#formKHilfen td.index {
	text-align: right;
	vertical-align: middle;
	font-weight: bold;
	padding: 5px;
}
#formKHilfen td.number {
	vertical-align: middle;
	font-weight: bold;
}
#formKHilfen td.number span {
	display: inline-block;
	margin: 4px;	
}
#formKHilfen input.add {
	float: left;
}
#formKHilfen input.comment {
	width: 100%;
    box-sizing: border-box;
	color: #333333;
}
#formKHilfen :-moz-placeholder {
	color: #555555;
	opacity: 1;
}
#formKHilfen ::-moz-placeholder {
	color: #555555;
	opacity: 1;
}
#formKHilfen :-ms-input-placeholder {
	color: #555555;
	opacity: 1;
}
#formKHilfen ::-webkit-input-placeholder {
	color: #555555;
	opacity: 1;
}
#formKHilfen .info {
	background: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/light-bulb-off.png.xhtml) no-repeat 0 center;
	border: none;
	padding: 0;
	width: 16px;
	height: 16px;
}
#formKHilfen .info:hover {
	background: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/light-bulb.png.xhtml) no-repeat 0 center;
}








.textMiddle {
	vertical-align: middle !important;
}

.asLink.kHilfe {
	display:inline;
	margin-left:-3px;
	font-weight: normal;
	color: #00c;
	width:auto;
	text-align:left;
    text-decoration: underline;
    box-shadow: none;
}

#formStatus .info {
	width: 500px;
	display: block;
	font-size: 90%;
    font-style: italic;
}
#formStatus .error {
    color: red;
}

/**
 * Hier werden spezielle Anpassungen vorgenommen, die ausschließlich im Customizing Bereich des Eureka+ Verwendung finden.  
 */
#customizing .rich-tabpanel-content {
	padding: 8px;
}

#customizing fieldset {
	padding: 8px;
	margin: 8px;
}
#customizing #formSettings fieldset {
	margin: 3px;
} 

#customizing legend+em {
	color: #555;
	font-style: italic;
	font-size: 90%;
	width: 320px;
	display: block;
	margin: 0 0 5px 0;
}

#customizing #formSettings select,
#customizing #formSettings input[type="text"] {
	width: 100%;
} 
#customizing #formSettings input.rich-calendar-input {
	width: 95%;
} 

#customizing .columnPanel select {
	width: 250px;
}

#formStates select {
	width: 350px !important;
}

#customizing .columnPanel a,
#customizing .columnPanel input[type="image"] {
	background: none;
	margin: 2px;
	width: 16px;
	height: 16px;
	display: inline-block;
}

#customizing a { text-decoration: none; }

#matrix select {
	margin: 0;
	min-width: 40px;
}
#matrix label.readable,
#matrix label.writable,
#matrix label.deletable,
#matrix label.none {
	display: block;
	width: 30px;
	padding: 2px;
	margin: -2px;
	text-align: center;
	cursor: pointer;
}

#matrix td.readable,
#matrix select.readable,
#matrix label.readable {
	background: #afa;
}

#matrix td.writable,
#matrix select.writable,
#matrix label.writable {
	background: #faa;
}

#matrix td.deletable,
#matrix select.deletable,
#matrix label.deletable {
	background: #fa3;
}

input[type="image"] {
	border: none;
	background: none;
}

#customizing input[type="button"].readable,
#customizing input[type="submit"].readable {
	background: #afa;
}

#customizing input[type="button"].writable,
#customizing input[type="submit"].writable {
	background: #faa;
}

#customizing input[type="button"].deletable,
#customizing input[type="submit"].deletable {
	background: #fa3;
}

span.warning,#customizing span.hint {
	display: block;
	margin: 10px;
	padding: 5px;
	font-style: italic;
	background: #ffe;
	border: 1px solid #aaa;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

#customizing table.states {
	border-collapse: separate !important;
	font-size: 8pt !important;
}

#customizing table.states th {
	text-align: center;
}

#customizing #formFeatureDetails .group {
	margin: 3px 8px;
}
#customizing #formFeatureDetails select,
#customizing #formFeatureDetails input[type="text"] {
	width: 100%;
}
#customizing #formFeatureDetails input[type="text"].tooltip,
#customizing #formFeatureDetails input[type="text"].label {
	width: 45%;
	margin: 0 0 0 5px;
}
#customizing #formFeatureDetails input[type="text"].label.columnOrder {
	width: 92%;
	margin: 0 0 0 5px;
}
#customizing #formFeatureDetails input[type="text"].columnOrder {
	width: 5%;
	margin: 0 0 0 25px;
}
#customizing #formFeatureDetails input[type="text"].tooltip.break {
	width: 92%;
	margin: 5px 0 0 25px;
}
#customizing #formFeatureDetails input[type="text"].tooltip.columnOrder {
	width: 85%;
	margin: 5px 0 0 5px;
}
#customizing #formFeatureDetails input[type="text"].rich-calendar-input {
	width: 75%;
}
#customizing #formFeatureDetails .statePair select {
	width: 180px;
	min-width: 180px;
	max-width: 180px;
}
#customizing #formFeatureDetails .statePair input.filter {
	width: 150px;
	vertical-align: top;
	margin-left: 20px;
}
#customizing #formFeatureDetails .statePair input.filter + input[type="image"] {
	margin-right: 20px;
}

#traegerRegistrierungsFunds  fieldset.fundSelection {
	width: auto;
	height: 100px;
	display: inline;
	vertical-align: middle;
 	margin-top: 5px; 
	margin-bottom: 5px; 
}

#customizing fieldset.icons {
	max-width: 220px;
}
#customizing  .statusPanel fieldset.icons {
	max-width: none;
}

#customizing .statusPanel fieldset {
	margin-right: 17px;
}

#customizing fieldset.icons img {
	margin: 1px;
}

/**
 * Einige spezielle Anpassungen für die Formular-Seite im Customizing...
 */
#customizing #formPageflowWebpages textarea,
#customizing #formPageflowWebpages input[type="text"] {
	width: 85%;
}

#customizing #formPageflowWebpages table.neutral select,
#customizing #formPageflowWebpages table.neutral textarea,
#customizing #formPageflowWebpages table.neutral input[type="text"],
#customizing #formPageflowWebpages .wide {
    box-sizing: border-box;
	width: 100%;
}
 
#customizing #formPageflowWebpages textarea {
	font-size: 90%;
}

#customizing #formPageflowWebpages tr.webpage input[type="text"] {
	font-size: 120%;
	font-weight: bold;
}

#customizing #formPageflowWebpages tr.formdef input[type="text"] {
	font-size: 110%;
	font-weight: bold;
}
#customizing #formPageflowWebpages tr.formdef img {
	vertical-align: middle;
}

#customizing #formPageflowWebpages fieldset {
	margin: 0;
	padding: 3px 5px;
}

#customizing #formPageflowWebpages .dr-stglpnl-b {
	font-size: auto;
}

.formPageflowDescs select {
	margin: 5px auto;
	display: block;
}

/* Fund-Struktur */

#customizing #formLevels {
	float: left;
}
#customizing #formLevels a {
	color: #000;
	text-decoration: none;
	display: inline-block;
	width: 100%;
	padding: 1px 0;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 4px;
}
#customizing #formLevels a.selected {
	background: #ccc;
}
#customizing #formLevelDetails input.rich-calendar-input {
	width: 80px;
}
#customizing #formLevels .rich-tree {
	max-width: 400px;
	overflow: hidden;
}
#customizing #formThemenfelder select {
	max-width: 500px;
}
#customizing #formIntervention select {
	max-width: 500px;
}
#customizing #formAssignments .rich-tree {
	max-width: 600px;
	overflow: hidden;
}
#customizing #formAssignments input[type="checkbox"] {
	float: right;
	z-index: 10;
}

/* Styling für die Übersicht der Belegliste... und andere Tabellen */
.level0 {
	background-color: #efefef;
}
.level0,
.level1 {
	margin-left: 0px;
	font-weight: bold;
}
.level2 {
	margin-left: 20px;
}
.level3 {
	margin-left: 40px;
}
.level4 {
	margin-left: 60px;
}


#customizing #formMSGDetails input.subject {
	width: 600px;
}
#customizing #formMSGDetails textarea {
	width: 600px;
	height: 400px;
	font-size: 100%;
}

/* System-Settings */

#customizing fieldset.category {
	display: inline-block;
	float: left;
}

#customizing fieldset.category fieldset legend {
	max-width: 300px;
	white-space: normal;
}
#customizing fieldset.category fieldset input[type="text"] {
	width: 300px;
}
#customizing fieldset.category fieldset .fieldError {
	width: 290px;
}
#customizing .fieldError {
	background: #ffe;
	border: 1px solid #888;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 3px 5px;
	margin: 3px 0;
	white-space: normal;
	display: block;
}
#formPageflowWebpages span.fieldError {
	display: inline-block;
	position: absolute;
	width: auto !important;
	font-weight: normal;
	max-width: 500px;
	background-color: rgba(255,200,200,0.9);
	border: 1px solid rgba(255,0,0,0.9);
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
	padding: 5px 10px;
	margin-left: 180px;
	margin-top: 6px !important;
	z-index: 10;
}
#formPageflowWebpages span.fieldErrorSmall {
	margin-left: 15px;
}
#formPageflowWebpages span.fieldError + textarea {
	background: #faa !important;
	border-color: #f00 !important;
	cursor: help !important;
}

#customizing em {
	font-style: normal;
	color: #55f;
}

#customizing .fund {
	background-color: #ffc;
}

/* Konten */
#formFundKonten td.money {
	text-align: right;
	vertical-align: middle;
}


/**
 * Es gibt bestimmte CSS Angaben, mit denen wir gezielt TABLEs steuern wollen. Diese sind nie global gültig
 * sondern sollten sich immer auf einen TABLE mit einer ganz bestimmten CLASS beziehen.  
 */
table.zuwes {
	border-collapse: collapse;
	border: 1px solid #555;
	empty-cells: show;
	text-align: left;
	width: 100%;
	font-size: 9pt;
}

table.zuwes thead th {
	background: #ccc;
}

table.zuwes tbody th {
	background: #ddd;
}

table.zuwes > tr > td,
table.zuwes > tr > th,
table.zuwes > tbody > tr > td,
table.zuwes > tbody > tr > th,
table.zuwes > thead > tr > td,
table.zuwes > thead > tr > th {
	padding: 3px;
}

table.zuwes tr:nth-child(odd) {
	background-color: #eee;
}

table.zuwes tr:nth-child(even) {
	background-color: #fff;
}

table.zuwes .highlite th {
	background: #eef;
}

.max75 {
	max-width: 75px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.max100 {
	max-width: 100px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.max150 {
	max-width: 150px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.max200 {
	max-width: 200px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.colMax300 tr,
.colMax400 tr {
    white-space: nowrap;
}
.colMax300 td,
.max300 {
	max-width: 300px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.colMax400 td,
.max400 {
	max-width: 400px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.max450 {
	max-width: 450px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.max500 {
	max-width: 500px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.max600 {
	max-width: 600px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.max700 {
	max-width: 700px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hideOverflow {
	overflow: hidden;
}

table.neutral {
	width: 100%;
}
table.w99percent {
	width: 99%;
}
table.neutral tr:nth-child(odd),table.neutral tr:nth-child(even) {
	background-color: transparent;
}

/* Der RichEditor in einem ZUWES-Table soll nicht zu sehr auseinander gehen! */
table.mceToolbar td {
	padding: 0;
}

.rot90 {
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
	filter: progid : DXImageTransform.Microsoft.BasicImage ( rotation = 3 );
	width: 18px;
	margin: 3px auto;
	display: block;
	overflow: visible !important; 
}
.rot90reverse {
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
	filter: progid : DXImageTransform.Microsoft.BasicImage ( rotation = 1 );
	width: 10px;
	margin: 3px auto;
	display: block;
	overflow: visible !important; 
}
.rot90.h40  { margin-top:  40px; height: auto; }
.rot90.h60  { margin-top:  60px; height: auto; }
.rot90.h80  { margin-top:  80px; height: auto; }
.rot90.h100 { margin-top: 100px; height: auto; }
.rot90.h125 { margin-top: 125px; height: auto; }
.rot90.h250 { margin-top: 250px; height: auto; }
.rot90.h300 { margin-top: 300px; height: auto; }
.rot90.h60 + img.rich-sort-icon { margin-top:  -80px; }
.rot90.h80 + img.rich-sort-icon { margin-top: -100px; }
.rot90.w40 { margin-bottom: 15px; }

ol.small,
ul.small {
	margin: 0;
	padding: 0;
}
ol.small li,
ul.small li {
	margin: 0 0 0 20px;
}

.sort-icon > a {
	font-size: 2.2em !important;
}

/**
 * Planung
 */
 
table.planung {
	border: 2px solid #000;
	border-collapse: collapse;
	font-size: 8pt;
}
table.planung caption {
	text-align: left;
	font-style: italic;
	padding: 10px;
}
table.planung caption label {
	display: block;	
}
table.planung thead th {
	background: #ddd;
	border: 2px solid #000;
}
table.planung tr td {
	padding: 3px;
	border: 1px solid #bbb;
}
table.planung tr th.group {
	padding: 3px;
	border: 2px solid #000;
	border-bottom: none;
}
table.planung tr th.first,
table.planung tr td.first {
	border-left: 2px solid #000;
}
table.planung tr th.kreis,
table.planung tr td.kreis {
	background: rgba(0, 0, 0, 0.1);
	text-align: center;
}
table.planung tr th.last,
table.planung tr td.last {
	border-right: 2px solid #000;
	background: rgba(0, 0, 0, 0.1);
}
table.planung tr td.money {
	vertical-align: middle;
	text-align: right;
	width: 60px;
	min-width: 60px;
}
table.planung tr td.money input {
	width: 100%;
	text-align: right;
	margin: -2px;
}
table.planung tr td.money input.usatz {
	width: 40px;
}
table.planung tr td {
	white-space: nowrap;
}
table.planung tr td span.error {
	color: #f00;
}
table.planung span.fieldError {
	margin-left: 80px !important;
}
table.planung tr.programm {
}
table.planung tr.kreis {
	background: #eee;
	font-weight: bold;
}
table.planung tr.prio {
	background: #efe;
	font-weight: bold;
}
table.planung tr.ziel {
	border: 2px solid #000;
	background: #eef;
	font-weight: bold;
}
table.planung tr.op {
	border: 2px solid #000;
	background: #ddd;
	font-weight: bold;
}
table.planung input[type="submit"] {
	border: none;
	display: inline;
	background: none;	
	padding: 0;
	margin: 0;
	cursor: pointer;
}
table.planung th input[type="submit"] {
	font-weight: bold;
}
table.planung input[type="submit"]:hover {
	text-decoration: underline;
}
table.planung td.invalid {
	background: rgba(255,0,0,0.5) !important;
}
table.planung td.warning {
	background: rgba(255,255,0,0.5) !important;
}

table.konten {
	width: auto;
	margin-top: 20px;
	position: absolute;
	right: 20px;
}
table.konten thead tr {
	background: #ddd;
}
table.konten td.money {
	text-align: right;
	vertical-align: middle;
}
table.hhst {
	font-size: 8pt;
	margin: 20px 0;
	border: 1px solid #000;
	border-collapse: collapse !important;
	white-space: nowrap;
}
table.hhst th,
table.hhst td {
	border: 1px solid #000;
	padding: 3px;
}
table.hhst th {
	background-color: #ddd;
	vertical-align: middle;
}
table.hhst td.money {
	width: 60px;
	min-width: 60px;
	text-align: right;
}
table.hhst td.invalid {
	background-color: #fcc;
}
table.hhst td.warning {
	background: rgba(255,255,0,0.5);
}
table.hhst tr:nth-child(2n) {
	background-color: #eee;
}
table.hhst tr:nth-child(2n+1) {
	background-color: #fff;
}
table.hhst td:nth-child(2n) {
	background-color: rgba(0,0,0,0.05);
}
.rich-tabpanel.planmodul {
	margin: 20px 0;
}

#formPlanFilter fieldset {
	vertical-align: top;
}
#formPlanFilter label {
	font-size: 8pt;
}
/* Die Jahre sollen im Zweifelsfall umbrechen... */
#formPlanFilter #jjj td {
	float: left;
	display: inline-block;
}
.innerTextLink a:active, .innerTextLink a:link, .innerTextLink a:visited {text-decoration:underline;}
.innerTextLink a:hover { text-decoration:underline;}

#teamChangeForm select {
	min-width:400px;
}

.noScriptScrollerPage {
	text-align: center;
	margin-left: auto;
	margin-right: auto; 
	width: auto;
}
.noScriptScrollerPage td {
	padding: 3px;
}

#formStatusDetails input[type="text"] {
	width: 100%;
}

input.rich-filter-input {
	width: 90%;
	min-width: 50px;
}

#formNV input[type="image"] {
	margin: -1px 2px;
	vertical-align: middle;
}
#formNV input.filter {
	width: 274px;
	margin: 5px;
	-o-border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	border-radius: 5px;
	background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/magnifier.png.xhtml); 
	background-position: 4px center;
	background-repeat: no-repeat;
	padding: 3px 3px 3px 23px;
}

#formPageflowDescs .used { background-color: #aaf; }
#formPageflowDescs .usedinworkflow { background-color: #cccc00; } 

table.separate {
	border-collapse: separate;
}

.rich-table-subheadercell,
.rich-table-subheadercell label {
	vertical-align: bottom;
}

.rich-table-subheader {
	background-color: rgb(220,220,220);
	background-image: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.2, rgb(240,240,240)),
	    color-stop(0.8, rgb(220,220,220))
	);
	background-image: -moz-linear-gradient(
	    center bottom,
	    rgb(240,240,240) 20%,
	    rgb(220,220,220) 80%
	);
}
.rich-table-footercell,
.rich-table-headercell {
	background-color: #D9DADB;
	background-image: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.2, rgb(199,199,199)),
	    color-stop(0.8, rgb(230,230,230))
	);
	background-image: -moz-linear-gradient(
	    center bottom,
	    rgb(199,199,199) 20%,
	    rgb(230,230,230) 80%
	);
	font-size: 13px;
	
}
.rich-table-subfootercell {
	background-color: #D9DADB;
	background-image: -webkit-gradient(
	    linear,
	    left top,
	    left bottom,
	    color-stop(0.2, rgb(199,199,199)),
	    color-stop(0.8, rgb(230,230,230))
	);
	background-image: -moz-linear-gradient(
	    center top,
	    rgb(199,199,199) 20%,
	    rgb(230,230,230) 80%
	);
}

input.indiLabel {
	width: 95%;
}

/* Ein paar Angaben für die Meta-Navigation... */
#header a               { display: inline-block; height: 16px; padding-left: 18px; }

/* Im M+C soll die Tabelle etwas flexibler sein... für WebKit gibt es Verbesserungen! */
table.mc td {
	white-space: pre;
	overflow: hidden;
}
table.mc.w300 td {
	max-width: 300px;
}
table.mc .rich-filter-input.selector {
	background-color: #e0f0e0;
}
table.filter input[type="image"].sortOrder {
	vertical-align: bottom;
}
table.tableSource input[type="image"].selector,
table.filter input[type="image"].selector,
table.mc input[type="image"].selector {
	position: relative;
	margin: 0 0 0 -20px !important;
}
form.formFilterMC .minmax {
	width: 100%;
}
form.formFilterMC .minmax input {
	width: 95%;
	margin: 0 auto;
	text-align: right;
}
form.formFilterMC .minmax input.rich-calendar-input[type="text"] {
	width: 60%;
	text-align: center;
}
form.formFilterMC label {
	max-width: 320px;
	overflow: hidden;
}
form.formFilterMC fieldset span {
	margin-bottom: 8px;
	display: block;
}
form.searchMC select {
    font-size: 1rem;
    font-weight: normal;
}

/** Kernanforderungen */
#pageCreator table.tableKA tr.kaRow1,
#pageCreator table.tableKA tr.kaRow2 {
	background: #ccc;
}
#pageCreator table.tableKA tr.kaRow1 td,
#pageCreator table.tableKA tr.kaRow2 td,
#pageCreator table.tableBK td {
	padding: 2px;
	border: 1px solid #ccc;
}
#pageCreator table.tableBK tr.bkHeader {
	background: #ddd;
}
#pageCreator table.tableBK textarea {
	width: 100px;
	height: 18px;
}
#pageCreator table.tableBK textarea:focus {
	width: 400px;
	height: 150px;
	position: absolute;
	margin-left: -150px;
	margin-top: -66px;
}
#pageCreator table.tableBK td.c1 {
	width: 50px;
}
#pageCreator table.tableBK td.c2 {
	width: 500px;
}
#pageCreator table.tableKA label,
#pageCreator table.tableBK label {
	margin: 1px;
}
#pageCreator table.tableBK table td {
	border: none;
}
#pageCreator table.tableBK table td input[type="submit"] {
	border: none;
	background: none;
	padding: 0;
	margin: 0;
	font-weight: normal;
	cursor: pointer;
}
#pageCreator table.tableBK table td input[type="submit"]:hover {
	text-decoration: underline;
}

#pageCreator table.tableKN {
	margin: 10px 0;
}
#pageCreator table.tableKN td {
	padding: 2px;
	border: 1px solid #ccc;
}
#pageCreator table.tableKN tr.header {
	background: #ddd;
}
#pageCreator table.tableKN tr.footer {
	background: #eee;
}
#pageCreator table.tableKN table td {
	border: none;
}
#pageCreator table.tableKN label {
	margin: 1px;
}

/* Beleghierarchie*/
#pageCreator table.tableBH {
	margin: 10px 0;
}
#pageCreator table.tableBH td {
	padding: 2px;
	border: 1px solid #ccc;
}
#pageCreator table.tableBH tr.header,
#pageCreator table.tableBH tr.bhHeader {
	background: #ddd;
}
#pageCreator table.tableBH td.c1 {
	width: 50px;
}
#pageCreator table.tableBH td.c2 {
	width: 500px;
}
#pageCreator table.tableBH label {
	margin: 1px;
}
#pageCreator table.tableBH table td {
	border: none;
}



#pageCreator label.summe {
    font-weight: bold;
    white-space: nowrap !important; /* wegen common.js#alignFinanceColumns(...) */
    margin-right: 10px !important;
}

/* A1E-9817: CSS im Bezug auf das Label von Checkboxen im Formular verbessern */
#pageCreator tr.checkboxRow label.summe {
  white-space: normal !important;
}

#pageCreator label.data {
    font-weight: normal;
    white-space: nowrap !important; /* wegen common.js#alignFinanceColumns(...) */
    margin-right: 10px !important;
}

table.statusHistory {
	border-collapse: collapse;
	border: 1px solid #ccc;
	empty-cells: show;
	text-align: left;
	width: auto;
	font-size: 9pt;
}
table.statusHistory label {
	margin: 0 !important;
}
table.statusHistory tr.header {
	background: #ddd;
}
table.statusHistory td,
table.statusHistory th {
	padding: 3px;
	border: 1px solid #ccc;
}

table.standardErrors {
	border-collapse: collapse;
	border: 1px solid #ccc;
	empty-cells: hide;
	text-align: left;
	width: auto;
	font-size: 9pt;
}
table.standardErrors label {
	margin: 0 !important;
}
table.standardErrors tr.header {
	background: #ddd;
}
table.standardErrors td {
	padding: 3px;
	border: 1px solid #ccc;
	background:#fff;
}
table.standardErrors td noborder{
	padding: 3px;
	border: 0px;
	background:#fff;
}

legend.mandatory:after,
span.mandatory:after,
label.mandatory:after {
	content: " *";
	color: #500;
}
label.mandatory.missing {
	color: red;
}

/* Im FireFox fehlt ein default style für die disabled Elemente der Auswahllisten... */
select option[disabled] {
	color: #aaa;
}

input.dragAndDrop {
	width: 20px !important;
	font-weight: normal !important;
	font-size: 100% !important;
	text-align: center;
}

/* Wenn z.B. alle Spaltenbreiten gleich sein sollen: */
.tableColumnsFixed {
	table-layout: fixed;
}

/* Styling für die FormComponent Belegliste */
#pageCreator .fcVoucherList .frameColor td,
#pageCreator .fcVoucherList table.frameColor {
	border-color: #C0C0C0;
	border-style: solid;
}
#pageCreator .fcVoucherList table.framedTbl {
	border-top-width: 1px;
	border-left-width: 1px;
	border-bottom-width: 0px;
	border-right-width: 0px;
}
#pageCreator .fcVoucherList .wrapperVoucherList td {
	padding-top: 0px;
}
#pageCreator .fcVoucherList .header td {
	background-color: rgb(220,220,220) !important;
}
#pageCreator .fcVoucherList .level0 td {
	background-color: #efefef;
}

#pageCreator .fcVoucherList td.firstColVoucherList {
	background-color: #efefef;
	width: 14%;
}

.fcVoucherOverviewColLabel {
	overflow: hidden; 
	text-overflow: ellipsis;
	/* NOTE: Hier ist bewusst keine width angegeben; die ergibt sich aus 100 % minus die anderen Spalten. */
}

.fcVoucherOverviewColAmount {
	width: 22%;
}

#pageCreator .fcVoucherList .framedTd td {
	border-bottom-width: 1px;
	border-right-width: 1px;
	padding-top: 4px;
	padding-left: 4px;
	padding-right: 4px;
}

/* Styling für die FormComponenten, die Listen erzeugen */
#pageCreator .fcLists label {
	margin-bottom: 0px;
	margin-top: 0px;
}

/* Styling für die FormComponenten, die Listen erzeugen */
#pageCreator label.Ueberschrift {
	font-weight:bold; 
	margin-left:5px !important;
}

/* CSS für die Aktionsleisten... */
#formFeaturesAvailable .rf-tbp.features .rf-tab-cnt {
	padding: 3px;
}
#formFeaturesAvailable .info {
	display: block;
	margin: -3px -3px 3px -3px;
	padding: 3px;
	background: #eee;
	border-radius: 0;
	font-size: 11px;
	        box-shadow: 0 1px 3px rgba(0,0,0,0.2);
	   -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}
#formFeaturesAvailable fieldset {
	background: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#f0f0f0) ); /* for webkit browsers */
	background: -moz-linear-gradient(top, #f7f7f7, #f0f0f0); /* for firefox 3.6+ */
	margin: 0 5px;
	padding: 1px;
	border: 1px dashed #aaa;
}
#formFeaturesAvailable fieldset legend {
	color: #555;
	font-size: 80%;
	font-style: italic;
	font-weight: normal;
	margin: 0 5px;
}
#formFeaturesAvailable > table > tbody > tr > td {
	width: 50%;
	min-width: 50%;
	max-width: 50%;
}
#formFeaturesAvailable .rf-tbp {
	width: 98%;
}
#formFeaturesAvailable td[align="right"] table {
	margin: 0 0 0 auto;
}

/* Ein paar Styles im Customizing für die Fieldsets... */
#formWFf .group.small fieldset.param {
	border: none;
	margin: 0;
	padding: 0;
}
#formWFf .group.small fieldset.param legend {
	display: none;
}
#formWFf .group.small fieldset.param span.info {
	margin-top: 8px;
	margin-bottom: 4px;
}
#formWFf .group.small input[type=checkbox] {
	margin: 0 5px 0 0;
}

span.inactive {
	color: #aaa;
	text-decoration: line-through;
}

form.standard {}
form.standard label {
	display: block;
	margin: 18px 0 5px;
}
form.standard select,
form.standard input[type="text"] {
	width: 100%;
}
form.standard fieldset {
	margin-bottom: 10px !important;
}

/** Profildaten  */
form#profilChangeForm input[type="text"] {
	width: 200px;
}

legend img {
	margin: 0 3px;
	vertical-align: bottom;
	cursor: pointer;
}

form.projectOverview {}
form.projectOverview fieldset {
	margin: 10px;
}
form.projectOverview td {
	padding: 3px;
}
form.projectOverview label {
	text-align: right;
	display: inline-block;
	width: 100px;
}
form.projectOverview td.rich-table-footercell {
	text-align: right;	
}

span.center {
	display: inline-block;
	width: 100%;
	text-align: center;
}
span.right {
	display: inline-block;
	width: 100%;
	text-align: right;
}

/**
 * Für M+C brauchen wir einige Anpassungen, damit wir dort sauber reagieren können.
 */
#mc h1 {
	padding: 0 10px 10px 10px;
	border-bottom: 1px dotted #888;
	margin: 0 0 20px 0;	
}
#mc   thead td,
#mcPS thead td {
	vertical-align: middle;
}
#mc   td,
#mcPS td,
#mc .rich-table-thead .asLink {
	white-space: nowrap;
}
#mc   input.sortOrder,
#mcPS input.sortOrder {
	margin: 0 3px;
}
#mc   .max300 > tbody td,
#mcPS .max300 > tbody td {
	max-width: 300px;
	overflow: hidden;
}
#mc   .wrap > tbody td,
#mcPS .wrap > tbody td {
	white-space: pre; /* nur die Umbrüche, die der Text mit bringt! */
}
/* Dieser Trick blendet bei der "nur Summen" Darstellung die leeren Zeilen so gut es geht aus. */
#mc .onlyTotals > tbody td.rf-dt-c {
	padding: 0;
	border-top: 0;
	border-bottom: 0;
}
#mc   > table > tbody > tr:hover,
#mcPS > table > tbody > tr:hover {
	background-color: #fee;
	cursor: pointer;
}
#mc   table.max300,
#mcPS table.max300 {
	max-width: none; /* Sonst ist der ganze Table begrenzt! */
}
#mc   table,
#mcPS table {
	border: none;
}


#formCols select {
	margin: 0 10px 0 0;	
}
#formCols table.quad fieldset {
	margin-right: 10px;
}

table.formCfgNav {
	width: 100%;
}
table.formCfgNav td.first {
	width: 250px;
}
table.formCfgNav .rich-stglpanel {
	margin: 0;
	padding: 0;
}
#formPageflowWebpages input.pageNav {
	display: inline-block;
	width: 240px;
	white-space: normal;
	text-align: left;
	background-color: #E3F1D7;
	padding: 3px 5px;
}
#formPageflowWebpages input.pageNav.selected {
	border-color: #000;
	background: #def;
}

#formLevelSelectPro td {vertical-align:middle;}

table.middle td {
    vertical-align: middle !important;
}
table.middle td label {
    vertical-align: text-bottom !important;
}

/**
 * Die Komponente zur Steuerung der Bank-Daten
 */

.bankTable td, .bankTable th {
    vertical-align: middle !important;
    padding: 2px 0;
}

.bankTable input {
    width: 380px;
}

.bankTable .info {
    display: inline-block;
    margin: 2px;
    font-style: italic;
}

/**
 * Die FormComponent mit der Projektlaufzeit
 */
.laufzeitTable td,
.laufzeitTable th {
	padding-right: 10px;
	vertical-align: middle !important;
}
.laufzeitTable.useLabelLeft > div > table div.fc {
	margin: 5px 0 !important;
}
.laufzeitTable.useLabelLeft table {
	margin-top: 5px !important;
}
.laufzeitTable table {
	width: auto !important;
}
	
/**
 * Anpassungen der AGB
 */
form.agb {
	margin: 50px;
}
form.agb fieldset {
	margin: 20px 0 !important;
}
form.agb input {
	margin: 10px 5px !important;
}

/**
 * Einige Feinheiten zur Sprachauswahl...
 */

div.language {
	display: inline;
	float: right;
	margin: 0 10px;
}
div.language label {
	width: auto !important;
}

.Bold {
	 font-weight: bold !important;
}


#customizing table.addresses input[type="image"] {
	margin: 0 5px;
	vertical-align: bottom;
}

#customizing form.addresses input[type="text"] {
    box-sizing: border-box;
	width: 100%;
}

form.language {
	display: inline;
	margin: 0 10px;
}
form.language select {
	font-size: 10px;
	width: 100px; /* beim Aufklappen ist es größer... */
}

table.nuvProjekte {
	white-space: nowrap;
}
table.nuvProjekte .rich-table-headercell {
	text-align: left;
}
table.nuvProjekte th,
table.nuvProjekte td {
	max-width: 300px;
	overflow: hidden;
}
table.nuvProjekte input[type="image"] {
	padding: 0;
}

span.missing {
	color: #aaa;
}
.asLink[disabled],
.asLink.disabled {
	color: #aaa;
	background-color: transparent;
}

/**
 * Im Formular wird der Header mit den wichtigsten Daten zum geöffneten Objekt ein wenig gestyled...
 */
div.formHeader {
	font-size: 130%;
	font-weight: bold;
	margin: 16px 8px 0;
	padding: 5px 10px;
	height: 24px;

	background-color: rgb(230,230,230);
	background:         linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background:      -o-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background:     -ms-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background:    -moz-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background: -webkit-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));

	border-radius:         2px; 
	-o-border-radius:      2px; 
	-ms-border-radius:     2px; 
	-moz-border-radius:    2px; 
	-webkit-border-radius: 2px; 

	box-shadow:         0 0 3px rgba(0, 0, 0, 0.25);
	-o-box-shadow:      0 0 3px rgba(0, 0, 0, 0.25);
	-ms-box-shadow:     0 0 3px rgba(0, 0, 0, 0.25);
	-moz-box-shadow:    0 0 3px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
}
div.formHeader .pager {
	width: auto;
	float: right;
}
div.formHeader .pager .counts {
	font-size: 80% !important;
}
div.formHeader .pager input[type="image"] {
	vertical-align: bottom;
	margin: 0 5px;
}

div.formHeader .leftBox {
    text-align: left;
    float: left;
    max-width: calc(100% - 180px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.formHeader .rightBox {
    text-align: right;
}

input.input_money_readonly {background-color:#dddddd;}

input.input_money_conflict{
    background:#FA8072;
}

input[disabled].input_money_conflict{
    background:rgb(253, 193, 187);
}

.bilderliste {
	margin-top: 200px;
	padding: 0;
	width: 650px;
}

.bilderliste li {
	list-style-type: none;
	float: left;
	border: 1px solid #E3F1D7;
	width: 150px;
	height: 100px;
	margin: 3px;
	padding: 3px;
}

.bilderliste h1 {
	margin: 15px;
}

.bilderliste a {
	text-decoration: none;;
	color: #15A;
}

.reg_buttonBox {
	margin-top: 100px;
	margin-left: -80px
}


.trsFullnameTable{margin-top:16px;}
.trsFullnameTable td, .trsFullnameTable th { padding:3px 14px 3px 2px;}
.trsFullnameTable td:last-child, .form-table th:last-child {padding-right:4px;}
.trsFullnameTable.textRight, .trsFullnameTable.textRight input {text-align:right;}

.trsEinAusdateTable {margin-top:16px;}
.trsEinAusdateTable td, .trsEinAusdateTable th { padding:3px 14px 3px 2px;}
.trsEinAusdateTable td:last-child, .form-table th:last-child {padding-right:4px;}
.trsEinAusdateTable .textRight, .trsEinAusdateTable .textRight input {text-align:right;}

#btnPrintValidations {
	background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/printer32.png.xhtml);
	display: block;
	width: 32px;
	height: 32px;
	float: right;
	margin: 7px 20px 0 0;
}

h1.validations {
	display: block;
	text-align: center;
	font-size: 120%;
	font-weight: bold;
}

/* Die kack #pageCreator Definitionen haben immer Vorrang... das nervt! */
table.roleEdit td,
table.roleEdit th {
	vertical-align: middle !important;
	height: 24px; /* wegen verschiedener Inhalte einheitliche Zeilenhöhe erzwingen... */
}
table.roleEdit label {
	margin: 0 10px 0 0 !important;
}
table.roleEdit select {
	width: 100%;
}

#pageCreator .uploadDownload label {
	margin: 0px;
}

#pageCreator .paketOverwiewLLeftHeading {
	margin: 10px 0 5px 0;
}

#pageCreator .paketOverwiewLabelLeft {
	margin: 5px 0 5px 0;
}

#pageCreator .paketOverwiewLabelTop {
	margin: 0px 0 5px 0;
}

.projectOverview div.header {
	width: 100%;
	min-width: 180px;
}
.projectOverview div.header input[type=image] {
	float: right;
}
table.minimized th.rich-table-subheader,
table.minimized td {
	display: none;
}
table.minimized td.rich-table-footercell {
	height: auto;
	display: table-cell;
	
}
.stundenAnzBericht {
	width: 750px;
}
textarea.pv {
	margin-top: 10px;
	width:500px; 
	height:150px;
	}
	
.pvText {
	font-size:1.2em;
	display:block;
	width:800px;
}
.number,
.formTable input.number {
	text-align: right;
	width: 125px;
}

#formSTDE input[type="button"], #formSTDE input[type="submit"]{
	text-align: left;
}
.editError input[type="text"], .editError textarea {
	width: 400px;
}

.stderror {
	display: block;
	width: 99%;
}
.stderror.open div.rf-cp-lbl-colps,
.stderror.open div.rf-cp-lbl-exp {
	color: #f00 !important;
}
.stderror.resolved div.rf-cp-lbl-colps,
.stderror.resolved div.rf-cp-lbl-exp {
	color: #0a0 !important;
}

#formStdErrors textarea {
    box-sizing: border-box;
	width: 100%;
	height: 50px;
}

table.rowSelection > tbody > tr:hover {
	background-color: #fee !important;
	cursor: pointer;
}

/* Mit dieser allgemeinen StyleClass kann man bewirken, dass sich Eingabefelder und vergleichbare Elemente über die volle Breite des Formulares erstrecken. */
.stretch select,
.stretch textarea,
.stretch input[type="text"] {
	box-sizing: border-box;
	width: 100%;
}

.noStretch select {
	box-sizing: border-box;
	width: auto !important;
}

.stretch input.rich-calendar-input {
	width: 95% !important;
}

.normalize label {
	margin: 5px 10px;
	display: inline-block;
}
.normalize fieldset {
	margin: 5px !important;
	padding: 5px !important;
}

.explaination {
	font-style: italic;
	display: block;
	margin-bottom: 5px;
}

.formulaMC {
	width: 300px;
}

table.centered {
	margin-left: auto;
	margin-right: auto;
}
table.centered th,
table.centered td {
	vertical-align: middle !important;
	text-align: center !important;
}

table.middled th,
table.middled td {
	vertical-align: middle !important;
}
/* Ein paar einfache Symbole, wenn irgendwo AJAX läuft... */
.ajaxStart, .ajaxError {
	width: 100px;
	height: 100px;
	display: block;
	position: absolute;
	border-radius: 50px;
	border: 2px dashed #111;
	margin: -20px 0 0 -20px;
	z-index: 99;
}
.ajaxStart { background: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/hourglass.png.xhtml) no-repeat center rgba(255,255,255,0.75); }
.ajaxStop  {}
.ajaxError { background: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/icons/exclamation-red.png.xhtml) no-repeat center rgba(255,0,0,0.75); }

.modal fieldset select,
.modal fieldset textarea,
.modal fieldset input[type="text"] {
    box-sizing: border-box;
	width: 100%;
}
.modal fieldset .gridEmail select,
.modal fieldset .gridEmail input[type="text"] {
	width: 200px !important;
	margin-right: 10px;
	margin-top:    5px;
    margin-bottom: 5px;
}
.modal fieldset .gridEmail label {
    margin-top:    7px; /** 5px von input + 1px von dessen padding + 1px von dessen border */
}
.modal fieldset input[type="text"].rich-calendar-input {
	width: 100px;
}

tr.subtotals td {
	background-color: #e3f1d7;

}

table.smcbsoll td {
	height:20px;
}

table.dashboard {
	width: 100%;
	border-collapse: separate;
}
table.dashboard > tbody > tr > td {
	padding: 5px;
	width: 50%;
}
table.dashboard.w70w30 > tbody > tr > td:nth-child(1) {
	width: 70%;
	min-width: 800px;
}
table.dashboard.w70w30 > tbody > tr > td:nth-child(2) {
	width: 30%;
}
table.recentProjects {
	margin-top: 5px;
}
table.recentProjects td {
	white-space: nowrap;
	overflow: hidden;
}
hr.footer {
	height: 0;
	border: none;
	border-top: 1px solid #aaa;
	margin-top: 30px;
}

table.sollIst td{
	padding-right: 5px;
	margin-top: 5px;
}

tt.SUCCESS, td.SUCCESS { background-color: #afa; }
tt.INFO,    td.INFO    { background-color: auto; }
tt.WARN,    td.WARN    { background-color: #ffa; }
tt.ERROR,   td.ERROR   { background-color: #faa; }
tt.FADE,    td.FADE    { color: #0003; }

/* Der ProgressBar in den Stats, wenn man Tracking aktiviert... */
.rich-progress-bar-block.stats {
	width: 100px;
	border-color: #aaa;
	margin-top: 1px;
	box-shadow: 0 0 5px rgba(0,0,0,0.25);
}
.rich-progress-bar-block.stats .rich-progress-bar-uploaded {
	background-image: none;
	background-color: #eee;
}

/* Für EURNEU-732 führen wir als StyleClass "useLabelLeft" ein, um die Ausrichtung der Elemente zu steuern. */
#pageCreator div.useLabelLeft {
	display: inline-block;
	width: 100%;
	margin-top: 5px;
}
/* Das 1. DIV in einem DIV.useLabelLeft ist das, welches das Label beinhaltet... */
#pageCreator div.useLabelLeft > div  {
	float: left;
	width: 25%;
}
/* Alles nach dem DIV mit dem Label soll den Rest in Anspruch nehmen... */
#pageCreator div.useLabelLeft > div + *,
#pageCreator div.useLabelLeft > div + * + * {
	width: 70%;
	margin-top: 5px;
	display: inline-block;
}
#pageCreator div.useLabelLeft > div + span {
	display: inline;
}

/* Alle direkten Kinder DIV eines DIV.content im PageCreator sind FormComponents... */
#pageCreator div.content > div {
	margin-top: 10px;
}
#pageCreator div.content > div.useLabelLeft {
	margin-top: 5px;
}

/* Für Prüfziele benötigen wir etwas Styling... */
.pruefziel {
	width: 100%;
}
.pruefziel > table {
	margin: 10px 0;
}
.pruefziel a {
	float: right;
}
.pruefziel table label {
	margin: 0 10px 0 5px !important;
}
#pageCreator .pruefziel textarea { /* Die ID ist notwendig, damit wir ohne !important auskommen, was ansonsten das Resize des Feldes im Browser blockieren würde! */
    box-sizing: border-box;
	width: 100%;
	height: 80px;
}

/* Anpassungen für die Address-Komponente... */
div.address input,
div.address select,
div.address textarea {
	width: 100%;
}
#pageCreator div.useLabelLeft.address > div,
#pageCreator div.useLabelLeft.address > div > div {
	float: none;
	width: 100%;
	margin-top: 0;
}
#pageCreator div.useLabelLeft.address > div > div > div,
#pageCreator div.useLabelLeft.address > div > div > div + div { /* Wofür war das DIV + DIV gedacht? */
	clear: both;
	float: left;
	width: 25%;
}
#pageCreator div.useLabelLeft.address > div > div > input,
#pageCreator div.useLabelLeft.address > div > div > select {
	width: 70%;
	margin-top: 10px;
	display: inline-block;
}


/* In Formularen zeigen wir Änderungen im Vergleich zu einem bestimmten Datum mit entsprechenden Feld-Markierungen an. */
#formChangedSince input.rich-calendar-input {
	font-size: 12px;
	text-align: center;
}
#formChangedSince img {
	vertical-align: bottom;
	margin: 0 3px 3px 0;
}
.modified,
.modified .rich-calendar-input {
	background-color: #ffa;
	border: 1px solid #f70;
	box-shadow: 0 0 0 5px #ff0;
}
.modified.input_money_conflict {
	background-color: #fca; /* Diese Kombination kommt nur bei den Ausgaben vor... */
}
.modified.rich-panel { /* Niemals das RichPanel selbst markieren... immer nur die Elemente darin... */
	background-color: inherit;
	border: inherit;
	box-shadow: inherit;
}

/* Teilnehmerstunden im Antrag... */
#content .tlnStunden td {
	vertical-align: middle;
}
#content .tlnStunden label {
	margin-right: 10px;
}

#customizing #formPrintDetails label {
	margin: 0 3px 0 10px;
}
.warningField {
	background: #fca !important;
	border-color: #f70 !important;
}

/* Unsere TextArea und der RichEditor sollen klein starten und onFocus größer werden. */
#pageCreator .autoExpand textarea,
#pageCreator .autoExpand table.mceLayout {
    box-sizing: border-box;
	width: 100%;
	height: 100px;
	min-height: 100px;
}
#pageCreator .autoExpand textarea:focus,
#pageCreator .autoExpand table.mceLayout:focus {
	height: 300px;
	min-height: 300px;
}
#pageCreator .expand textarea,
#pageCreator .expand table.mceLayout {
    box-sizing: border-box;
	width: 100%;
	height: 200px;
	min-height: 200px;
}

.auditReportPV,
.auditReportPV td {
	border-collapse: collapse;
	border: 1px solid #C0C0C0;
	padding: 1px 4px 1px 4px;
}
.auditReportPV .level-1,
.auditReportPV .level0 {
	margin-left: 0px;
	font-weight: bold;
}
.auditReportPV table tr:last-child td,
.auditReportPV table tr:first-child td {
	background-color: rgb(200,200,200);
	background:         linear-gradient(top, rgb(220,220,220), rgb(180,180,180));
	background:      -o-linear-gradient(top, rgb(220,220,220), rgb(180,180,180));
	background:     -ms-linear-gradient(top, rgb(220,220,220), rgb(180,180,180));
	background:    -moz-linear-gradient(top, rgb(220,220,220), rgb(180,180,180));
	background: -webkit-linear-gradient(top, rgb(220,220,220), rgb(180,180,180));
}
.auditReportPV table tr:first-child td {
	text-align: center !important;
	white-space: normal !important;
}

/* Berichtsliste Prüfplan */
table.berichtsliste {}
table.berichtsliste td {padding:3px 5px; border:1px solid #ccc; }

#customizing legend input[type="submit"] {
	margin-left: 10px;
}

canvas.printPreview {
	box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
	border: 1px solid #555;
}

.stretch {
    box-sizing: border-box;
	width: 100%;
}
table.stretch th,
table.stretch td {
	padding: 1px 3px;
}
table.stretch th.min,
table.stretch td.min {
	padding: 1px 2px; /* etwas kleiner */
}

input:focus,
select:focus,
textarea:focus,
checkbox:focus {
    box-shadow: 0 0 2px 2px #07f;
}

/* Formatierter Text in Tabellen muss formatiert bleiben... */
td pre {
	margin: 0;
	font-family: Monaco, "Courier New", Courier, monospace !important;
}

.asLink.error {
	color: red;
}

/**
 * EURNEU-7970: CSS Korrektur für den Abstand wieder korrigiert...
 */
.finance.reduced {
	margin-top: -15px !important;
}
.textperyear.reduced {
	margin-top: -6px !important;
}

/** Hier ist ein sehr seltsamer Ansatz für einen Tool-Tip umgesetzt worden, der in importHistorysDetails.xhtml verwendet wird. Ich vermute, das kommt von Yusuf. */
a.tooltip {text-decoration:none; cursor: help !important; color: black !important	;}
    a.tooltip strong {line-height:30px;}
    a.tooltip > span 
    {
	    width:250px;
	    padding: 10px 20px;
	    margin-top: 20px;
	    margin-left: -85px;
	    opacity: 0;
	    visibility: hidden;
	    z-index: 10;	   
	    position: absolute;

	    font-family: Arial;
	    font-size: 12px;
	    font-style: normal;  
        	    
	    -webkit-border-radius: 3px;
	    -moz-border-radius: 3px;
	    -o-border-radius: 3px;
	    border-radius: 3px;
	    
	    
        -webkit-box-shadow: 2px 2px 2px #999;
	    -moz-box-shadow: 2px 2px 2px #999;		
	    box-shadow: 2px 2px 2px #999;	    
	    
	    -webkit-transition-property:opacity, margin-top, visibility, margin-left;
	    -webkit-transition-duration:0.4s, 0.3s, 0.4s, 0.3s;  
	    -webkit-transition-timing-function: ease-in-out, ease-in-out, ease-in-out, ease-in-out;
	
	    -moz-transition-property:opacity, margin-top, visibility, margin-left;
	    -moz-transition-duration:0.4s, 0.3s, 0.4s, 0.3s;  
	    -moz-transition-timing-function: ease-in-out, ease-in-out, ease-in-out, ease-in-out;
	
	    -o-transition-property:opacity, margin-top, visibility, margin-left;
	    -o-transition-duration:0.4s, 0.3s, 0.4s, 0.3s;  
	    -o-transition-timing-function: ease-in-out, ease-in-out, ease-in-out, ease-in-out;
	
	    transition-property:opacity, margin-top, visibility, margin-left;
	    transition-duration:0.4s, 0.3s, 0.4s, 0.3s;  
	    transition-timing-function: ease-in-out, ease-in-out, ease-in-out, ease-in-out;
    }
    
    /*a.tooltip > span:hover,*/
	a.tooltip:hover > span
	{
		opacity: 1;
		text-decoration:none;
		visibility: visible;
		overflow: visible;
		margin-top:25px;
		display: inline;
		margin-left: -60px;	
		white-space: normal !important;	
		
	}

	a.tooltip span b {
    
		width: 15px;
		height: 15px;
		margin-left: 20px;
		margin-top: -19px;
			
		display: block;
		position: absolute;

		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
			
		-webkit-box-shadow: inset -1px 1px 0 #fff;
		-moz-box-shadow: inset 0 1px 0 #fff;
		-o-box-shadow: inset 0 1px 0 #fff;
		box-shadow: inset 0 1px 0 #fff;
			
		display: none\0/;
		*display: none;
	}
    
a.tooltip > span {
	color: #000000; 

	background: #FFFFAA;
	border: 1px solid black;   
}    
	  
a.tooltip span b {
	background: #FFFFAA;
	border-top: 1px solid black;
	border-right: 1px solid black;
}

/*TollTip Ende*/

.kursiv {
	font-style: italic;
}

/**
 * Das neue Dashboard benötigt ein wenig CSS...
 */
div.dashboard {
	display: table;
    box-sizing: border-box;
	width: 100%;
}
div.dashboard > div.row {
	display: table-row;
}
div.dashboard > div.row > div.col {
	display: table-cell;
	vertical-align: top;
}
div.dashboard form.settings {
	min-width: 160px;
	margin-bottom: 25px; /* Sonst rutschen die Icons im FireFox auf die Table. */
}
div.dashboard .rf-tab-hdr-tabline-top {
    margin-right: 120px; /* Sonst wird die Toolbar überlagert! */
}
div.dashboard table.settings {
	float: right;
	display: block;
	border: 1px solid #ccc;
	border-radius: 3px;
	border-collapse: separate;
	margin: -38px -9px -5px 0;
	font-size: 15px;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
	white-space: nowrap;
	position: relative; /* sonst wirkt der z-index nicht */
    z-index: 333; /* Die Settings sollen ggf. �ber den Tabs liegen, wenn zu wenig Platz ist, (NOTE) aber hinter dem div.modal. */
    opacity: 0.8;
    background: var(--color-background); /* Default w�re transparent. Das ist schwer zu erkennen, wenn die Settings ggf. �ber den Tabs liegen. */
}
div.dashboard table.settings td {
	border: none !important;
	padding: 0 2px !important;
	vertical-align: middle;
	text-align: center;
}
div.dashboard table.settings span,
div.dashboard table.settings a {
	margin: 1px;
	color: #ccc;
}
div.dashboard table.settings span:hover,
div.dashboard table.settings a:hover {
	color: #555;
}

div.dashboard .rf-tab-cnt {
    min-width: 200px;
}
div.dashboard .widget span.loading {
    color: #888;
    font-style: italic;
    display: inline-block;
    margin: 4px;
}

.dndTable {
	display: none;
	position: absolute;
	z-index: 999;
    box-sizing: border-box;
	width: 100%;
	height:90%;
}
.dndTable td {
	padding: 5px;
	vertical-align: middle;
	text-align: center;	
}
.dndTable .dndArea {
	vertical-align: middle;
	display: block;
    box-sizing: border-box;
	width: 100%;
	height: 100%;
	font-size: 100px;
	line-height: 120px;
	background-color: rgba(0,0,0,0.1);
	border: 2px dotted #000;
	border-radius: 5px;
}
table.widget-settings {
	display: inline-block;
	vertical-align: top;
	width: 45%;
}
table.widget-settings th {
	padding: 2px 10px 2px 0;
}
table.widget-settings td {
	padding: 0 2px;
}
.rich-stglpnl-marker,
.rich-stglpanel-header label {
	margin: 4px;
}

.limitMaxW,
.limitMaxW * {
	max-width: 500px;
	overflow: hidden;
}

.radioLabel label {
	font-weight: normal;
}

div.toggleInfo {
	margin: 8px;
}

span.toggleInfo {
	margin: 8px;
}

#pageCreator .radioTable {
	margin: 10px 0;
}
#pageCreator .radioTable td {
    vertical-align: baseline;
	padding-right: 10px;
}
#pageCreator .radioTable td div {
    vertical-align: bottom;
	margin-top: 1px;
    margin-bottom: 0px;
}
#pageCreator .radioTable td div label {
    vertical-align: bottom;
}

table.contact td {
	vertical-align: middle !important;
	padding: 2px 2px 2px 0 !important;
}
table.contact select {
	min-width: 300px;
}
table.contact label {
	padding: 0 !important;
	margin: 4px 20px 4px 0 !important;
}
table.contact span.subtitle {
	margin-top: 5px;
	font-style: italic;
	display: inline-block;
}

.rich-panel-body {
	font-size: 12px;
	font-family: "Lucida Grande", Helvetica, Verdana, Tahoma, sans-serif;
}

/* Der neue Header für das selektierte Projekt, Bericht, etc... */
table.header  {
    box-sizing: border-box;
    width: 99%;
    margin: 5px;
    padding: 1px;
    font-size: 11px;
    background: white;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
    border-radius: 3px;
    border-collapse: separate;
    white-space: nowrap;
}
table.header th,
table.header td {
	padding: 2px 5px;
	background: rgb(220,230,250);
}
table.header th {
	width: 1px;
	text-align: right;
	background: rgb(230,240,250);
}
table.header thead th {
	color: #888;
	text-align: center;
	background-color: rgb(220,230,255);
	background:         linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background:      -o-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background:     -ms-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background:    -moz-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
	background: -webkit-linear-gradient(top, rgb(240,240,240), rgb(220,220,220));
}
table.header input.float {
	display: none;
	float: right;
	width: 16px;
	height: 16px;
	right: 16px;
	margin-top: 5px;
	position: absolute;
}
table.header:hover input.float {
	display: block;
}

table.checkboxes label {
	margin: 1px;
}
table.checkboxes td {
	vertical-align: middle !important;
	padding-right: 5px; 
}

article.impressum {
	padding: 30px;
	font-size: 14px;
	line-height: 1.5em;
}

img.logo.registration {
	display: block;
	margin: 50px auto 0px;
	height: 50px;
	width: auto;
}
div.wizard {
	line-height: 1.3em;
	width: 800px;
	margin: 50px auto;
	padding: 20px;
	border: 1px solid #ccc;
	border-radius: 10px;
	box-shadow: 1px 1px 10px rgba(0,0,0,0.15);
	background-color: #fff;
}
div.wizard.antrag {
	margin: 100px auto;
}
div.wizard h1,
div.wizard h2 {
	line-height: 1.3em;
	margin: 1.3em 0 1em 0;
	text-align: center;
}
div.wizard h1 {
	font-size: 2em;
	border-bottom: 1px solid #ccc;
	padding-bottom: 10px;
}
div.wizard h2 {
	font-size: 1.5em;
}
div.wizard form.choice,
div.wizard form.action {
	text-align: center;
	margin: 2em;
}
div.wizard.login {
    width:      min-content;
    min-width:  800px;
}
div.wizard form.options {
    width:      max-content; /* fit-content geht noch nicht im FireFox (ESR) v91 */
    min-width:  800px;
}
div.wizard form.resetPW,
div.wizard form.login {
	margin: 40px auto;
	width: 300px;
}
div.wizard form.choice div {
	display: inline-block;
}
div.wizard form.choice div img {
	display: block;
	margin: 0 auto 10px;
}
div.wizard + form {
	text-align: center;
	margin: 20px;
}
div.wizard + form input[type="button"],
div.wizard + form input[type="submit"],
div.wizard form.options a,
div.wizard form.options input[type="button"],
div.wizard form.resetPW input[type="button"],
div.wizard form.login   input[type="button"],
div.wizard form.choice  input[type="button"],
div.wizard form.action  input[type="button"],
div.wizard form.options input[type="submit"],
div.wizard form.resetPW input[type="submit"],
div.wizard form.login   input[type="submit"],
div.wizard form.choice  input[type="submit"],
div.wizard form.action  input[type="submit"] {
	background-color: rgb(240, 240, 240);
	background:         linear-gradient(top, rgb(250, 250, 250), rgb(230, 230, 230));
	background:      -o-linear-gradient(top, rgb(250, 250, 250), rgb(230, 230, 230));
	background:     -ms-linear-gradient(top, rgb(250, 250, 250), rgb(230, 230, 230));
	background:    -moz-linear-gradient(top, rgb(250, 250, 250), rgb(230, 230, 230));
	background: -webkit-linear-gradient(top, rgb(250, 250, 250), rgb(230, 230, 230));

	box-shadow: 1px 1px 5px rgba(0,0,0,0.15);
	cursor: pointer;

	font-size: 1.3em;
	font-weight: bold;
	width: 10em;
	margin: 0 0.5em;
	padding: 0.5em 1em;
}
div.wizard form.login   input[type="button"].flex,
div.wizard form.resetPW input[type="button"].flex,
div.wizard form.choice  input[type="button"].flex,
div.wizard form.action  input[type="button"].flex,
div.wizard form.login   input[type="submit"].flex,
div.wizard form.resetPW input[type="submit"].flex,
div.wizard form.choice  input[type="submit"].flex,
div.wizard form.action  input[type="submit"].flex {
	width: auto;
	margin: 0.5em;
}
div.wizard form.choice  input[type="button"].auto,
div.wizard form.choice  input[type="submit"].auto {
    width: auto;
    min-width: 10em;
}
div.wizard form.login   input[type="button"].stretch,
div.wizard form.resetPW input[type="button"].stretch,
div.wizard form.choice  input[type="button"].stretch,
div.wizard form.action  input[type="button"].stretch,
div.wizard form.login   input[type="submit"].stretch,
div.wizard form.resetPW input[type="submit"].stretch,
div.wizard form.choice  input[type="submit"].stretch,
div.wizard form.action  input[type="submit"].stretch {
	width: 90%;
	margin: 0.2em;
	padding: 0.3em 0.6em;
	font-size: 1.1em;
	text-align: left;
}
div.wizard + form input[type="button"]:hover,
div.wizard + form input[type="submit"]:hover,
div.wizard form.options a:hover,
div.wizard form.options input[type="button"]:hover,
div.wizard form.login   input[type="button"]:hover,
div.wizard form.choice  input[type="button"]:hover,
div.wizard form.action  input[type="button"]:hover,
div.wizard form.options input[type="submit"]:hover,
div.wizard form.login   input[type="submit"]:hover,
div.wizard form.choice  input[type="submit"]:hover,
div.wizard form.action  input[type="submit"]:hover {
	border-color: #555;
}
div.wizard form.login  input[type="button"].selected,
div.wizard form.choice input[type="button"].selected,
div.wizard form.login  input[type="submit"].selected,
div.wizard form.choice input[type="submit"].selected {
/* Wir versuchen es mal mit einer neutraleren Farbe... */
	background-color: rgb(210, 210, 210);
	background:         linear-gradient(top, rgb(220, 220, 220), rgb(190, 190, 190));
	background:      -o-linear-gradient(top, rgb(220, 220, 220), rgb(190, 190, 190));
	background:     -ms-linear-gradient(top, rgb(220, 220, 220), rgb(190, 190, 190));
	background:    -moz-linear-gradient(top, rgb(220, 220, 220), rgb(190, 190, 190));
	background: -webkit-linear-gradient(top, rgb(220, 220, 220), rgb(190, 190, 190));
/* 	background-color: rgb(210, 220, 245); */
/* 	background:         linear-gradient(top, rgb(210, 220, 245), rgb(180, 190, 245)); */
/* 	background:      -o-linear-gradient(top, rgb(210, 220, 245), rgb(180, 190, 245)); */
/* 	background:     -ms-linear-gradient(top, rgb(210, 220, 245), rgb(180, 190, 245)); */
/* 	background:    -moz-linear-gradient(top, rgb(210, 220, 245), rgb(180, 190, 245)); */
/* 	background: -webkit-linear-gradient(top, rgb(210, 220, 245), rgb(180, 190, 245)); */
}
div.wizard form.action input[type="submit"] {
	background-color: rgb(210, 240, 210);
	background:         linear-gradient(top, rgb(200, 240, 200), rgb(180, 230, 180));
	background:      -o-linear-gradient(top, rgb(200, 240, 200), rgb(180, 230, 180));
	background:     -ms-linear-gradient(top, rgb(200, 240, 200), rgb(180, 230, 180));
	background:    -moz-linear-gradient(top, rgb(200, 240, 200), rgb(180, 230, 180));
	background: -webkit-linear-gradient(top, rgb(200, 240, 200), rgb(180, 230, 180));
	width: 20em;
	margin-top: 2em;
}
div.wizard + form input[type="button"],
div.wizard + form input[type="submit"] {
	font-size: 1em;
	color: #555;
	margin-bottom: 50px;
}
div.wizard form.resetPW input[type="button"],
div.wizard form.login input[type="button"],
div.wizard form.resetPW input[type="submit"],
div.wizard form.login input[type="submit"] {
	margin: 20px auto;
	display: block;
}
div.wizard form.resetPW input[type="text"],
div.wizard form.resetPW input[type="password"],
div.wizard form.login input[type="text"],
div.wizard form.login input[type="password"] {
	width: 300px;
	padding: 3px;
}
div.wizard form.login input[type="checkbox"] {
	margin: 10px 5px 0 0;
}
div.wizard form.login label {
	margin: 10px 0 0 0;
}
div.wizard form.login select {
	display: block;
	margin: 0 auto;
}
div.wizard form.login td {
	vertical-align: middle !important;
	padding: 3px;
}
div.wizard form.options {
	border-top: 1px solid #ccc;
	padding-top: 10px;
	text-align: center;
}
div.wizard form.options a,
div.wizard form.options input[type="button"],
div.wizard form.options input[type="submit"] {
	display: inline-block;
	border: 1px solid #bbb;
	border-radius: 2px;
	font-size: 1em;
	font-weight: bold;
	width: 15em;
	margin: 0 0.5em;
	padding: 0.5em;
	text-decoration: none;
	color: #555;
}
div.wizard form.options .grid-2 a,
div.wizard form.options .grid-2 input[type="button"],
div.wizard form.options .grid-2 input[type="submit"],
div.wizard form.options .grid-3 a,
div.wizard form.options .grid-3 input[type="button"],
div.wizard form.options .grid-3 input[type="submit"],
div.wizard form.options .grid-4 a,
div.wizard form.options .grid-4 input[type="button"],
div.wizard form.options .grid-4 input[type="submit"],
div.wizard form.options .grid-5 a,
div.wizard form.options .grid-5 input[type="button"],
div.wizard form.options .grid-5 input[type="submit"] {
    margin: 0;
    width: 100%;
    box-sizing: border-box;
}
div.wizard .small {
	font-size: 1em !important;
}
div.login.logos {
	text-align: center;
}
div.login.logos img {
	width: auto;
	height: 80px;
	margin: 20px;
}

.bRegCol1 {
	width: 200px;
	vertical-align: middle !important;
	padding: 2px;
	text-align: right;
}
.bRegCol2 {
	min-width: 10px;
	vertical-align: middle !important;
	padding: 2px;
}
.bRegCol3 {
	min-width: 100px;
	vertical-align: middle !important;
	padding: 2px;
}
.bRegCol3 input[type="text"],
.bRegCol3 select {
	width: 250px;
}
.bRegCol4 {
	vertical-align: middle;
}

/* Ein paar Standard Breiten... */
.w20  { width:  20px !important; min-width:  20px !important; }
.w30  { width:  30px !important; min-width:  30px !important; }
.w50  { width:  50px !important; min-width:  50px !important; }
.w60  { width:  60px !important; min-width:  60px !important; }
.w70  { width:  70px !important; min-width:  70px !important; }
.w75  { width:  75px !important; min-width:  75px !important; }
.w80  { width:  80px !important; min-width:  80px !important; }
.w100 { width: 100px !important; min-width: 100px !important; }
.w130 { width: 130px !important; min-width: 130px !important; }
.w150 { width: 150px !important; min-width: 150px !important; }
.w160 { width: 160px !important; min-width: 160px !important; }
.w175 { width: 175px !important; min-width: 175px !important; }
.w200 { width: 200px !important; min-width: 200px !important; }
.w220 { width: 220px !important; min-width: 220px !important; }
.w250 { width: 250px !important; min-width: 250px !important; }
.w300 { width: 300px !important; min-width: 300px !important; }
.w350 { width: 350px !important; min-width: 350px !important; }
.w375 { width: 375px !important; min-width: 375px !important; }
.w400 { width: 400px !important; min-width: 400px !important; }
.w450 { width: 450px !important; min-width: 450px !important; }
.w500 { width: 500px !important; min-width: 500px !important; }
.w600 { width: 600px !important; min-width: 600px !important; }

.wMAX { width: 5000px !important; }

.w8p  { width: 8% !important; }
.w10p { width: 10% !important; }
.w20p { width: 20% !important; }
.w25p { width: 25% !important; }
.w30p { width: 30% !important; }
.w40p { width: 40% !important; }
.w50p { width: 50% !important; }
.w60p { width: 60% !important; }
.w70p { width: 70% !important; }
.w90p { width: 90% !important; }

.w200 .rich-calendar-input {
	width: 150px !important; /* etwas weniger als 200px */)
}

select.tree option[disabled] {
	font-weight: bold;
	color: #000;
	margin: 8px 0 4px 0;
	border-bottom: 1px dotted #000;
}

/**
 * Styling für das HKR...
 */
.hkr.budgets {
	width: 100%;
	white-space: nowrap;
}
.hkr.budgets th,
.hkr.budgets td {
	padding: 1px;
	vertical-align: middle !important;
}
.hkr.budgets input[type="text"] {
	width: 110px;
	margin: 1px;
	text-align: right;
}
.hkr.budgets input.negative {
	color: #f00;
}
.hkr.budgets input.invalid { /* wird momentan nicht genutzt... */
	color: #f00;
	border-color: #f00;
	background-color: #ffa;
}


table.grid {
	margin: 10px 0;
}
table.grid td {
	vertical-align: middle !important;
	padding: 2px 3px;
}
table.grid.top td {
	vertical-align: top !important;
}
table.grid label {
	border-bottom: 1px dotted #aaa;
	display: inline-block;
	width: 100%;
}

div.bankverbindungen table td {
	vertical-align: middle !important;
	padding: 1px 10px 1px 0;
	width: 300px;
}
div.bankverbindungen table td:nth-child(1) {
	width: auto;
}
div.bankverbindungen table label {
	margin: 0 10px 0 0 !important;
}
div.bankverbindungen table tr:nth-child(1) td {
	text-align: center !important;
}
div.bankverbindungen table select,
div.bankverbindungen table input {
	width: 100%;
}

table.huel {
	margin-bottom: 20px;
	width: auto;
	white-space: nowrap;
}
table.huel th,
table.huel td {
	border: 1px solid #000;
	padding: 3px 8px;
}
table.huel th {
	vertical-align: middle;
	text-align: center;
}
table.huel th.left {
	text-align: left;
}
table.huel tr.total {
	border-top: 2px solid #000;
	font-weight: bold;
}
table.huel tr.total th,
table.huel tr.total td {
	background: #ccc;
}
table.huel td.money {
	text-align: right;
}

#pageCreator table.formTable.payment label {
	margin: 0;
}
#pageCreator table.formTable.payment input {
	width: 100px;
}
#pageCreator table.formTable.payment td {
	padding: 2px 10px 2px 0;
	vertical-align: middle;
}
#pageCreator table.formTable.payment td.cc {
	text-align: center;
}

.compact fieldset {
	margin: 2px !important;
	padding: 3px 6px !important;
	border-radius: 3px !important;
}

table.modern {
	display: inline-table;
	border-collapse: collapse;
	border: 1px solid #555;
	empty-cells: show;
	text-align: left;
	font-size: 9pt;
	box-shadow: 0 0 5px rgba(0,0,0,0.25);
}
table.modern.better tt {
	font-size: 0.9em;
}
table.modern.better th,
table.modern.better td {
	border: 1px solid #888;
}
table.modern thead,
table.modern tfoot {
	border: 1px solid #888;
}
table.modern thead th {
	background: #ccc;
}
table.modern tbody th {
	background: #ddd;
}
table.modern td {
	padding: 3px;
	vertical-align: middle !important;
}
table.modern th {
	padding: 5px;
	text-align: center;
}
table.modern tr:nth-child(odd) {
	background-color: #eee;
}
table.modern tr:nth-child(even) {
	background-color: #fff;
}
table.modern .highlite th {
	background: #eef;
}

#pageCreator table.formTable.payment label {
	margin: 0;
}
#pageCreator table.formTable.payment input {
	width: 100px;
}
#pageCreator table.formTable.payment td {
	padding: 2px 10px 2px 0;
	vertical-align: middle;
}
#pageCreator table.formTable.payment td.cc {
	text-align: center;
}

#pageCreator .mittelQuali td {
	vertical-align: middle;
}
#pageCreator .mittelQuali input {
	text-align: right;
}
#pageCreator .mittelQuali label {
	margin: 0 10px;
}

h3.akte  {
	margin: 20px 0;
}
table.akte {
	margin: 10px 0;
}

.block {
	display: block !important;
}
.flex,
table.flex {
	width: auto;
}

.contact dl {
	display: block;
	width: 100%;
	margin: 20px 0;
}
.contact dl dt {
	float: left;
	font-weight: bold;
	text-align: right;
}
.contact dl dd {
	float: right;
}
.contact dl dt,
.contact dl dd  {
	width: 48%;
	margin: 5px;
}

.invalid, td.error {
	background: #fcc !important;
}
td.error {
	float: none;
	padding: 4px;
}
td.warn {
	background: #ffc !important;
}
.valid {
	background: #cfc !important;
}
.help {
	font-style: italic;
	color: #888;
	display: inline-block;
	margin-left: 10px;
	white-space: nowrap;
}

p.stats,
fieldset.stats {
	padding: 10px;
	margin: 5px;
}

.za-relevant {
	background-color: #afa;
}
.not-za-relevant {
	background-color: #faa;	
}
.even .za-relevant {
	background-color: #8d8;
}
.even .not-za-relevant {
	background-color: #d88;	
}

fieldset span.info {
	display: block;
	color: #555;
	margin-bottom: 5px;
	font-size: 90%;
}
fieldset span.info * {
	font-size: 100%; /* 100% von den für span.info definierten 90%... */
}

 .black,
a.black,
 .black:hover,
a.black:hover {
	text-decoration: none !important;
	color: black !important;
}
.baseUnit {
	font-weight: bold;
}

table.layout,
table.layout tr,
table.layout td,
table.layout th {
	border: 0;
	border-collapse: collapse;
	width: 100%;
	margin: 0;
	white-space: nowrap;
}

/**
 * In Dialogen habe ich oft das Problem, dass ich Inhalte in einem GRID nebeneinander legen will.
 * Die naheliegenden StyleClasses "layout" oder "grid" sind aber schon belegt... daher "dialog". 
 */
table.dialog {
    width: 100%;
    border: none;
}
table.dialog > tbody > tr > td {
    padding: 0;
    margin: 0;
}
table.dialog > tbody > tr > td + td {
    padding-left: 10px;
}

ul.clean {
	list-style: none;
	padding: 0;
	margin: 0;
}

table.striped tr:nth-child(2n) {
	background-color: rgba(0, 0, 0, 0.05);
}
table.striped tr:nth-child(0) {
	background-color: transparent;
}

table.lined {
	border-collapse: collapse;
}
table.lined tr:nth-child(2n) {
	background-color: rgba(0, 0, 0, 0.05);
}
table.lined th {
	text-align: left;
	background: #ddd;
	background:         linear-gradient(top, #ddd, #ccc);
	background:      -o-linear-gradient(top, #ddd, #ccc);
	background:     -ms-linear-gradient(top, #ddd, #ccc);
	background:    -moz-linear-gradient(top, #ddd, #ccc);
	background: -webkit-linear-gradient(top, #ddd, #ccc);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee' ); /* Farben 6-stellig! */
}
table.lined th,
table.lined td {
	border: 1px solid #aaa;
	padding: 3px 5px;
}
table.lined.phasen {
	white-space: nowrap;
}
table.lined.phasen th,
table.lined.phasen td {
	vertical-align: middle !important;
	padding: 2px;
	min-width: 50px;
}
table.lined.phasen th {
	text-align: center;
}

table.columns {
	border-collapse: separate;
	border-spacing: 5px;
	width: 100%;
	padding: 0;
	margin: -5px;
}
table.columns td {
	padding: 0;
	margin: 0;
}

.flw200 {
	float: left;
	width: 200px;
	display: block;
}
.flw250 {
	float: left;
	width: 250px;
	display: block;
}

.red {
	color: red !important;
}

.dates input.rich-calendar-input {
	width: 80px;
	text-align: center;
}

.za-dates {
	margin: 10px 0;
	border: 2px solid #555;
	border-collapse: collapse;
}
.za-dates th,
.za-dates td {
	padding: 3px;
	border: 1px solid #555;
}
.za-dates .h1 th,
.za-dates .h2 th,
.za-dates .h3 th,
.za-dates .h4 th,
.za-dates .h1 td,
.za-dates .h2 td,
.za-dates .h3 td,
.za-dates .h4 td {
	padding: 5px 3px;
	font-weight: bold;
	text-align: center !important;
	vertical-align: top;
}
.za-dates .h1 th,
.za-dates .h1 td {
	background-color: #ddd;
}
.za-dates .h2 th,
.za-dates .h2 td {
	background-color: #eee;
}
.za-dates .h3 th,
.za-dates .h3 td {
	background-color: #f7f7f7;
}
.za-dates .h4 th,
.za-dates .h4 td {
	background-color: #ddd;
}
.za-dates .h4 th.right,
.za-dates .h4 td.right {
	text-align: right !important;
}
.inline {
	display: inline !important;
}

table.tableSource .rich-table-thead input[type=image] {
	margin-left: 5px;
	vertical-align: baseline;
}

div.descMC select,
div.descMC input {
	margin-right: 3px;
}

div.auszahlungsblatt {
	white-space: nowrap;
	margin: 10px 0 0 0;
}
div.auszahlungsblatt tr.sum {
	border-top: 1px solid #888;
}
div.auszahlungsblatt tr.last {
	border-bottom: 1px solid #888;
}
div.auszahlungsblatt tr.head td {
	text-align: center !important;
}
div.auszahlungsblatt td {
	padding: 1px 5px;
}
div.auszahlungsblatt label {
	margin: 0 !important;
}

table.cp0 th,
table.cp0 td {
	padding: 0; 
}
table.cp1 th,
table.cp1 td {
	padding: 1px; 
}
table.cp2 th,
table.cp2 td {
	padding: 2px; 
}
table.cp3 th,
table.cp3 td {
	padding: 3px; 
}
table.cp5 th,
table.cp5 td {
	padding: 5px; 
}

.tag {
	border: 0px solid transparent;
	border-radius: 3px;
	background-color: #eee;
	padding: 1px 4px;
	color: #fff;
}
span.tag {
	display: inline-block;
}

td.warning {
	background-color: #ffffaa;
}
td.critical {
	background-color: #ffaaaa;
}
td.good {
	background-color: #aaffaa;
}

/* Einige Elemente wollen wir grundsätzlich als leicht umrandete Box mit subtilem Schatten darstellen. */
.boxed {
	display: block;
	padding: 5px;
	margin: 5px;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 3px;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
}
.pullRight {
	float: right;
}
.info {
	font-weight: normal;
	font-style: italic;
}

/* Ein kleiner Status, den wir im Layout direkt verankern... */
div.status  {
	float: right;
	padding: 0 10px;
}

hr {
	border: none;
	border-top: 1px solid #aaa;
}

.sq20 {
	display: inline-block;
	width: 20px;
	height: 20px;
}

.ajaxStatus {
	font-size: 90%;
	margin-right: 10px !important;
	display: inline-block;
}

fieldset.tight {
	width: auto !important;
	display: inline-block;
	padding: 5px;
	margin: 0;
}
fieldset.tight input {
	margin: 0 2px;
}

table.clean,
table.clean tr,
table.clean th,
table.clean td {
	border: none !important;
	background: none !important;
	padding: 2px !important;
}

table button[type=image],
table input[type=image],
table img {
	vertical-align: middle;
}

/* Manchmal wollen wir Elemente extra markieren... hervorheben. */
.outline {
    outline: 3px outset rgba(255,0,0,0.75);
}

/* Styling für das Customizing der K-Hilfen... */
.khilfeTest * {
	font-size: 10px;
	vertical-align: middle;
}
.khilfeTest input[type="text"] {
	padding: 0;
}
.khilfeTest td {
	padding-right: 5px;
}
.khilfeErrors {
	margin-top: 10px;
	font-size: 10px;
	font-style: italic;
}

/* EURNEU-6243: Das CSS kam hier mit irgendeiner Anpassung letztens mal durcheinander... ich bessere damit wieder nach. */
#body .formTable.finance label {
	white-space: normal;
}

/* Das BVA möchte das Logo im Wizzard Dialog haben... also müssen wir das entsprechend stylen. */
div.wizard h1 .logo {
	float: left;
	margin: -30px 0 0 0;
}
div.wizard h1 .logo img {
	height: 50px;
}
div.wizard h1 .logo + span.next {
	text-align: right;
	display: block;
}

/* Darüber hinaus setzen wir auf den übergreifenden Seiten für Login, Passwort und Registrierung eine neutralere Farbe ein. */
div.wizard input,
div.wizard select,
div.wizard input {
	background-color: #fafafa;
}
#body div.wizard *.rf-tbp *.rf-tab-hdr-brd {
	background-color: #333;
}
#body div.wizard *.rf-tbp *.rf-tab-cnt {
	border-color: #aaa;
}
#body div.wizard *.rf-tbp *.rf-tab-hdr-act {
	border-color: #333;
	background:   #ccc;
	background:         linear-gradient(top, #ddd, #ccc);
	background:      -o-linear-gradient(top, #ddd, #ccc);
	background:     -ms-linear-gradient(top, #ddd, #ccc);
	background:    -moz-linear-gradient(top, #ddd, #ccc);
	background: -webkit-linear-gradient(top, #ddd, #ccc);
}

/**
 * EURNEU-6682: Wir beschränken die cFc2 Spalte und nach links gestellte Labels auf 300px und brechen sie um...
 *              Gleichzeitig heben wir das 300px Limit bei der Finanzierungstabelle aber wieder auf! 
 */
.cFc2 label, .useLabelLeft .align label {
	max-width: 300px;
	white-space: normal;
}
/* Möglichst schmal - die COLs in den ROWs geben die Breite vor. Nur cFc2 mit dem wesentlichen LABEL nimmt sich den Rest der Breite. 
   In cFc1 steht ggf. der Shortcut. */
.cFc1, .cFc3, .cFc4, .cFc5, .cFc6, .cFc7, .cFc8, .cFc9 {
    width: 1px;
} 
.cFc2 {
    white-space: nowrap;
    text-overflow: ellipsis;
}

#body .formTable.finance label {
	max-width: none;
}

div.pleaseWait span.msg {
	background: none;
	border: none;
	margin: 0;	
	padding: 0;
}
span.msg {
	float: none;
	display: block;
	margin: 1px 0;
	padding: 2px 4px;
	background: #eee;
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 2px;
	font-style: normal;
}
span.msg.okay {
	background: #dfd;
}
span.msg.info {
	background: #eef;
}
span.msg.warn {
	background: #ffc;
}
span.msg.error {
	background: #fcc;
}

.milk {
	border-radius: 5px;
	border: 1px solid rgba(0,0,0,0.25);
	background: rgba(255,255,255,0.75);
	padding: 5px;
	box-shadow: 0 0 5px rgba(0,0,0,0.25);
}
.milk.spinner {
	width: 100px;
	height: 100px;
}
.milk.spinner table {
	width: 100%;
	height: 100%;
}
.milk.spinner table tr td {
	text-align: center !important;
	vertical-align: middle !important;
}

/** http://tobiasahlin.com/spinkit/ */
.spinner .spinner {
  margin: 10px auto 0;
  width: 70px;
  text-align: center;
}
.spinner .spinner > div {
  width: 18px;
  height: 18px;
  background-color: rgba(0,0,0,0.5);
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.spinner .spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.spinner .spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

/**
 * Diese feine Klasse kann an <h:selectManyCheckbox /> Elementen verwendet werden,
 * um diese in 5 Spalten fließen zu lassen...
 */
.grid5 tr {
	width: 20%;
}
.grid4 tr {
	width: 25%;
}
.grid3 tr {
	width: 33%;
}
.grid2 tr {
	width: 50%;
}
.grid5 tr,
.grid4 tr,
.grid3 tr,
.grid2 tr {
	float: left;
}
.grid5,
.grid4,
.grid3,
.grid2,
.grid5 table,
.grid4 table,
.grid3 table,
.grid2 table {
	width: 100%;
}

.banner {
	color: #ccc;
	margin: 300px 0;
	width: 100%;
	display: inline-block;
	text-align: center;
	font-size: 50px;
	line-height: 60px;
}

/* Wir müssen was gegen das allgemeine .error tun! Dazu kommt aber noch ein wenig extra Styling für unsere Zwecke. */
ol li.error {
	color: red;
	float: none;
	padding: 0; 
}
ol li.warn {
	color: #fa5;
}

/* Für den Fachadmin blenden wir einige Hilfsmittel ein, die ein entsprechendes Styling bekommen sollen... */
.tools {
	position: fixed;
	bottom: 10px;
	left: 10px;

	border-radius: 3px;
	background: rgba(0, 0, 0, 0.75);
	box-shadow: 1px 1px 5px rgba(0,0,0,0.8);

	width: auto;
	max-width: 50%;
	padding: 5px;
}
.tools * {
	font-size: 11px;
	color: #eee;
}
.tools a,
.tools a:link,
.tools a:active,
.tools a:visited {
	color: #eee;
}
.tools label {
	color: #fff;
}
.tools input {
	width: 100%;
	background: rgba(0,0,0,0.5);
	border: none;
}
.tools input[type=image] {
	width: auto;
    position: absolute;
    margin: -24px 0 0 0;
    right: 3px;
}
.tools .header {
	border-radius: 3px 3px 0 0;
	background: rgba(0,0,0,0.5);
	display:block;
	margin: -5px -5px 5px -5px;
	padding: 3px 5px;
	font-style: bold;
	min-width: 110px;
}

table input.filter {
    width: 100%;
    min-width: 16px;
    box-sizing: border-box;
    padding: 0 2px;
    font-size: 0.9em;
}
table input.filter.active {
	background-color: #fcc;
}
table a.sel { /* Das kleine Icon im Filter bei unserer allgemeinen tabelle.xhtml */
	margin-left: -14px;
	margin-right: 5px;
	margin-top: -1px;
}
table a.sel2 { /* Das RESET daneben! */
	margin-left: -27px;
	margin-right: 17px;
	margin-top: -1px;
}
table input[type=image].sel {
	margin-left: -20px;
	margin-right: 5px;
	margin-top: -1px;
}
legend input.filter  {
	width: 100px;
	display: inline;
	font-size: 90%;
	line-height: 90%;
	text-align: bottom;
}
/** Ich starte mal ein paar SIMPLE Styles... alle mit .s-* als Namen... */
.s-red {
	color: red;
}

a.sort_icon img {
	width: 1.1em;
	height: 1.1em;
}

/** Die ganzen Font-Awesome Links sollten immer eine konstante Farbe haben... */
a.fa,
a.fa:link,
a.fa:active,
a.fa:visited {
	color: #888;
	text-decoration: none;	
}
a.fa:hover {
	color: #000;
}
a.fa.active {
	color: red;
}

.quote::before,
.quote::after {
	content: "“";
}
.quote {
	font-style: italic;
	font-family: "Times New Roman", serif;
}
.quote.confetti {
	float: left;
	font-size: 3vw;
	line-height: 4vw;
	text-align: center;
	padding: 100px 20px;
	margin-top: -500px;
	width: 95%;
}

table caption {
	font-size: 90%;
	font-style: italic;
	color: #888;
	white-space: normal;
	text-align: left;
}

/* EURNEU-8731: Zwischensummen in der Belegliste */
td.sum {
	background: #cde;
	background:         linear-gradient(top, #cde, #def);
	background:      -o-linear-gradient(top, #cde, #def);
	background:     -ms-linear-gradient(top, #cde, #def);
	background:    -moz-linear-gradient(top, #cde, #def);
	background: -webkit-linear-gradient(top, #cde, #def);
}

/* EURNEU-9373 - In Tabellen-Filtern sollen Icons angezeigt werden statt des Pfades. */
div.checkbox_height, div.checkbox_height table tr, div.checkbox_height table tr td input {
	height: 18px;
} 

/* @-moz-document wird nur vom Firefox interpretiert. 
Hier als Stylehack genutzt da Firefox height in pixeln ignoriert und em auch anders interpretiert als andere Browser. */
@-moz-document url-prefix() {
    div.checkbox_height, div.checkbox_height table tr, div.checkbox_height table tr td input {
        height: 1.585em;
    }
}

div.checkbox_height label {
	margin-left: 4px;
}

/**
 * Dieses CSS sorgt dafür, dass die THEAD + TFOOT unserer Tabellen immer auf dem Screen bleiben, solange die Tabelle noch sichtbar ist und man scrollt.
 * Sobald die Tabelle den Screen verlässt, wandert auch der Header mit ihr raus. Diese CSS Eigenschaft wird aber noch nicht überall unterstützt.
 * Siehe http://caniuse.com/#search=sticky
 * 
 * Leider scheint die Zeit noch nicht reif dafür... nur Chrome reagiert darauf... und blendet dabei dann die Border aber aus.
 * Ich habe es nicht geschafft, das gerade zu biegen... trotz diverser Versuche.
 */
/* table.rf-dt thead { */
/* 	position: sticky; */
/* 	top: 0; */
/* } */
/* table.rf-dt tfoot { */
/* 	position: sticky; */
/* 	bottom: 0; */
/* } */

.scrollX {
    overflow-x: auto;
}

/** Die folgenden Styles werden unter anderem vom TabellenDelegate genutzt! */
td.grouping {
	background: #cde;
	background:         linear-gradient(top, #bcd, #def);
	background:      -o-linear-gradient(top, #bcd, #def);
	background:     -ms-linear-gradient(top, #bcd, #def);
	background:    -moz-linear-gradient(top, #bcd, #def);
	background: -webkit-linear-gradient(top, #bcd, #def);
}
th .fa.hl {
    color: #f55;
}
/* th.modified { */
/*         box-shadow: none; Die gelbe OUTLINE deaktivieren! */
/* 	background: #ecc; */
/* 	background:         linear-gradient(top, #fdd, #ecc); */
/* 	background:      -o-linear-gradient(top, #fdd, #ecc); */
/* 	background:     -ms-linear-gradient(top, #fdd, #ecc); */
/* 	background:    -moz-linear-gradient(top, #fdd, #ecc); */
/* 	background: -webkit-linear-gradient(top, #fdd, #ecc); */
/* } */
th span.menu {
	color: #888;
	margin: 2px;
	cursor: pointer;	
}
th span.menu:hover {
	color: #000;
}
th span.menu.active {
	color: #a00;
}
table.TabellenDelegate thead th,
table.TabellenDelegate thead td {
	vertical-align: bottom !important;
}
table.TabellenDelegate th input {
	/* Falls die Spaltenüberschrift doch umbrechen soll... */
	/* white-space: normal; */
}
div.popup {
    display: none;
    z-index: 10;
    position: absolute;
    background: #eee;
    background:         linear-gradient(top, #eee, #fff);
    background:      -o-linear-gradient(top, #eee, #fff);
    background:     -ms-linear-gradient(top, #eee, #fff);
    background:    -moz-linear-gradient(top, #eee, #fff);
    background: -webkit-linear-gradient(top, #eee, #fff);
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #aaa;
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
}
div.popup input.asLink {
	font-weight: normal;
}
div.popup tr:hover {
	background-color: #ccc; 
}
div.popup label.header {
	border-bottom: 1px solid #aaa;
	padding-bottom: 3px;
	margin-bottom: 3px;
	width: 100%;
}

/** Kleiner Trick, um mehrere Links mit , zu trennen... */
.commas:before {
	content: ", ";
}
.commas:nth-child(1):before {
	content: "";
}

.wrap300 {
	width: 100%;
	max-width: 300px;
	overflow: hidden;
}
.wrap300 * {
	width: 100%;
	display: inline-block;
	white-space: normal !important;
}

/** EURNEU-4864: Ich versuche eine halbwegs brauchbare Breadcrumb für den Wizard hinzubekommen... */
ol.wizard.breadcrumb + div.wizard {
	margin-top: 0;
}
ol.wizard.breadcrumb {
	font-size: 1.2em;
	margin-top: 50px;
	text-align: center;
}
ol.wizard.breadcrumb li {
	display: inline-block;
	margin-right: 15px;
}
ol.wizard.breadcrumb li i,
ol.wizard.breadcrumb li a,
ol.wizard.breadcrumb li span {
	color: #888;
}
ol.wizard.breadcrumb li.active a,
ol.wizard.breadcrumb li.active span {
	color: #000;
	font-weight: bold;
}
ol.wizard.breadcrumb li.highlite a,
ol.wizard.breadcrumb li.highlite span {
	color: #627F0D;
	font-weight: bold;
}
div.wizard .choice .mark {
	display: block;
	font-size: 1.5em;
	color: #627F0D;
	position: absolute;
	margin: 6px 0 0 16px; 
}
table.wrapLongTexts tr td.max300 span {
	white-space: normal !important;
}
table.middle.wrapLongTexts td {
	vertical-align: top !important;	
}


/** Ein paar Styles für das CommentUI */
.commentPanel {
    position: fixed;
    right: 0px;
    top: 147px;
    padding: 4px 8px;
    border: 1px solid #aaa;
    border-right: none;
    border-radius: 5px 0 0 5px;
    background-color: rgba(255, 255, 200, 0.9);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
    max-width: 500px;
}
.commentPanel.expanded {
    background-color: rgba(255, 255, 200, 1);
    border-radius: 5px;
    border-right: 1px solid #aaa;
    margin-right: 15px;
}
.commentPanel .fa {
    color: #555;
}
.commentPanel .bouble {
    display: block;
    padding: 3px 6px;
    margin: 3px;
    font-size: 0.9em;
    border-radius: 5px;
    background: rgba(255,255,255,0.9);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
}
.commentPanel .timestamp,
.commentPanel .reference {
    color: #000;
    display: block;
    margin: 0 8px;
    text-align: right;
    font-weight: bold;
    font-size: 0.9em;
}
.commentPanel .timestamp {
    margin: 5px 5px 0 8px;
    text-align: left;
}
.commentPanel .badge {
    position: fixed;
    top: 153px;
    right: 35px;
    padding: 2px 6px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #aaa;
    border-radius: 30px;
    color: #555;
    font-weight: bold;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25);
}
.commentPanel h1 {
    font-size: 1.1em;
    border-bottom: 1px solid #aaa;
    padding-bottom: 2px;
}
.commentPanel h2 {
    font-size: 1.1em;
    border-top: 1px solid #aaa;
    padding: 5px 5px 0 5px;
    margin-top: 10px;
}
.commentPanel textarea {
    margin: 0 3px;
    padding: 5px;
    border: none;
    border-radius: 5px;
    background: rgba(255,255,255,0.9);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
    width: 485px;
    height: 30px;
    font-size: 0.9em;
}
.commentPanel a.close {
    float: right;
    display: block;
    margin: -25px 0 0 0;
    font-size: 1.5em;
}
.commentPanel .action {
    float: right;
    margin: 3px 7px;
}
.commentPanel .search {
    margin: 5px 3px;
    padding: 3px 6px;
    border: none;
    border-radius: 5px;
    background: rgba(255,255,255,0.9);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
    width: 483px;
    font-size: 0.9em;
}
.commentPanel a.reset {
    position: absolute;
    right: 15px;
    top: 43px;    
}

/**
 * Das folgende Styling wird u.a. in log.xhtml vom StatsLog verwendet.
 */
div.framed {
	background-color: #eee;
	max-width: 95vw;
	overflow: scroll;
	border: 1px solid #aaa;
	border-radius: var(--border-radius-tabs);
	margin: 10px 0;
	padding: 10px;
}
span.log,
span.log * {
    font-family: monospace, Monaco, "Courier New", Courier, sans-serif;
    white-space: pre-wrap;
    display: inline-block;
}
span.log span {
	white-space: nowrap;
	margin: 0;
	padding: 0;
}
span.log span.error { color: var(--color-danger);  }
span.log span.warn  { color: var(--color-warning); }
span.log span.debug { color: var(--color-primary); }

/**
 * EURNEU-10026: Unser neues Formular braucht grundlegendes Styling!
 * siehe auch form-modern.css
 */
form.formular {
    margin-left: 240px;
}
form.formular div.block {
    display: block;
    margin: 5px 0 10px 0;
    padding: 0 10px 3px 10px;
    border: 1px solid #aaa;
    border-radius: 3px;
    background: #fff;
}
form.formular h3 {
    font-size: 1.1em;
    padding: 2px 10px 1px 10px;
    margin: 0 -10px 8px -10px;
    border-radius: 3px 3px 0 0;
    border-bottom: 1px solid #aaa;
    background: #ddd;
    background:         linear-gradient(top, #eee, #ddd);
    background:      -o-linear-gradient(top, #eee, #ddd);
    background:     -ms-linear-gradient(top, #eee, #ddd);
    background:    -moz-linear-gradient(top, #eee, #ddd);
    background: -webkit-linear-gradient(top, #eee, #ddd);
}
div.formHeader.warn {
    background: #ffa;
    background:         linear-gradient(top, #ffa, #eea);
    background:      -o-linear-gradient(top, #ffa, #eea);
    background:     -ms-linear-gradient(top, #ffa, #eea);
    background:    -moz-linear-gradient(top, #ffa, #eea);
    background: -webkit-linear-gradient(top, #ffa, #eea);
    padding-left: 8px;
}
div.formHeader.modern {
    background-image: linear-gradient( -110.1deg,  rgba(241,115,30,1) 18.9%, rgba(231,29,54,1) 90.7% );
    color: #fff;
    padding-left: 8px;
}
form.formular div.element {
    display: block;
    margin: 10px 0 5px;
/*     min-width: 475px; */
}
form.formular label.element {
    margin: 5px 5px 3px 0;
}
form.formular div.element:empty {
    min-height: 25px;
    background: #f005;
    border: 1px solid #f008;
    border-radius: 3px;
}
form.formular div.element:empty::before {
    content: "Die Darstellung vom Typ '" attr(data-type) "' für Deskriptor '" attr(data-descriptor) "' wird von diesem Formular nicht unterstützt!";
    color: #000a;
    margin: 5px 10px;
    display: inline-block;
}
form.formular div.element > label {
    display: block;
    width: 100%;
    white-space: normal;
    margin-bottom: 3px;
}
form.formular div.element label.plain {
    font-weight: normal;
}
form.formular div.element div.input {
    display: inline-block;
    width: calc(100% - 5px);
    margin: 0;
    padding: 0;
}
form.formular div.element div.input.element {
    margin: 0 0 5px 0;
}
form.formular div.element div.input select,
form.formular div.element div.input textarea,
form.formular div.element div.input input[type=text] {
    width: 100%;
}
form.formular div.element.labelLeft > label {
    display: inline-block;
    width: 250px;
    white-space: normal;
    vertical-align: middle;
    padding-top: 2px;
}
form.formular div.element.labelLeft div.input {
    display: inline-block;
    width: calc(100% - 250px - 10px);
    min-width: 120px;
    vertical-align: top;
}
form.formular div.element.labelLeft textarea {
    width: calc(100% - 5px);
    height: 100px;
}
form.formular div.element.tooltip label::after,
form.formular div.element.mandatory label::after {
    font: normal normal normal 14px/1 FontAwesome;
    margin: 3px;
    font-size: 0.8em;
    white-space: pre;
}
form.formular div.element.labelLeft.tooltip label::after,
form.formular div.element.labelLeft.mandatory label::after {
    float: right;
}
form.formular div.element.mandatory > label::after {
    content: "\f006";
}
form.formular div.element.tooltip > label::after {
    content: "\f129";
}
form.formular div.element.mandatory.tooltip > label::after {
    content: "\f129   \f006";
}
form.navigation ul li input[type=submit] {
    background: none;
    border: none;
    display: block;
    font-size: 10pt;
    font-weight: normal;
    text-align: left;
    text-decoration: none;
    width: 100%;
}
form.navigation ul li input[disabled] {
    color: #aaa;
}
form.navigation ul li::before {
    font: normal normal normal 14px/1 FontAwesome;
    float: left;
    color: #555;
    margin: 2px 0 0 -10px;
    content: "\f0da";
}
form.navigation ul li.selected {
    background-color: #C5DFAE;
}
*.normalize * {
	font-weight: normal !important;
}

/**  
 * Mit EURNEU-10208 haben wir das unser Menü umgestellt und setzen jetzt auf SmartMenus (https://www.smartmenus.org/)
 * Das Styling haben wir bei der Gelegenheit neu aufgesetzt und versucht, uns auf das Wesentliche zu beschränken. 
 */
#allhead ul.menu {
    margin-right: 100px; /* Andernfalls überlagert das unser Icon oben rechts! */
    padding-left: 10px;
    z-index: auto;
    box-shadow: none;
}
#allhead ul.menu ul {
    border: none;
}
#allhead ul.menu > li {
    margin: 0 3px 0 0;
}
#allhead ul.menu li {
    padding: 4px 10px;

    border: 1px solid #ccc;
    border-bottom: none;
    border-radius: 3px 3px 0 0;

    background: #ddd;
    background:         linear-gradient(top, #eee, #ddd);
    background:      -o-linear-gradient(top, #eee, #ddd);
    background:     -ms-linear-gradient(top, #eee, #ddd);
    background:    -moz-linear-gradient(top, #eee, #ddd);
    background: -webkit-linear-gradient(top, #eee, #ddd);
}
#allhead ul.menu li ul li {
    border-radius: 0;
}
#allhead ul.menu li ul li a {
    font-weight: normal;
}
#allhead ul.menu li.active:hover,
#allhead ul.menu li.active {
    background: #8ac;
    background:         linear-gradient(top, #cde, #8ac);
    background:      -o-linear-gradient(top, #cde, #8ac);
    background:     -ms-linear-gradient(top, #cde, #8ac);
    background:    -moz-linear-gradient(top, #cde, #8ac);
    background: -webkit-linear-gradient(top, #cde, #8ac);

    border-color: #039;
}
#allhead ul.menu li:hover {
    background: #ccc;
    background:         linear-gradient(top, #bbb, #ddd);
    background:      -o-linear-gradient(top, #bbb, #ddd);
    background:     -ms-linear-gradient(top, #bbb, #ddd);
    background:    -moz-linear-gradient(top, #bbb, #ddd);
    background: -webkit-linear-gradient(top, #bbb, #ddd);
}
#allhead ul.menu li a:focus:before {
    font: normal normal normal 16px/1 FontAwesome;
    content: "\f0a4";
    position: absolute;
    margin: 0 0 0 -20px;
    color: #000;
}
#allhead ul.menu li a {
    font-size: 12px;
    color: #000;
}
#allhead ul.menu li a span.sub-arrow {
    display: none;
}

/**
 * EURNEU-10247: Wir versuchen uns an einem neuen Ansatz für Notifications!
 */
form.notifications {
    position: fixed;
    top: 100px;
    right: 0px;
    max-height: 80vh;
    overflow: auto;
    z-index: 1000;
    padding: 5px;
    text-align: right;
}
form.notifications div {
    float: none;
    display: block;
    vertical-align: middle;
    overflow: hidden;
    padding: 3px 8px;
}
form.notifications div div {
    text-align: left;
    display: inline-block;
    width: 50vw;
    max-width: 50vw;
    margin: 1px;
    padding: 2px 6px;
    background: #ccc;
    border: 1px solid #aaa;
    border-radius: 3px;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.75);
    
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}
form.notifications div.info {
    font-style: normal;
    background-color: #cfa;
    border-color: #5c5;
}
form.notifications div.warn {
    background-color: #ffc;
    border-color: #aac;
}
form.notifications div.error {
    background-color: #fcc;
    border-color: #f00;
}
form.notifications a,
form.notifications a:hover {
    color: #000;
    text-decoration: none;
}
form.notifications a.time,
form.notifications span.time {
    font-size: 0.8em;
    color: #888;
    padding: 2px 4px;    

    background: rgba(255,255,255,0.9);
    background-size: 0%;
    background-repeat-x: no-repeat;
    background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/img/GradientGrey02.png.xhtml);

    border-radius: 3px;
    border: 1px solid rgba(0,0,0,0.25);
}
form.notifications a.close {
    margin-right: 12px;
    font-size: 1.5em;
    color: #aaa;
}

/* @see checkBoxFilter.xhtml */
i.toggle {
    cursor: pointer;
    color: #888;
}
i.toggle:hover {
    color: #111;
}

/**
 * Es wird Zeit, das CSS für die Breadcrumb neu zu gestalten. Daher habe ich alles rausgeworfen, was nicht mehr
 * benötigt wird und gestalte das nun von Grund auf sauber neu. Um Nebenwirkungen auf andere Bereiche zu vermeiden,
 * grenze ich es aber sicherheitshalber auf das #menu ein.   
 */
#menu table.bar {
    width: 100%;
    background-color: #8ac;
    border-top: 2px solid #039;
    border-bottom: 1px solid #039;
    white-space: normal;
}
#menu table.bar td {
    padding: 1px 5px;
}
#menu table.bar td.right {
    vertical-align: top;
    white-space: nowrap;
}
#menu ol.breadcrumb li {
    white-space: nowrap;
    margin-top: 5px; 
    display: inline-block;
    font-weight: bold;
    color: #fff;
}
#menu ol.breadcrumb li::before {
    font-family: FontAwesome;
    font-weight: normal;
    content: "\f054";
    margin: 5px;
    color: #456;
    transition: color .2s linear;    
}
#menu ol.breadcrumb li:hover::before {
    color: #123;
}    
#menu ol.breadcrumb li.fund::before {
    content: "\f19c";
}
#menu ol.breadcrumb li.level::before {
    content: "\f090";
}
#menu ol.breadcrumb li.feature::before {
    content: "\f205";
}
#menu ol.breadcrumb li.entity::before {
    content: "\f0a4";
}
#menu ol.breadcrumb li.table::before {
    content: "\f00b";
}
#menu ol.breadcrumb li a {
    color: inherit;
}

/**
 * Das FORM für die Projektsuche ist neben der Breadcrumb Teil des durchgehenden Balkens im Kopf der Seite.
 * Es soll nicht länger FLOATING platziert werden, damit es sich sauber ins Layout intergrieren lässt.
 */
#menu form.projectnumber input[type="text"] {
    color: #333;
    padding: 1px;
    text-align: center;
    margin-right: 5px;
}

blockquote {
    margin-left: 10px;
    padding-left: 10px;
    border-left: 5px solid #aaa;
}

/**
 * Mit A1E-3176 gestalte ich die K-Hilfen neu...
 */
table.khilfe thead th {
    padding: 0 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: break-word;
    word-wrap: break-word;
    vertical-align: bottom;
}
table.khilfe tbody td {
    min-width: 50px;
    max-width: 100px;
    width: auto;
}
table.khilfe tbody td:first-child {
    min-width: initial;
}
table.khilfe tbody tr.corrected td input[type=text] {
    border-color: #fa0;
}
table.khilfe tbody tr.correction td input[type=text] {
    border-color: #0a0;
}
table.khilfe tbody tr.fehler td textarea.kommentar:not([disabled]),
table.khilfe tbody tr.fehler td input[type=text]:not([disabled]) {
    background-color: #f005;
}
table.khilfe tbody td input[type=text] {
    width: calc(100% - 5px);
}
table.khilfe tbody textarea.kommentar {
    width: calc(100% - 5px);
    height: 2.5em;
}

.text-error {
    color: #f00 !important;
}
.text-warn {
    color: #fa0 !important;
}
.text-success {
    color: #0a0 !important;
}
.bg-error {
    background-color: #f002 !important;
}
.bg-warn {
    background-color: #ff05 !important;
}
.bg-success {
    background-color: #0f03 !important;
}

.muted {
    color: #888;
}
span.small {
    font-size: 0.9em;
}
span.warn {
    color: orange;
}

/**
 * Der PAGER aus A1E-5861 bekommt ein wenig Style...
 */
form.pager  {
    padding: 5px 10px;
    margin: -18.5px auto 15px auto;
    width: max-content; /* fit-content geht noch nicht im FireFox (ESR) v91 */
    border: 1px solid var(--color-border-soft);
    border-radius: var(--border-radius-tabs);
    background-color: var(--color-background-box);
    box-shadow: 3px 3px 10px var(--color-shadow-soft);
    text-align: center;
    z-index: 1;
}
form.pager h3 {
    margin: -2px -10px 5px -10px; /* PADDING vom FORM überlagern... */
    padding-bottom: 2px;
    font-size: .8em;
    font-weight: normal;
    border-bottom: 1px solid var(--color-border-soft);
}
form.pager span.counter {
    padding: 0 .5em;
    font-weight: bold;
    vertical-align: middle;
}
form.pager input.close,
form.pager input.first,
form.pager input.prev,
form.pager input.next,
form.pager input.last {
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 0 2px;
    vertical-align: middle;
    cursor: pointer;
    border: none;
    background: none;
    background-size: contain;
    background-repeat: no-repeat;
    transition: transform .2s ease-in-out;
}    
form.pager input.first {
    background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/icons/fast-backward-solid.svg.xhtml);
}    
form.pager input.prev {
    background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/icons/backward-solid.svg.xhtml);
}    
form.pager input.next {
    background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/icons/forward-solid.svg.xhtml);
}    
form.pager input.last {
    background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/icons/fast-forward-solid.svg.xhtml);
}    
form.pager input.close {
    /* Diesen Button verschieben wir hinter den kleinen Toolbar. */
    margin-right: -32px;
    margin-top: 2px;
    float: right;
    background-color: var(--color-background-box);
    border-radius: 100%;
    
    background-image: url(/EurekaRLPPlus/javax.faces.resource/gfx/icons/times-circle-regular.svg.xhtml);
}    
form.pager input.close:hover,
form.pager input.first:hover,
form.pager input.prev:hover,
form.pager input.next:hover,
form.pager input.last:hover {
    transform: scale(1.2);
}