/* nbp-intern.css */
/* ===================================================================================================================
* Variablen
* ===================================================================================================================*/
:root {
/* Farben */
--nbp-color-cool-gray-5: #F5F7FA; /* striped - var(--nbp-color-cool-gray-5) */
--nbp-color-cool-gray-10: #F2F4F8; /* - var(--nbp-color-cool-gray-10) */
--nbp-color-cool-gray-15: #E8EBF3; /* - var(--nbp-color-cool-gray-15) */
--nbp-color-cool-gray-20: #DDE2EB; /* - var(--nbp-color-cool-gray-20) */
--nbp-color-cool-gray-30: #BDC2CD; /* - var(--nbp-color-cool-gray-30) */
--nbp-color-cool-gray-40: #9EA5B0; /* - var(--nbp-color-cool-gray-40) */
--nbp-color-cool-gray-50: #848A96; /* (3,5:1) - var(--nbp-color-cool-gray-50) */
--nbp-color-cool-gray-60: #697180; /* (4,9:1) - var(--nbp-color-cool-gray-60) */
--nbp-color-cool-gray-70: #484E58; /* (8,4:1) - var(--nbp-color-cool-gray-70) */
--nbp-color-cool-gray-80: #2B323F; /* Schrift - var(--nbp-color-cool-gray-80) */
--nbp-color-blue-10: #EDF5FF; /* (1,1:1) - var(--nbp-color-blue-10) */
--nbp-color-blue-15: #CCEEFF; /* (1,2:1) - var(--nbp-color-blue-10) */
--nbp-color-blue-20: #D0E2FF; /* (1,3:1) - var(--nbp-color-blue-20) */
--nbp-color-blue-50: #4589FF; /* (3,3:1) - var(--nbp-color-blue-50) */
--nbp-color-blue-60: #0F62FE; /* (5,0:1) - var(--nbp-color-blue-60) */
--nbp-color-blue-70: #0043CE; /* (7,8:1) - var(--nbp-color-blue-70) */
--nbp-color-white: #FFFFFF; /* var(--nbp-color-white) */
--nbp-color-green-10: #DEFBE6; /* (1,1:1) - var(--nbp-color-green-10) */
--nbp-color-green-15: #B6F6C8; /* (1,2:1) - var(--nbp-color-green-15) */
--nbp-color-green-50: #24A147; /* (3,4:1) - var(--nbp-color-green-50) */
--nbp-color-green-60: #198038; /* (5,0:1) - var(--nbp-color-green-60) */
--nbp-color-green-70: #0E6027; /* (7,7:1) - var(--nbp-color-green-70) */
--nbp-color-red-10: #FFF1F1; /* (1,1:1) - var(--nbp-color-red-10) */
--nbp-color-red-15: #FFE0E0; /* (1,2:1) - var(--nbp-color-red-15) */
--nbp-color-red-20: #FFD7D9; /* (1,3:1) - var(--nbp-color-red-20) */
--nbp-color-red-30: #F4BBBE; /* (1,7:1) - var(--nbp-color-red-30) */
--nbp-color-red-50: #FA4D56; /* (3,4:1) - var(--nbp-color-red-50) */
--nbp-color-red-60: #DA1E28; /* (5,0:1) - var(--nbp-color-red-60) */
--nbp-color-red-70: #A2191F; /* (7,8:1) - var(--nbp-color-red-70) */
--nbp-color-yellow-10: #FCF4D6; /* (1,1:1) - var(--nbp-color-yellow-10) */
--nbp-color-yellow-15: #F8E6A0; /* (1,3:1) - var(--nbp-color-yellow-15) */
--nbp-color-yellow-20: #FDDC69; /* (1,3:1) - var(--nbp-color-yellow-20) */
--nbp-color-yellow-30: #F1C21B; /* (1,7:1) - var(--nbp-color-yellow-30) */
--nbp-color-black: #000000; /* Tooltips - var(--nbp-color-black) */
/* Token */
--nbp-support-error: #DA1E28; /* red-60 - var(--nbp-support-error) */
--nbp-support-warning: #F1C21B; /* yellow-30 - var(--nbp-support-warning) */
--nbp-support-success: #198038; /* green-60 - var(--nbp-support-success) */
--nbp-shadow-overlay: 0 5px 10px rgba(0, 0, 0, 0.5); /* var(--nbp-shadow-overlay) */
--nbp-shadow-dialog: 0 5px 20px rgba(0, 0, 0, 0.5); /* var(--nbp-shadow-dialog) */
--nbp-shadow-focus: 0 0 0 3px #C3DBFE; /* var(--nbp-shadow-focus) */
--nbp-shadow-tabfocus: 0 0 0 3px #4887FC; /* var(--nbp-shadow-tabfocus) */
}
/* ===================================================================================================================
* Farben - alt
* ===================================================================================================================*/
/* ===================================================================================================================
* Font
* ===================================================================================================================*/
html {
font-size: 87.5%; /* 1 rem = 14px */
/* scrollbar-gutter: stable both-edges; */
}
body {
font-family: IBM Plex Sans,Helvetica Neue,Arial,sans-serif;
font-size: 14px;
line-height: 1.3;
color: var(--nbp-color-cool-gray-80);
background-color: var(--nbp-color-cool-gray-20);
margin: 0;
padding: 0 24px 36px 24px;
}
/* Primfaces - UI-Reset */
.ui-helper-reset {
line-height: 1.3;
}
/* ===================================================================================================================
* Skeleton
* ===================================================================================================================*/
/* s. BETDEV-487
* wird benötigt um das von Bootstrap gesetzte "scroll-behavior: smooth" zu überschreiben
* führte zum hin und her Springen beim Eingeben von Text in Textareas, wenn man diese durch mehrere Zeilenumbrüche vergrößerte
*/
@media (prefers-reduced-motion: no-preference) {
:root {
scroll-behavior: auto;
}
}
/* ===================================================================================================================
* Basis-Layout
* ===================================================================================================================*/
.nbp-main-grid {
display: grid;
grid-template-columns: auto 1fr auto;
grid-template-rows: auto 1fr;
grid-template-areas:
"header header header"
"navigation content seitenhilfe";
}
header.nbp-header {
grid-area: header;
}
nav.nbp-nav {
grid-area: navigation;
height: fit-content;
padding-top: 16px;
}
main.nbp-main {
grid-area: content;
min-width: 0;
height: fit-content;
}
aside.nbp-aside {
grid-area: seitenhilfe;
height: fit-content;
padding-top: 16px;
}
.nbp-main {
background: var(--nbp-color-white);
border-radius: 8px;
}
/* ===================================================================================================================
* Sticky Verhalten
* ===================================================================================================================*/
/* Sticky z-Index:
950 - Toast
930 - Header
920 - Sticky Content der direkt über den Menüs aufliegt (Abstand zu Header)
910 - normales Level (alle Menüs, Header, Tabview, etc.)
< 910 - alles was durchscrollen soll (Gegenstandsbaum)
*/
/* "position:sticky" und "top" wird per JavaScript gesetzt. */
.nbp-sticky {
z-index: 910;
}
.nbp-sticky-top-gap {
padding-top: 16px;
background: var(--nbp-color-cool-gray-20);
z-index: 920;
}
/* erzeugt einen grauen Abstand zum Header, wenn keine menuForm vorhanden ist (Bsp.: Dashboard) */
.nbp-nomenu.nbp-sticky-top-gap {
/* margin-bottom damit der border-radius bestehen bleibt */
padding-top: 22px;
margin-bottom: -6px;
}
/* ========================================================
* Back-to-Top
* ========================================================*/
a.nbp-back-to-top {
box-sizing: border-box;
position: fixed;
bottom: 25px;
right: 25px;
opacity: 0.85;
background-color: var(--nbp-color-blue-60);
width: 30px;
height: 30px;
border-radius: 50%;
padding: 7px;
z-index: 950;
display: none;
font-size: 16px;
line-height: 1em;
color: var(--nbp-color-white);
text-decoration: none !important;
text-align: center;
}
.nbp-back-to-top:hover,
.nbp-back-to-top:focus {
outline: none;
opacity: 1;
cursor: pointer;
}
/* ===================================================================================================================
* Allgemeine Elemente
* ===================================================================================================================*/
p {
padding: 0;
margin: 0 0 .6em 0;
}
img, fieldset {
border: 0;
}
table {
border-spacing: 0;
border-collapse: collapse;
}
h2 {
font-size: 1.5em;
font-weight: 300;
margin-top: 1em;
margin-bottom: 1em;
}
h3 {
font-size: 1.4em;
font-weight: 300;
margin-top: 1em;
margin-bottom: 1em;
}
h4 {
font-size: 1em;
font-weight: bold;
margin-top: 1.33em;
margin-bottom: 1.33em;
}
/* ===================================================================================================================
* Bootstrap Base
* ===================================================================================================================*/
* {
box-sizing: border-box;
}
*:before,
*:after {
box-sizing: border-box;
}
button:focus {
outline: none;
}
/* ===================================================================================================================
* Helfer-Klassen
* ===================================================================================================================*/
.nbp-keep-line-breaks {
white-space: pre-wrap;
}
.max-width-100 {
max-width: 100%;
}
.hidden {
display: none !important;
}
.opacity-1 {
opacity: 1 !important;
}
/* ===================================================================================================================
* Progress (Ajax-Requests)
* ===================================================================================================================*/
body.nbp-progress, body.nbp-progress * {
cursor: progress !important;
}
/* ===================================================================================================================
* Focus - Mindestkontrast 3:1
* ===================================================================================================================*/
/* Links :: TAB-Focus */
.nbp-tabfocus-on a:focus {
outline: 2px dotted;
outline-offset: 2px;
}
/* Inputs :: TAB-Focus */
.nbp-tabfocus-on .ui-inputfield.ui-state-focus,
.nbp-tabfocus-on .ui-selectonemenu.ui-state-focus,
.nbp-tabfocus-on .ui-selectcheckboxmenu.ui-state-focus,
.nbp-tabfocus-on .ui-chkbox-box.ui-state-focus,
.nbp-tabfocus-on .ui-timepicker .ui-inputfield:focus,
.nbp-tabfocus-on .ui-autocomplete .ui-autocomplete-dropdown.ui-button.ui-button-icon-only.ui-state-focus,
.nbp-tabfocus-on .form-check-input:focus,
.nbp-tabfocus-on select:focus,
.nbp-tabfocus-on .cke_chrome.cke_focus {
box-shadow: var(--nbp-shadow-tabfocus);
}
/* ===================================================================================================================
* Icons
* ===================================================================================================================*/
/* Icons: FontAwesome *****/
.ui-icon[class*="fa-"],
.ui-icon[class*="nbp-fi-"] {
background-image: none;
font-size: 14px;
text-indent: 0;
color: inherit;
overflow: visible;
padding: 0;
}
.fa-download {
transform: translateY(-.5px);
}
.transform-rotate90 {
transform: rotate(90deg);
}
.transform-flip {
transform: scaleX(-1);
}
/* Boolean :: Readonly */
.nbp-boolean {
font-size: 16px;
width: 1em;
}
.nbp-boolean-on {
color: var(--nbp-color-cool-gray-80);
}
.nbp-boolean-off {
color: var(--nbp-color-cool-gray-50);
}
/* Status Icon Farben */
.nbp-ok {
color: var(--nbp-support-success);
}
.nbp-warning {
color: var(--nbp-support-warning);
}
.nbp-error {
color: var(--nbp-support-error);
}
/* Status Tag mit Background-Color */
.nbp-status-tag {
/*display: inline-block;*/
/*white-space: nowrap;*/
color: var(--nbp-color-cool-gray-80);
border: 1px solid transparent;
border-radius: 3px;
padding: 0 3px;
margin: 0;
}
.nbp-status-tag ~ .nbp-status-tag {
margin-top: 1px;
}
.nbp-status-green--bg,
.nbp-status-success--bg {
background-color: var(--nbp-color-green-15);
}
.nbp-status-yellow--bg,
.nbp-status-warning--bg {
background-color: var(--nbp-color-yellow-15);
}
.nbp-status-red--bg,
.nbp-status-error--bg {
background-color: var(--nbp-color-red-15);
}
.nbp-status-blue--bg,
.nbp-status-progress--bg {
background-color: var(--nbp-color-blue-15);
}
.nbp-status-gray--bg,
.nbp-status-neutral--bg {
background-color: var(--nbp-color-cool-gray-20);
}
/* PF-Icons mit Fontawesome-Icons ersetzen */
.ui-icon.ui-chkbox-icon,
.ui-icon.ui-radiobutton-icon,
.ui-icon.ui-icon-seek-prev,
.ui-icon.ui-icon-arrow-1-e,
.ui-icon.ui-icon-arrowstop-1-e,
.ui-icon.ui-icon-arrow-1-w,
.ui-icon.ui-icon-arrowstop-1-w,
.ui-picklist-filter-container .ui-icon,
.ui-icon.ui-icon-closethick,
.ui-messages .ui-icon.ui-icon-close,
.ui-autocomplete-token .ui-icon.ui-icon-close,
.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon,
.ui-selectonemenu-filter-container .ui-icon,
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger .ui-icon,
.ui-selectcheckboxmenu-filter-container .ui-icon,
.ui-selectcheckboxmenu-close .ui-icon,
.ui-autocomplete .ui-autocomplete-dropdown .ui-icon,
.ui-datatable .ui-sortable-column .ui-icon,
.ui-accordion .ui-accordion-header .ui-icon,
.ui-datepicker .ui-datepicker-prev .ui-icon,
.ui-datepicker .ui-datepicker-next .ui-icon,
.ui-datepicker .ui-picker-up .ui-icon,
.ui-datepicker .ui-picker-down .ui-icon,
.ui-tree-toggler.ui-icon,
.ui-fileupload .ui-icon,
.ui-icon,
.ui-password .ui-password-icon {
/* Reset PF */
background: 0 !important;
text-indent: 0 !important;
border-radius: 0;
transform: translate(0, 0);
overflow: visible;
/* Fontawesome */
font-family: 'Font Awesome 6 Pro';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: inline-block;
text-rendering: auto;
/* Icon */
font-size: 16px;
line-height: 1;
}
/* Checkbox */
.ui-icon.ui-chkbox-icon.ui-icon-check:before {
content: "\f00c"; /* fa-check */
font-weight: 900;
}
/* Radiobutton */
.ui-icon.ui-radiobutton-icon.ui-icon-bullet:before {
content: "\f111"; /* fa-circle */
}
.ui-password.ui-password-masked .ui-password-icon:before {
content: "\f06e"; /* fa-eye */
}
.ui-password.ui-password-unmasked .ui-password-icon:before {
content: "\f070"; /* fa-eye-slash */
}
/* Button :: Fileupload */
.ui-fileupload .ui-fileupload-choose .ui-icon:before {
content: "\f093"; /* fa-upload */
}
.ui-fileupload .ui-fileupload-cancel .ui-icon:before {
content: "\f00d"; /* fa-xmark */
}
/* Dialog */
.ui-icon.ui-icon-closethick:before {
content: "\f00d"; /* fa-xmark */
}
/* Messages */
.ui-messages .ui-icon.ui-icon-close:before {
font-size: 14px;
content: "\f00d"; /* fa-xmark */
}
/* Accordion */
.ui-accordion-header .ui-icon.ui-icon-triangle-1-s:before {
content: "\f077"; /* fa-chevron-up */
}
.ui-accordion-header .ui-icon.ui-icon-triangle-1-e:before {
content: "\f078"; /* fa-chevron-down */
}
/* Tree */
.ui-tree-toggler.ui-icon.ui-icon-triangle-1-s:before {
content: "\f0d7"; /* fa-caret-down */
font-weight: 900;
}
.ui-tree-toggler.ui-icon.ui-icon-triangle-1-e:before {
content: "\f0da"; /* fa-caret-right */
font-weight: 900;
}
/* Calendar, Datepicker */
.ui-datepicker .ui-datepicker-prev .ui-icon,
.ui-datepicker .ui-datepicker-next .ui-icon {
overflow: hidden;
}
.ui-datepicker .ui-datepicker-prev .ui-icon:before {
content: "\f060"; /* fa-arrow-left */
}
.ui-datepicker .ui-datepicker-next .ui-icon:before {
content: "\f061"; /* fa-arrow-right */
}
.ui-datepicker .ui-picker-up .ui-icon:before {
content: "\f062"; /* fa-arrow-up */
}
.ui-datepicker .ui-picker-down .ui-icon:before {
content: "\f063"; /* fa-arrow-down */
}
/* Row-Toggler */
.ui-row-toggler.ui-icon.ui-icon-circle-triangle-e:before {
content: '\f054'; /* fa-chevron-right */
}
.ui-row-toggler.ui-icon.ui-icon-circle-triangle-s:before {
content: '\f078'; /* fa-chevron-down */
}
.ui-datatable thead .ui-row-toggler {
font-weight: 400;
}
/* SelectOneMenu, SelectCheckboxMenu */
.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon,
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger .ui-icon {
transform: translateY(-1px);
}
.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon:before,
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger .ui-icon:before,
.ui-autocomplete .ui-autocomplete-dropdown .ui-icon:before {
content: "\f0dc"; /* fa-sort */
}
.ui-picklist-filter-container .ui-icon:before,
.ui-selectonemenu-filter-container .ui-icon:before,
.ui-selectcheckboxmenu-filter-container .ui-icon:before {
content: "\f002"; /* fa-magnifying-glass */
}
.ui-selectcheckboxmenu-close .ui-icon:before {
content: "\f00d"; /* fa-xmark */
}
/* Datatable :: Sort :: Default */
.ui-datatable .ui-sortable-column .ui-icon {
font-size: 12px;
text-align: center;
}
/* Datatable :: Sort :: Default */
.ui-datatable .ui-sortable-column .ui-icon:before {
content: "\f0dc"; /* fa-sort */
}
/* Datatable :: Sort :: Up */
.ui-datatable .ui-sortable-column .ui-icon.ui-icon-triangle-1-n:before {
content: "\f0d8"; /* fa-caret-up */
}
/* Datatable :: Sort :: Down */
.ui-datatable .ui-sortable-column .ui-icon.ui-icon-triangle-1-s:before {
content: "\f0d7"; /* fa-caret-down */
}
/* Datatable :: Select Menü */
.ui-datatable .ui-filter-column select.ui-column-filter {
appearance: none;
padding-right: 30px;
background: url('data:image/svg+xml,') no-repeat right 8px center/10px 10px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
/* Picklist */
.ui-icon.ui-icon-arrow-1-e:before {
content: "\f061"; /* fa-arrow-right */
}
.ui-icon.ui-icon-arrowstop-1-e:before {
content: "\f340"; /* fa-arrow-right-to-line */
}
.ui-icon.ui-icon-arrow-1-w:before {
content: "\f060"; /* fa-arrow-left */
}
.ui-icon.ui-icon-arrowstop-1-w:before {
content: "\f33e"; /* fa-arrow-left-to-line */
}
/* Row-Toggler */
div.ui-row-toggler {
color: var(--nbp-color-cool-gray-60);
outline: none;
}
div.ui-row-toggler.ui-icon {
font-family: 'Font Awesome 6 Pro';
font-size: 12px;
text-indent: 0;
width: 22px;
height: 22px;
border: 1px solid transparent;
background-color: transparent;
background-image: none;
color: var(--nbp-color-cool-gray-60);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
div.ui-row-toggler.ui-icon:hover,
div.ui-row-toggler.ui-icon:focus {
border: 1px solid var(--nbp-color-cool-gray-20);
background-color: var(--nbp-color-cool-gray-20);
font-weight: normal;
}
/* Paginator :: PF-Icons mit FontAwesome-Icons ersetzen */
.ui-paginator-first,
.ui-paginator-prev,
.ui-paginator-next,
.ui-paginator-last {
/* FontAwesome */
font-family: 'Font Awesome 6 Pro';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: inline-block;
text-rendering: auto;
/* Icon */
font-size: 12px;
}
.ui-paginator-first .ui-icon,
.ui-paginator-prev .ui-icon,
.ui-paginator-next .ui-icon,
.ui-paginator-last .ui-icon {
display: none;
}
.ui-paginator-first:before {
content: "\e3d4"; /* fa-arrow-left-long-to-line */
}
.ui-paginator-prev:before {
content: "\f177"; /* fa-arrow-left-long */
}
.ui-paginator-next:before {
content: "\f178"; /* fa-arrow-right-long */
}
.ui-paginator-last:before {
content: "\e3d5"; /* fa-arrow-right-long-to-line */
}
.ui-paginator .ui-paginator-first,
.ui-paginator .ui-paginator-prev,
.ui-paginator .ui-paginator-next,
.ui-paginator .ui-paginator-last {
padding: 3px 6px;
}
/* ===================================================================================================================
* Links
* ===================================================================================================================*/
a {
text-underline-offset: .15em; /* line-height ist nur 1.2 */
}
:focus-visible {
outline: none;
}
/* Dotted Link */
.nbp-dotted-link {
text-underline-offset: .15em;
text-decoration: 1px underline dotted;
cursor: pointer;
}
.nbp-dotted-link:hover, a.nbp-dotted-link:hover,
.nbp-dotted-link:focus, a.nbp-dotted-link:focus {
text-decoration: 1px underline solid;
}
.nbp-dotted-link-off,
.nbp-dotted-link-off:hover {
text-decoration: none;
}
/* Iconlink (dotted) */
.nbp-iconlink {
transform: translateX(25px);
display: inline-block; /* verhindere Umbruch zwischen icon und link */
outline-offset: 2px;
/* dotted */
text-decoration: 1px underline dotted;
line-height: 1.4;
}
.nbp-iconlink:before {
content: "\f0a9"; /* fa-circle-arrow-right */
font-family: 'Font Awesome 6 Pro';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: inline-block;
position: absolute;
margin-left: -25px;
text-align: left;
font-size: 16px;
line-height: 17px;
transform: translateY(0);
}
a.nbp-iconlink:hover, a.nbp-iconlink:focus {
text-decoration: 1px underline solid;
}
/* Linkicon */
.linkicon {
font-size: 15px;
display: inline-block;
transform: translateY(1px);
margin-right: 6px;
}
.linkicon:before {
content: "\f0a9"; /* fa-circle-arrow-right */
font-family: 'Font Awesome 6 Pro';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* PF-Link Disabled State */
.ui-commandlink.ui-state-disabled {
text-decoration: none;
}
/* ===================================================================================================================
* Primefaces :: Buttons
* ===================================================================================================================*/
/* Buttons */
.ui-button {
transition: background-color .1s ease, border-color .1s ease;
border-radius: 20px;
}
/* Text-Buttons */
.ui-button .ui-button-text {
line-height: 1em;
white-space: nowrap;
}
/* PF LinkButton */
.ui-linkbutton.ui-button.ui-state-default > a:focus {
outline: none;
}
/* Buttons Icon-Only */
.ui-button-icon-only {
width: 32px;
height: 32px;
border-radius: 50%;
vertical-align: middle;
}
.ui-button-icon-only .ui-button-text {
display: none;
}
/* Button Round */
.ui-button.button-round {
border-radius: 50%;
}
/* Button Styles default (button-md) */
.ui-button {
display: inline-flex;
align-items: center;
justify-content: center;
height: 32px;
}
.ui-button .ui-icon {
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
position: relative;
top: 0;
left: 0;
margin: 0;
}
/* Icon left */
.ui-button.ui-button-text-icon-left .ui-icon {
margin-left: 1em;
}
/* Icon right */
.ui-button.ui-button-text-icon-right .ui-button-text {
order: 1;
}
.ui-button.ui-button-text-icon-right .ui-icon {
order: 2;
margin-right: 1em;
}
/* Padding */
.ui-button-text-only .ui-button-text {
padding: 0 1.3em;
}
.ui-button-text-icon-left .ui-button-text {
padding: 0 1.3em 0 .5em;
}
.ui-button-text-icon-right .ui-button-text {
padding: 0 .5em 0 1.3em;
}
/* Primary Buttons */
.button-primary.ui-state-default {
border: 1px solid var(--nbp-color-blue-60);
background-color: var(--nbp-color-blue-60);
font-weight: normal;
color: var(--nbp-color-white);
}
.button-primary:hover,
.button-primary:focus {
border: 1px solid var(--nbp-color-blue-70);
background-color: var(--nbp-color-blue-70);
font-weight: normal;
}
.button-primary.ui-state-disabled,
.button-primary:disabled {
border: 1px solid var(--nbp-color-cool-gray-20);
background-color: var(--nbp-color-cool-gray-20);
color: var(--nbp-color-cool-gray-30);
cursor: default;
}
/* Icon */
.button-primary.ui-state-default .ui-icon,
.button-primary:hover .ui-icon,
.button-primary:focus .ui-icon {
color: var(--nbp-color-white);
}
.button-primary.ui-state-disabled .ui-icon,
.button-primary:disabled .ui-icon {
color: var(--nbp-color-cool-gray-30);
}
/* Ghost Buttons */
.button-ghost.ui-state-default {
border: 1px solid transparent;
background-color: transparent;
font-weight: normal;
color: var(--nbp-color-cool-gray-60);
box-shadow: none;
}
.button-ghost:hover,
.button-ghost:focus {
border: 1px solid var(--nbp-color-cool-gray-10);
background-color: var(--nbp-color-cool-gray-10);
font-weight: normal;
}
.button-ghost.ui-state-disabled,
.button-ghost:disabled {
background-color: transparent;
border-color: transparent;
color: var(--nbp-color-cool-gray-30);
cursor: default;
}
/* Icon */
.button-ghost.ui-state-default .ui-icon,
.button-ghost:hover .ui-icon,
.button-ghost:focus .ui-icon {
color: var(--nbp-color-cool-gray-60);
}
/* Button Ghost auf grauem Hintergrund */
.button-ghost-grey.button-lg .ui-icon[class*="fa-"] {
font-size: 16px;
}
.button-ghost-grey:hover,
.button-ghost-grey:focus {
border: 1px solid var(--nbp-color-cool-gray-20);
background-color: var(--nbp-color-cool-gray-20);
}
/* Button XtraSmall :: Inline table */
.button-xs {
height: 22px;
}
.button-xs.ui-button-text-only .ui-button-text {
padding: 0 1em;
font-size: 12px;
}
.button-xs.ui-button-icon-only {
width: 22px;
height: 22px;
margin: 0 3px;
}
.button-xs .ui-icon[class*="fa-"],
.button-xs .ui-icon[class*="nbp-fi-"]{
font-size: 12px;
font-weight: 400;
}
/* Button Small */
.button-sm {
height: 24px;
}
.button-sm.ui-button-icon-only {
width: 24px;
height: 24px;
margin: 0 3px;
}
.button-sm .ui-icon[class*="fa-"],
.button-sm .ui-icon[class*="nbp-fi-"]{
font-size: 13px;
font-weight: 400;
}
/* Button Medium :: Inline inputs (Default) */
.button-md {
height: 28px;
}
.button-md.ui-button-icon-only {
width: 28px;
height: 28px;
margin: 0 3px;
}
.button-md .ui-icon[class*="fa-"] {
font-size: 14px;
/* font-weight: 400; */
}
/* Button Large :: Call To Action */
.button-lg {
height: 32px;
}
.button-lg.ui-button-icon-only {
width: 32px;
height: 32px;
margin: 0 3px;
}
.button-lg .ui-icon[class*="fa-"] {
font-size: 14px;
}
/* Split-Button */
.ui-splitbutton-menubutton.ui-button-icon-only {
width: 28px;
height: auto;
}
/* Dualer Split-Button */
.button-split-left {
margin-right: -12px !important;
}
.button-split-left .ui-icon {
margin-left: 8px;
}
.button-split-left.ui-button-text-icon-left .ui-button-text {
padding-right: 12px;
}
.button-split-left.ui-button-text-icon-left .ui-icon {
margin-left: 1em;
margin-right: .2em;
}
.button-split-left + .button-split-right {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
margin-left: 0 !important;
}
.ui-button.button-primary.button-split-right {
border-left: 1px solid var(--nbp-color-white);
}
.button-split-left:hover + .button-split-right,
.button-split-left:focus + .button-split-right {
background-color: var(--nbp-color-blue-70);
color: var(--nbp-color-white);
}
/* Button :: Fileupload mit Fonticon */
.ui-fileupload-choose .ui-icon {
font-size: 12px;
}
/* PF-Button individuell als 'active' markieren */
.nbp-button-supress-ui-state-focus.ui-state-focus {
border-color: var(--nbp-color-blue-60);
background-color: transparent;
color: var(--nbp-color-blue-60);
}
.nbp-button-supress-ui-state-focus.nbp-btn-active,
.nbp-button-supress-ui-state-focus:hover,
.nbp-tabfocus-on .nbp-button-supress-ui-state-focus.ui-state-focus {
border-color: var(--nbp-color-blue-60);
background-color: var(--nbp-color-blue-60);
color: var(--nbp-color-white);
}
.nbp-button-supress-ui-state-focus.nbp-btn-active:hover,
.nbp-tabfocus-on .nbp-button-supress-ui-state-focus.nbp-btn-active.ui-state-focus {
background-color: var(--nbp-color-blue-70);
border-color: var(--nbp-color-blue-70);
}
/* Button mit Tooltip */
.nbp-bs-button-tooltip {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.ui-dialog .nbp-bs-button-tooltip,
.ui-dialog .nbp-bs-tooltip {
z-index: 2000;
}
.tooltip {
font-family: inherit;
}
.nbp-bs-tooltip .tooltip-inner,
.nbp-bs-tooltip-menu .tooltip-inner {
max-width: 500px;
}
.nbp-bs-tooltip {
margin-top: 6px !important;
}
.nbp-bs-tooltip-menu {
margin-left: 10px !important;
}
/* ===================================================================================================================
* Grid
* ===================================================================================================================*/
.size1of1 {width: 100%;}
.size1of2 {width: 50%;}
.size1of3 {width: 33.33%;}
.size2of3 {width: 66.66%;}
.size1of4 {width: 25%;}
.size3of4 {width: 75%;}
.size1of5 {width: 20%;}
.size2of5 {width: 40%;}
.size3of5 {width: 60%;}
.size4of5 {width: 80%;}
.size1of6 {width: 16.65%;}
.size1of8 {width: 12.5%;}
.size3of8 {width: 37.5%;}
.nbp-clearfix:after {
content: ".";
visibility: hidden;
display: block;
height: 0;
clear: both;
}
/* line (row) */
.line {
margin-bottom: 5px;
min-height: 30px;
}
.line:before,
.line:after {
display: table;
content: " ";
}
.line:after {
clear: both;
}
.line.line-small {
min-height: 1px;
}
/* line-collapse lässt die line verschwinden, wenn kein Content vorhanden ist
Achtung: whitespace wird vom empty-Operator auch als Content betrachtet - daher eine h:panelGroup für die line verwenden */
.line.line-collapse:empty {
margin-bottom: 0;
min-height: 0;
}
.button-line {
text-align: right;
min-height: 1em;
}
.button-line button {
margin-left: 10px;
}
.button-line-small {
text-align: right;
}
/* ===================================================================================================================
* Formulare
* ===================================================================================================================*/
/*
* .nbp-form-group
* .nbp-form-label-col
* .nbp-form-input-col
*/
.nbp-form-group {
float: left;
margin-bottom: 10px;
}
/* geringere Zeilenhöhe */
.nbp-form-readonly .line {
min-height: 26px;
}
.nbp-form-readonly .nbp-form-group {
margin-bottom: 0;
}
/* label-col und input-col */
.nbp-form-group .nbp-form-label-col,
.nbp-form-group .nbp-form-input-col {
float: left;
min-height: 28.5px;
}
/* label-col */
.nbp-form-label-col {
display: flex;
align-items: center;
}
/* Label :: Text */
.nbp-form-label-col label,
.nbp-form-label-col .nbp-form-label {
max-width: calc(100% - 50px);
display: inline-block;
margin: 0;
color: var(--nbp-color-cool-gray-60);
font-size: 1em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
box-sizing: border-box;
}
.nbp-form-label-col.nbp-form-label-noinfo label,
.nbp-form-label-col.nbp-form-label-noinfo .nbp-form-label {
max-width: calc(100% - 10px);
}
/* mandatory Kennzeichnung */
.nbp-form-label-col .nbp-form-label-mandatory {
width: 6px;
margin-left: 3px;
color: var(--nbp-color-cool-gray-60);
}
/* Label :: Info-Icon (tooltip) */
.nbp-form-label-col > .nbp-infoicon {
display: inline-block;
margin: 0 22px 0 10px;
font-size: 14px;
width: 1em;
color: var(--nbp-color-cool-gray-70);
cursor: default;
box-sizing: border-box;
outline: 0;
}
.nbp-tabfocus-on .nbp-form-label-col > .nbp-infoicon:focus {
font-weight: bold;
}
/* Ohne Label */
.nbp-form-group .nbp-form-input-col.nbp-form-group-nolabel {
width: 100% !important;
float: none;
}
/* Stacked */
.nbp-form-group.nbp-form-group-stacked {
margin-bottom: 10px;
}
.nbp-form-group.nbp-form-group-stacked .nbp-form-label-col {
width: 100% !important;
padding-bottom: 8px;
}
.nbp-form-group.nbp-form-group-stacked .nbp-form-input-col {
width: 100% !important;
}
/* Sizing -------------------------------------------------------------- */
/* 2-spaltiger Grid */
.line .nbp-form-group.size1of2 .nbp-form-input-col {
padding-right: 20px;
}
.line .nbp-form-group.size1of2:nth-of-type(2) .nbp-form-input-col {
padding-right: 0;
padding-left: 20px;
}
.line .nbp-form-group.size1of2:nth-of-type(2) .nbp-form-label-col {
margin-right: -20px;
margin-left: 20px;
}
.nbp-form-group-p-l {
padding-left: 20px;
}
/* default: ratio2to3 */
.nbp-form-group .nbp-form-label-col {
width: 40%;
}
.nbp-form-group .nbp-form-input-col {
width: 60%;
}
/* FormGroup Display Modi */
.nbp-form-block {
display: block;
}
.nbp-form-flex-grid {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 10px;
}
.nbp-form-flex-row {
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
}
.nbp-form-flex-col {
display: flex;
flex-direction: column;
justify-content: center;
}
.nbp-form-group .nbp-form-flex-row .ui-calendar,
.nbp-form-group .nbp-form-flex-row .ui-selectcheckboxmenu,
.nbp-form-group .nbp-form-flex-row .ui-inputnumber {
width: 100%;
}
/* size1of1 default: ratio1to4 */
.nbp-form-group.size1of1 .nbp-form-label-col {
width: 20%;
}
.nbp-form-group.size1of1 .nbp-form-input-col {
width: 80%;
}
/* ratio1to1 */
.nbp-form-group.ratio1to1 .nbp-form-label-col {
width: 50%;
}
.nbp-form-group.ratio1to1 .nbp-form-input-col {
width: 50%;
}
/* ratio1to2 */
.nbp-form-group.ratio1to2 .nbp-form-label-col {
width: 33.333%;
}
.nbp-form-group.ratio1to2 .nbp-form-input-col {
width: 66.666%;
}
/* ratio1to4 */
.nbp-form-group.ratio1to4 .nbp-form-label-col {
width: 20%;
}
.nbp-form-group.ratio1to4 .nbp-form-input-col {
width: 80%;
}
/* ratio1to4 - small */
.nbp-form-group.ratio1to4s .nbp-form-label-col {
width: 20%;
}
.nbp-form-group.ratio1to4s .nbp-form-input-col {
width: calc(50% + 15px);
padding-right: 0;
}
/* ratio1to9 */
.nbp-form-group.ratio1to9 .nbp-form-label-col {
width: 10%;
}
.nbp-form-group.ratio1to9 .nbp-form-input-col {
width: 90%;
}
/* ratio4to1 - speziell für reine Checkbox-Auflistungen */
.nbp-form-group.ratio4to1 .nbp-form-label-col {
width: 80%;
}
.nbp-form-group.ratio4to1 .nbp-form-input-col {
width: 20%;
}
/* Breite 2-spaltiger Grid (size1of2) für andere Elemente */
.nbp-gridsize1of2 {
width: calc(50% - 20px);
}
/* Breite 3/4 (size1of1 ratio1to4s) für andere Elemente */
.nbp-gridsize3of4 {
width: calc(70% + 15px);
}
/* Input (nbp-form-input-col-readwrite) ------------------------------------------------------ */
/* 100% Breite für inputs */
input, textarea, .ui-inputfield, .ui-selectonemenu {
box-sizing: border-box;
}
.nbp-form-group input,
.nbp-form-group textarea,
.nbp-form-group .ui-inputfield,
.nbp-form-group .ui-selectonemenu {
width: 100%;
}
/* Bootstrap Checkbox und Radio */
.nbp-form-group .form-check {
margin-top: 3px;
min-height: 22px;
}
.nbp-form-group .form-check .form-check-label {
margin-top: 2px;
}
.nbp-form-group .form-check .form-check-input {
margin-top: 2px;
}
/* p:selectManyCheckbox */
.ui-selectmanycheckbox label {
padding-top: 6px;
}
/* p:calendar, p:autocomplete, p:inputNumber */
.nbp-form-group .nbp-form-input-col.nbp-form-block .ui-calendar,
.nbp-form-group .nbp-form-input-col.nbp-form-block .ui-autocomplete,
.nbp-form-group .nbp-form-input-col.nbp-form-block .ui-inputnumber,
.nbp-form-group .nbp-form-input-col.nbp-form-block .ui-password {
padding-top: 0;
}
/* CKEditor mit Button */
.nbp-form-group .nbp-form-ckeditor.nbp-form-ckeditor-mit-button {
float: left;
}
.nbp-form-group .nbp-form-ckeditor.nbp-form-ckeditor-mit-button + button {
margin-left: 10px;
}
/* Links */
.nbp-form-group .nbp-form-input-col > a, .nbp-form-group .nbp-form-input-col > span > a {
text-decoration: 1px underline dotted;
line-height: 1.2;
}
.nbp-form-group .nbp-form-input-col > a:hover, .nbp-form-group .nbp-form-input-col > span > a:hover,
.nbp-form-group .nbp-form-input-col > a:focus, .nbp-form-group .nbp-form-input-col > span > a:focus {
text-decoration: 1px underline solid;
}
/* Fileupload */
.nbp-form-group.nbp-form-fileupload {
/* width: 100%; */
}
/* Fileupload Multi */
.nbp-form-group.nbp-form-fileupload-multi .nbp-fileupload-dateiliste .size3of8 {
width: calc(37.5% + 20px);
}
.nbp-fileupload-dateiliste .nbp-fileupload-icon {
width: 15px;
text-align: center;
margin-right: 8px;
}
.nbp-fileupload-dateiliste .nbp-fileupload-dateiliste-item {
padding-bottom: 4px
}
/* Zeichenzähler für Textarea */
.nbp-charcount-output {
margin-top: -22px
}
/* Output (nbp-form-input-col-readonly) ------------------------------------------------------ */
/* Readonly für outputText und links */
.nbp-form-group .nbp-form-input-col > span,
.nbp-form-group .nbp-form-input-col > a {
display: block;
word-wrap: break-word;
overflow-wrap: break-word;
/* Lange Url in flex-container */
/* https://stackoverflow.com/questions/36150458/flex-item-overflows-container-due-to-long-word-even-after-using-word-wrap */
min-width: 1px;
}
.nbp-form-group .nbp-form-input-col.nbp-form-block > span,
.nbp-form-group .nbp-form-input-col.nbp-form-block > a {
padding-top: 6px;
}
/* Links */
.nbp-form-group .nbp-form-input-col > a {
display: inline-block;
}
/* Boolean + Link */
.nbp-form-group .nbp-form-input-col .form-check + a {
margin-left: 5px;
}
.nbp-form-group .nbp-form-input-col .nbp-form-flex {
display: flex;
align-items: center;
}
/* Date, Number */
.nbp-form-group .nbp-form-input-col .nbp-output-number,
.nbp-form-group .nbp-form-input-col .nbp-output-date,
.nbp-form-group .nbp-form-input-col .nbp-output-symbol {
display: inline-block;
}
.nbp-form-group .nbp-form-input-col .nbp-output-symbol {
margin-left: 4px;
}
/* Output Color */
.nbp-form-group .nbp-form-input-col .nbp-outputcolor {
margin-top: 1px;
}
/* Fonticon */
.nbp-form-group .nbp-form-input-col .nbp-fonticon {
font-size: 16px;
padding-top: 4px;
}
/* Image */
.output-image {
max-width: 100px;
max-height: 100px;
display: block !important;
border: 1px solid var(--nbp-color-cool-gray-15);
}
.output-image.output-image-sm {
max-width: 200px;
max-height: 200px;
}
.output-image.output-image-md {
max-width: 200px;
max-height: 200px;
}
.output-image.output-image--border-0 {
border: 0;
}
.nbp-input-image-row {
display: flex;
flex-wrap: wrap;
gap: 1.5rem;
}
.nbp-form-group-padding {
padding-top: 6px;
}
.nbp-form-group-padding .col-auto .button-xs {
transform: translateY(-3px);
}
/* Text :: Ausserhalb einer Formgroup */
.nbp-form-text-padding {
display: inline-block;
padding-top: 6px;
}
/* Links :: Ausserhalb einer Formgroup */
a.nbp-form-text-padding {
display: inline-block;
padding-top: 5px;
}
/* readonly kann auch per ui-state-error umrandet werden */
.ui-state-error.nbp-readonly {
border: 1px solid var(--nbp-support-error);
background-color: transparent;
color: inherit;
border-radius: 3px;
padding: 4px;
}
.nbp-select.ui-state-error {
color: inherit;
border-color: var(--nbp-support-error);
}
/* ===================================================================================================================
* Faces :: Inputs
* ===================================================================================================================*/
/* =================================================================
* NBP :: SelectManyCheckbox / SelectOneRadio mit Bootstrap-Styling
* =================================================================*/
.form-check {
min-height: 16px;
}
.form-check-inline {
margin-right: 15px;
}
.form-check-input {
border: 1px solid var(--nbp-color-cool-gray-40);
}
.form-check-input[type="checkbox"] {
border-radius: 3px;
}
.form-check-input:checked {
background-color: var(--nbp-color-blue-60);
border-color: var(--nbp-color-blue-60);
}
.form-check-input:disabled:checked {
background-color: var(--nbp-color-cool-gray-50);
border-color: var(--nbp-color-cool-gray-50);
}
.form-check-input:disabled,
.form-check-input.form-check-input-readonly:disabled {
background-color: var(--nbp-color-cool-gray-15);
}
.form-check-input.form-check-input-readonly:disabled:checked {
background-color: var(--nbp-color-cool-gray-80);
border-color: var(--nbp-color-cool-gray-80);
}
.form-check-input:enabled:hover {
border-color: var(--nbp-color-cool-gray-60);
}
.form-check-input:checked:hover {
border-color: var(--nbp-color-blue-60);
}
/* =================================================================
* NBP :: InputOneMenue mit h:selectOneMenu
* =================================================================*/
.nbp-select {
width: 100%;
min-height: 28.5px;
background-color: var(--nbp-color-white);
color: var(--nbp-color-cool-gray-80);
border: 1px solid var(--nbp-color-cool-gray-30);
border-radius: 3px;
padding: 4px 24px 4px 4px;
text-overflow: ellipsis;
/* Pfeil überschreiben */
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-size: 16px 12px;
background-position: right 5px center;
}
.nbp-select:hover {
cursor: pointer;
}
.nbp-select:hover,
.nbp-select:focus {
border: 1px solid var(--nbp-color-cool-gray-40);
}
select:focus,
.nbp-select:focus {
box-shadow: var(--nbp-shadow-focus);
}
/* ===================================================================================================================
* Primefaces :: Inputs
* ===================================================================================================================*/
.ui-shadow {
box-shadow: var(--nbp-shadow-overlay);
}
.ui-inputfield {
border-radius: 3px;
}
/* ========================================================
* Primefaces :: Inputtext
* ========================================================*/
.ui-inputtext {
min-height: 28.5px;
}
.nbp-input-small .ui-inputtext,
.nbp-input-small.ui-inputtext {
line-height: 1.05;
padding: 3px 4px;
}
/* ========================================================
* Primefaces :: Password
* ========================================================*/
.ui-password.ui-input-icon-right {
position: relative;
display: inline-block;
}
.ui-password.ui-input-icon-right .ui-inputfield {
padding-right: 2rem;
}
.ui-password.ui-input-icon-right .ui-password-icon {
position: absolute;
top: 50%;
margin-top: -0.5rem;
right: 0.5rem;
font-style: normal;
font-size: 14px;
width: 16px;
color: var(--nbp-color-cool-gray-60);
}
.ui-password.ui-input-icon-right .ui-password-icon:hover {
cursor: pointer;
}
/* ========================================================
* Primefaces :: Checkbox
* ========================================================*/
.ui-chkbox .ui-chkbox-box {
width: 16px;
height: 16px;
border-radius: 3px;
}
.ui-icon.ui-chkbox-icon {
display: none;
}
.ui-chkbox-box {
background: transparent;
color: var(--nbp-color-white);
}
.ui-chkbox-box.ui-state-active {
background-color: var(--nbp-color-blue-60);
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}
.ui-chkbox-box.ui-state-hover,
.ui-chkbox-box.ui-state-focus {
border-color: var(--nbp-color-cool-gray-60);
}
/* ========================================================
* Primefaces :: Radiobutton
* ========================================================*/
.ui-radiobutton .ui-radiobutton-box {
width: 18px;
height: 18px;
}
.ui-icon.ui-radiobutton-icon {
margin: 0;
font-size: 7px;
text-align: center;
transform: translateY(-1.5px);
}
.ui-radiobutton-box {
background: transparent;
}
.ui-radiobutton-box.ui-state-active {
background: var(--nbp-color-blue-60);
}
.ui-radiobutton-box.ui-state-hover {
border-color: var(--nbp-color-cool-gray-80);
}
.ui-radiobutton-box.ui-state-disabled {
opacity: 1;
}
/* ========================================================
* Primefaces :: SelectManyCheckbox
* ========================================================*/
.ui-selectmanycheckbox.ui-grid-responsive .ui-g-12 {
padding: 0 0 5px 0;
}
.ui-selectmanycheckbox .ui-chkbox,
.ui-selectmanycheckbox label {
display: table-cell;
vertical-align: top;
}
.ui-selectmanycheckbox label {
margin: 0;
padding-left: 8px;
padding-right: 10px;
}
.ui-selectmanycheckbox .ui-state-disabled {
opacity: 1;
}
.ui-selectmanycheckbox.ui-state-error {
background: inherit;
color: inherit;
border: none;
}
.ui-selectmanycheckbox.ui-state-error .ui-chkbox-box {
border-color: var(--nbp-support-error);
}
/* SelectManyCheckbox + SelectBooleanCheckbox "All" */
.nbp-selectmaycheckbox-plus-all {
display: flex;
}
/* ========================================================
* Primefaces :: ColorPicker
* ========================================================*/
.clr-field {
display: flex;
max-width: 240px;
}
.clr-field button {
margin-right: 4px;
height: 20px;
width: calc(100% - 75px);
border-radius: 3px;
border: none;
}
.clr-field button:after {
box-shadow: none;
}
.clr-field button.ui-state-error {
width: calc(100% - 75px);
color: inherit;
border: none;
}
.clr-close, .clr-clear {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 8px;
flex-grow: 1;
margin: 5px 5px 20px 5px;
}
.clr-clear {
margin-left: 20px;
}
.clr-close {
margin-right: 20px;
}
.clr-picker button {
color: var(--nbp-color-blue-60);
background-color: var(--nbp-color-white);
border: 1px solid var(--nbp-color-blue-60);
transition: background-color .1s ease, border-color .1s ease;
}
.clr-picker button:hover,
.clr-picker button:focus {
color: var(--nbp-color-white);
background-color: var(--nbp-color-blue-60);
}
/* Readonly */
.clr-field input.nbp-colorpicker-ro {
opacity: 1;
pointer-events: unset;
}
.clr-field input.nbp-colorpicker-ro.ui-state-hover {
border: 1px solid var(--nbp-color-cool-gray-30);
}
/* Output */
.nbp-outputcolor {
line-height: 1;
padding: 5px;
width: 100px;
text-align: center;
}
/* ========================================================
* Primefaces :: Selectonemenu
* ========================================================*/
.ui-selectonemenu {
display: block;
}
.ui-selectonemenu .ui-selectonemenu-label {
text-overflow: ellipsis;
min-height: 24px;
}
.ui-selectonemenu .ui-selectonemenu-trigger {
width: 24px;
color: var(--nbp-color-cool-gray-70);
background: 0;
border-color: transparent;
}
.ui-selectonemenu-items-wrapper {
width: auto;
height: auto;
}
.ui-selectonemenu-panel {
max-width: 70%;
}
.ui-selectonemenu-panel .ui-selectonemenu-list-item,
.ui-selectonemenu-panel .ui-selectonemenu-item-group {
box-sizing: border-box;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
white-space: nowrap;
padding: 3px 5px;
border: 0 none;
font-weight: normal;
}
.ui-selectonemenu-panel .ui-selectonemenu-item-group {
font-weight: bold;
}
.ui-selectonemenu-panel .ui-selectonemenu-filter-container {
box-sizing: border-box;
width: 100%;
}
.ui-selectonemenu-panel .ui-selectonemenu-filter {
width: 100%;
padding-right: 24px;
}
.ui-selectonemenu-panel .ui-selectonemenu-filter-container .ui-icon {
font-size: 14px;
color: var(--nbp-color-cool-gray-60);
}
.ui-selectonemenu-small .ui-selectonemenu-label {
padding: 2px 4px;
}
/* ========================================================
* Primefaces :: SelectCheckboxMenu
* ========================================================*/
.ui-selectcheckboxmenu {
display: block;
border-radius: 3px;
}
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-label-container {
display: block;
border: none;
background-color: transparent;
color: inherit;
}
.ui-selectcheckboxmenu.ui-state-focus {
box-shadow: var(--nbp-shadow-focus);
}
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-label {
text-overflow: ellipsis;
white-space: nowrap;
padding: 4px 20px 4px 4px;
min-height: 28.5px;
line-height: 18.5px;
}
/* Trigger identisch zu InputOneMenu */
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger {
width: 24px;
color: var(--nbp-color-cool-gray-70);
background-color: transparent;
border-color: transparent;
/* Pfeil überschreiben */
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-size: 16px 12px;
background-position: right 5px center;
}
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger .ui-icon {
/* von PF gesetztes Icon ausblenden */
display: none;
}
.ui-selectcheckboxmenu-panel {
padding: 0; /* noetig, damit jQuery die Breite korrekt setzt */
max-width: 50%;
box-shadow: var(--nbp-shadow-overlay);
}
/* Filter */
.ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-header {
/* display: none; */
background: var(--nbp-color-white);
border: 0;
margin: 0;
padding: 10px 6px 8px;
}
.ui-selectcheckboxmenu-header .ui-chkbox {
margin-top: 6px;
margin-left: 4px;
}
.ui-selectcheckboxmenu-header .ui-selectcheckboxmenu-filter-container {
width: calc(100% - 58px);
padding-left: 7px;
}
.ui-selectcheckboxmenu-header .ui-inputfield {
width: 100%;
padding: 4px 24px 4px 4px;
}
.ui-selectcheckboxmenu-header .ui-selectcheckboxmenu-filter-container .ui-icon {
font-size: 14px;
color: var(--nbp-color-cool-gray-60);
top: 6px;
}
.ui-selectcheckboxmenu-header .ui-selectcheckboxmenu-close {
padding: 0;
margin-top: 5px;
background: inherit;
border-color: transparent;
color: var(--nbp-color-cool-gray-60);
}
.ui-selectcheckboxmenu-header .ui-selectcheckboxmenu-close.ui-state-hover {
color: var(--nbp-color-cool-gray-80);
}
/* Items */
.ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-items-wrapper {
padding: 6px 6px 10px;
}
.ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-list-item {
padding: 0 0 0 4px;
}
.ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-list-item label {
cursor: pointer;
padding: 4px 5px 4px 35px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-list-item .ui-chkbox {
margin-top: -9px;
}
.ui-selectcheckboxmenu-header span.ui-icon {
float: unset;
}
/* ========================================================
* Primefaces :: Calendar
* ========================================================*/
.ui-datepicker {
min-width: unset !important;
width: 260px;
}
.nbp-si-suche-suchtext-col .p-datepicker,
.ui-datatable .p-datepicker {
width: 100%;
}
/* ========================================================
* Primefaces :: Autocomplete (Multi)
* ========================================================*/
/* Input */
.ui-autocomplete,
.ui-autocomplete-multiple-container,
.ui-autocomplete input {
width: 100%;
vertical-align: middle;
}
.ui-autocomplete.ui-autocomplete-multiple .ui-autocomplete-token {
color: var(--nbp-color-white);
background-color: var(--nbp-color-blue-60);
max-width: calc(100% - 4px);
}
/* Icon */
.ui-autocomplete-token .ui-icon {
text-align: center;
}
.ui-autocomplete-token .ui-icon.ui-icon-close:before {
font-size: 12px;
content: "\f00d"; /* fa-xmark */
}
/* Token-Label */
.ui-autocomplete-multiple-container .ui-autocomplete-token-label {
font-size: 13px;
padding: 2px 18px 2px 2px;
max-width: 100%;
display: block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
/* Autocomplete-Panel */
.ui-autocomplete-panel {
max-width: 50%;
overflow-x: hidden;
}
.ui-autocomplete-panel .ui-autocomplete-list-item.ui-state-highlight {
background-color: var(--nbp-color-cool-gray-10);
}
.ui-autocomplete-panel .ui-autocomplete-table th,
.ui-autocomplete-panel .ui-autocomplete-table td {
border-color: var(--nbp-color-white);
}
/* Autocomplete-Komponente für Schlagwörter */
.nbp-autocomplete-multi .ui-autocomplete-multiple-container {
border-radius: 3px;
}
.nbp-autocomplete-multi .ui-button.ui-autocomplete-dropdown {
background: transparent;
box-shadow: none;
border: 0;
border-radius: 0;
color: var(--nbp-color-cool-gray-70);
width: 24px;
}
/* ========================================================
* Primefaces :: Autocomplete (Single)
* ========================================================*/
.ui-autocomplete .ui-inputfield {
border-radius: 3px;
min-height: 28px;
}
.ui-autocomplete .ui-autocomplete-dropdown.ui-button.ui-button-icon-only {
box-shadow: none;
border-radius: 0 3px 3px 0;
border: 1px solid var(--nbp-color-cool-gray-30);
color: var(--nbp-color-cool-gray-70);
background-color: var(--nbp-color-white);
width: 28px;
/* Pfeil überschreiben */
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-size: 16px 12px;
background-position: right 5px center;
}
.ui-autocomplete .ui-autocomplete-dropdown.ui-button.ui-button-icon-only.ui-state-focus,
.ui-autocomplete .ui-autocomplete-dropdown.ui-button.ui-button-icon-only:hover {
border: 1px solid var(--nbp-color-cool-gray-40);
}
.ui-autocomplete .ui-autocomplete-dropdown.ui-button.ui-button-icon-only.ui-state-focus {
box-shadow: var(--nbp-shadow-focus);
}
.ui-autocomplete .ui-autocomplete-dropdown .ui-icon {
/* von PF gesetztes Icon ausblenden */
display: none !important;
}
.ui-autocomplete-panel {
padding: 5px 0;
}
.ui-autocomplete-panel .ui-autocomplete-list {
padding: 0 0.4em;
}
/* ========================================================
* Primefaces :: Picklist
* ========================================================*/
.ui-picklist {
table-layout: fixed;
}
/* Picklist :: Liste links und rechts */
.ui-picklist .ui-picklist-list {
width: 300px;
white-space: nowrap;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.ui-picklist .ui-picklist-filter {
padding: 7px 24px 7px 10px;
width: 100%;
border: 1px solid var(--nbp-color-cool-gray-20);
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.ui-picklist .ui-picklist-filter-container .ui-icon {
font-size: 14px;
color: var(--nbp-color-cool-gray-60);
top: 9px;
right: 6px;
}
.ui-picklist .ui-picklist-caption {
font-weight: bold;
padding: 10px;
border-bottom: 0;
text-align: left;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.ui-picklist-filter-container + .ui-picklist-caption {
border-top: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.ui-picklist .ui-picklist-list li {
margin: 1px;
padding: 5px 10px;
outline: 0;
}
.ui-picklist-item.ui-state-disabled {
opacity: 1;
}
/* Picklist :: Buttons */
.ui-picklist .ui-picklist-buttons-cell {
display: flex;
flex-direction: column;
}
.ui-picklist .ui-picklist-buttons {
height: auto;
padding: 0 20px;
}
.ui-picklist .ui-picklist-buttons .ui-button {
display: inline-flex;
width: 24px;
height: 24px;
margin: 7px auto;
}
.ui-picklist .ui-picklist-buttons .ui-button .ui-icon {
font-size: 14px;
}
.ui-picklist .ui-picklist-buttons .ui-button:not(.ui-state-disabled):hover {
background-color: var(--nbp-color-blue-60);
border-color: var(--nbp-color-blue-60);
}
.ui-picklist .ui-picklist-buttons .ui-button:not(.ui-state-disabled):hover .ui-icon {
color: var(--nbp-color-white);
}
/* Picklist :: Höhe 85px */
.ui-picklist.picklist-small .ui-picklist-list {
height: 85px;
}
/* Picklist :: Breite 100% */
.ui-picklist.picklist-w100,
.ui-picklist.picklist-w100 .ui-picklist-list {
width: 100%;
}
.ui-picklist.picklist-w100 .ui-picklist-list-wrapper {
width: 50%;
}
.ui-picklist.picklist-w100 .ui-picklist-buttons {
width: 50px;
padding: 0;
}
.ui-picklist.ui-state-error {
background: none;
border: none;
}
.ui-picklist.ui-state-error .ui-picklist-target {
border: 1px solid var(--nbp-support-error);
}
/* ========================================================
* Primefaces :: Fileupload
* ========================================================*/
.nbp-fileupload .ui-fileupload-buttonbar {
padding: 0;
background: none;
border: none;
}
.nbp-fileupload .ui-fileupload-content {
padding: 0;
border: none;
background: transparent;
}
.nbp-fileupload .ui-fileupload-content .ui-messages > div {
margin-bottom: 0;
}
.nbp-fileupload .ui-fileupload-content .ui-messages ul {
margin-left: 0;
}
.nbp-fileupload .ui-fileupload-content .ui-messages .ui-messages-close {
display: none;
}
.nbp-fileupload.nbp-fileupload-xs .ui-fileupload-files {
display: none;
}
.nbp-fileupload .ui-fileupload-files {
margin: 0;
}
.nbp-fileupload .ui-fileupload-files > div:not(:empty) {
display: block;
margin-top: 10px;
}
.nbp-fileupload .ui-button.ui-fileupload-cancel {
height: 28px;
width: 28px;
transform: translateY(-2px);
}
.ui-fileupload .ui-fileupload-cancel .ui-icon {
font-size: 12px;
line-height: 16px;
}
.nbp-fileupload .ui-fileupload-preview:empty {
padding: 0 !important;
}
.nbp-fileupload .ui-button.ui-fileupload-choose {
height: 28px;
}
/* ========================================================
* Primefaces-Extensions :: CK-Editor
* ========================================================*/
/* .nbp-cke-ta ist die textarea vor dem Editor div (.cke.cke_reset) */
.cke.cke_reset {
border: 1px solid var(--nbp-color-cool-gray-20);
box-shadow: none;
}
.nbp-cke-ta.ui-state-error {
background: transparent;
}
.nbp-cke-ta.ui-state-error + .cke.cke_reset {
border: 1px solid var(--nbp-support-error);
}
.nbp-cke-ta:not([readonly]) ~ .cke_chrome:hover {
border: 1px solid var(--nbp-color-cool-gray-40);
}
.cke.cke_reset.cke.cke_focus {
box-shadow: var(--nbp-shadow-focus);
}
/* textarea nicht visible - ist sonst u.U. bei der Initialisierung kurz visible */
.nbp-cke-ta {
visibility: hidden;
}
/* Wordcount-Plugin */
.cke_bottom .cke_wordcount {
display: block;
float: right;
margin-top: -2px;
margin-right: 3px;
color: var(--nbp-color-cool-gray-70);
}
.cke_bottom .cke_wordcount .cke_path_item {
color: var(--nbp-color-cool-gray-70);
}
.cke_wordcountLimitReached {
color: var(--nbp-support-error) !important
}
/* ========================================================
* Primefaces-Extensions :: Code-Mirror
* ========================================================*/
.CodeMirror {
border: 1px solid var(--nbp-color-cool-gray-20);
}
.CodeMirror-gutters {
background-color: var(--nbp-color-cool-gray-10);
}
/* ========================================================
* Primefaces :: Label
* ========================================================*/
.ui-outputlabel.ui-state-error {
border: 0 none;
background: none;
}
/* ========================================================
* Primefaces :: Messages
* ========================================================*/
.ui-messages-info,
.ui-messages-warn,
.ui-messages-error,
.ui-messages-fatal {
margin-bottom: 16px;
color: var(--nbp-color-cool-gray-70);
}
.ui-messages-info-summary,
.ui-messages-warn-summary,
.ui-messages-error-summary,
.ui-messages-fatal-summary {
color: var(--nbp-color-cool-gray-70);
font-weight: normal;
margin-left: 0;
}
.ui-messages-info {
background-color: var(--nbp-color-blue-10);
border-color: var(--nbp-color-blue-20);
}
.ui-messages-warn {
background-color: var(--nbp-color-yellow-10);
border-color: var(--nbp-color-yellow-20);
}
.ui-messages-error,
.ui-messages-fatal {
background-color: var(--nbp-color-red-10);
border-color: var(--nbp-color-red-20);
}
.ui-messages-info-icon,
.ui-messages-warn-icon,
.ui-messages-error-icon,
.ui-messages-fatal-icon {
display: none;
}
.ui-messages ul {
margin: 0 0 0 6px;
}
.ui-messages p:last-child {
margin-bottom: 0;
}
.ui-messages .ui-messages-close {
transform: translateY(-2px);
}
.messages-bearbeiten .ui-corner-all {
margin-top: 0;
}
.messages-scrollpanel {
width: 100%;
min-height: 0;
max-height: 140px;
border: none;
background: inherit;
}
/* ========================================================
* Primefaces :: Growl
* ========================================================*/
.ui-growl {
top: 10px;
right: 10px;
width: auto;
max-width: 600px;
z-index: 2000 !important;
}
.ui-growl-item {
display: flex;
align-items: center;
padding: 20px;
}
.ui-growl-item-container {
border-width: 0 0 0 6px;
opacity: 1;
}
.ui-growl-message {
width: 100%;
float: left;
padding: 0;
}
.ui-growl-title {
padding: 0;
margin-right: 10px;
font-weight: 400;
}
.ui-growl-icon-close {
/*
position: relative;
display: block !important;
order: 2;
top: 0;
right: 0;
*/
}
.ui-growl-image {
display: none;
}
.ui-growl-info {
background-color: var(--nbp-color-blue-20);
border-color: var(--nbp-color-blue-50);
}
.ui-growl-warn {
background-color: var(--nbp-color-yellow-15);
border-color: var(--nbp-color-yellow-30);
}
.ui-growl-error {
background-color: var(--nbp-color-red-20);
border-color: var(--nbp-color-red-50);
}
/* ===================================================================================================================
* Primefaces :: Komponenten
* ===================================================================================================================*/
/* ========================================================
* Primefaces :: Tabview
* ========================================================*/
.ui-tabs {
padding: 0;
}
.ui-tabs.ui-tabs-top > .ui-tabs-nav {
border: none;
border-radius: 0;
background-color: transparent;
z-index: 910;
padding: 0;
line-height: 17px;
}
.ui-tabs.ui-tabs-top > .ui-tabs-nav li {
border: none;
margin: 0;
top: 0;
font-weight: bold;
}
.ui-tabs-outline {
outline: none;
}
/* Trennlinie Tabview in Dialogen */
.ui-dialog .ui-tabs-panels {
border-top: 2px solid var(--nbp-color-cool-gray-20);
margin-top: -2px;
}
/* ========================================================
* Primefaces :: Datalist
* ========================================================*/
/* p:datalist type='none' */
.ui-datalist-content {
border: none;
background: none;
}
/* p:datalist type=unordered,ordered */
.ui-datalist-data {
padding: 0 0 0 14px;
margin: 3px 0;
}
.ui-datalist-data .ui-datalist-item {
padding: 2px 0;
}
/* p:dataList type='unordered' styleClass='nbp-form-notypelist' */
.nbp-form-notypelist ul {
padding: 0;
list-style-type: none;
}
/* ========================================================
* Primefaces :: Datatable
* ========================================================*/
/* Table */
.ui-datatable table {
width: 100%;
}
.ui-datatable-resizable {
padding-bottom: 0;
}
.ui-datatable-resizable table {
table-layout: auto;
}
/* Columns */
.ui-datatable thead th {
padding: 8px 10px;
}
.ui-datatable tbody td {
padding: 6px 10px;
}
/* Empty-Message */
.ui-datatable tbody .ui-datatable-empty-message td {
padding: 10px 10px;
}
/* statische Tabellen mit .ui-datatable ***/
table.ui-datatable {
width: 100%;
margin-bottom: 12px;
}
/* Rows */
table.ui-datatable tbody tr:nth-child(odd) {
background: var(--nbp-color-cool-gray-5);
}
table.ui-datatable tbody tr:nth-child(even) {
}
/* Expansion-Rows */
.ui-datatable .ui-expanded-row-content {
background: var(--nbp-color-cool-gray-20);
}
/* Foot */
.ui-datatable tfoot tr {
border: 1px solid var(--nbp-color-white);
}
.ui-datatable tfoot tr td,
.ui-datatable tfoot tr td.ui-state-default {
text-align: left;
background: var(--nbp-color-cool-gray-15);
border: inherit;
}
/* Sort */
.ui-datatable thead th .ui-sortable-column-badge {
border-radius: 50%;
font-size: 11px;
height: 16px;
min-width: 16px;
line-height: 16px;
color: var(--nbp-color-white);
background: var(--nbp-color-cool-gray-60);
margin-left: 3px;
}
/* Column Resize */
.ui-datatable .ui-column-resizer-helper {
border-color: var(--nbp-color-blue-60);
}
/* Spaltenbreiten */
.nbp-colsize-xxs {width: 30px}
.nbp-colsize-xs {width: 60px}
.nbp-colsize-s {width: 100px}
.nbp-colsize-m {width: 140px}
.nbp-colsize-l {width: 180px}
.nbp-colsize-xl {width: 220px}
.nbp-colsize-xxl {width: 280px}
.nbp-colsize-90 {width: 90px}
/* ========================================================
* Primefaces :: Datatable :: Content
* ========================================================*/
.ui-datatable table, table.ui-datatable {
overflow-wrap: break-word;
word-wrap: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}
/* Links in Tabellen */
.ui-datatable td a {
text-decoration: 1px underline dotted;
}
.ui-datatable td a:hover,
.ui-datatable td a:focus {
text-decoration: 1px underline solid;
}
.ui-datatable td a.nbp-dotted-link-off {
text-decoration: none;
}
/* Buttons in Tabellen */
.ui-datatable .button-xs {
margin-top: -1px;
margin-bottom: -1px;
}
/* normales Umbrechen in Tabellenzellen */
.ui-datatable-resizable thead th, .ui-datatable-resizable tbody td, .ui-datatable-resizable tfoot td {
white-space: normal;
}
/* keep line-breaks */
.ui-datatable-resizable tbody td.nbp-keep-line-breaks {
white-space: pre-wrap;
}
.ui-datatable .nbp-boolean {
font-size: 14px;
line-height: 1;
font-weight: 600;
width: 100%;
text-align: center;
}
.ui-datatable td img {
display: none;
}
.ui-datatable td table {
display: none;
}
.ui-datatable td pre {
white-space: normal;
margin: 0;
}
.ui-datatable td p {
margin: 0;
}
.ui-datatable td ol, .ui-datatable td ul {
margin-top: 0;
padding-left: 20px;
}
/* Fix Primefaces - Focus Cell-Navigation */
.ui-datatable-data td[role="gridcell"]:focus,
.ui-datatable-data td[role="gridcell"] *:focus,
.ui-datatable-data td[role="grid"] [tabindex="0"]:focus {
outline: none;
}
.ui-datatable-data td[role="gridcell"] .nbp-select:hover,
.ui-datatable-data td[role="gridcell"] .nbp-select:focus {
/* wegen Problemen mit Primefaces component.css (select in einer Tabelle) */
border: 1px solid var(--nbp-color-cool-gray-80);
}
/* ========================================================
* Primefaces :: Datatable :: Paginator
* ========================================================*/
.ui-datatable .ui-paginator,
.ui-datagrid .ui-paginator {
position: relative;
}
.ui-paginator .ui-paginator-page,
.ui-paginator .ui-paginator-pages,
.ui-paginator .ui-paginator-next,
.ui-paginator .ui-paginator-last,
.ui-paginator .ui-paginator-first,
.ui-paginator .ui-paginator-prev,
.ui-paginator .ui-paginator-current {
font-size: 14px;
vertical-align: middle;
line-height: 1;
margin: 0 3px;
}
.ui-paginator .ui-paginator-pages {
padding: 0;
}
.ui-paginator .ui-paginator-current {
font-weight: normal;
font-size: 14px;
margin-right: 16px;
}
/* Select :: Anzahl Treffer pro Seite */
.ui-paginator select.ui-paginator-rpp-options {
vertical-align: middle;
font-size: 1em;
font-weight: normal;
text-shadow: none;
width: 55px;
height: 20px;
cursor: pointer;
}
/* Select :: Anzahl Treffer pro Seite :: als Bootstrap Custom-Select */
.ui-paginator select.ui-paginator-rpp-options.ui-state-default {
display: inline-block;
padding: 1px 24px 1px 5px;
margin-left: 16px;
background: url('data:image/svg+xml,') no-repeat right 5px center/12px 11px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: 3px;
color: var(--nbp-color-cool-gray-70) !important;
background-color: var(--nbp-color-white);
border: 1px solid transparent;
width: auto;
}
.ui-paginator select.ui-paginator-rpp-options.ui-state-default:focus::-ms-value {
color: var(--nbp-color-cool-gray-70);
background-color: var(--nbp-color-white);
}
.ui-paginator select.ui-paginator-rpp-options.ui-state-default::-ms-expand {
display: none;
}
.ui-paginator .ui-paginator-page {
font-size: 14px;
padding: 3px 8px;
}
.ui-widget-header.ui-paginator .ui-state-default {
background-color: var(--nbp-color-white);
color: var(--nbp-color-cool-gray-70);
border: 1px solid transparent;
border-radius: 50%;
box-shadow: none;
width: 32px;
height: 32px;
line-height: 24px;
}
.ui-widget-header.ui-paginator .ui-state-default.ui-state-disabled {
opacity: 1;
color: var(--nbp-color-cool-gray-50);
}
.ui-widget-header.ui-paginator .ui-state-default.ui-state-hover,
.ui-widget-header.ui-paginator .ui-state-default.ui-state-focus {
border: 1px solid var(--nbp-color-cool-gray-15);
background-color: var(--nbp-color-cool-gray-15);
color: var(--nbp-color-cool-gray-70);
}
.ui-widget-header.ui-paginator .ui-paginator-pages .ui-state-default,
.ui-widget-header.ui-paginator .ui-paginator-pages .ui-state-default.ui-state-hover,
.ui-widget-header.ui-paginator .ui-paginator-pages .ui-state-default.ui-state-active {
border-radius: 0;
background-color: var(--nbp-color-white);
border: 0;
border-bottom: 2px solid transparent;
color: var(--nbp-color-cool-gray-70);
width: auto;
padding: 3px 6px;
margin: 0 6px;
}
.ui-widget-header.ui-paginator .ui-paginator-pages .ui-state-default:hover,
.ui-widget-header.ui-paginator .ui-paginator-pages .ui-state-default:focus {
border-bottom: 2px solid var(--nbp-color-cool-gray-50);
}
.ui-widget-header.ui-paginator .ui-paginator-pages .ui-state-default.ui-state-active {
border-bottom: 2px solid var(--nbp-color-blue-60);
}
/* ========================================================
* Primefaces :: Datatable :: Filter
* ========================================================*/
.ui-datatable .ui-column-filter,
.ui-column-customfilter .ui-inputfield {
width: 100%;
margin: 10px 0 5px 0;
min-height: auto;
text-align: left;
background-color: var(--nbp-color-white);
border-radius: 3px;
text-shadow: none;
font-weight: normal;
font-size: 1em;
padding: 2px 4px;
height: 24px;
}
.ui-column-filter.ui-state-hover,
.ui-column-filter.ui-state-focus {
/*border: 1px solid var(--nbp-color-cool-gray-80);*/
}
/* Filter-Icon für alle Filter-Inputs */
.ui-datatable .ui-filter-column input.ui-column-filter,
.ui-datatable .ui-filter-column .ui-column-customfilter input,
.ui-datatable .ui-filter-column select.ui-column-filter {
padding-right: 25px;
/* fa-regular fa-filter-list */
background: url('data:image/svg+xml,') no-repeat right 8px center/12px 12px;
}
/* Custom */
.ui-datatable .ui-column-customfilter {
margin-top: 0;
}
/* Filter :: Reset-Button */
.clear-filters-container .ui-button {
width: 20px;
height: 20px;
margin: 0;
}
/* Filter :: Reset-Button :: Fonticon */
.clear-filters-container .ui-button .ui-icon {
font-size: 12px;
margin-top: -6px;
}
.clear-filters-container .ui-button .ui-button-text {
padding: 0;
}
.nbp-datatable-custom-right {
position: absolute;
right: 0;
}
.nbp-datatable-custom-right:not(.active) .ui-button {
opacity: .8;
pointer-events: none;
}
.nbp-datatable-custom-right.clear-filters-container .ui-button {
height: 28px;
margin-top: 4px;
}
.nbp-datatable-custom-right.clear-filters-container .ui-state-default {
border: 1px solid var(--nbp-color-blue-60);
background-color: var(--nbp-color-white);
color: var(--nbp-color-blue-60);
width: auto;
border-radius: 20px;
padding: 0 1em;
}
.nbp-datatable-custom-right.clear-filters-container.active .ui-state-default.ui-state-hover,
.nbp-datatable-custom-right.clear-filters-container.active .ui-state-default.ui-state-focus {
color: var(--nbp-color-white);
background-color: var(--nbp-color-blue-60);
border-color: var(--nbp-color-blue-60);
}
.nbp-datatable-custom-right.clear-filters-container:not(.active) .ui-state-default {
opacity: 0;
border-color: var(--nbp-color-cool-gray-60);
color: var(--nbp-color-cool-gray-60);
}
/* ========================================================
* Primefaces :: Datatable :: Global Search
* ========================================================*/
/* Globale Suche */
.nbp-datatable-search {
padding: 0;
display: flex;
}
/* Globale Suche :: Input */
.nbp-datatable-search .nbp-datatable-search-input {
display: inline-block;
width: 100%;
height: 32px;
padding: 3px 30px 3px 8px;
}
/* Globale Suche :: Reset */
.nbp-datatable-search .nbp-datatable-search-reset.ui-state-default {
display: inline-block;
margin-left: -30px;
margin-right: 0;
border: 0;
background-color: transparent;
box-shadow: none;
color: var(--nbp-color-cool-gray-50);
height: 30px;
width: 30px;
}
.nbp-datatable-search .nbp-datatable-search-reset.ui-state-hover,
.nbp-datatable-search .nbp-datatable-search-reset.ui-state-focus {
color: var(--nbp-color-cool-gray-80);
}
.nbp-datatable-search .nbp-datatable-search-reset .ui-icon {
font-size: 16px;
font-weight: 400;
color: inherit;
}
.nbp-datatable-search .nbp-datatable-search-input:placeholder-shown ~ .nbp-datatable-search-reset {
display: none;
}
/* Globale Suche :: Such-Button */
.nbp-datatable-search-button {
margin-right: 0;
margin-left: 10px;
}
/* ========================================================
* Primefaces :: Datatable :: Aktionsmenu in Tabellen
* ========================================================*/
.ui-datatable .nbp-col-einrueckung {
display: flex;
}
.ui-datatable .nbp-col-einrueckung .nbp-col-einrueckung-grow {
flex-grow: 1;
}
.ui-datatable td.nbp-col-actionmenu > a {
display: inline-block;
max-width: calc(100% - 25px);
}
/* Menu-Container */
.ui-datatable td .nbp-actionmenu-container {
float: right;
margin-top: -1px;
margin-bottom: -1px;
}
/* Button */
.nbp-datatable-menu-button {
width: 18px;
height: 18px;
border-radius: 50%;
margin: 0 0 0 4px;
box-shadow: none;
}
.nbp-datatable-menu-button.ui-button .ui-icon {
font-size: 12px;
color: inherit;
}
.ui-datatable td .nbp-actionmenu-container .ui-button {
margin-top: 0;
margin-bottom: 0;
}
/*
.nbp-datatable-menu-button.ui-button.ui-state-default {
border-color: var(--nbp-color-cool-gray-60);
color: var(--nbp-color-cool-gray-60);
}
.nbp-datatable-menu-button.ui-button.ui-state-default:hover,
.nbp-datatable-menu-button.ui-button.ui-state-default:focus {
border-color: var(--nbp-color-blue-60);
color: var(--nbp-color-white);
}
*/
.ui-datatable td.nbp-col-link-and-button > a {
display: inline-block;
max-width: calc(100% - 28px);
}
.ui-datatable td.nbp-col-link-and-button .ui-button {
float: right;
}
/* Menu */
.nbp-datatable-menu {
}
/* Inhalt Spalte mit nicht-umbrechenden Text (Overflow Ellipsis) */
.nbp-datatable-table .nbp-datatable-inhalt-sm {
position: relative;
}
.nbp-datatable-table .nbp-datatable-inhalt-sm span {
position: absolute;
top: 6px;
max-width: calc(100% - 20px);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* Tabelle mit frozen Columns */
.nbp-frozen-table tbody tr {
vertical-align: top;
}
.nbp-frozen-table.ui-datatable td table {
display: table;
table-layout: fixed;
}
.nbp-frozen-table .ui-datatable-scrollable-header {
background-color: transparent;
border-top: 1px solid var(--nbp-color-cool-gray-15);
}
.nbp-frozen-table .ui-datatable-frozenlayout-left {
border-right: 1px solid var(--nbp-color-cool-gray-15);
}
.nbp-frozen-table .ui-datatable-empty-message {
display: none;
}
.nbp-frozen-table .nbp-error:empty {
background-color: var(--nbp-color-cool-gray-10);
}
.nbp-frozen-table.ui-datatable {
border-bottom: 1px solid var(--nbp-color-cool-gray-15);
}
.nbp-frozen-table .ui-datatable-scrollable-footer-box td:last-child {
border-right: 1px solid var(--nbp-color-cool-gray-15);
}
.nbp-frozen-table .ui-datatable-fs > tbody > tr,
.nbp-frozen-table .ui-datatable-scrollable-header {
border: none;
}
.nbp-frozen-table .ui-datatable-scrollable-theadclone th {
border-top: none;
}
.nbp-frozen-table .ui-datatable-scrollable-header-box tr,
.nbp-frozen-table .ui-datatable-scrollable-header-box th {
border-bottom: none;
}
.nbp-frozen-table .ui-datatable-frozenlayout-left,
.nbp-frozen-table.ui-datatable .ui-datatable-frozenlayout-right tr td:last-child,
.nbp-frozen-table.ui-datatable .ui-datatable-frozenlayout-right tr th:last-child {
border-right: none;
}
.nbp-frozen-table .ui-datatable-frozenlayout-right,
.nbp-frozen-table.ui-datatable .ui-datatable-frozenlayout-left tr td:first-child,
.nbp-frozen-table.ui-datatable .ui-datatable-frozenlayout-left tr th:first-child {
border-left: none;
}
.nbp-vorhanden {
color: var(--nbp-color-cool-gray-60);
}
.nbp-import-infoicon {
line-height: inherit;
}
/* Antrag Gegenstände Datatable -> Kein Paginator */
.nbp-antrag-gegenstaende-form .ui-datatable {
margin-top: 20px;
}
/* ========================================================
* Primefaces :: Tree
* ========================================================*/
.ui-tree .ui-treenode-icon {
margin-top: -2px;
}
.ui-treenode-label .ui-state-highlight {
border: none;
}
.ui-tree-toggler.ui-icon {
font-size: 14px;
color: var(--nbp-color-cool-gray-70);
}
/* Gegenstände-Baum */
.ui-tree.nbp-element-tree .ui-treenode-content .ui-treenode-label {
border-bottom: none !important;
}
.ui-tree.nbp-element-tree .ui-treenode-content.ui-state-hover .ui-treenode-label {
background-color: transparent;
color: var(--nbp-color-cool-gray-80);
}
.ui-tree.nbp-element-tree .ui-treenode-content.ui-state-highlight .ui-treenode-label {
background-color: transparent;
color: var(--nbp-color-cool-gray-80);
}
/* Count-Bubbles */
.nbp-tree-count {
background-color: var(--nbp-color-cool-gray-60);
border-color: var(--nbp-color-cool-gray-60);
color: var(--nbp-color-white);
border-style: solid;
border-width: 1px;
border-radius: 9px;
font-size: 12px;
font-weight: normal;
line-height: 1em;
padding: 2px 3px;
margin: 0 8px 0 0;
text-align: center;
display: inline-block;
min-width: 18px;
}
.nbp-tree-count.nbp-tree-count-empty {
background-color: var(--nbp-color-white);
color: var(--nbp-color-cool-gray-60);
}
/* Drag and Drop */
.drop-container .drop-highlight .nbp-tree-item .nbp-tree-count {
background-color: var(--nbp-color-green-50);
border-color: var(--nbp-color-green-50);
color: var(--nbp-color-white);
}
.drag-icon:hover {
/* cursor: move; */
}
.ui-draggable-dragging {
cursor: move;
}
.nbp-drop-tree .ui-treenode-content .ui-treenode-label {
margin: 0;
padding: 0;
}
.nbp-drop-tree .ui-treenode-content .ui-treenode-label .nbp-tree-item {
display: inline-block;
margin: 0;
padding: 3px 5px 3px 3px;
vertical-align: middle;
}
.nbp-drop-tree .drop-highlight .nbp-tree-item {
background-color: var(--nbp-color-cool-gray-15);
}
.nbp-treenode .ui-state-highlight .drop-highlight .nbp-tree-item {
color: var(--nbp-color-cool-gray-70);
}
.nbp-treenode .ui-state-highlight .drop-highlight .nbp-tree-item .nbp-tree-count {
color: var(--nbp-color-white);
}
/* ========================================================
* Primefaces :: Dialog
* ========================================================*/
.ui-dialog,
.ui-dialog .ui-dialog-titlebar,
.ui-dialog .ui-dialog-content {
box-sizing: content-box; /* Jquery-UI Bug beim resizen umgehen */
}
.ui-dialog {
box-shadow: var(--nbp-shadow-dialog);
}
.ui-dialog .ui-dialog-titlebar {
display: flex;
align-items: center;
padding: 10px 10px 10px 20px;
font-size: 14px;
background-color: var(--nbp-color-cool-gray-10);
}
.ui-dialog .ui-dialog-titlebar .ui-dialog-title {
float: none;
flex-grow: 2;
margin: 0;
font-weight: bold;
}
.ui-dialog .ui-dialog-titlebar-icon.ui-dialog-titlebar-close {
display: inline-flex;
align-items: center;
justify-content: center;
position: relative;
margin: 0;
padding: 0;
background-color: transparent;
transition: background-color .1s ease;
border: 0;
border-radius: 50%;
width: 32px;
height: 32px;
color: var(--nbp-color-cool-gray-60);
float: none;
text-decoration: none;
}
.ui-dialog .ui-dialog-titlebar-icon.ui-dialog-titlebar-close:hover {
background-color: var(--nbp-color-cool-gray-20);
}
.ui-dialog .ui-dialog-titlebar-icon.ui-dialog-titlebar-close .ui-icon {
display: flex;
align-items: center;
justify-content: center;
}
.ui-dialog .ui-dialog-content {
padding: 30px;
}
.ui-dialog .button-line {
display: flex;
justify-content: end;
/* margin-top: 20px; */
margin: 20px -30px -30px;
padding: 16px 20px;
background-color: var(--nbp-color-cool-gray-10);
}
.ui-dialog .button-line:empty {
margin: 0;
padding: 0;
min-height: 0;
}
/* Dialog Fullscreen */
.ui-dialog.nbp-dialog-fullscreen {
}
.ui-dialog.nbp-dialog-fullscreen .ui-dialog-titlebar {
}
.ui-dialog.nbp-dialog-fullscreen .ui-dialog-content {
position: static;
padding: 0;
height: calc(100vh - 52px) !important;
}
.ui-dialog.nbp-dialog-fullscreen .ui-dialog-content .nbp-dialog-fullscreen-content {
padding: 30px;
height: calc(100vh - 118px);
}
.nbp-dialog-fullscreen .ui-dialog-content .button-line {
position: absolute;
left: 0;
bottom: 0;
margin: 0;
height: 64px;
width: 100%;
}
/* Dialog Scroll */
.nbp-dialog-scroll .ui-dialog-content {
padding: 0;
overflow: hidden;
}
.nbp-dialog-scroll .nbp-dialog-scroll-container {
max-height: calc(100vh - 60px - 52px);
overflow: hidden;
display: flex;
flex-direction: column;
}
.nbp-dialog-scroll .nbp-dialog-scroll-content {
flex-grow: 1;
overflow-y: auto;
padding: 15px 30px
}
.nbp-dialog-scroll .button-line {
margin: 0;
min-height: fit-content;
}
.nbp-splitpopup-form {
height: 100%;
}
.nbp-splitpopup-grid {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto 1fr;
grid-template-areas:
"left right-top"
"left right-bottom";
grid-gap: 40px 25px;
height: calc(100% - 64px);
}
.nbp-splitpopup-grid-row {
display: grid;
grid-template-rows: 20px 1fr;
grid-row-gap: 15px;
min-height: 0;
background: var(--nbp-color-white);
}
.nbp-splitpopup-grid-row-1 {
grid-area: left;
}
.nbp-splitpopup-grid-row-2 {
grid-area: right-top;
}
.nbp-splitpopup-grid-row-3 {
grid-area: right-bottom;
min-height: 400px;
}
.nbp-splitpopup-grid-row .nbp-textpanel-wrapper {
flex-grow: 1;
overflow: auto;
}
.nbp-splitpopup-grid-row .nbp-textpanel {
height: 100%;
max-height: unset;
}
.nbp-splitpopup-header {
font-weight: bold;
}
.nbp-splitpopup-table-wrapper {
display: flex;
flex-direction: column;
min-height: 0;
}
.nbp-splitpopup-table-wrapper .ui-datatable {
flex-grow: 1;
overflow-y: auto;
}
.nbp-splitpopup-table-wrapper .ui-state-highlight .nbp-dotted-link-off {
color: var(--nbp-color-cool-gray-80);
}
.nbp-splitpopup-table-wrapper .nbp-stn-table-icon:hover {
color: var(--nbp-color-blue-60);
font-weight: bold;
}
.nbp-splitpopup-form:not([data-dirty="true"]) .nbp-splitpopup-btn-save,
.nbp-splitpopup-form[data-dirty="true"] .nbp-splitpopup-btn-save-disabled {
display: none;
}
.nbp-splitpopup-form:not([data-dirty="true"]) .nbp-splitpopup-btn-save-disabled,
.nbp-splitpopup-form[data-dirty="true"] .nbp-splitpopup-btn-save{
display: inline-flex;
}
/* Ersteller suchen Dialog */
.nbp-dialog-ersteller-suchen .ui-messages-warn {
margin-top: 0;
}
.nbp-dialog-ersteller-suchen .search-result-ro-line {
padding: 0 10px;
}
.nbp-dialog-ersteller-suchen .ui-datatable th {
display: none;
}
.nbp-dialog-ersteller-suchen-headline {
font-size: 15px;
font-weight: bold;
margin-bottom: 16px;
}
.nbp-dialog-ersteller-suchen .search-result {
border: 1px solid var(--nbp-color-cool-gray-30);
border-radius: 4px;
padding: 10px;
margin-left: -10px;
margin-right: -10px;
}
.nbp-dialog-ersteller-suchen .search-result-ro-line .search-result {
border: 1px solid var(--nbp-color-cool-gray-15);
}
.nbp-dialog-ersteller-suchen .ui-datatable tr td {
border: none;
padding-bottom: 10px;
background-color: var(--nbp-color-white);
}
.nbp-dialog-ersteller-suchen .ui-datatable tr:first-of-type td {
padding-top: 0;
}
.nbp-dialog-ersteller-suchen .ui-datatable tr:last-of-type td {
padding-bottom: 0;
}
.nbp-dialog-ersteller-suchen .ui-datatable tr {
border: none;
}
/* ========================================================
* Primefaces :: Global Confirm Dialog
* ========================================================*/
.confirm-dialog-global.ui-dialog .ui-dialog-titlebar {
padding: 15px 20px;
}
.confirm-dialog-global.ui-dialog .ui-dialog-content {
padding: 20px;
}
.confirm-dialog-global.ui-dialog .ui-dialog-buttonpane {
padding: 10px 20px 20px;
margin: 0;
border-width: 0;
text-align: right;
}
.confirm-dialog-global.ui-dialog .ui-dialog-buttonpane button {
padding: 0;
margin: 0 0 0 10px;
min-width: 75px;
}
.confirm-dialog-global.ui-dialog .ui-dialog-titlebar-close {
display: none;
}
.confirm-dialog-global.ui-dialog .ui-dialog-content .ui-icon {
float: none;
display: none;
}
/* ========================================================
* Primefaces :: Global Confirm PopUp
* ========================================================*/
.confirm-popup-global.ui-confirm-popup .ui-confirm-popup-content {
padding: 20px;
}
.confirm-popup-global.ui-confirm-popup .ui-confirm-popup-footer {
padding: 0 20px 20px;
text-align: right;
}
.confirm-popup-global.ui-confirm-popup .ui-confirm-popup-footer button {
margin: 0 0 0 10px;
height: 30px;
min-width: 60px;
}
.confirm-popup-global.ui-confirm-popup .ui-confirm-popup-icon {
display: none;
}
/* ========================================================
* Primefaces :: Overlaypanel
* ========================================================*/
.nbp-menu .ui-overlaypanel-content {
padding: 0;
}
.nbp-menuitem a:hover {
color: var(--nbp-color-cool-gray-70);
background: var(--nbp-color-cool-gray-20);
}
/* ========================================================
* Primefaces :: Progressbar
* ========================================================*/
.ui-progressbar {
height: 18px;
border-radius: 3px;
}
.ui-progressbar .ui-progressbar-value {
margin: 0;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.ui-progressbar .ui-progressbar-label {
font-weight: normal;
font-size: 12px;
line-height: 18px;
white-space: nowrap;
padding: 0 8px;
color: var(--nbp-color-white);
}
/* ========================================================
* Primefaces :: Schedule
* ========================================================*/
.nbp-eventbg-01 { background: #4285f4}
.nbp-eventbg-02 { background: #db4437}
.nbp-eventbg-03 { background: #f4b400}
.nbp-eventbg-04 { background: #0f9d58}
.nbp-eventbg-05 { background: #ab47bc}
.nbp-eventbg-06 { background: #00acc1}
.nbp-eventbg-07 { background: #ff7043}
.nbp-eventbg-08 { background: #9e9d24}
.nbp-eventbg-09 { background: #5c6bc0}
.nbp-eventbg-10 { background: #f06292}
.nbp-eventbg-11 { background: #00796b}
.nbp-eventbg-12 { background: #c2185b}
.nbp-eventbg-unkwown { background: #5F6A79}
.nbp-eventbg-01-light { background: #6DA0F3; }
.nbp-eventbg-02-light { background: #DB6258; }
.nbp-eventbg-03-light { background: #F3CA56; }
.nbp-eventbg-04-light { background: #43A777; }
.nbp-eventbg-05-light { background: #B069BC; }
.nbp-eventbg-06-light { background: #4DB5C1; }
.nbp-eventbg-07-light { background: #FF8B67; }
.nbp-eventbg-08-light { background: #9D9D57; }
.nbp-eventbg-09-light { background: #7D87C0; }
.nbp-eventbg-10-light { background: #F087AB; }
.nbp-eventbg-11-light { background: #3C8780; }
.nbp-eventbg-12-light { background: #C24D7C; }
.nbp-schedule {
margin: 4px 4px 20px 4px;
}
/* individuelle Controls im Schedule-Header */
.nbp-schedule-control-group,
.fc .fc-toolbar-chunk {
display: flex;
flex-direction: row;
flex-wrap: wrap;
column-gap: .75em;
row-gap: 10px;
}
.nbp-schedule-control {
white-space: nowrap;
}
/* Header */
.fc .fc-toolbar.fc-header-toolbar {
margin: 1.5em 0;
}
.fc-direction-ltr .fc-toolbar>*>:not(:first-child) {
margin-left: 0;
}
.fc select {
min-height: 28px;
}
.fc-toolbar .fc-toolbar-title {
padding: 0 10px;
white-space: nowrap;
}
.fc .fc-button {
transition: background-color .1s ease, border-color .1s ease;
}
.fc .fc-button-primary {
height: 28px;
padding: 0 15px;
color: var(--nbp-color-blue-60);
border: 1px solid var(--nbp-color-blue-60);
background-color: var(--nbp-color-white);
border-radius: 20px;
}
.fc .fc-button-primary:hover,
.fc .fc-button-primary:focus {
background-color: var(--nbp-color-blue-60);
border: 1px solid var(--nbp-color-blue-60);
color: var(--nbp-color-white);
}
.fc .fc-button-primary:not(:disabled):active,
.fc .fc-button-primary:not(:disabled).fc-button-active {
border: 1px solid transparent;
background-color: var(--nbp-color-blue-60);
color: var(--nbp-color-white);
}
.fc .fc-button-primary:not(:disabled).fc-button-active:focus {
background-color: var(--nbp-color-blue-70);
border: 1px solid var(--nbp-color-blue-70);
color: var(--nbp-color-white);
}
.fc .fc-button-primary:disabled {
border: 1px solid var(--nbp-color-cool-gray-60);
background-color: var(--nbp-color-white);
opacity: 0.25;
color: var(--nbp-color-cool-gray-60);
cursor: default;
}
.fc .fc-button:focus,
.fc .fc-button-primary:focus,
.fc .fc-button-primary:not(:disabled):active:focus,
.fc .fc-button-primary:not(:disabled).fc-button-active:focus {
box-shadow: none;
}
.fc .fc-button-primary.fc-button-active {
pointer-events: none;
}
.fc .fc-button-primary.fc-prev-button,
.fc .fc-button-primary.fc-next-button {
padding: 0 8px;
}
.fc .fc-button .fc-icon {
transform: translateY(-1px);
}
.fc .ui-selectonebutton.ui-buttonset {
height: 28px;
}
.fc .ui-selectonebutton .ui-button {
height: 28px;
display: inline-flex;
}
.fc .ui-selectonebutton .ui-button:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.fc .ui-selectonebutton .ui-button:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
/* ??? */
.fc .ui-state-highlight {
color: inherit;
border: 0;
}
/* Kalender-Grid */
.fc-content, .fc-divider, .fc-list-heading td, .fc-list-view, .fc-popover,
.fc-row, .fc tbody, .fc td, .fc th, .fc thead {
border-color: var(--nbp-color-cool-gray-20);
}
.fc-row .fc-highlight-skeleton td,
.fc-row .fc-bg-event-skeleton td {
border-color: var(--nbp-color-cool-gray-30);
}
.fc-col-header th {
font-weight: normal;
padding-top: 2px;
padding-bottom: 2px;
}
/* Background :: Gesamter Kalender */
.fc-view {
background: var(--nbp-color-white);
}
/* Background :: Today */
.fc .fc-daygrid-day.fc-day-today,
.fc .fc-timegrid-col.fc-day-today {
/* cool-gray-30 */
background-color: rgba(189,194,205,0.15);
}
/* Background-Events (Wochenenden, Feiertage) */
.fc .fc-bg-event {
opacity: 1;
/* cool-gray-30 */
background-color: rgba(189,194,205,0.1);
color: var(--nbp-color-cool-gray-60);
padding: 0;
}
.fc .fc-bg-event .fc-event-title {
font-size: 12px;
}
/* Monatsansicht */
.fc .fc-day-other .fc-daygrid-day-top {
opacity: .7;
}
.fc .fc-day-today .fc-daygrid-day-number {
font-weight: bold;
}
.fc .fc-daygrid-week-number {
background-color: transparent;
}
/* Events (Termine) */
.fc .fc-event:not(.fc-bg-event) {
color: var(--nbp-color-white);
border-color: transparent;
font-size: 12px;
border-radius: 2px;
padding: 1px 2px;
}
.fc .fc-event:not(.fc-bg-event):hover {
cursor: pointer;
}
.fc .fc-event:not(.fc-bg-event) .fc-event-time {
min-width: 32px;
margin-right: 3px;
text-align: right;
font-weight: normal;
}
.fc .fc-event:not(.fc-bg-event) .fc-group-count {
margin-right: 3px;
}
.fc .fc-event:not(.fc-bg-event) .fc-event-title {
text-overflow: ellipsis;
}
.fc .fc-daygrid-more-link:hover {
text-decoration: underline;
}
/* ========================================================
* Primefaces :: Tooltip
* ========================================================*/
/* Bootstrap-Tooltip */
.tooltip .tooltip-inner {
padding: 0.25rem 0.5rem;
border-radius: 0.25rem;
font-size: 12px;
background-color: var(--nbp-color-black);
}
/* Default Primefaces Tooltip */
.ui-tooltip .ui-tooltip-text {
padding: 0.25rem 0.5rem;
border-radius: 0.25rem;
font-size: 12px;
line-height: 1.5;
background-color: var(--nbp-color-black);
}
.ui-tooltip-right .ui-tooltip-arrow {
border-right-color: var(--nbp-color-black);
}
.ui-tooltip-text.ui-shadow {
box-shadow: none;
}
/* Gestylter Primefaces Tooltip */
.nbp-tooltip.ui-tooltip {
pointer-events: auto !important;
padding: 0;
}
.nbp-tooltip.ui-tooltip .ui-tooltip-arrow {
display: none;
}
.nbp-tooltip.ui-tooltip .ui-tooltip-text {
border: 1px solid var(--nbp-color-cool-gray-20);
border-radius: 5px;
padding: 20px;
background-color: var(--nbp-color-white);
color: var(--nbp-color-cool-gray-80);
font-size: 13.5px;
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-word;
hyphens: auto;
}
.nbp-tooltip.ui-tooltip a {
color: var(--nbp-color-cool-gray-80);
}
.nbp-tooltip.ui-tooltip .ui-tooltip-text.ui-shadow {
box-shadow: var(--nbp-shadow-overlay);
}
/* FormGroup :: HilfeIcon */
.nbp-tooltip.nbp-tooltip-hilfe {
max-width: 500px;
}
/* Fragebogen intern :: HilfeIcon */
.nbp-tooltip.fb-tooltip {
max-width: 600px;
}
/* QR-Code */
.nbp-tooltip.nbp-tooltip-qr .ui-tooltip-text {
padding: 15px;
}
/* Tooltip-Content :: VCard */
.nbp-vcard-list {
display: table;
}
.nbp-vcard-item {
display: table-row;
}
.nbp-vcard-label {
display: table-cell;
color: var(--nbp-color-cool-gray-60);
padding: 3px 10px 3px 0;
}
.nbp-vcard-value {
display: table-cell;
}
.nbp-vcard-name {
font-weight: bold;
margin-bottom: 5px;
}
.nbp-vcard-status {
font-style: italic;
font-size: .9em;
}
.nbp-vcard .ui-outputpanel-loading {
display: none;
}
.nbp-vcard .ui-widget {
font-family: inherit;
font-size: inherit;
}
/* ===================================================================================================================
* Fachadministration :: Komponenten
* ===================================================================================================================*/
/* ========================================================
* NBP :: Komponente :: Schlagwortliste
* ========================================================*/
ul.labels, .ui-datatable td ul.labels {
display: block;
list-style-type: none;
margin: 0;
padding: 3px 0 0;
}
ul.labels:after {
clear: both;
content: "";
display: block;
height: 0;
visibility: hidden;
}
ul.labels li {
display: block;
float: left;
margin: 1px 5px 3px 0;
max-width: 100%;
}
ul.labels li span {
background: none var(--nbp-color-cool-gray-20);
border: 1px solid var(--nbp-color-cool-gray-20);
border-radius: 3px;
display: block;
line-height: 1;
padding: 3px 6px;
white-space: nowrap;
font-size: 13px;
max-width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* ========================================================
* NBP :: Komponente :: Datalist-Entry
* ========================================================*/
.nbp-datalist-entry {
margin: 0;
padding: 15px 0;
}
.nbp-datalist-entry label,
.nbp-datalist-entry .nbp-form-label {
color: var(--nbp-color-cool-gray-50);
}
.nbp-datalist-entry .nbp-textpanel {
max-height: 12em;
}
.nbp-datalist-entry .line {
min-height: 1em;
}
.nbp-datalist-entry .line .nbp-form-group {
margin-bottom: 0;
}
/* ========================================================
* NBP :: Komponente :: ActionMenu - Composite: actionMenu
* ========================================================*/
/* Actionmenü :: Container */
.nbp-actionmenu-container {
display: inline-block;
position: static;
}
/* Actionmenü :: Overlay */
.nbp-dropdown-menu {
font-size: 14px;
color: var(--nbp-color-cool-gray-80);
min-width: 50px;
padding: 5px 0;
box-shadow: var(--nbp-shadow-overlay);
max-width: 70%;
overflow: hidden;
}
/* Actionmenü :: Items */
.nbp-dropdown-menu .dropdown-item {
display: flex;
align-items: center;
}
.nbp-dropdown-menu .dropdown-item,
.nbp-dropdown-menu .dropdown-header {
color: var(--nbp-color-cool-gray-80);
padding: 10px 15px;
font-size: inherit;
text-decoration: none;
border: 0;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.nbp-dropdown-menu .dropdown-header {
font-style: italic;
}
.nbp-dropdown-menu .dropdown-item:hover,
.nbp-dropdown-menu .dropdown-item:focus {
color: var(--nbp-color-cool-gray-80);
text-decoration: none;
background-color: var(--nbp-color-cool-gray-10);
}
.nbp-dropdown-menu .ui-icon {
font-size: 16px;
color: inherit;
display: inline-block;
width: 16px;
text-align: center;
transform: translateY(1px);
margin-right: 12px;
}
.nbp-dropdown-menu .nbp-dropdown-header--bg {
line-height: 1.35;
background-color: var(--nbp-color-cool-gray-10);
color: var(--nbp-color-cool-gray-80);
margin-top: -5px;
padding: 12px 15px;
margin-bottom: 5px;
}
/* Actionmenu SM */
.nbp-dropdown-menu.nbp-dropdown-menu-sm .dropdown-item,
.nbp-dropdown-menu.nbp-dropdown-menu-sm .dropdown-header {
padding: 6px 15px;
}
.nbp-dropdown-menu.nbp-dropdown-menu-sm .ui-icon {
font-size: 14px;
transform: translateY(-1px);
}
.nbp-dropdown-menu .dropdown-divider {
border-top: 1px solid var(--nbp-color-cool-gray-20);
}
/* ========================================================
* NBP :: Komponente :: Sortierer - Composite: sortierer
* ========================================================*/
.nbp-sortierer tr {
cursor: pointer;
}
.nbp-sortierer tr:hover,
.ui-datatable.ui-sortable-helper tr {
background: var(--nbp-color-cool-gray-20);
}
.nbp-sortierer tr.ui-datatable-rowordering {
background: var(--nbp-color-cool-gray-5);
border: 1px solid var(--nbp-color-white);
}
/* ========================================================
* NBP :: Komponente :: Letzte Änderung - Composite: letzteAenderung
* ========================================================*/
.nbp-letzte-aenderung {
font-size: .9em;
line-height: 22px;
}
/* ========================================================
* NBP :: Komponente :: Output Ersteller - Composite: outputNutzer
* ========================================================*/
.nutzer-inactive {
font-style: italic;
}
.nutzer-deleted {
text-decoration: line-through;
}
.nutzer-empty {
font-style: italic;
}
/* ========================================================
* NBP :: Komponente :: Layout - Composite: layout, layoutTop, layoutLeft, layoutRight
* ========================================================*/
/* Layout Grid für Baumansicht */
.layout-grid {
display: grid;
grid-template-columns: auto 24px 1fr;
grid-template-rows: auto 1fr;
grid-template-areas:
"top top top"
"left middle right";
}
/* layout-top :: Header */
.layout-top {
grid-area: top;
}
/* layout-left :: Baum */
.layout-left {
grid-area: left;
}
.layout-tree-container {
padding: 0;
margin-left: 6px;
/* unset wegen Cursor-Icons beim Drag/Drop */
z-index: unset;
}
.layout-tree-container .ui-tree {
width: 100%;
padding: 14px 20px 15px 0;
}
/* layout-middle :: Resizer */
.layout-grid .layout-middle {
grid-area: middle;
position: relative;
cursor: ew-resize;
width: 2px;
z-index: 900;
overflow: visible;
padding: 0 12px;
}
.layout-grid .layout-middle:before {
content: '';
width: 2px;
position: absolute;
top: 0;
left: 11px;
height: 100%;
background-color: var(--nbp-color-cool-gray-20);
}
/* https://stackoverflow.com/questions/17923922/hover-on-child-should-turn-off-hover-effect-on-parent/78110861#78110861 */
.layout-grid .layout-middle:hover:not(:has(div:hover)):before {
background-color: var(--nbp-color-blue-60);
}
.layout-grid .layout-middle:hover .layout-middle-div {
opacity: 1;
}
.layout-grid .layout-middle .layout-middle-div {
display: flex;
align-items: center;
justify-content: center;
font-family: 'Font Awesome 6 Pro';
cursor: pointer;
width: 28px;
height: 28px;
margin-top: 20px;
margin-left: -14px;
background-color: var(--nbp-color-cool-gray-20);
position: relative;
border-radius: 50%;
opacity: 0;
transition: opacity .1s ease-in-out;
border: 2px solid transparent;
}
.layout-grid .layout-middle .layout-middle-div:before {
content: '\f053'; /* fa-chevron-left */
}
.layout-grid .layout-middle .layout-middle-div.layout-middle-collapse:before {
content: '\f054'; /* fa-chevron-right */
}
.layout-grid .layout-middle .layout-middle-div:hover {
border: 2px solid var(--nbp-color-blue-70);
}
/* layout-right :: Content */
.layout-grid .layout-right {
grid-area: right;
padding-bottom: 15px;
padding-left: 20px;
min-width: 0;
}
.layout-include-container {
height: 100%;
}
.layout-include-container .ui-panel-content {
padding: 1em;
}
.layout-include-container.layout-include-container-nomargin .ui-panel-content {
padding: 0;
}
.layout-include-container .crud-tabview {
min-height: 100%;
}
/* ========================================================
* NBP :: Komponente :: Sichten
* ========================================================*/
.xm-si-simenu {
max-height: calc(100vh - 250px);
min-height: 100px;
overflow-y: auto;
}
/* Suche */
.nbp-si-list-table ul {
display: table;
width: 100%;
padding: 0;
}
.nbp-si-list-table ul li {
display: table-cell;
table-layout: fixed;
vertical-align: top;
}
.nbp-si-suche-label-col {
width: 30%;
}
.nbp-si-suche-vergleich-col {
width: 22%;
}
.nbp-si-suche-suchtext-col {
width: 40%;
}
.nbp-si-suche-button-col {
width: 8%;
}
.nbp-si-suche-label {
display: inline-block;
padding-top: 6px;
padding-right: 10px;
/* Hyphenation */
overflow-wrap: break-word; /* Chrome, Opera */
word-wrap: break-word; /* Fallback für 'aaaaaaa'-Testfälle */
word-break: break-word;
-ms-hyphens: auto; /* > IE 10 */
-moz-hyphens: auto; /* < FF 43 */
-webkit-hyphens: auto; /* > Safari 5.1 */
hyphens: auto; /* > FF 43 */
}
.nbp-si-suche-verknuepfung.nbp-select {
float: right;
width: 60px;
margin-right: 10px;
}
.nbp-si-suche-vergleich.nbp-select {
width: 120px;
}
.nbp-si-suche-suchtext-col .ui-inputfield {
width: 100%;
}
.nbp-si-suche-button {
margin-top: 1px;
float: right;
}
/* Tabellenspalten konfigurieren *****/
.nbp-si-spconfig .ui-accordion .ui-accordion-content {
padding: 0;
}
table.ui-datatable.nbp-si-spconfig-table {
width: 100%;
margin: 0;
}
.nbp-si-spconfig-table thead th {
padding: 8px 8px;
}
.nbp-si-spconfig-table thead td {
padding: 3px 8px;
}
.nbp-si-spconfig-spalte-col {
width: 70%;
}
.nbp-si-spconfig-breite-col {
width: 15%;
}
.nbp-si-spconfig-sichtbar-col {
width: 15%;
white-space: nowrap;
}
.nbp-si-spconfig-table .ui-inputfield {
width: 36px;
padding: 2px 4px;
}
.nbp-si-spconfig-table input[type="checkbox"] {
margin: 1px 0 0 12px;
}
/* Sichten administrieren *****/
.nbp-si-admin-table {
width: 100%;
}
.nbp-si-admin-table th {
padding: 8px 8px;
}
.nbp-si-admin-label-col {
width: auto;
}
.nbp-si-admin-button-col {
width: 35px;
}
.nbp-si-admin-table .ui-inputfield {
width: 100%;
}
/* ========================================================
* NBP :: Komponente :: Charts
* ========================================================*/
.nbp-chartwrapper {
width: 100%;
background: var(--nbp-color-white);
margin-bottom: 20px;
border: 1px solid var(--nbp-color-cool-gray-20);
}
.nbp-chartwrapper.fb-statistik-chart {
margin-bottom: 0;
}
.nbp-chartwrapper h4 {
padding: 12px 12px 24px 12px;
margin: 0;
}
.nbp-chartwrapper.fb-statistik-chart .nbp-chart.nbp-pie-chart {
max-width: 100%;
height: 200px;
}
.nbp-chart {
padding: 0 40px;
position: relative;
}
.nbp-chart.nbp-pie-chart {
max-width: 300px;
padding: 0;
}
/* Legende */
.nbp-chartwrapper .nbp-chart-legend {
padding: 12px;
font-size: 13px;
word-wrap: break-word;
overflow-wrap: break-word;
hyphens: auto;
}
.nbp-chart-legend-color-col {
width: 20px;
min-width: 20px;
vertical-align: top;
padding-top: 3px;
}
/* Tooltip */
.nbp-chart-tooltip {
padding: 8px 12px;
font-size: 13px;
font-weight: bold;
max-width: 300px;
background-color: var(--nbp-color-white);
border: 1px solid var(--nbp-color-cool-gray-50);
position: absolute;
box-shadow: 0 2px rgba(215, 215, 215, 0.6);
}
.nbp-chart-column .nbp-chart-tooltip {
transform: translate(0, -100%);
}
.nbp-chart-tooltip ul {
margin: 0;
padding: 0;
}
.nbp-chart-tooltip ul li {
list-style-type: none;
padding: 4px 0;
}
.nbp-chart-tooltip span {
font-weight: normal;
margin-right: 4px;
display: inline-block;
}
.nbp-chart-tooltip.nbp-chart-tooltip-timelinechart span {
width: 46px;
}
/* https://github.com/google/google-visualization-issues/issues/2162 */
div.google-visualization-tooltip {
pointer-events: none;
}
/* ========================================================
* NBP :: Komponente :: Textpanel
* ========================================================*/
.nbp-textpanel-wrapper {
position: relative;
}
.nbp-textpanel {
min-height: 2em;
max-height: 16em;
line-height: 1.5;
display: block;
box-sizing: border-box;
overflow-y: auto;
border: 1px solid var(--nbp-color-cool-gray-20);
border-radius: 3px;
background: var(--nbp-color-white);
padding: 8px 12px;
width: 100%;
overflow-wrap: break-word;
word-wrap: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}
.nbp-textpanel.nbp-textpanel-lg {
min-height: 2em;
max-height: 32em;
}
.nbp-textpanel-inline.nbp-textpanel-expanded .nbp-textpanel {
max-height: initial;
}
.nbp-textpanel-inline .nbp-textpanel{
scrollbar-gutter: stable;
}
.nbp-textpanel-framewrapper {
position: relative;
overflow: visible;
}
.nbp-textpanel-frame {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0 none;
}
.nbp-textpanel-framecontent.nbp-beteiligung-text,
.nbp-textpanel.nbp-beteiligung-text {
position: relative;
/* identisch zu iframe-def in common.css */
font-family: Arial, Helvetica, sans-serif;
line-height: 1.5;
font-size: 14px;
}
.nbp-textpanel .nbp-textpanel-btn {
position: absolute;
left: calc(50% - 12px);
background-color: var(--nbp-color-white);
}
.nbp-textpanel-wrapper .nbp-textpanel-btn-top {
top: -12px;
}
.nbp-textpanel-wrapper .nbp-textpanel-btn-bottom {
bottom: -12px;
}
.nbp-textpanel-wrapper .nbp-textpanel-btn {
position: absolute;
bottom: -12px;
left: calc(50% - 12px);
background-color: var(--nbp-color-white);
}
.nbp-textpanel-wrapper .nbp-textpanel-btn:hover,
.nbp-textpanel-wrapper .nbp-textpanel-btn:focus {
background-color: var(--nbp-color-blue-60);
}
.nbp-textpanel-btn .ui-icon:before {
content: "\f078"; /* fa-chevron-down */
}
.nbp-textpanel-expanded .nbp-textpanel-btn .ui-icon:before {
content: "\f077"; /* fa-chevron-up */
}
/* Wrapper für iFrame */
.nbp-textpanel.nbp-textpanel-framewrapper {
padding: 0;
}
/* wird für die exakte Größenberechnung des iFrames benötigt */
.nbp-textpanel-framecontent .nbp-textpanel-text {
scrollbar-gutter: stable;
overflow-y: auto;
}
/*
.nbp-textpanel-framecontent {
padding: 8px 16px 8px 12px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px !important;
line-height: 1.5;
}
.nbp-beteiligung-text.textpanel {
font-size: 1em;
line-height: 1.5;
}
*/
.search-result-line .nbp-outputtext-pre,
.nbp-textpanel-pre .nbp-textpanel-text {
white-space: pre-wrap;
}
.textpanel-expanded {
padding-right: 28px;
}
.textpanel-hidden {
display: none;
}
.textpanel-label {
display: block;
margin-bottom: 10px;
}
.textpanel-selection-popup {
position: absolute;
display: none;
width: auto;
height: auto;
padding: 12px 16px 16px;
border: 1px solid var(--nbp-color-cool-gray-80);
border-radius: 3px;
top: 300px;
left: 300px;
box-shadow: 0 0 6px 1px rgba(172, 181, 194, 0.56);
background: var(--nbp-color-white);
z-index: 1000;
}
.textpanel-selection-popup-hidden {
display: none;
}
.textpanel-selection-popup-divider {
margin-bottom: 10px;
}
.nbp-textpanel mark {
scroll-margin: 10px;
padding: 2px 0;
background-color: var(--nbp-color-yellow-10);
}
.nbp-textpanel mark.nbp-mark-complete {
background-color: var(--nbp-color-green-10);
}
.nbp-textpanel mark.nbp-mark-partial {
background-color: var(--nbp-color-yellow-10);
}
/* Zitate ***/
.nbp-textpanel blockquote {
border-left: 5px solid var(--nbp-color-cool-gray-20);
font-style: italic;
padding: 2px 8px 2px 20px;
}
.nbp-textpanel h1, .nbp-textpanel h2, .nbp-textpanel h3, .nbp-textpanel h4, .nbp-textpanel h5, .nbp-textpanel h6 {
font-weight: 600;
}
/* ========================================================
* NBP :: Komponente :: Kommunikation
* ========================================================*/
.nbp-mail-ansicht {
background: var(--nbp-color-white);
margin: 15px 10px;
padding: 20px;
overflow: hidden;
}
.nbp-mail-antwort {
border-left: 6px solid var(--nbp-color-yellow-15);
}
.nbp-mail-ansicht-betreff {
font-weight: bold;
margin-bottom: 20px;
}
.nbp-mail-ansicht-inhalt {
white-space: pre-wrap;
}
.ui-datatable .nbp-mail-ansicht-anhaenge ul {
padding-left: 0;
}
.nbp-mail-ansicht-header {
margin-bottom: 20px;
}
.nbp-mail-ansicht-header > div {
margin-bottom: 3px;
}
.nbp-platzhalter-list li {
display: grid;
grid-template-columns: 280px 1fr;
}
/* ========================================================
* NBP :: Liste der Bearbeitungsvermerke/Kommentare
* ========================================================*/
.nbp-vermerk-ansicht,
.nbp-kommentar-ansicht {
background: var(--nbp-color-white);
margin: 15px 10px;
padding: 20px;
overflow: hidden;
white-space: pre-wrap;
}
.ui-datatable .nbp-vermerk-ansicht p {
margin-bottom: .6em;
}
.ui-datatable .nbp-vermerk-ansicht p:last-child {
margin-bottom: 0;
}
/* ========================================================
* NBP :: PopUp mit PDF-Viewer
* ========================================================*/
.pdf-viewer-popup iframe {
border: 1px solid var(--nbp-color-cool-gray-15);
}
/* ========================================================
* Bootstrap :: Toast
* ========================================================*/
.nbp-toast-container {
position: fixed;
top: 0;
right: 0;
padding: 15px;
z-index: 950;
}
.nbp-toast {
font-size: 13px;
background-color: var(--nbp-color-white);
}
.nbp-toast .toast-header {
color: var(--nbp-color-cool-gray-80);
background-color: var(--nbp-color-cool-gray-10);
padding: 10px 15px;
font-weight: bold;
}
.nbp-toast .toast-header button {
margin-right: -5px;
}
.nbp-toast .toast-body {
padding: 15px;
}
/* Status-Msg mit Icon */
.nbp-toast .nbp-toast-status {
display: flex;
line-height: 1.5;
}
.nbp-toast-status .nbp-toast-status-icon {
font-size: 16px;
margin-right: 10px;
font-weight: normal;
}
/* ========================================================
* OpenLayers - Karten
* ========================================================*/
/* Map :: Dienste konfigurieren */
.nbp-popup-config-map-container {
position: relative;
}
.olmaps-service-config {
position: absolute;
width: 100%;
z-index: 9009;
}
.olmaps-service-config .card {
border-radius: 0;
}
.olmaps-service-config #service-capabilities select {
height: auto;
max-height: 7em;
}
.nbp-service-select-deselect-btn {
padding: 0;
min-width: 7em;
text-align: left;
}
.nbp-service-select-hint {
display: inline;
margin-left: 10px;
}
.nbp-service-select-hint code {
color: inherit;
}
.olmaps-service-config .alert {
padding: .5em .75em;
}
.olmaps-service-config .alert-warning {
color: inherit;
}
/* Map :: Layerswitcher :: Sortieren */
.nbp-map-layer-switcher-rw .ol-layerswitcher .layerup {
font-family: 'icomoon';
background-color: transparent;
float: left;
height: 1em;
top: 20px;
left: -2px;
opacity: 1;
margin-left: 6px;
}
.nbp-map-layer-switcher-rw .ol-layerswitcher .layerup:before {
content: "\ec71";
left: -1px;
bottom: -1px;
color: #0873A8;
font-size: 16px;
border: none;
height: auto;
}
.nbp-map-layer-switcher-rw .ol-layerswitcher .layerup:after {
content: none;
}
/* Map :: Layerswitcher :: Löschen */
.nbp-map-layer-switcher-rw .ol-layerswitcher .layerTrash {
font-size: 14px;
background-color: #0873A8;
}
.nbp-map-layer-switcher-rw .ol-layerswitcher .layerTrash:before {
font-size: 16px;
line-height: 14px;
}
/* ===================================================================================================================
* Fachadministration :: Seiten
* ===================================================================================================================*/
/* ========================================================
* Seiten :: Login
* ========================================================*/
.nbp-login-panel {
width: 560px;
margin: 100px auto;
padding: 30px 40px;
border-radius: 8px;
background-color: var(--nbp-color-white);
}
.nbp-login-panel h2 {
margin-bottom: 30px;
margin-top: 0;
}
/* ========================================================
* Seiten :: Base :: Übersicht / Bearbeiten
* ========================================================*/
/* Panel-Header */
.panel-header {
padding: 24px;
min-height: 80px;
z-index: 925;
background-color: var(--nbp-color-white);
margin: 0 -24px;
border-top-right-radius: 8px;
border-top-left-radius: 8px;
}
.panel-header.panel-header-bearbeiten {
padding-bottom: 12px;
min-height: 68px;
}
.panel-header-separator {
border-bottom: 2px solid var(--nbp-color-cool-gray-20);
}
.panel-header .nbp-bearbeiten-messages > div {
margin-bottom: 0;
margin-top: 20px;
}
/* Statuszeile Bearbeiten Ansicht*/
.bearbeiten-status-zeile {
background: var(--nbp-color-white);
min-height: 12px;
}
/* Panel-Header mit Tabview */
.panel-header.panel-header-bearbeiten.panel-header-with-tabview {
padding-bottom: 24px;
min-height: 80px;
}
.panel-header-with-tabview ~ .panel-header-separator {
}
.panel-header-with-tabview ~ .bearbeiten-status-zeile {
height: 25px;
}
/* Überschrift */
.panel-header h2 {
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 22px;
}
/* Messages */
.nbp-messages-hook {
padding: 0 24px;
}
/* Statuszeile Sicht (Datatable) */
.sicht-status-zeile {
font-size: 14px;
color: var(--nbp-color-cool-gray-60);
padding: 10px 0;
min-height: 36px;
}
.sicht-status-zeile .status-divider {
margin: 0 8px;
}
/* Buttons Top */
.panel-buttons-top {
display: flex;
}
.panel-buttons-top button,
.panel-buttons-top .ui-menubutton {
margin-left: 8px;
margin-right: 0;
}
.panel-buttons-edit {
display: flex;
margin-right: 8px;
}
.panel-buttons-edit .panel-button-cancel {
margin-right: 8px;
}
/* ========================================================
* Seiten :: Base :: Header
* ========================================================*/
.nbp-header {
padding-top: 16px;
z-index: 930;
background: var(--nbp-color-cool-gray-20);
border-bottom: 1px solid transparent;
text-align: center;
}
.nbp-main-grid .nbp-header {
text-align: left;
}
.nbp-header-wrapper {
padding: 10px 17px;
min-height: 30px;
border: 0;
border-radius: 8px;
}
.nbp-header-left {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.nbp-header-right {
}
/* Link zu Dashboard */
.nbp-header-dashboard {
padding-right: 0;
font-size: 18px;
line-height: 30px;
max-height: 30px;
}
.nbp-header-dashboard .ui-button.nbp-header-button {
transform: translateY(-1px);
}
.nbp-header-dashboard .nbp-header-icon {
padding: 0 4px 0 1px;
}
.nbp-header-dashboard .nbp-header-button a {
display: flex;
align-items: center;
height: 100%;
}
/* Überschrift */
.nbp-header-headline {
font-size: 22px;
line-height: 30px;
font-weight: 300;
}
.nbp-header-headline a:focus {
outline-offset: -2px;
}
/* Ausgewählte Beteiligung */
.nbp-header-btg {
font-size: 18px;
}
.ui-button.nbp-header-button {
height: 30px;
width: 30px;
background-color: transparent;
border: 1px solid transparent;
color: var(--nbp-color-cool-gray-80);
}
.ui-button.nbp-header-button .ui-icon {
width: 30px;
}
.ui-button.nbp-header-button:hover,
.ui-button.nbp-header-button:focus {
border: 1px solid var(--nbp-color-cool-gray-15);
background-color: var(--nbp-color-cool-gray-15);
}
.ui-button.nbp-header-button.nbp-mandant-switched {
border: 2px solid var(--nbp-color-blue-60);
}
.nbp-header-icon {
font-size: 12px;
padding: 0 11px 0 8px;
transform: translateY(-2px);
}
.nbp-header-menu-mandant {
width: 260px;
}
.nbp-header-menu-nutzer {
min-width: 200px;
}
/* ========================================================
* Seiten :: Base :: Footer
* ========================================================*/
.nbp-footer {
padding: 15px 50px;
background: var(--nbp-color-cool-gray-60);
color: var(--nbp-color-white);
border: 0;
}
.nbp-footer nav {
text-align: right;
}
.nbp-footer ul {
list-style: none;
margin: 0;
padding: 0
}
.nbp-footer ul li {
display: inline-block;
}
.nbp-footer ul li:not(:last-child)::after {
content: '|';
padding: 0 5px;
}
.nbp-footer a {
color: var(--nbp-color-white);
text-decoration: none;
}
.nbp-footer a:hover,
.nbp-footer a:focus {
text-decoration: underline;
}
/* ========================================================
* Seiten :: Base :: Layout
* ========================================================*/
.nbp-main {
background: var(--nbp-color-white);
}
.contentpanel {
padding: 0 24px 24px;
border-radius: 8px;
}
/* Tabellen */
.ui-datatable tr {
border: 1px solid var(--nbp-color-white);
}
.ui-datatable tr td {
border-width: 0;
}
.ui-datatable .ui-datatable-even,
table.ui-datatable tbody tr:nth-child(2n+1) {
background-color: var(--nbp-color-cool-gray-5);
}
.ui-datatable tr.ui-state-hover {
background-color: var(--nbp-color-cool-gray-15);
}
.ui-datatable tr.ui-state-highlight {
background-color: var(--nbp-color-cool-gray-20);
}
/* Tabmenü */
.ui-tabmenu .ui-tabmenu-nav {
margin: 0;
padding: 0;
}
.ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem {
margin: 0;
top: 0;
outline: 0;
}
.ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem a {
padding: 1em;
}
/* Tabfocus */
.nbp-tabfocus-on .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem.ui-menuitem-outline {
outline: 2px dotted;
outline-offset: -3px;
}
/* Hauptmenü :: 1. Ebene */
.nbp-navigation-menu {
background: var(--nbp-color-white);
border-radius: 8px;
max-width: 300px;
padding-top: 5px;
margin-right: 16px;
overflow: hidden;
}
.nbp-tabmenu-main .ui-tabmenu-nav {
display: flex;
flex-direction: column;
}
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem {
background: inherit;
padding: 0 16px;
line-height: 16px;
transition: background-color .1s ease;
}
/* Menuitem Link */
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem .ui-menuitem-link {
/* flex sorgt dafür, dass das Menuitem nicht zusammengeschoben wird */
display: flex;
width: 100%;
padding: 12px 4px;
transition: border-color .1s ease;
}
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem .ui-menuitem-link .ui-menuitem-text {
color: var(--nbp-color-cool-gray-60);
}
/* Hover */
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem.ui-state-hover .ui-menuitem-link {
border-bottom: 1px solid var(--nbp-color-cool-gray-50);
}
/* Active */
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem .ui-menuitem-link.ui-state-active {
border-bottom: 2px solid var(--nbp-color-blue-60);
}
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem .ui-menuitem-link.ui-state-active .ui-menuitem-text {
color: var(--nbp-color-cool-gray-80);
}
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem .ui-menuitem-link.ui-state-active .ui-menuitem-icon {
font-weight: bold;
}
/* Icon */
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem .ui-icon {
font-size: 14px;
text-align: center;
}
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem .ui-menuitem-text {
margin-left: 8px;
}
/* Vorletztes Item (letztes Navigationsitem) */
.nbp-tabmenu-main .ui-tabmenuitem:nth-last-child(2) {
margin-bottom: 5px;
}
.nbp-tabmenu-main .ui-tabmenuitem:nth-last-child(2) .ui-menuitem-link {
border-bottom: 1px solid transparent;
}
/* Letztes Item (Toggle) */
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem:last-child {
background-color: var(--nbp-color-cool-gray-10);
}
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem:last-child .ui-menuitem-link {
border-bottom: none;
}
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem:last-child .ui-menuitem-text {
display: none;
}
/* Hover */
.nbp-tabmenu-main .ui-tabmenu-nav .ui-tabmenuitem:last-child.ui-state-hover {
background-color: var(--nbp-color-cool-gray-15);
}
.nbp-tabmenu-main:not(.nbp-tabmenu-collapsed) .ui-tabmenu-nav.ui-widget-header .ui-tabmenuitem:last-child .ui-menuitem-link {
padding-right: 0;
justify-content: end;
}
/* Collapsed */
.nbp-tabmenu-main.nbp-tabmenu-collapsed .ui-tabmenuitem .ui-menuitem-text {
display: none;
}
/* Hauptmenü :: 2. Ebene */
.nbp-tabmenu-sub {
background: var(--nbp-color-cool-gray-10);
border-radius: 8px 8px 0 0;
overflow: hidden;
}
/* Menuitem */
.nbp-tabmenu-sub .ui-tabmenu-nav.ui-widget-header .ui-tabmenuitem {
height: 45px;
background: transparent;
}
/* Menuitem Link */
.nbp-tabmenu-sub .ui-tabmenu-nav.ui-widget-header .ui-tabmenuitem.ui-state-default .ui-menuitem-link {
border-right: 1px solid var(--nbp-color-cool-gray-50);
border-bottom: none;
transition: background-color .2s, border-color .2s;
}
/* Hover */
.nbp-tabmenu-sub .ui-tabmenu-nav.ui-widget-header .ui-tabmenuitem.ui-state-hover .ui-menuitem-link {
background-color: var(--nbp-color-cool-gray-15);
}
/* Active */
.nbp-tabmenu-sub .ui-tabmenu-nav.ui-widget-header .ui-tabmenuitem .ui-menuitem-link.ui-state-active span {
border-bottom: 2px solid var(--nbp-color-blue-60);
padding-bottom: 2px;
}
.nbp-tabmenu-sub .ui-tabmenu-nav.ui-widget-header .ui-tabmenuitem.ui-state-hover .ui-menuitem-link.ui-state-active {
background: var(--nbp-color-white);
}
/* Tabs :: CrudView */
.crud-tabview {
background: transparent;
}
.crud-tabview.ui-tabs .ui-tabs-panel {
padding: 0;
}
.crud-tabview .ui-tabs-nav {
margin-top: -37px;
width: max-content;
max-width: 100%;
background: transparent;
font-size: 14px;
}
.crud-tabview.ui-tabs .ui-tabs-nav li {
margin-top: 4px;
}
.crud-tabview.ui-tabs .ui-tabs-nav li.ui-tabs-selected,
.crud-tabview.ui-tabs .ui-tabs-nav li.ui-tabs-outline {
outline: 0;
}
/* Tabfocus */
.nbp-tabfocus-on .crud-tabview.ui-tabs .ui-tabs-nav li.ui-tabs-outline {
outline: 2px dotted var(--nbp-color-cool-gray-80);
outline-offset: -3px;
}
/* Baum-Ansicht */
.layout-grid .ui-tabs.ui-tabs-top > .ui-tabs-nav {
margin-left: -32px;
}
.layout-grid .sicht-status-zeile {
padding-top: 14px
}
/* Accordion */
.ui-accordion {
background: var(--nbp-color-white);
}
.ui-accordion .ui-accordion-header {
padding: 14px 30px 14px 14px;
font-size: 15px;
outline: 0;
margin-top: 0;
border: none;
border-top: 1px solid var(--nbp-color-cool-gray-20);
transition: background-color .3s ease;
}
.ui-accordion .ui-accordion-header.ui-state-default {
font-weight: bold;
background-color: var(--nbp-color-white);
}
.ui-accordion .ui-accordion-header.ui-state-active {
background-color: var(--nbp-color-white);
}
/* kein Error-State am Accordion-Header */
.ui-accordion .ui-accordion-header.ui-state-error {
border-color: var(--nbp-color-cool-gray-20);
}
.ui-accordion .ui-accordion-content {
padding: 16px 20px;
overflow: visible; /* benötigt für BS-Dropdowns */
position: static;
margin: 0;
/* revert PF scale(1) :: benötigt für BS-Overlays */
transform: none;
}
/* Accordion-Content :: clearfix */
.ui-accordion-content::after {
display: block;
clear: both;
content: "";
}
.ui-accordion.nbp-popup-accordion .ui-accordion-content {
padding: 24px 0 12px;
overflow: hidden;
}
.ui-accordion .ui-accordion-header .ui-icon {
left: auto;
right: 1em;
margin-top: -7px;
font-weight: 100;
font-size: 14px;
text-align: center;
}
.ui-accordion:not(.nbp-static-accordion) .ui-accordion-header:hover {
background-color: var(--nbp-color-cool-gray-10);
}
.ui-accordion .ui-accordion-header.ui-state-error {
color: inherit;
}
/* Tabfocus */
.nbp-tabfocus-on .ui-accordion .ui-accordion-header.ui-tabs-outline {
outline: 2px dotted var(--nbp-color-cool-gray-80);
}
/* Static-Accordion */
.nbp-static-accordion.ui-accordion .ui-accordion-header,
.nbp-static-accordion.ui-accordion .ui-accordion-header a {
cursor: default;
}
.nbp-static-accordion.ui-accordion .ui-accordion-header .ui-icon {
display: none;
}
/* Tabellen in Accordions */
.ui-accordion-content .ui-datatable {
margin-bottom: 15px;
}
.details-panel .ui-accordion .ui-accordion-header,
.ui-dialog .ui-accordion .ui-accordion-header {
padding: 14px 30px 14px 20px;
}
/* Erstes Accordion */
/* https://stackoverflow.com/questions/2717480/css-selector-for-first-element-with-class */
/* Aufbau: div > h3 | h3 | h3 < div */
/* Die erste h3 eines ui-accordions im Bearbeiten Bereich hat keine Border & oberen Abstand */
.details-panel .ui-accordion .ui-accordion-header:first-of-type {
margin-top: 20px;
border-top: 1px solid transparent;
}
/* Die erste h3 der Nachbarn des ersten Accordions haben eine obere Border & keinen oberen Abstand*/
.details-panel .ui-accordion ~ .ui-accordion .ui-accordion-header:first-of-type {
margin-top: 0;
border-top: 1px solid var(--nbp-color-cool-gray-20);
}
/* static Accordions */
/* Aufbau: div > h3 < div | div > h3 < div | div > h3 < div */
/* first-of-type nicht notwendig, da es eh nur ein h3 pro div gibt */
/* Das erste static Accordion eines Dialogs hat keine obere Border */
.ui-dialog .ui-accordion.nbp-static-accordion .ui-accordion-header {
border-top: 1px solid transparent;
}
/* Die Nachbarn des ersten static Accordions eines Dialogs haben eine obere Border */
.ui-dialog .ui-accordion.nbp-static-accordion ~ .ui-accordion.nbp-static-accordion .ui-accordion-header {
border-top: 1px solid var(--nbp-color-cool-gray-20);
}
/* In Einzelfällen kann auch 'nbp-accordion-header-no-border' verwendet werden um die Border bei einem Accordion wegzunehmen */
.ui-accordion .ui-accordion-header.nbp-accordion-header-no-border {
border-top: 1px solid transparent;
}
/* States */
.ui-state-default {
font-weight: normal;
}
.ui-state-active {
font-weight: normal;
}
.ui-widget-header {
font-weight: normal;
}
.linie {
border-bottom: 1px solid var(--nbp-color-cool-gray-20);
margin-bottom: 10px;
padding-bottom: 10px;
}
/* ===================================================================================================================
* Seitenhilfe
* ===================================================================================================================*/
.nbp-seitenhilfe {
/* Wenn die Seitenhilfe das höchste Element ist, darf dieses kein Scrolling verursachen */
max-height: calc(100vh - 120px);
max-width: 400px;
display: flex;
flex-direction: column;
margin-left: 16px;
background: var(--nbp-color-white);
border-radius: 8px;
}
.nbp-seitenhilfe-header {
display: flex;
align-items: center;
min-height: 45px;
border-radius: 8px 8px 0 0;
background: var(--nbp-color-cool-gray-10);
padding: 0 5px 0 15px;
}
.nbp-seitenhilfe-headline {
flex-grow: 1;
font-size: 18px;
}
.nbp-seitenhilfe-content {
padding: 15px;
overflow-y: auto;
}
/* erste h2 */
.nbp-seitenhilfe-top + h2 {
margin-top: 0;
}
.nbp-seitenhilfe-footer {
min-height: 15px;
}
/* ========================================================
* Seiten :: Sitemap
* ========================================================*/
.nbp-sitemap a {
text-decoration: none;
}
.nbp-sitemap a:hover,
.nbp-sitemap a:focus {
text-decoration: underline;
}
/* ========================================================
* Seiten :: Dashboard
* ========================================================*/
.dashboard-table {
margin-bottom: 20px;
line-height: 1.8;
}
.dashboard-table tr td,
.dashboard-table tr th {
padding: 8px 12px;
}
.dashboard-table tr th {
font-size: 14px;
font-weight: bold;
text-align: left;
}
.dashboard-table tr.dashboard-normal th {
font-weight: normal;
}
.dashboard-table tr td {
vertical-align: top;
}
.dashboard-table .dashboard-active {
font-weight: bold;
}
.dashboard-table .dashboard-icon-col {
text-align: center;
}
.dashboard-icon {
font-size: 28px;
padding: 6px;
}
.dashboard-beteiligung {
font-size: 14px;
font-weight: bold;
margin-bottom: 2px;
}
.dashboard-beteiligung-sub {
font-size: 13px;
color: var(--nbp-color-cool-gray-70);
}
.dashboard-startlabel {
display: inline-block;
width: 9em;
font-style: italic;
}
.dashboard-count {
display: inline-block;
}
.dashboard-neu {
margin-right: 5px;
}
.dashboard-actions {
display: inline-block;
padding-top: 5px;
}
.dashboard-actions-button-col {
display: inline-block;
width: 40px;
text-align: center;
}
/* Tabelle 'Schnellstart' */
.dashboard-shortcuts a {
font-size: 14px;
}
.dashboard-linkicon {
font-size: 16px;
transform: translateY(1px);
margin-right: 10px;
}
/* ========================================================
* Seiten :: Gegenstände / Informationen
* ========================================================*/
/* Strukturierter Text - Composite: strukturierterText */
/* Layout */
.nbp-struc-text-grid {
display: grid;
grid-template-columns: 33% 1fr;
column-gap: 30px;
}
/* Tree Gliederungspunkte */
.nbp-struc-text-tree.ui-tree {
width: 100%;
background: var(--nbp-color-white);
padding: 5px 10px 0 0;
}
.nbp-struc-text-tree .ui-tree-container {
padding-bottom: 15px;
}
.nbp-element-tree .nbp-treenode-invisible .ui-treenode-label {
font-style: italic;
}
.nbp-struc-text-tree .nbp-treenode-invisible .ui-treenode-label {
font-style: italic;
}
/* Textpanel :: initiale Höhe */
.nbp-struc-text .nbp-textpanel {
max-height: 28em;
}
/* Fileupload :: Button */
.nbp-struc-text .nbp-fileupload {
float: right;
margin-left: 4px;
}
/* Fileupload :: das Detail-Panel nicht anzeigen */
.nbp-struc-text .nbp-fileupload .ui-fileupload-files {
display: none;
}
/* Splitten-Dialog - Composite: splittenDialog */
.nbp-splitlevel.nbp-form-group .nbp-form-input-col > span {
display: inline-block;
}
.nbp-splitlevel.nbp-form-group .nbp-splitlevel-checkbox {
padding-top: 0;
margin-right: 14px;
}
.nbp-splitten-tree {
width: 100%;
background: var(--nbp-color-white)
}
.nbp-splitten-tree.ui-tree .ui-tree-toggler {
vertical-align: top;
margin-top: 3px;
}
.nbp-splitten-tree h1, .nbp-splitten-tree h2, .nbp-splitten-tree h3,
.nbp-splitten-tree h4, .nbp-splitten-tree h5, .nbp-splitten-tree h6 {
font-size: 14px;
margin: 0 0 6px;
}
/* ========================================================
* Seiten :: Fragebogen-Editor
* ========================================================*/
.fb-editor-layout-table {
display: table;
width: 100%;
margin: 0;
padding: 0;
border: none;
border-spacing: 0;
table-layout: fixed;
margin-top: 36px;
}
.fb-editor-layout-table-left {
display: table-cell;
width: 47%;
vertical-align: top;
padding-right: 3%;
}
.fb-editor-layout-table-right {
display: table-cell;
width: 50%;
vertical-align: top;
}
.fb-editor-layout-table td {
vertical-align: top;
}
.fb-editor-layout-table h2 {
margin-top: 0;
margin-bottom: 1em;
}
.fb-editor-layout-table .nbp-form-group.two-line {
margin-bottom: 10px;
}
.fb-editor-layout-table .nbp-form-group.two-line .nbp-form-label-col {
width: 50%;
margin-bottom: 4px;
}
.fb-editor-layout-table .nbp-form-group.two-line .nbp-form-input-col {
width: 100%;
}
.fb-editor-layout-table .cke_chrome {
box-sizing: border-box;
border: 1px solid var(--nbp-color-cool-gray-20);
box-shadow: none;
}
/* Tabelle */
.fb-editor-list {
white-space: nowrap;
}
.fb-editor-list .ui-datatable-scrollable-header,
.fb-editor-list .ui-datatable-scrollable-theadclone,
.fb-editor-list .ui-datatable-scrollable-footer {
height: 0;
border: none;
display: none;
}
.fb-editor-list .ui-datatable-scrollable-body {
overflow-x: hidden;
overflow-y: auto;
}
.fb-editor-list .fb-editor-list-data-col {
width: auto !important;
vertical-align: middle;
}
.fb-editor-list .fb-editor-list-button-col {
width: 75px !important;
padding-left: 4px;
}
.fb-editor-list .ui-state-highlight {
border-color: var(--nbp-color-white);
}
.fb-editor-list td {
text-overflow: ellipsis;
height: 20px;
}
.fb-editor-label.fb-editor-linie {
display: inline-block;
border-bottom: 1px solid var(--nbp-color-cool-gray-20);
margin-bottom: 7px;
padding-bottom: 7px;
margin-right: 0;
width: calc(100% - 30px);
}
.fb-editor-list .fb-editor-label {
color: var(--nbp-color-cool-gray-60);
margin-right: 8px;
}
.fb-editor-list .fb-editor-listitem-move {
margin-right: 0.4em;
}
.fb-editor-list .fb-editor-listitem-spacer {
display: inline-block;
width: 16px;
}
/* Tabelle :: States */
.fb-editor-list .fb-editor-error .fb-editor-label {
color: var(--nbp-support-error) !important;
}
.fb-editor-list .ui-state-hover .fb-editor-label {
color: var(--nbp-color-cool-gray-80);
}
.fb-editor-list .ui-state-highlight .fb-editor-listitem {
color: var(--nbp-color-cool-gray-80);
}
.fb-editor-list .ui-state-highlight .fb-editor-label {
color: var(--nbp-color-cool-gray-80);
}
.fb-editor-teilueberschrift h2 {
float: left;
margin: 8px 0 12px;
}
.fb-editor-teilueberschrift .fb-editor-teilueberschrift-buttons {
float: right;
margin-top: 6px;
}
.fb-editor-teilueberschrift .fb-editor-teilueberschrift-buttons button {
margin: 0 0 0 6px;
}
.nbp-form-group.fb-editor-error {
margin-top: -10px;
color: var(--nbp-support-error);
white-space: normal;
}
.nbp-cke-hilfe-link,
.nbp-cke-hilfe-pop {
display: none;
}
.nbp-tabview.ui-tabs .ui-tabs-nav li.nbp-tabview-error {
border-color: var(--nbp-support-error);
}
.fb-fragebogen .ui-widget-content {
background: var(--nbp-color-white);
border: none;
}
/* ========================================================
* Seiten :: Fragebogen-Statistik
* ========================================================*/
.chart-button-active {
display: none;
}
.fb-statistik-col1 {
width: 50%;
float: left;
}
.fb-statistik-col2 {
width: 50%;
float: left;
padding-left: 20px;
}
.fb-statistik-unterfrage {
margin: 20px 0 10px;
}
.fb-statistik-chart .gc-legend {
display: none;
}
.fb-statistik-color-col {
padding: 0 !important;
width: 26px;
vertical-align: top;
}
.fb-statistik-color-col div {
border: 15px solid transparent;
}
.fb-drilldown-col1 {
float: left;
width: calc(100% - 40px);
}
.fb-drilldown-col2 {
float: left;
width: 40px;
}
.fb-drilldown-col2 .ui-button {
float: right;
}
.fb-drilldown-col1.fb-drilldown-suchtext {
margin-top: -14px;
}
/* Drilldown :: Suchtext */
.nbp-form-group.fb-drilldown-suchtext-input .nbp-form-input-col {
display: flex;
}
.nbp-form-group.fb-drilldown-suchtext-input .ui-selectonemenu {
min-width: 85px;
}
/* Drilldown :: PopUp */
.ui-dialog.fb-drilldown-popup {
width: 795px !important;
height: auto;
max-height: 90%;
max-width: 80%;
overflow: auto;
}
.ui-dialog.fb-drilldown-popup,
.ui-dialog.fb-drilldown-popup .ui-dialog-titlebar,
.ui-dialog.fb-drilldown-popup .ui-dialog-content {
box-sizing: border-box;
}
.ui-dialog.fb-drilldown-popup .ui-dialog-titlebar {
position: fixed;
width: 795px;
z-index: 10;
}
.ui-dialog.fb-drilldown-popup .ui-dialog-titlebar-close {
padding-right: 14px;
}
.ui-dialog.fb-drilldown-popup .ui-dialog-content {
padding-top: 60px;
}
.fb-drilldown-popup .ui-accordion-content {
padding-left: 0;
padding-right: 5px;
}
/* ========================================================
* Seiten :: PopUp - Nutzer suchen
* ========================================================*/
/* Composite: erstellerHandhabenDialog */
.ui-datatable .search-result {
font-size: 0.95em;
}
.ui-datatable .search-result a {
font-weight: bold;
font-size: 1.07em;
}
.ui-datatable .search-result a b {
font-weight: 900;
font-style: italic;
}
.ui-datatable .search-result b {
font-weight: 900;
}
.search-result-line {
min-height: 20px;
line-height: 20px;
}
.search-result-line-top {
margin-bottom: 5px;
}
.nutzer-toggle-button {
width: 10em;
margin-right: 6px;
}
.nbp-nutzersuche-tabview .ui-tabs-panel {
padding: 20px 0 0;
}
.nbp-maildialog-tabview .ui-tabs-panel {
padding: 20px 0 0;
}
/* ========================================================
* Seiten :: Moderieren / Auswerten
* ========================================================*/
.nbp-stn-table-icon {
display: block;
font-size: 16px;
width: 1em;
}
.nbp-beitrag-table-icon {
display: block;
font-size: 16px;
width: 1em;
}
.nbp-kommentar-table-icon {
display: block;
font-size: 16px;
width: 1em;
margin-left: 1em
}
.drag-icon:hover {
color: var(--nbp-color-blue-60);
font-weight: bold;
}
/* Zuordnen-Dialog */
.nbp-stn-zuordnen-tree.ui-tree {
width: 100%;
background: var(--nbp-color-white);
}
.nbp-stn-zuordnen-tree.ui-tree .ui-tree-container {
padding: 10px 5px 15px;
}
.nbp-fb-auswerten.fb-fragebogen {
background: var(--nbp-color-white);
padding: 20px;
}
/* Stellungnahme zu Karte auswerten -> Inhalt Bild */
.nbp-stn-karte-bild {
cursor: pointer;
}
.nbp-synopse-tabview .ui-tabs-panel {
padding: 20px 0;
}
.nbp-synopse-tabview .ui-accordion .ui-accordion-content {
padding: 16px 14px;
}
/* TODO :: Das sollte besser im xhtml gelöst werden */
.nbp-synopse-tabview .button-line {
margin: 20px -30px -50px;
}
/* Volltextsuche :: Highlighting */
.nbp-diff-match {
padding: 2px 0;
background-color: var(--nbp-color-green-10);
}
.nbp-diff-more {
margin: 0 5px;
color: var(--nbp-color-cool-gray-50);
}
/* ========================================================
* Seiten :: Teilnehmer
* ========================================================*/
.nbp-buchungspaket .nbp-form-label {
white-space: normal;
}
.nbp-buchungspaket-option {
display: flex;
margin-bottom: 5px;
}
.nbp-buchungspaket-option .form-check {
width: calc(100% - 80px);
}
.nbp-buchungspaket-option .nbp-gebuehr {
margin-top: 7px;
width: 80px;
text-align: right;
}
/* ========================================================
* Seiten :: Sitemap
* ========================================================*/
.nbp-sitemap {
line-height: 1.5;
}
/* ========================================================
* Seiten :: Forms-Test
* ========================================================*/
.forms-test-colored .nbp-form-group {
border: 0 dashed blue;
}
.forms-test-colored .nbp-form-label-col,
.forms-test-colored .nbp-form-input-col {
border: 0 dotted darkred;
}
/* ========================================================
* Seiten :: Formular-Intern
* ========================================================*/
/* Fragebogen */
.fb-skin-intern.fb-fragebogen {
padding: 0;
margin: 0;
}
/* Überschriften */
.fb-fragebogen h1, .fb-fragebogen h2, .fb-fragebogen h3, .fb-fragebogen h4, .fb-fragebogen h5, .fb-fragebogen h6 {
margin: .8em 0;
}
/* Seitenindex */
.fb-skin-intern .fb-seitenindex-panel {
margin-top: 0;
}
.fb-skin-intern .fb-seitenindex-panel > label {
display: inline-block;
margin-bottom: 5px;
}
/* Form-Group */
.fb-skin-intern.fb-fragebogen .nbp-form-group {
}
/* Formular Form-Group default :: ratio1to4s */
.fb-skin-intern.ratio1to4s .nbp-form-group .nbp-form-label-col {
width: 20%;
}
.fb-skin-intern.ratio1to4s .nbp-form-group .nbp-form-input-col {
width: calc(50% + 15px);
padding-right: 0;
}
/* Formular Form-Group :: ratio1to2 */
.fb-skin-intern.ratio1to2 .nbp-form-group .nbp-form-label-col {
width: 33.333%;
}
.fb-skin-intern.ratio1to2 .nbp-form-group .nbp-form-input-col {
width: 66.666%;
padding-right: 0;
}
/* Form-Group :: Label-Spalte */
.fb-skin-intern .nbp-form-label-col label,
.fb-skin-intern .nbp-form-label-col .nbp-form-label {
width: auto;
max-width: calc(100% - 60px);
max-height: 2em;
}
.fb-pflichtfrage-indikator {
padding: 5px 0 0 3px;
float: left;
}
.fb-skin-intern .fb-fragetext {
padding: 0;
}
/* Form-Group :: Input-Spalte */
.fb-skin-intern .fb-anhang-title,
.fb-skin-intern .fb-matrix {
margin-top: 5px;
}
.nbp-form-group .nbp-form-input-col.fb-matrix .nbp-boolean {
padding-top: 0;
}
/* Info-PopUp */
.fb-tooltip-fragetext p:last-of-type {
margin-bottom: 0;
}
.fb-skin-intern .fb-infopanel-list {
margin: 0;
padding-left: 10px;
}
/* Gruppe */
.fb-skin-intern .fb-gruppe.fb-gruppe-rahmen {
margin: 0;
padding: 0;
border: 0;
}
.fb-skin-intern .fb-gruppe-header {
margin-bottom: 20px;
}
/* Media */
.fb-skin-intern .fb-media {
max-width: 120px;
}
/* Textbox */
.fb-skin-intern .fb-textbox {
margin-bottom: 20px;
}
/* Reset Styles aus fb-commons */
.fb-skin-intern .fb-selectonemenu .ui-selectonemenu-label {
padding: 4px;
}
/* Matrix-Fragen */
.fb-skin-intern .fb-matrix-row-labels .fb-matrix-col-value {
padding-top: 0;
}
@media screen and (min-width: 768px) {
.fb-skin-intern .fb-matrix .fb-matrix-data-rows .fb-matrix-row:nth-child(2n+1) {
background: var(--nbp-color-cool-gray-5);
}
}
@media screen and (max-width: 767px) {
.fb-matrix .fb-matrix-output-wrapper {
display: flex;
align-items: center;
}
}
/* Fileupload */
.fb-skin-intern .fb-fileupload .ui-fileupload-buttonbar {
padding-top: 5px;
}
.fb-skin-intern .fb-fileupload-hinweis {
margin-bottom: 10px;
}
/* Datalist :: Mehrfachauswahl ReadOnly */
.fb-fragebogen .ui-datalist-content {
background: none;
}
/* Überschriften */
.fb-skin-intern.fb-fragebogen h1 {
font-size: 1.7em
}
.fb-skin-intern.fb-fragebogen h2 {
font-size: 1.6em
}
.fb-skin-intern.fb-fragebogen h3 {
font-size: 1.5em
}
.fb-skin-intern.fb-fragebogen h4 {
font-size: 1.4em
}
.fb-skin-intern.fb-fragebogen h5 {
font-size: 1.3em
}
.fb-skin-intern.fb-fragebogen h6 {
font-size: 1.2em
}
/* Buttons */
.fb-button-add-gruppe.ui-button-icon-only,
.fb-button-remove-gruppe.ui-button-icon-only {
margin: 0;
}
.fb-btn {
padding: 0;
}
.fb-btn:hover {
color: var(--nbp-color-white);
}
/* Fehler-Klassen */
.fb-skin-intern .ui-selectonemenu label.ui-selectonemenu-label {
border: none;
}
.fb-skin-intern .fb-checkbox.fb-frage-fehler {
box-shadow: none;
}
.fb-skin-intern .fb-infopanel-list .fb-fehler,
.fb-skin-intern .nbp-infoicon.fb-frage-fehler {
color: var(--nbp-support-error);
}
/* size1of1 ratio1to4s :: div */
.fb-skin-intern.ratio1to4s .fb-seitenindex-panel,
.fb-skin-intern.ratio1to4s .fb-linie {
max-width: calc(70% + 15px);
}
/* size1of1 ratio1to4s :: row */
.fb-skin-intern.ratio1to4s .fb-group-row,
.fb-skin-intern.ratio1to4s .fb-seiten-navigation {
max-width: calc(70% + 35px);
}
/* nicht anzeigen */
.fb-skin-intern .fb-linie,
.fb-skin-intern .nbp-spacer {
display: none;
}
/* Views :: Teilnehmer */
.fb-skin-intern.fb-view-teilnehmer .fb-gruppe-header {
display: none;
}
.fb-skin-intern.fb-view-teilnehmer .fb-button-remove-gruppe {
display: none;
}
/* Fragebogen Wiederholbare Gruppierung */
.fb-seiten .ui-button.ui-button-icon-only.fb-button-round-md .ui-icon.nbp-fi {
/* Fontawesome */
font-family: 'Font Awesome 6 Pro';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: auto;
font-size: 14px;
}
.fb-seiten .nbp-fi.icomoon-plus2:before {
content: "\2b";
}
.fb-seiten .nbp-fi.icomoon-minus2:before {
content: "\f068";
}
/* ========================================================
* Seiten :: Meldeverfahren
* ========================================================*/
.nbp-mv-iconauswahl-overlay {
max-width: 396px !important;
}
.nbp-mv-iconauswahl-fonticon {
display: inline-block !important;
padding-top: 4px !important;
width: 30px;
font-size: 16px;
vertical-align: top;
}
.nbp-mv-iconauswahl-overlay-fonticon {
font-size: 16px;
width: 16px;
margin: 4px;
}
.nbp-mv-fonticon {
display: inline-block;
width: 1em;
margin-right: 10px;
}
/* ===================================================================================================================
* Fachadministration :: Hilfetexte
* ===================================================================================================================*/
.nbp-hilfetext {
}
a.nbp-hilfetext-close {
position: absolute;
top: 12px;
right: 15px;
font-size: 16px;
color: var(--nbp-color-cool-gray-50);
}
a.nbp-hilfetext-close:hover {
cursor: pointer;
color: var(--nbp-color-cool-gray-80);
}
.nbp-hilfetext h2 {
font-size: 1.5em;
font-weight: 300;
}
.nbp-hilfetext h4 {
font-size: 1.3em;
font-weight: 300;
}
.nbp-hilfetext ul.nbp-hilfe-button-liste {
list-style: none;
padding-left: 0;
}
.nbp-hilfetext dl dt {
font-weight: bold;
margin-top: 10px;
}
.nbp-hilfetext dl dt::after {
content: ": ";
}
.nbp-hilfetext dd + dd {
font-style: italic;
}
.nbp-hilfetext ul li .aktion-icon {
height: 26px;
width: 26px;
display: inline-block;
margin: 0 10px 5px 0;
background-color: var(--nbp-color-white);
color: var(--nbp-color-cool-gray-70);
border: 1px solid var(--nbp-color-cool-gray-70);
border-radius: 50%;
text-align: left;
padding: 6px;
vertical-align: middle;
}
.nbp-hilfetext ul li .aktion-icon:before {
font-size: 12px;
text-align: center;
margin-left: -1px;
}
ul.nbp-hilfe-button-liste .aktion-icon,
ul.nbp-hilfe-button-liste a {
vertical-align: middle;
}
/* Fonticons für Hilfetext-Buttons */
.nbp-hilfetext .aktion-icon:before {
/* Fontawesome */
font-family: 'Font Awesome 6 Pro';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: auto;
/* Icon */
font-size: 14px;
display: block;
width: 14px;
height: 14px;
line-height: 14px;
}
.nbp-hilfetext .aktion-icon-suche:before {
content: "\f002";
}
.nbp-hilfetext .aktion-icon-suche-reset:before {
content: "\f00d";
}
.nbp-hilfetext .aktion-icon-standard-zuruecksetzen:before {
content: "\f021";
}
.nbp-hilfetext .aktion-icon-sicht-konfigurieren:before {
content: "\f0ce";
}
.nbp-hilfetext .aktion-icon-export-tabelleninhalte:before {
content: "\f019";
}
.nbp-hilfetext .aktion-icon-neu:before {
content: "\2b";
}
.nbp-hilfetext .aktion-icon-loeschen:before {
content: "\f2ed";
}
.nbp-hilfetext .aktion-icon-zurueck-zur-uebersicht:before {
content: "\f060";
}
.nbp-hilfetext .aktion-icon-editieren:before {
content: "\f303";
}
.nbp-hilfetext .aktion-icon-aktionen:before {
content: "\f142";
}
.nbp-hilfetext .aktion-icon-kachel:before {
content: "\e195";
}
.nbp-hilfetext .aktion-icon-vorschau:before {
content: "\f04b";
}
.nbp-hilfetext .aktion-icon-chain:before {
content: "\f0c1";
}
.nbp-hilfetext .aktion-icon-pdf:before {
content: "\f1c1";
}
.nbp-hilfetext .aktion-icon-balkendiagramm:before {
content: "\e473";
}
.nbp-hilfetext .aktion-icon-tortendiagramm:before {
content: "\f64e";
}
.nbp-hilfetext .inline-img {
height: 20px;
width: 20px;
display: inline-block;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
/* ===================================================================================================================
* Komponente :: Fancybox
* ===================================================================================================================*/
/* Hintergrund */
.fancybox__backdrop {
background-color: var(--nbp-color-white);
}
/* Caption */
.fancybox__caption {
color: var(--nbp-color-cool-gray-80);
text-align: center;
}
/* Toolbar */
.fancybox__toolbar {
background: none;
text-shadow: none;
color: var(--nbp-color-white);
}
/* Buttons */
.carousel__button svg {
filter: none;
stroke: var(--nbp-color-cool-gray-60)
}
.carousel__button:hover svg {
stroke: var(--nbp-color-cool-gray-80);
}
.nbp-tabfocus-on .carousel__button:focus {
outline: 2px dotted var(--nbp-color-cool-gray-80);
}
.nbp-tabfocus-on .carousel__button:focus svg {
stroke: var(--nbp-color-cool-gray-80);
}
/* ===================================================================================================================
* Print
* ===================================================================================================================*/
.nbp-print-only {
display: none;
}
@media print {
.nbp-print-only {
display: initial;
}
.nbp-print-hide {
display: none;
}
/* Sticky Verhalten */
.nbp-sticky,
.crud-tabview.ui-tabs .ui-tabs-nav {
position: static !important;
}
/* Main Grid */
header, nav, aside {
display: none;
}
/* Allgemeine Elemente */
.ui-accordion .ui-accordion-header .ui-icon {
display: none;
}
.ui-accordion .ui-accordion-header {
padding: 20px 0;
font-size: 18px;
}
.ui-accordion .ui-accordion-content {
padding: 0;
}
.nbp-boolean {
width: auto;
color: inherit;
font: inherit;
font-size: inherit;
}
.nbp-boolean.nbp-boolean-on::before {
content: "Ja";
}
.nbp-boolean.nbp-boolean-off::before {
content: "Nein";
}
.line {
margin: 0;
min-height: 0;
}
.nbp-form-group {
width: 100%;
font-size: 12px;
color: #000;
}
.nbp-form-group .nbp-form-label-col,
.nbp-form-group .nbp-form-input-col {
margin: 0 !important;
padding: 0 !important;
}
.nbp-form-group.size1of2 .nbp-form-label-col,
.nbp-form-group.size1of1 .nbp-form-label-col {
width: 25%;
}
.nbp-form-group.size1of2 .nbp-form-input-col,
.nbp-form-group.size1of1 .nbp-form-input-col {
width: 75%;
}
.nbp-form-label-col label,
.nbp-form-label-col .nbp-form-label {
width: 100%;
padding-right: 10px;
}
.nbp-form-label-col .nbp-infoicon {
display: none;
}
.nbp-form-group .nbp-form-input-col .nbp-boolean {
padding-top: 5px;
}
/* Charts */
.gc-chartwrapper {
border: none;
}
.gc-chartwrapper .gc-legend table {
width: 100%;
font-size: 12px;
}
/* Fragebogenstatistik */
.fb-statistik-frage {
page-break-inside: avoid;
}
.fb-statistik-unterfrage {
page-break-inside: avoid;
margin: 0;
}
.fb-statistik-frage .fb-linie {
display: none;
}
.fb-statistik-frage .fb-statistik-col1,
.fb-statistik-frage .fb-statistik-col2 {
width: 100%;
padding: 0;
}
.fb-statistik-frage .ui-datatable th,
.fb-statistik-frage .ui-datatable tr {
border: 1px solid var(--nbp-color-cool-gray-15);;
}
.fb-statistik-frage .gc-chartwrapper {
margin-top: 10px;
}
.fb-statistik-frage .gc-chartwrapper .gc-legend {
display: block;
}
/* Fragebogenstatistik :: Drilldown :: Inputs */
.ui-selectonemenu.ui-state-default,
.ui-selectonemenu .ui-selectonemenu-trigger {
border-color: transparent;
}
.ui-selectonemenu .ui-selectonemenu-label {
color: #000;
padding-left: 0;
}
.ui-chkbox .ui-chkbox-box.ui-state-active {
border: 1px solid var(--nbp-color-cool-gray-30);
}
.ui-chkbox .ui-chkbox-icon.ui-icon-check {
background-image: none;
border: 8px solid var(--nbp-color-cool-gray-30);
}
/* Drucken von Charts -> Größe des Canvas's anpassen, damit es nicht über das PDF hinausragt */
/* Das Canvas muss seine ursprüngliche Aspect-Ratio beibehalten damit es nicht zu Verzerrungen kommt */
.nbp-chartwrapper .nbp-chart {
height: auto !important;
}
.nbp-chartwrapper canvas {
height: auto !important;
width: auto !important;
min-height: auto !important;
max-width: 100%;
}
}
/* ===================================================================================================================
* Aufräumen - Neue Styles bitte hier einfügen
* ===================================================================================================================*/
/* TBO :: Portal-Breite für Editoren */
.width-web-editor textarea,
.width-web-editor .nbp-charcount-output {
width: 670px !important;
}
/* VUL :: Einrückung für untergeordnete Werte in Statistiktabellen */
.nbp-statistik-datatable .nbp-statistik-column .sub-item {
margin-left: 10px;
}
/* MDA :: frozen Layout - Statistiktabellen */
.nbp-statistik-datatable {
overflow: visible;
}
/* MDA :: frozen Layout - Breite fixieren */
.nbp-statistik-datatable .ui-datatable-frozenlayout-left {
min-width: 300px;
max-width: 300px;
}
/* MDA :: frozen Layout - Scrollbar immer anzeigen */
.nbp-statistik-datatable .ui-datatable-frozenlayout-right .ui-datatable-scrollable-body {
overflow-x: scroll;
}
/* MDA :: Strukturordner */
.ui-datatable table .nbp-element-nummerierung {
padding-left: 2em;
}
/* MDA :: Download von Bildern/Dokumenten via outputLink */
.nbp-download-outputlink {
display: inline-block;
border: 1px solid var(--nbp-color-blue-60);
background-color: var(--nbp-color-white);
font-weight: normal;
position: relative;
padding: 0;
text-decoration: none!important;
text-align: center;
overflow: visible;
color: var(--nbp-color-blue-60) !important;
}
.nbp-download-outputlink .ui-icon {
color: var(--nbp-color-blue-60);
}
.nbp-download-outputlink.ui-button-icon-only:hover {
background-color: var(--nbp-color-blue-60);
font-weight: normal;
color: var(--nbp-color-white);
}
.nbp-download-outputlink.ui-button-icon-only:hover .ui-icon {
color: var(--nbp-color-white);
}
/* MDA : Service > Kontaktgrid */
.nbp-kontakt-grid .ui-datalist-data {
list-style: none;
padding: 0;
margin: 0 0 15px;
border: 1px solid var(--nbp-color-cool-gray-15);
}
.nbp-kontakt-grid .ui-datalist-item {
padding: 10px;
}
.nbp-kontakt-grid .ui-datalist-item:nth-child(odd) {
background-color: var(--nbp-color-cool-gray-5);
}
/* REFACTORING FACHADMINISTRATION */
.nbp-duplizieren-grid .ui-datagrid-column {
padding: 0;
}