/*----------------*/
/* Seitenstruktur */
/*----------------*/

/* Tablets */
@media only screen and (max-width: 985px) {
  /* Checkboxen etwas groesser bei kleinen Geraeten. */
  input[type=checkbox] {
    -ms-transform: scale(1.5); /* IE */
    -moz-transform: scale(1.5); /* FF */
    -webkit-transform: scale(1.5); /* Safari and Chrome */
    -o-transform: scale(1.5); /* Opera */
    transform: scale(1.5); /* Alle neuen Browserversionen */
  }

  .ui-datatable .ui-paginator {
    text-align: left;
  }
}

.resultTable {
  padding: 0px 4px 4px 4px;
}

.report-page {
  border-color: inherit;
  border-style: none;
  border-width: 1px;
  padding: 4px 10px 8px 10px;
}

.report-page .ui-panelgrid {
  width: 100%;
}

.report-page .first-table-column {
  padding-left: 0;
  padding-right: 5px;
}

.report-page .last-table-column {
  padding-left: 5px;
  padding-right: 0;
}

.report-page .no-header {
  padding-top: 20px;
}

.report-page .ui-panelgrid .ui-panelgrid-cell {
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0;
  padding-bottom: 0;
}

.report-page .ui-panelgrid-cell {
  width: 50%;
}

.report-page label {
  display: inline-block;
  font-weight: bold;
  vertical-align: top;
  padding: 15px 0px 5px 0px;
}

.objekt-seite .resultTable {
  padding: 12px;
}

.objekt-seite .resultTable {
  background-color: #B2DDE1;
}

.objekt-seite .objekt-content {
  background-color: #E5F3F5;
  padding: 10px;
}

.objekt-seite .objekt-paragraph {
  padding-top: 15px;
  font-size: 11px;
}

.objekt-seite .objekt-title {
  font-weight: bold;
  font-size: 12px;
  padding-left: 7px;
}

.objekt-seite .objekt-trenner {
  border-color: #B2DDE1;
}

/*-----------------*/
/* Tabellenlayout. */
/*-----------------*/
.ui-datatable .ui-widget-content {
  border-width: 0;
}

.ui-datatable table {
  table-layout: auto !important;
  overflow: auto;
}

/**
 * Tabellen-Kopf
 */
.uebersichts-seite .ui-datatable thead .ui-state-default.column {
  /* Standard Zeilenhoehe */
  height: 28px;
  /*
   * Hintergrundfarbe als Bild. Das Bild enthaelt die graue Standard-Farbe, den weissen
   * Abstand, den Schatten, die oberen runden Ecken und die etwas dunklere HOVER-Farbe.
   * Ecken und HOVER-Farbe werden durch ?nderung von background-position realisiert.
   */
  background: url("/vitportal/jakarta.faces.resource/img/vit/tabellenkopf.png.xhtml") no-repeat scroll center top transparent;
  /* Raender in der Kopfzeile werden ueber die inneren DIV's realisiert. */
  border-width: 0;
  font-weight: bold;
  padding: 0;
  /* Bei leeren Tabellen sollen Spalten, die einen leere Header besitzen (z.B. die Checkbox-Spalte) */
  /* trotzdem eine Breite haben. Insbesondere bei der Checkbox-Spalte wuerde anderfalls die runde linke Ecke */
  /* des Tabellenkopfes nicht vorhanden sein. */
  min-width: 5px;
  /* needed  after primefaces 4.0 update. header in table was displaced. */
  white-space: nowrap !important;
}

.uebersichts-seite .ui-datatable .ui-datatable-scrollable-body thead .ui-state-default.column {
  height: 0px;
}

/* Filter-Buttons */
.uebersichts-seite .filter-button {
  border: 0;
  height: 19px;
  background: none;
  margin-right: 0;
}

.uebersichts-seite .mobil-table .filter-button {
  width: 18px;
}

/* Filter-Icon */
.uebersichts-seite .filter-icon {
  background-image: url("/vitportal/jakarta.faces.resource/img/vit/tabellenkopf_filter_icon.png.xhtml");
}

.uebersichts-seite .filter-icon.active {
  background-image: url("/vitportal/jakarta.faces.resource/img/vit/tabellenkopf_filter_icon_active.png.xhtml");
}

.uebersichts-seite .filter-button.ui-state-hover {
  background-color: #888;
}

/* Bei Hover Icons verdunkeln */
.ui-state-hover .klein-ok, .ui-state-hover .klein-abbrechen {
  background-position: 0 -17px;
}

/* OK- und Abbrechen haben keinen Hintergrund */
.filter-ok, .filter-abbrechen {
  border: 0 !important;
  background: none !important;
}

/* Graues Filter-Panal ohne Rand. */
.filter-panel {
  background: #bababa;
  border-color: #888;
}

/* Nicht aktive Filter werden von Primefaces mit visible=hidden ausgeblendet. */
/* Damit liegen sie aber noch im Elementenfluss und beeinflussen die Hoehe. */
/* Mit display=none nehmen wir sie aus dem Elementenfluss raus. */
.filter-panel.ui-overlay-hidden {
  display: none !important;
}

/* Grids innerhalb eines Filters sollen auch graue Hintergrundfarbe besitzen. */
.filter-panel .ui-widget-content, .filter-panel .ui-widget-header {
  background: #bababa;
}

.filter-panel.range-filter {
  min-height: 100px;
}

.filter-panel.input-filter {
  min-height: 65px;
}

.filter-panel.period-filter {
  width: 220px;
}

.filter-panel.checkbox-filter {
  min-width: 120px;
}

.period-filter .ui-inputfield {
  width: 80px;
}

.checkbox-filter input[type="checkbox"] {
  vertical-align: middle;
}

/* Spaltenueberschrift linksbuendig */
.uebersichts-seite .ui-datatable th {
  text-align: left;
}

/* Spaltenueberschrift erste Spalte mittig */
.uebersichts-seite .ui-datatable th.firstColumn-center-title {
  text-align: center;
}

/* Spaltenueberschrift soll nicht am linken und rechten Rand kleben */
.uebersichts-seite .headerText {
  margin-left: 3px;
  margin-right: 5px;
}

/* Abstand zwischen Spaltenueberschrift und Sortier-Icon */
.uebersichts-seite .ui-sortable-column .headerText {
  margin-right: 0px;
}

/* Abstand zwischen Spaltenueberschrift und Filter-Icon */
.uebersichts-seite .filter-column .headerText {
  margin-left: 0px;
}

/* Runde Ecke links oben */
.uebersichts-seite .ui-datatable thead .ui-state-default.firstColumn {
  background-position: left top;
}

/* Runde Ecke links oben */
.uebersichts-seite .ui-datatable thead .ui-state-default.firstColumn-center-title {
  background-position: left top;
}

/* Runde Ecke rechts oben */
.uebersichts-seite .ui-datatable thead .ui-state-default.lastColumn {
  background-position: right top;
}

/* HOVER - Farbe */
.uebersichts-seite .ui-datatable thead .ui-state-default:HOVER {
  background-position: center -28px;
}

/* Runde Ecke links oben bei HOVER */
.uebersichts-seite .ui-datatable thead .ui-state-default.firstColumn:HOVER {
  background-position: left -28px;
}

/* Runde Ecke rechts oben bei HOVER */
.uebersichts-seite .ui-datatable thead .ui-state-default.lastColumn:HOVER {
  background-position: right -28px;
}

/* Trennstrich */
.uebersichts-seite .ui-datatable thead .column > span:FIRST-CHILD {
  border-style: solid;
  border-left-width: 1px;
  border-right-width: 0;
  border-top-width: 0;
  border-bottom-width: 0;
  /* Trennstrich zwischen den Eintraegen im Tabellenkopf */
  border-left-color: #989898;
}

/* kein Trennstrich bei erster Spalte */
.uebersichts-seite .ui-datatable thead .column.firstColumn > span:FIRST-CHILD {
  border-left-width: 0px;
}

.uebersichts-seite .ui-datatable thead .column.firstColumn-center-title > span:FIRST-CHILD {
  border-left-width: 0px;
}

/**
 * Tabellen-Body
 */
.uebersichts-seite .ui-datatable-even {
  /* Hintergrungfarbe dunkel */
  background: none repeat scroll 0 0 #B2DDE1;
  /* Standard Zeilenhoehe */
  height: 28px;
}

.uebersichts-seite .ui-datatable-odd {
  /* Hintergrungfarbe hell */
  background: none repeat scroll 0 0 #E6F4F5;
  /* Standard Zeilenhoehe */
  height: 28px;
}

/* HOVER - Farbe */
.uebersichts-seite .ui-datatable-even:hover, .uebersichts-seite .ui-datatable-odd:hover,
.objekt-seite .ui-datatable-even.ui-datatable-selectable:hover,
.objekt-seite .ui-datatable-odd.ui-datatable-selectable:hover {
  background: none repeat scroll 0 0 #99CCCC !important;
}

/* Tabelle hat keine Raender */
.ui-datatable-data .column {
  border-width: 0 !important;
  word-break: keep-all;
  white-space: nowrap;
}

/* Fuer rechtsbuendige Spalten */
.ui-datatable .rightAligned {
  text-align: right;
}

/* Fuer linksbuendige Spalten */
.ui-datatable .leftAligned {
  text-align: left;
}

/* Fuer Fettschrift  */
.ui-datatable .bold {
  font-weight: bold;
}

.ui-datatable .fixed-width-title {
  width: 44%;
}

.ui-datatable .fixed-width {
  width: 7%;
}

/* Kein Unterstrich fuer Links in der Tabelle */
.column a {
  text-decoration: none;
}

/* Tabellen-Zeilen auf Objekt-Seite abwechelnd tuerkis und weiss. */
.objekt-seite .ui-datatable-even {
  background: #fff !important;
}

/* Tabellenkopf auf Objekt-Seite */
.objekt-seite .ui-datatable thead .column {
  background: none;
  border-width: 0;
  font-weight: bold;
  text-align: left;
  white-space: nowrap !important;
}

/*-------------------*/
/* Sonstige Elemente */
/*-------------------*/

/* Basislayout Menue-Button */
/* Der Menue-Button ist absolut positioniert, damit die aufgeklappten Menue-Items */
/* die Tabelle ueberdecken. */
.menu-button {
  width: 210px !important;
  background-color: #e8e8e8;
  z-index: 1; /* Menue soll ueber Filter-Button liegen. */
  height: 31px;
}

/* Nach dem Umbau der Tabellen auf scrollable wurde das Auswahlmenue (Erfassungen)
   von dem Tabellen header uberlagert, deshalb ist an dieser Stelle z-index = 1 notwendig  */
.menu-button .ui-panelmenu-panel {
  position: absolute;
  z-index: 1;
  background-color: #e8e8e8;
  width: 220px;
}

.result-controls .vertical-align-normal .ui-button {
  height: 31px;
}

.result-controls .ui-selectonemenu.reload-width {
  width: 100px !important;
}

/* Weissen jquery-Theme-Hintergrund fuer den Menue-Button ausschalten */
.menu-button .ui-widget-content {
  background: none;
}

/* FacesMessages - div in der stalllisteStammdaten.xhtml */
.messages {
  width: 800px;
}

.ui-button.button-drucken {
  border-color: #bababa;
  height: 31px;
}

/* Druck Button PDF. */
/* Weite wird angepasst, damit der Button quadratisch ist. */
.result-controls .ui-button.button-drucken {
  width: 31px;
}

.result-controls .ui-button.button-drucken-zuchtwerte {
  width: 57px;
}

.button-drucken .icon-drucken, .button-drucken-zuchtwerte .icon-drucken {
  background-image: url("/vitportal/jakarta.faces.resource/img/vit/icon_drucken.png.xhtml");
}

.result-controls .ui-button {
  display: block;
  border-color: #bababa;
  margin-right: 0;
}

.dialogpage-control-root {
  padding: 20px 15px 25px 0;
  text-align: right;
}

.dialogpage-text-root {
  padding: 15px;
}

.reload-button {
  width: 124px;
  height: 25px
}

.result-controls .menu-button .ui-panelmenu-header {
  border-color: #bababa;
}

/*
 * OK-Button-Icon klein.
 * Das Bild enthaelt (vertikal) 4 Teilbilder im Abstand von 17px mit verschiedenen Grautoenen (z.B. fuer hover).
 *
 * todo: ggf. in sowas wie genaral.css auslagern
 */
.klein-ok {
  background-image: url("/vitportal/jakarta.faces.resource/img/vit/button_klein_ok.png.xhtml") !important;
}

/*
 * Abbrechen-Button-Icon klein.
 * Das Bild enthaelt (vertikal) 4 Teilbilder im Abstand von 17px mit verschiedenen Grautoenen (z.B. fuer hover).
 *
 * todo: ggf. in sowas wie genaral.css auslagern
 */
.klein-abbrechen {
  background-image: url("/vitportal/jakarta.faces.resource/img/vit/button_klein_abbrechen.png.xhtml") !important;
}

.ui-panelgrid.panelGrid td {
  padding: 0 10px;
}

/* Farblich Hervorhebung einer dataTable-Zelle rot. */
/* Es muss dazu im im p:column - tag die styleclass 'rot' angegeben werden. */
.ui-datatable-data .red {
  background: none repeat scroll 0 0 rgb(255, 153, 153);
  background: none repeat scroll 0 0 rgba(255, 153, 153, 0.7);
}

/* Farblich Hervorhebung einer dataTable-Zelle blau. */
/* Es muss dazu im im p:column - tag die styleclass 'blue' angegeben werden. */
.ui-datatable-data .blue {
  background: none repeat scroll 0 0 rgb(153, 153, 255);
  background: none repeat scroll 0 0 rgba(153, 153, 255, 0.7);
}

/* Farblich Hervorhebung einer dataTable-Zelle orange. */
/* Es muss dazu im im p:column - tag die styleclass 'orange' angegeben werden. */
.ui-datatable-data .orange {
  background: none repeat scroll 0 0 rgb(220, 188, 153);
  background: none repeat scroll 0 0 rgba(220, 188, 153, 0.7);
}

/* Farblich Hervorhebung eines DataTable-Textes orange. */
/* Es muss dazu im im p:column - tag die styleclass 'orangefont' angegeben werden. */
.ui-datatable-data .orangefont {
  color: #ba8700;
}

.ui-datatable-data .new-area {
  border-left: 2px solid #FFFFFF !important;
}

.ui-datatable-data .new-area-after {
  border-right: 2px solid #FFFFFF !important;
}

.ui-datatable-data .line-through {
  text-decoration: line-through;
}

/* Farbliche Hervorhebung der Spalte nach der sortiert ist */
.uebersichts-seite .ui-datatable thead .ui-state-active {
  background-position: center -28px !important;
}

.title-icon.ui-grid-col-6, .title-info.ui-grid-col-6 {
  width: auto;
}

.ui-datatable-scrollable .ui-datatable-empty-message td {
  border-width: 0;
}

/* Entfernen der horizontalen Scrollbalken in den Tabellen der Eutergesundheit-Accordiontabs
   und auf der Tiersuche  */
#zellzahlentwicklung-accordion .overflow-hidden .ui-datatable-tablewrapper,
.tiersuche-form-class .overflow-hidden .ui-datatable-tablewrapper {
  overflow: hidden;
}

/* --- MOBILE SONDERSEITEN --- */
.mobil-table thead {
  background-color: #e8e8e8;
}

.mobil-table tbody tr:nth-child(even) {
  background: #e6f4f5;
}

.mobil-table tbody tr:nth-child(odd) {
  background: #b2dde1;
}

.mobil-table tbody tr:hover {
  background: #99cccc;
  cursor: pointer;
}

.mobil-table {
  border-spacing: 0;
}

.mobil-table tr {
  height: 30px;
}

/* Spalten-Ueberschrift auch linksbündig. */
.mobil-table th {
  text-align: left;
}

.link-column {
  text-decoration: underline;
  cursor: pointer;
}

.ui-datatable .table-checkbox {
  -ms-transform: scale(1.5); /* IE */
  -webkit-transform: scale(1.5); /* Chrome, Safari, Opera */
  -moz-transform: scale(1.5); /* FF */
  -o-transform: scale(1.5); /* Opera */
  transform: scale(1.5); /* Alle neuen Browserversionen */
}

/* Vertikal mittige Checkbox im Table-Header */
.ui-datatable thead .table-checkbox {
  margin-top: 3px;
}

/* Vertikal mittige Checkboxen im Table-Body */
.ui-datatable .ui-datatable-data .firstColumn {
  padding-top: 5px;
  padding-bottom: 3px;
}

#senseKopplungZuordnungTableId .ui-column-filter.ui-inputfield {
  margin: -11px;
  padding: 3px;
  position: relative;
  top: -10px;
  left: 100px;
}

#senseKopplungZuordnungTableId .filter-column {
  min-width: 215px;
}

#alSenseGesundTiereTableId .schwelle_rot {
  background: none repeat scroll 0 0 rgba(255, 153, 153, 0.7);
}

#alSenseGesundTiereTableId .schwelle_gelb {
  background: none repeat scroll 0 0 rgba(255, 255, 153, 0.7);
}