.ui-icon-male:after{
    background-image:url("/szonline/javax.faces.resource/male.svg.xhtml?ln=images");
}

.ui-icon-female:after {
    background-image:url("/szonline/javax.faces.resource/female.svg.xhtml?ln=images");
}

.ui-icon-malefemale:after {
    background-image:url("/szonline/javax.faces.resource/malefemale.svg.xhtml?ln=images");
}

.ui-icon-pd-arrow-l:after {
    background-image:url("/szonline/javax.faces.resource/pd-arrow-l.svg.xhtml?ln=images");
}
.ui-icon-pd-arrow-r:after {
    background-image:url("/szonline/javax.faces.resource/pd-arrow-r.svg.xhtml?ln=images");
}
.ui-icon-pd-arrow-l-end:after {
    background-image:url("/szonline/javax.faces.resource/pd-arrow-l-end.svg.xhtml?ln=images");
}
.ui-icon-pd-arrow-r-end:after {
    background-image:url("/szonline/javax.faces.resource/pd-arrow-r-end.svg.xhtml?ln=images");
}

.ui-icon-pd-download:after{
    background-image:url("/szonline/javax.faces.resource/pd-download.svg.xhtml?ln=images");
}

.pd-icon-sort-unsorted:after {
    background-image:url("/szonline/javax.faces.resource/pd-sort-unsorted.svg.xhtml?ln=images");
}

.pd-icon-sort-up:after {
    background-image:url("/szonline/javax.faces.resource/pd-sort-up.svg.xhtml?ln=images");
}

.pd-icon-sort-down:after {
    background-image:url("/szonline/javax.faces.resource/pd-sort-down.svg.xhtml?ln=images");
}

/* icon for plausi-check */
.ui-icon-okay:after {
    background-image:url("/szonline/javax.faces.resource/pd-icon-okay.svg.xhtml?ln=images");
}
.pd-icon-cross:after {
    background-image:url("/szonline/javax.faces.resource/pd-icon-cross.svg.xhtml?ln=images");
}
.pd-icon-questionmark:after {
    background-image:url("/szonline/javax.faces.resource/pd-icon-questionmark.svg.xhtml?ln=images");
}

.pd-plausicheck tr td {
    padding:1em;
}



.pd-table-columntoggle-btn-disable {
    display: none !important;
}

.pd-accordion-menu {  /* damit das AccordionMenu die Gesamtbreite des Panels ausfüllt */
    position: relative;
    margin-left:-1em;
    margin-right:-1em;
    padding:0em;
    margin-top: 1em;
    margin-bottom: 1em;
}

.pd-accordion-menu p {
    display:none;             /* damit <p></p> am Anfang und Ende des Inhaltes eines Accordion-Tabs verschwindet */
}

/* Untermenupunkt */
.pd-accordion-menu.pd-menuentry li>a {
   padding-left: 2.5em;       /* momentaner workaround: Untermenüpunkte einrücken */
}

.pd-responsiveTable td {/* damit Button und Text vertikal ausgerichtet sind */
    vertical-align: middle !important;
}

.pd-table-optionline div.ui-field-contain {      /* Tabellenoptionen-Zeile (Buttons + RowsperPage */
    margin: 0em;
}

.pd-listbox + div.ui-select { width:12.5em; }  /* erfasst die Listbox, wenn das Label der Listbox pd-listbox Class besitzt */
.pd-listbox-small + div.ui-select { width:6.25em; }  /* erfasst die Listbox, wenn das Label der Listbox pd-listbox Class besitzt */

.pd-sort-btn { width: 15em !important; }

/* Pagination Table */
table.pd-tablestyle th, table.pd-tablestyle td {
    border: 2px solid black;
}

table.pd-tablestyle th {
    border-top: 0px;
}

table.pd-tablestyle tr td:first-child, table.pd-tablestyle tr th:first-child {
    border-left: 0px;

}

table.pd-tablestyle tr td:last-child, table.pd-tablestyle tr th:last-child {
    border-right:0px;
}

table.pd-tablestyle tr.ui-datatable-even { background-color: #eeeeee; }  /* gerade Zeilen in der Tabelle */
table.pd-tablestyle tr.ui-datatable-odd  { background-color: #fafafa; }  /* ungerade Zeilen in der Tabelle */

/* ----- */

/* Breakpoints for Responsive Table (jQuery Table Column Toggle) */



/* Manually hidden */
.ui-table-columntoggle.ui-responsive th.ui-table-cell-hidden,
.ui-table-columntoggle.ui-responsive td.ui-table-cell-hidden {
    display: none;
}

/* Manually shown */
.ui-table-columntoggle.ui-responsive th.ui-table-cell-visible,
.ui-table-columntoggle.ui-responsive td.ui-table-cell-visible {
    display: table-cell;
}

.pd-inputtextwithoutclear a {
    display: none;
}

.pd-input-uppercase > input {
    text-transform: uppercase;
}

.pd-width100 {
    width: 100%;
}

.pd-tierliste-table {
    width: 100%;
}

/* pd-combined-fields */
.pd-combined-fields {
    overflow: visible;       /* Damit der Box Shadow angezeigt wird */
    display: table;         /* Damit es beim Umbruch bei kleinen Fensterbreiten richtig angezeigt wird aber nur bei 2 InputFields...*/
}

.pd-combined-fields [class*="ui-"] {
    margin: 0;
}

/* ----- */


/* pd-dateTimeCalendar */
.pd-datetime-picker {
    width: 15em !important;
}

.pd-datetime-picker .ui-block-a .ui-calendar,
.pd-datetime-picker .ui-block-a .ui-input-text {
    margin-right: 0.25em;
}

.pd-datetime-picker .ui-block-b .ui-input-text {
    margin-left: 0.25em;
}

/* ------ */

/* pd-inputtext-plus-button ==> Inputfield und daneben ein Button */
.pd-inputtext-plus-button {
    /*width: 15em !important;*/
}

.pd-inputtext-plus-button .ui-block-a {
    width: auto;
    float: right;
    margin-left:0.3125em;
}

.pd-inputtext-plus-button .ui-block-b {
    float:none;
    overflow:auto!important;
    width:auto;
}

.pd-inputtext-plus-button .ui-block-a .ui-btn {
    height: 37px;
    padding-top: 0;
    padding-bottom: 0;
    margin-left:0;
}

.pd-combined-fields.pd-inputtext-plus-button {
    display:block;
}

.pd-button-group .ui-btn:first-child {
    margin-right:0.75em!important;
}



/* ----- */


/* TESTS */
.pd-tierliste-additionalinfo {
    display: none;
    visibility: collapse;
}

@media screen and (min-width: 46em) {
    .pd-tierliste-additionalinfo {
        display: table-cell;
        visibility: visible;
    }

    .pd-tierliste-table tr td:first-child {
        width:28em;
    }
}

.pd-tierliste-panel {
    min-width: 20em;
    max-width: 56.25em;
    width: 100%;
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: auto;
}


@media screen and (min-width: 56.25em) {
    .pd-tierliste-panel {
      /*  width: 900px;*/
    }
}


.pd-tableptions .ui-block-b * {
    margin-left:auto;
    margin-right:0;
}

.pd-tableoptions .ui-block-c * {
    margin-right:0;
    float: right;
}

.pd-paginationDropdown {
    min-width: 15.625em;
}

.pd-usershortinfo td {
    vertical-align: top;
}

/* Menu Farben */


/* ---------------------- */
/* "nur im Desktop-Modus" */
/* ---------------------- */

/* Arbeitskreis deaktivieren, wenn Breite weniger als 1024px */
@media screen and (max-width: 600px) { /* wichtig 1023! */
    .pd-MenuColors>div:nth-child(5) {
        display: none;
    }
}

/* Folgendes evtl. für Drucken Button usw...? */
@media screen and (max-width: 600px) {
    .pd-desktopmode {
        display: none;
    }
}


/* ---------------------- */

.pd-no-margin {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Abgrenzungslinie zwischen Maincontent und Header */
.ui-content[role="main"] {
    border-top: 1px solid #000000;
}

.pd-filter-sort-no-margin {
    position: relative;
    margin-left: -1em;
    margin-right: -1em;
    margin-top: 0em;
    padding: 0em;
}

.pd-filter-sort-content-margin {
    margin-left:0.8em;
    margin-right: 0.8em;
}

.pd-currentpage-inputfield {
    width:3em;
}

.pd-currentpage-inputfield input {
    text-align: right !important;
}

.pd-right-align {
    text-align: right !important;
}

.pd-datepickerbutton {
    display:inline-block;
}

/* Validation Error */
/* Are Available now in Primefaces Mobile
.ui-message-error-detail {
    background-color: #f2dede;
    border-color: #eed3d7;
    color: #b94a48;
    margin: 0 5px;
    padding: 2px 5px;

    border-radius: 3px;
    display: block;
}

.ui-messages-error {
    background-color: #f2dede;
    border-color: #eed3d7;
    color: #b94a48;
    margin: 0 5px;
    padding: 2px 5px;

    border-radius: 3px;
    display: block;
}

*/

/* Table fixed deaktivieren, damit der Text nicht über den Spaltenrand geschrieben wird... */
.ui-table {
    table-layout: auto !important;
}

/* Centering-Class */
.pd-centered {
    margin-left: auto;
    margin-right: auto;
}

.pd-awesomebutton {
    width: 2.8em !important; /* TESTWEISE */
    margin-right: 0em !important;  /* TESTWEISE */
    height: 2.8em;      /* found empirically .... */
}

button.pd-awesomebutton.pd-notext > span.fa {
    position:initial;
    left:-1px!important;
    top: -2px;
    font-size:1em;
}

.ui-paginator button.pd-awesomebutton.pd-notext > span.fa {
    left: 1px !important
}

.pd-awesomebtnwidth {
    width: 4em !important;
}

.pd-width-smallnumber {
    width: 2em !important;
}

.pd-buttonmenu {
    width: 16em;
}

.pd-listbox-width12 + div.ui-select {   /* erfasst die Listbox, wenn das Label der Listbox pd-listbox Class besitzt */
    width: 12em !important;
}

/* TESTS*/
.pd-newdatatable table {
    table-layout: auto;
}

.pd-newdatatable table td {/* damit Button und Text vertikal ausgerichtet sind */
    vertical-align: middle !important;
}

.pd-newdatatable .ui-paginator {
    background-color: #dcdcdc;
    height:2.8em;
}

.pd-smalltableheight {
    position: relative;
    top: -0.64em;
}

.pd-newdatatable .ui-paginator .pd-awesomebutton {
    height:2.5em;
    padding-top:0.6em;
    width:3.0em !important;
}

/* Spaltenbreiten TODO: schöner wäre es, wenn man die colClasses setzt, dann wäre sicherlich important nicht notwendig*/
.pd-width-date {
    width: 6em !important;
}

.pd-width-ohrmarke {
    width: 13em !important;
}

.pd-width-number {
    width: 4em !important;
}

.pd-width-checkbox {
    width: 4em !important;
}

.pd-width-1-letter {
    width: 2em !important;
}

.pd-width-2-letter {
    width: 4em !important;
}

.pd-minwidth-5em {
    min-width: 5em;
}

/* Mauszeiger auf "Pointer" setzen, wenn man über einer Zeile ist... */
.pd-newdatatable table.pd-tablestyle.pd-cursorpointer tbody tr {
    cursor: pointer;
}


/* Ausrichtung "refresh"-Button: vertikal zentriert bei pm:field auf input field*/
.pd-daterange-vcentered {
    position: relative;
    top: 1.15em;                /* TODO: empirisch gefunden */
}

@media (min-width: 28em) {
    .pd-daterange-vcentered {
        position:relative;
        top:0em;
    }
}


.pd-green-font {
    color: #00cf00;
}

.pd-red-font {
    color: #cf0000;
}

.pd-yellow-font {
    color: #fafa00}

.pd-bold-font {
    font-weight: bold;
}




.pd-subheader.ui-header {
    display:none;
}

.pd-subheader-show {
    display:inherit !important;
}

/* AK Typ in Header von AK-Übersicht */
h2>em {
    font-size: 0.625em !important;
    font-weight: normal;
    padding-left: 1em;
}


/* BUG FIXES: */

/* PM-Calendar ist in falschem z-index; gesetzt wird er auf 1, aber muss auf 2 sein  */
.ui-datepicker.ui-widget.ui-widget-content {
    z-index: 2 !important;
}


/* p:selectbooleancheckbox hat ebenfalls fixen z-index von 2 (sowohl Label als auch HTML Komponente) => Probleme mit Kalender */
div.ui-checkbox label {
    z-index: 0 !important;
}

div.ui-checkbox input {
    z-index: -1 !important;
}

/* ENDE BUGFIXES */


/* Ahnentafel */
table.pd-ahnentafel {
    border-collapse: collapse;
    empty-cells: show;
    table-layout: fixed;
    width:100%;
}

.pd-separator {
    border-bottom: solid 1px #000000;
}


/*
    Einstellung für Tabellenzeilen
*/

.pd-newdatatable tbody tr {
    height: 3.4375em; /* 55px */
}

.pd-newdatatable div.pd-selectbooleancheckbox {
    width: 2.625em;
    margin-top: 0;
    margin-bottom: 0;
}

.pd-newdatatable button.pd-awesomebutton {
    width: 2.625em;  /* wird momentan ignoriert, da es !important benötigen würde, aber Breite ist okay */
    height: 2.5em;
    padding-top: 9px;
    padding-bottom: 13px;
    margin-top: 0;
    margin-bottom: 0;
}

.pd-newdatatable div.ui-input-text {
    margin-top: 1px;
    margin-bottom: 2px;
}

.pd-newdatatable button.ui-btn {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 10px;
    padding-bottom: 9px;
}

/* ------ */
/* Tiermodul */

.pd-dropdownmenu {
    width: 18em;
    margin-left: auto;
    margin-right: auto;
}


.pd-tiernavigationwrapper {
    margin-left: auto;
    margin-right: auto;
    width: 18em;                    /* wie .pd-dropdownmenu */
    top: -1.25em;
    position:relative;
}

.pd-tiernavigationbuttonstop {
    display:none
}


@media screen and (min-width: 26em) {
    .pd-tiernavigationbuttonstop {
        display:inline-block;
    }

    .pd-tiernavigationwrapper {
        width: 23em;
    }
}


/* ----- */

.pd-additionalmenu-right {
    position: absolute;
    right: 0;
    top: 47px;
    width: 12.5em;
}

/* Logos */

.pd-szonline-logo.pd-logo-big {
    width:100%;
}

.pd-welcome-box h1 {
    font-size: 1.5em;
}

@media screen and (min-width: 28em) {
    .pd-szonline-logo.pd-logo-big {
        width:240px;
    }

    .pd-welcome-box h1 {
        font-size: 2em;
    }
}


.pd-margin-bottom {
    margin-bottom: 2em;
}

.pd-szonline-logo.pd-logo-login {
    width:75px;
    float:right;
    margin-top :2px;
    top: -8px;
    position: relative;
}

.pd-login-panel {
    width: 20em;
    margin-left:auto;
    margin-right:auto;
}

.pd-login-panel > .ui-panel-m-titlebar.ui-bar h3 {
    display:inline;
    top:1em;
    position:relative;
}

.pd-szonline-logo {
    width:120px;
}

.pd-left {
    margin-left:0;
    margin-right:auto;
}
.pd-right {
    margin-left:auto;
    margin-right:0;
}
.pd-center {
    margin-left:auto;
    margin-right:auto;
}



/* selectOneMenuEditable  */

.pd-selectonemenueditable.ui-grid-a .ui-block-a {
    min-width: 12em;
}

.pd-selectonemenueditable.ui-grid-a .ui-block-b {
    width:1em;
    position:relative;
    top:3px
}

.pd-ohrmarkenauswahl .ui-block-a {
    width: 7em;
}
.pd-ohrmarkenauswahl .ui-block-a .ui-select {
    top:-0.25em;
    left:-5px;
}

.pd-ohrmarkenauswahl .ui-block-b {
    width: 14em;
}

.pd-ohrmarkenauswahl .ui-block-c {
    width:1em;
    position:relative;
    top:3px
}


/* --- */


/* FOR PMGRAFIK FINALLY NEEDS TO BE COPIED TO CORRESPONDING CSS */
div.jqplot-point-label {
    font-size: 1.1em;
}


/* Bei Harnstoff die Zahlen der Klasse größer */

div.jqplot-point-label.jqplot-point-1, div.jqplot-point-label.jqplot-point-4, div.jqplot-point-label.jqplot-point-7,
div.jqplot-point-label.jqplot-point-10, div.jqplot-point-label.jqplot-point-13, div.jqplot-point-label.jqplot-point-16,
div.jqplot-point-label.jqplot-point-19, div.jqplot-point-label.jqplot-point-22, div.jqplot-point-label.jqplot-point-25 {
    font-size: 1.5em;
}


/* Error Page */
label.error-msg {
    font-weight: bold;
}

.error-stacktrace div.ui-block-a {
    width:10em;
}

.error-stacktrace div.ui-block-b {
    min-width:20em;
}

/* AJAX LOADER */
        /* JETZT FÜLLT ES DEN GESAMTEN BILDSCHIRM, DAMIT MAN NICHT WÄHREND EINES LAUFENDEN AJAX-REQUESTS IRGENDWELCHE ACTIONS AUSLÖSEN KANN */
.ui-loader .ui-icon-loading {
    left:50%;
    top:50%;
    position:relative;
    margin-left: -1.4375em;
    margin-top: -1.4375em;
}

.ui-loader-default {
    background: #aaaaaa none repeat scroll 0 0;
    margin:0;
    opacity:0.5;
    width:100%;
    height:100%;
}

.ui-loader {
    left:0;
    top:0;
}

/* Required Indicator */
.ui-outputlabel-rfi {
    color:#ff0000;
    font-size: 0.75em;          /* TESTS, VIELE SEITEN SAGEN, DASS MAN MIT SUEPRSCRIPT AUFPASSEN SOLLE */
    line-height: 1;
    vertical-align: top;
}
/* ------ */

/* SELECT ONE MENU BUTTON BUG (Pfeil nach unten hat die Liste nicht geöffnet) */
.ui-select .ui-btn select {
    z-index: 2 !important;          /* ORIGINAL: OHNE IMPORTANT */
}

/* Datalist has margin left and right which should not be there */
.ui-popup > .ui-content .ui-datalist .ui-listview {
    margin:0;
}
/* --- */


/* VERTIKALE AUSRICHTUNG */
.ui-field-contain .ui-calendar.ui-calendar-popup > .ui-input-text {
    margin: 0;
}
/*
.ui-field-contain .ui-outputlabel (wenn danach ein .ui-select kommt) {
    margin-top:0.75em;
}
*/
/* TODO: DIE NÄCHSTEN ZWEI KÖNNEN VIELLEICHT OBEN BEI DER DEFINITION VON SELECTONEMENUEDITABLE DABEI!! */
.ui-field-contain .pd-selectonemenueditable .ui-block-a .ui-input-text {
    margin:0;
}

.ui-field-contain .pd-selectonemenueditable .ui-block-b .ui-btn {
    margin-top:0;
    margin-bottom:0;
}

/* --- */
/* Button neben Inputfield */
.pd-inputfield-with-button td:first-child {
    width:100%
}

.pd-inputfield-with-button td {
    left:-3px;
    position:relative;
}
.pd-inputfield-with-button .ui-input-text, .pd-inputfield-with-button .ui-btn {
    margin-top:0;
    margin-bottom:0;
}

/* ------- */

/* Willkommensnachricht */
.pd-welcome-box {
    width:60%;
}

/* TESTDATENBANK */
/*
.ui-page>.ui-header {
    background-color: #dd0000!important;
}

.ui-page>.ui-header>.ui-title {
    text-shadow: none;
}
*/

/* MENU FARBEN TEST */

/* Mein Betrieb */
.pd-accordion-menu .pd-menu-betrieb>a {
    background-color: #f7cf53 !important;
}

.pd-accordion-menu .pd-menu-betrieb>a:hover {
    background-color: #f5c737 !important;
}

/* Betrieb Untermenu */
.pd-accordion-menu .pd-submenu-betrieb li>a {
    background-color: #f9df8d !important;
}

.pd-accordion-menu .pd-submenu-betrieb li>a:hover {
    background-color: #f9d76f !important;
}

/* ----- */

/* Vermarktung */
.pd-accordion-menu .pd-menu-vermarktung>a {
    background-color: #dee169 !important;
}

.pd-accordion-menu .pd-menu-vermarktung>a:hover {
    background-color: #d8dc50 !important;
}

/* Vermarktung Untermenu */
.pd-accordion-menu .pd-submenu-vermarktung li>a {
    background-color: #e9eb9b !important;
}

.pd-accordion-menu .pd-submenu-vermarktung li>a:hover {
    background-color: #e3e682 !important;
}

/* ------ */


/* Statistik */
.pd-accordion-menu .pd-menu-statistik>a {
    background-color: #68b8e2 !important;
}

.pd-accordion-menu .pd-menu-statistik>a:hover {
    background-color: #4eacde !important;
}

/* Statistik Untermenu */
.pd-accordion-menu .pd-submenu-statistik li>a {
    background-color: #9ad0ec !important;
}

.pd-accordion-menu .pd-submenu-statistik li>a:hover {
    background-color: #81c4e7 !important;
}
/* ------ */


/* Verwandschaftskontrolle */
.pd-accordion-menu .pd-menu-verwandtschaft>a {
    background-color: #b991ae !important;
}

.pd-accordion-menu .pd-menu-verwandtschaft>a:hover {
    background-color: #ae7ea1 !important;
}

/* Verwandschaftskontrolle Untermenu */
.pd-accordion-menu .pd-submenu-verwandtschaft li>a {
    background-color: #d1b5c9 !important;
}

.pd-accordion-menu .pd-submenu-verwandtschaft li>a:hover {
    background-color: #c5a3bc !important;
}
/* ------ */


/* Arbeitskreis */
.pd-accordion-menu .pd-menu-ak>a {
    background-color: #e6647c !important;
}

.pd-accordion-menu .pd-menu-ak>a:hover {
    background-color: #e24a66 !important;
}

/* Arbeitskreis Untermenu */
.pd-accordion-menu .pd-submenu-ak li>a {
    background-color: #ef97a7 !important;
}

.pd-accordion-menu .pd-submenu-ak li>a:hover {
    background-color: #ea7e92 !important;
}

/* ----- */

/* Meldungen */

.pd-menu-meldungen a {
    background-color: #bbbbbb !important;
}

.pd-menu-meldungen a:hover {
    background-color: #d0d0d0 !important;
}

/* ---- */



/* Menubuttons unterhalb der Module-Menus (Einstellungen und Abmelden) */
.pd-menu-bottom a {
    background-color: #bbbbbb !important;
}

.pd-menu-bottom a:hover {
    background-color: #d0d0d0 !important;
}

/* Allgemein Inputtext mit readonly ==> anchor display none... Otherwise Value can be deleted (is not sent back to server, but displayed */
.ui-input-text > input[readonly] + a {
    display:none;
}

/* ---- */


/* Reparatur Awesome Buttons */

[class^="fa-"]::after,
[class^="fa-"]::before {
    font-family: FontAwesome;
    font-size: 1.1em;
    font-weight: normal;
    line-height: 20px;
    left:1em;
    position:absolute;
}


.ui-btn.fa.pd-notext {
    padding: 0;
    box-sizing: content-box;
    width: 1.75em;
    height:1.75em;
    white-space: nowrap !important;
}
.fa {
    display: block;
}

/* ---- */

/* UI-LOADER inkl. Hintergrund wird neuerdings in die Mitte geschoben ?!?! */
.ui-loader {
    top:0 !important;
}
/* --- */