.xdebug-var-dump {
    background: #fff;
}
.highlight {
    background: #00ff00;
}
.highlight-1 {
    background: #f00;
}
.active {
    background-color: #A6463C;
}
.aktive-zeile {
    background-color: #99ff99;
}
.hinweis {
    color: #0000ff;
}
#datentabelle tbody tr:hover {
    background-color: #FFEFD8;
}
.datentabelle tbody tr:hover {
    background-color: #FFEFD8;
}
div.cl-both {
    clear: both;
    height: .1px;
    font-size: 0;
    line-height: 0;
}
#ueber {
  font-family: Verdana, Arial, Helvetica;
  font-size: 18px;
}
div.uebersetzung {
    border: 1px solid;
    margin-bottom: 10px;
    padding: 0px 10px 0px 10px;
}
div.uebersetzung .deutsch {
    background-color: #C7D7E8;
    padding: 10px;
}
/*
 * Sonstige Klassen, die an mehreren Stellen verwendet werden.
 */
.zuletzt_geklickt > td {
    border-top: 3px solid #ff0000;
    border-bottom: 3px solid #ff0000;
}
.job_ready > td, .pickingDone, .orderDone, .successHighlight {
    background: #99ff99;
}
.noWrap {
    white-space: nowrap;
}
td.rightAligned {
    text-align: right;
}
/* Text under an input field in a table cell */
td .tableFieldSubRow {
    margin-top: 0.8em;
}
.clearFloat {
    clear:both;
}

/* Border and legend should not be shown in print views (TAF-580) */
fieldset.printView { border: 0 !important; }
fieldset.printView legend { display: none; }

/* Set bigger char size in print view */
.printView, .printView td, .printView th { font-size: 16px; }

/**
 * Tabellen fuer Auftragsplanung
 */
.tabelle_fuer_auftragsplanung th {
    font-size: 12px;
    padding: 2px;
}
.tabelle_fuer_auftragsplanung td {
    padding: 2px;
}
/**
 * Tabelle fuer Druckansichten
 */
table.druckansicht td {
    font-size: 25px;
}
table.druckansicht th {
    font-size: 25px;
}
/*
 * Design for user pages
 */
.user {
  border: 2px solid #999;
  margin-bottom: 20px;
  padding: 0px;
  background: #CAEFD2;
}
.user span {
  margin-left: 10px;
}
.user p, .user form {
    border-bottom: 1px dashed #999;
    margin: 0px;
    padding: 5px 0px;
}
/*
 * Design for header bar with breadcrumb and logout link
 */
#topzeile {
    color: #fff;
    background: #7F8D9D;
    font-size: small;
}
#topzeile a {
    text-decoration: none;
    color: #fff;
}
#topzeile a:hover {
    text-decoration: underline;
}
#topzeile span {
    float: right;
    margin-right: 10px;
}
#topzeile ul.breadcrumb {
    float: left;
    padding-left: 0px;
    margin-top: 0;
    margin-bottom: 0;
}
#topzeile ul.breadcrumb li {
    display: inline;
    padding-left: 5px;
}
/*
 * Design for boxes with status messages
 */
div#nachrichtenbox {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    font-size: 14px;
}
#fehlermeldungen {
    background: url(../images/block_64.png) no-repeat #f5e0e0;
    padding-left: 100px;
    min-height: 64px;
    border: 1px solid #600;
    color: #600;
}
#fehlermeldungen li {
    list-style-image: url(../images/block_16.png);
}
#warnmeldungen {
    background: url(../images/block_64.png) no-repeat #ffffaa;
    padding-left: 100px;
    min-height: 64px;
    border: 1px solid #600;
    color: #600;
}
#warnmeldungen li {
    list-style-image: url(../images/block_16.png);
}
#erfolgsmeldungen {
    background: url(../images/tick_64.png) no-repeat #d6e9fe;
    padding-left: 100px;
    min-height: 64px;
    border: 1px solid #060;
    color: #060;
}
#erfolgsmeldungen li {
    list-style-image: url(../images/tick_16.png);
}
div#nachrichtenbox ul li li {
    /*
     * Do not place images in front of item lists in a message. We have this
     * case for example when we list several active beutel which contain an
     * article that the user wants to deaktivate.
     */
    list-style-image: none;
}
/*
 * Design for artikel navigation
 */
#artikelnavigation {
    margin-bottom: 10px;
    font-size: 1.2em;
    letter-spacing: 0.3em;
    padding-bottom: 4px;
    border-bottom: 2px solid #A6463C;
}
#artikelnavigation a {
    text-decoration: none;
    color: #000;
}
#artikelnavigation a:hover {
    text-decoration: underline;
}
#artikelnavigation li {
    display: inline-block;
    margin-right: 10px;
    padding: 4px 8px 4px 8px;
    background: #FFBFB8;
    border: 2px solid #A6463C;
}
/*
 * Styling for forms
 */
form.newstyle {
    border: 0;
    margin: 0 auto;
}
form.newstyle fieldset, fieldset.pageSection  {
    padding: 0px 40px 0px 10px;
    margin-bottom: 10px;
    border: 1px solid #aaa;
    background: #ddd;
}
form.newstyle legend, .pageSection legend {
    padding: 2px;
    font-weight: bold;
    color: #333;
    background: #fff;
    border: 1px solid #AAAAAA;
}
form.newstyle ul, .pageSection ul {
    margin: 0;
    padding: 10px 0 0 0;
    list-style-type: none;
}
form.newstyle ul.secondLevel, .pageSection ul.secondLevel {
    margin-left: 160px;
    padding-top: 0px;
}
form.newstyle li {
    margin: 0 0 10px 0;
    padding: 0;
}
/* A li that is only used to describe a field should be placed directly below the field. Therefore we pull it 10 px into the direction of the field. */
form.newstyle .liForFieldDescription {
    margin-top: -10px;
}
form.newstyle .fieldDescription {
    color: #666;
    font-size: 12px;
}
form.newstyle label {
    cursor: pointer;
    position: relative;
    margin-bottom: -5px;
    font-size: 13px;
}
/* In forms with class oneliner we want to have the label and the associated input field in one horizontal line. */
form.oneliner label {
    float: left;
    width: 160px; /* If you change this you must also change form.oneliner .liForFieldDescription */
}
form.oneliner .liForFieldDescription {
    margin-left: 160px; /* If you change this you must also change form.oneliner label */
}
/*
 * Set width of label and left margin of li for field description for several forms.
 */
#splPackagingForm label {
    width: 190px;
}
#splPackagingForm .liForFieldDescription {
    margin-left: 190px;
}
#articleSearchForm label {
    width: 120px;
}
#articleSearchForm .liForFieldDescription {
    margin-left: 120px;
}
#customerEarningsForm label {
    width: 40px;
}
#articleVolumeOfSalesSearchForm label {
    width: 130px;
}
#articleVolumeOfSalesSearchForm .liForFieldDescription {
    margin-left: 130px;
}
#bagSearchForm label {
    width: 120px;
}
#bagSearchForm .liForFieldDescription {
    margin-left: 120px;
}
#earningsForm label {
    width: 70px;
}
/*
 * Form interaction elements
 */
form.newstyle textarea {
    width: 500px;
    height: 200px;
}
form.newstyle input.hint {
    color: #999;
}
/* Button to send a form or to execute JavaScript actions */
input.sendButton {
    font-weight: bold;
    color: #fff;
    text-align: center;
    padding: 5px;
    text-indent: 0px;
    border: none;
    background: #175ba2;
}
/* Input field for volume of orders */
input#inputVolumeOfOrders {
    font-size: 1.6em;
    font-weight: bold;
    width: 120px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input fields for delivery dates and customer of orders */
#orderHeader > input {
    font-size: 1.6em;
    font-weight: bold;
}
#orderHeader > input.twoDigitsInput {
    width: 25px;
}
#orderHeader > input.fourDigitsInput {
    width: 50px;
}
/* Input field for amounts */
input.amount {
    width: 85px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for normal length text */
input.normalText {
    width: 350px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for long text */
input.longText {
    width: 700px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for small text */
input.smallText {
    width: 150px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for tiny text */
input.tinyText {
    width: 50px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for two digits */
input.twoDigitsInput {
    width: 20px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for four digits */
input.fourDigitsInput {
    width: 40px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for seven digits */
input.sevenDigitsInput {
    width: 70px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Input field for a price */
input.priceInput {
    width: 65px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}
/* Button to set current date in date field */
.dateSelectionButton {
    display: block;
    margin: 5px 0 0 160px;        
}
/** Generic fields */
.taftecRow {
    background: #eee;    
    clear: both;
}
.taftecTableRow {
    background: #eee;    
    clear: both;
    display: table;
}
.taftecBox, .taftecBox50, .taftecBoxVAlign, .taftecTableBox {    
    float: left;
    margin: 25px;
}
.taftecTableBox {    
    margin-left: 0px;
}
.taftecBox50 {
    width: 50%;
}

/* Formatting of delivery note and commission note */
fieldset.pageSection {
    padding-bottom: 10px;
}
.labelsHorizontalAligned {
    margin-top: 10px;
    margin-bottom: 10px;
    padding-bottom: 20px;
}
.labelsHorizontalAligned .taftecLabel{
    float:left;
    padding: 0px 20px 0px 20px;
}
#staticPickingNoteData fieldset {
    border: 0;
    background: #eee;
}
#newConsignedArticles fieldset {
    border: 0;
}
.pickingNoteField, .deliveryNoteField {
    background: #eee;
    margin-bottom: 15px;
    padding: 10px;
}
#deliveryNotePrintView, #pickingNotePrintView, #printView {
    background: white;
}
#deliveryNotePrintView h1, #pickingNotePrintView h1, #printView h1 {
    font-size: 18pt;
    text-decoration: none;
}
/*
 * Footer in the print view of a delivery note of a customer order.
 */
#deliveryNoteFooter {
    border-top: 1px solid #000;
    background: #fff;
    padding-top: 10px;
    text-align: center;
}
/*
 * Footer in the print view of a customer order sheet and in the print view of a supplier order sheet.
 */
#orderFooter {
    border-top: 1px solid #000;
    background: #fff;
    padding-top: 10px;
    text-align: center;
}

#processData .taftecBox, #processData .taftecBox50, #processData .taftecBoxVAlign,
#deliveryNoteData .taftecBox, #deliveryNoteData .taftecBox50, #deliveryNoteData .taftecBoxVAlign,
#goodsReceiptData .taftecBox, #goodsReceiptData .taftecBox50, #goodsReceiptData .taftecBoxVAlign, 
#pickingNoteData .taftecBox, #pickingNoteData .taftecBox50, #pickingNoteData .taftecBoxVAlign {
    margin: 2px;        
}
#deliveryNoteData .taftecBoxVAlign, 
#goodsReceiptData .taftecBoxVAlign, 
#pickingNoteData .taftecBoxVAlign, 
#processData .taftecBoxVAlign {
    width: 230px;
}
#articleData {
    margin-top: 30px;
    width: 100%;
}
#articleData .taftecBox{
    margin-bottom: 60px;
    margin-top: 60px;
    width: 100%;
}
#articleData table {
    width: 90%;
}
#articleData table th {
    background: #ddd;
}
#articleData table td {
    background: white;
}
/** textarea in consign picking note */
#newConsignedArticles .pickingNoteNote textarea {
    height: 40px;
    width: 613px;
}
/* textarea in update picking note*/
.pickingNoteField .pickingNoteNote textarea {
    height: 40px;
    width: 570px;
}
/* Field in show picking note */
.pickingNoteField .pickingNoteNote .noteField {
    height: 40px;
    width: 577px;
}
/* Print view */
#noteLabel {
    text-decoration: underline;
}
/* Fields in additionals picking note unit row */
.additionalTableRow select.normalText {
    width: 180px;
    border: 1px solid #8eb0d9;
    padding: 0;
    background: #fff;
}

/******************************
 * Article overview page
 * Total width of this table must be 1000 px.
 */
#tableArticleOverview {
    table-layout: fixed;
    word-break: break-all;
}
#tableArticleOverview th {
    text-align: center;
    padding: 0;
}
#tableArticleOverview #ColArtNr {
    width: 130px;
    word-break: break-all;
}
#tableArticleOverview #ColArtText {
    width: 215px;
}
#tableArticleOverview #ColArtType {
    width: 120px;
}
#tableArticleOverview #ColAvailableAmt, #tableArticleOverview #ColReservedAmt, #tableArticleOverview #ColStockLevel, #tableArticleOverview #ColCalcStock {
    width: 100px;
}
#tableArticleOverview #ColToolImage {
    width: 35px;
}
#tableArticleOverview a.splPriceAvailable,
#tableArticleOverview a:visited.splPriceAvailable,
#tableArticleOverview a:hover.splPriceAvailable {
    color: #fc0fc0;
    font-weight: bold;
}

/******************************
 * Job creation and editing form
 */
#jobForm #jobStartButton {
    display: inline-block;
    margin: 5px 0px;
    padding: 5px 10px;
    color: #fff;
    background: #175ba2;
}
#tabelle_fuer_auftragserstellung th {
    font-size: 80%;
}
#tabelle_fuer_auftragserstellung td {
    padding-left: 2px;
    padding-right: 2px;
    vertical-align: middle;
}
/* Zusätzliche Zeilen fuer Startzeiten in Auftragserstellung */
td.fillUpCell {
    border: 0;
}

/******************************
 * Job overview table
 */
#jobOverviewTable tr.mark_job_as_next td {
    color: #f00;
    font-weight: bold;
}
#jobOverviewTable tr.hbStartDateSetByStartButton td {
    color: #00f;
    font-weight: bold;
}
/* The span that shows text like "gotowe 16.10. 10:17" in the column "fertig" has the class ready-block. */
#jobOverviewTable .ready-block {
    display: inline-block;
    border: 1px solid;
    margin-bottom: 2px;
    white-space: nowrap;
    font-size: 90%;
}
/* We have an anchor in the job overview table when the user comes back to the table after he looked at a job.
 * Such an anchor should not get any styling that is used for normal links. We use tbody in the selector because
 * the links in the table header (for sorting) should be styled normally.
 */
#jobOverviewTable tbody a, #jobOverviewTable tbody a:visited, #jobOverviewTable tbody a:hover {
    text-decoration: none;
    color: #000;
}
/* The aforementioned anchor must appear in the same color as the rest of the text in that table row. */
#jobOverviewTable tr.mark_job_as_next td a {
    color: #f00;
}
/* The following css rule must come after the rule for
 * #jobOverviewTable tr.mark_job_as_next td a
 * because that one must be overwritten by the next rule. */
#jobOverviewTable tr.hbStartDateSetByStartButton td a {
    color: #00f;
}
#jobOverviewTable a.normal-link, #jobOverviewTable a.normal-link:visited {
    color: #00f;
}

#tableArticleOverview td.highlightAmt {
    color: #f00;
}