﻿/* Table styles
/* Table styles
----------------------------------------------*/
/* Main area set-up 
/* Main area set-up 
--------------------------------------------------------*/
/* Sizing styles
-----------------------------------------------------------*/
.full-width {
  width: 100%;
}
.full-height {
  height: 100%;
}
.full-page {
  height: 100%;
  width: 100%;
}
/* Basic items
------------------------------------------------------------*/
template {
  visibility: collapse;
  display: none;
}
.button-look {
  background-color: #EEEEEE;
  color: #333333;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
  text-decoration: none;
  /* get rid of the underline */
  border-radius: 4px;
}
.button-press-look {
  background-color: lightgray;
  border-bottom: 1px solid #CCCCCC;
  border-left: 1px solid #333333;
  border-top: 1px solid #333333;
  border-right: 1px solid #CCCCCC;
}
.button-stylings {
  background-color: #EEEEEE;
  color: #333333;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
  text-decoration: none;
  /* get rid of the underline */
  border-radius: 4px;
  background-size: 100vw 100vh;
  vertical-align: bottom;
  padding-right: 5px;
  padding-left: 4px;
}
.button-stylings:hover {
  background-color: lightgray;
}
.button-stylings:active {
  background-color: lightgray;
  border-bottom: 1px solid #CCCCCC;
  border-left: 1px solid #333333;
  border-top: 1px solid #333333;
  border-right: 1px solid #CCCCCC;
  padding-right: 4px;
  padding-left: 5px;
}
.button-stylings:disabled {
  color: #CCC;
  background-color: white;
  border-color: #CCC;
}
.icon-link-as-button {
  background-color: #EEEEEE;
  color: #333333;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
  text-decoration: none;
  /* get rid of the underline */
  border-radius: 4px;
  background-size: 100vw 100vh;
  vertical-align: bottom;
  padding-right: 5px;
  padding-left: 4px;
  padding-top: 7px;
  /* icon link as button */
  padding-bottom: 3px;
  height: 100%;
}
.icon-link-as-button:hover {
  background-color: lightgray;
}
.icon-link-as-button:active {
  background-color: lightgray;
  border-bottom: 1px solid #CCCCCC;
  border-left: 1px solid #333333;
  border-top: 1px solid #333333;
  border-right: 1px solid #CCCCCC;
  padding-right: 4px;
  padding-left: 5px;
}
.icon-link-as-button:disabled {
  color: #CCC;
  background-color: white;
  border-color: #CCC;
}
.icon-link-as-button-small {
  width: 100%;
  background-color: #EEEEEE;
  color: #333333;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
  text-decoration: none;
  /* get rid of the underline */
  border-radius: 4px;
  background-size: 100vw 100vh;
  vertical-align: bottom;
  padding-right: 5px;
  padding-left: 4px;
  /* icon link as button */
  height: 100%;
  padding-top: 7px;
  /* icon link as button */
  padding-bottom: 3px;
}
.icon-link-as-button-small:hover {
  background-color: lightgray;
}
.icon-link-as-button-small:active {
  background-color: lightgray;
  border-bottom: 1px solid #CCCCCC;
  border-left: 1px solid #333333;
  border-top: 1px solid #333333;
  border-right: 1px solid #CCCCCC;
  padding-right: 4px;
  padding-left: 5px;
}
.icon-link-as-button-small:disabled {
  color: #CCC;
  background-color: white;
  border-color: #CCC;
}
.center_button {
  text-align: center;
}
/********** Reducing font size in tables */
table.no-outline-table,
table.no-outline-table-packed,
table.no-outline-wide,
table.display-table,
filter-table,
table.edit-table,
table.no-outline-top-table-packed,
.no-outline-spaced-table,
.no-outline-spaced-centered,
.button-table-packed,
table.information-table,
.invoice-table,
.data-table,
.dl-horizontal,
.no-outline-dl-like {
  font-size: 85%;
}
/********** Basic table styles */
table.wide {
  width: 100%;
}
table.no-outline-table,
table.no-outline-table-packed,
table.no-outline-wide,
table.display-table,
.filter-table,
.display-table tr table.edit-table,
table.no-outline-top-table-packed,
.no-outline-spaced-table,
.no-outline-spaced-centered,
.button-table-packed,
table.unlined-information-table {
  padding: 0px 0px 0px 0px;
  border-width: 0px;
  border-style: none;
  border: 0;
}
tr.total-row {
  font-weight: bold;
}
/****************** Table for showing divided things ****************/
.underlined-row-table {
  border-collapse: collapse;
}
.underlined-row-table tr {
  border-bottom: 1px solid gray;
  width: 100%;
}
tr.no-underline-row {
  border-bottom: none;
}
.overlined-row-table {
  border-collapse: collapse;
  width: 100%;
}
.no-outline,
.no-outline-wide {
  text-align: left;
}
.no-outline-packed,
.no-outline-packed tr,
.button-table-packed tr {
  padding: 0px 0px 0px 0px;
  border-style: none;
  border-width: 0px;
  border: 0;
}
.no-outline-small,
.no-outline-small-centre,
.no-outline-small-wide {
  border-collapse: collapse;
  border-style: none;
  font-size: 75%;
}
.no-outline-small td,
.no-outline-small-centre td,
.no-outline-small-wide td {
  padding-right: 10px;
  line-height: 85%;
  font-size: 80%;
}
table.no-outline-small-centre {
  margin-left: auto;
  margin-right: auto;
}
.no-outline-small-wide,
.no-outline-wide {
  width: 100%;
}
td.right-cell {
  width: 100%;
  text-align: right;
}
.basic-icon-cell {
  height: 45px;
  vertical-align: central;
  padding: 0px 0px 0px 2px !important;
}
.icon-cell-image {
  width: 22px;
  height: 22px;
  vertical-align: top;
  padding: 1px 1px 1px 1px;
}
.icon-cell-image-small {
  width: 14px;
  height: 14px;
  vertical-align: central;
  padding: 1px 1px 1px 1px;
}
td.icon-cell {
  width: 50px;
  min-width: 50px;
  height: 45px;
  vertical-align: central;
  padding: 0px 0px 0px 2px !important;
}
td.icon-cell a {
  width: 100%;
  background-color: #EEEEEE;
  color: #333333;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
  text-decoration: none;
  /* get rid of the underline */
  border-radius: 4px;
  background-size: 100vw 100vh;
  vertical-align: bottom;
  padding-right: 5px;
  padding-left: 4px;
  /* icon link as button */
  height: 100%;
  padding-top: 7px;
  /* icon link as button */
  padding-bottom: 3px;
  min-height: 50px;
  min-width: 45px !important;
  padding-bottom: 8px;
}
td.icon-cell a:hover {
  background-color: lightgray;
}
td.icon-cell a:active {
  background-color: lightgray;
  border-bottom: 1px solid #CCCCCC;
  border-left: 1px solid #333333;
  border-top: 1px solid #333333;
  border-right: 1px solid #CCCCCC;
  padding-right: 4px;
  padding-left: 5px;
}
td.icon-cell a:disabled {
  color: #CCC;
  background-color: white;
  border-color: #CCC;
}
td.icon-cell img {
  width: 14px;
  height: 14px;
  vertical-align: central;
  padding: 1px 1px 1px 1px;
}
td.icon-cell-larger {
  width: 50px;
  min-width: 50px;
  height: 45px;
  vertical-align: central;
  padding: 0px 0px 0px 2px !important;
}
td.icon-cell-larger a {
  width: 100%;
  background-color: #EEEEEE;
  color: #333333;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
  text-decoration: none;
  /* get rid of the underline */
  border-radius: 4px;
  background-size: 100vw 100vh;
  vertical-align: bottom;
  padding-right: 5px;
  padding-left: 4px;
  /* icon link as button */
  height: 100%;
  padding-top: 7px;
  /* icon link as button */
  padding-bottom: 3px;
  min-height: 50px;
  min-width: 45px !important;
  padding-top: 10px;
  padding-bottom: 1px;
}
td.icon-cell-larger a:hover {
  background-color: lightgray;
}
td.icon-cell-larger a:active {
  background-color: lightgray;
  border-bottom: 1px solid #CCCCCC;
  border-left: 1px solid #333333;
  border-top: 1px solid #333333;
  border-right: 1px solid #CCCCCC;
  padding-right: 4px;
  padding-left: 5px;
}
td.icon-cell-larger a:disabled {
  color: #CCC;
  background-color: white;
  border-color: #CCC;
}
td.icon-cell-larger img {
  width: 14px;
  height: 14px;
  vertical-align: central;
  padding: 1px 1px 1px 1px;
}
td.icon-cell-small img {
  width: 14px;
  height: 14px;
  vertical-align: central;
  padding: 1px 1px 1px 1px;
}
td.double-icon-cell {
  width: 80px;
  height: 45px;
  vertical-align: central;
  padding: 0px 0px 0px 2px !important;
}
td.double-icon-cell img {
  width: 22px;
  height: 22px;
  vertical-align: top;
  padding: 1px 1px 1px 1px;
}
td.double-icon-cell a {
  min-height: 100%;
}
dl.dl-horizontal dt,
dl.dl-horizontal dd {
  margin-bottom: 0.4em;
}
/********** Data table(s) */
.data-table,
.small-data-table {
  border-collapse: collapse;
  border-style: solid;
  border-color: #666;
  border-left-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 1px;
  border-top-width: 0px;
  line-height: 1.3em;
  overflow: scroll;
}
.data-table {
  margin-top: 0.5em;
  width: 100%;
}
.data-table tr,
.small-data-table tr {
  border-style: solid;
  border-color: #666;
  border-left-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 0px;
  border-top-width: 0px;
}
/* To zebra string the item, need to use the "alternate" class */
.data-table tr,
.small-data-table tr {
  color: black;
}
.data-table tr td,
.small-data-table tr td {
  color: black;
}
.data-table td,
.small-data-table td {
  font-size: 80%;
  padding: 1px 6px 1px 6px;
}
.action-cell td {
  font-size: 110%;
}
.data-table-alternating {
  font-size: 85%;
  border-collapse: collapse;
  border-style: solid;
  border-color: #666;
  border-left-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 1px;
  border-top-width: 0px;
  line-height: 1.3em;
  overflow: scroll;
  margin-top: 0.5em;
  width: 100%;
}
.data-table-alternating tr {
  border-style: solid;
  border-color: #666;
  border-left-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 0px;
  border-top-width: 0px;
}
.data-table-alternating td {
  font-size: 80%;
  padding: 1px 6px 1px 6px;
}
.data-table-alternating th,
.data-table-alternating th > a {
  font-size: 10pt;
  font-weight: bold;
  text-align: left;
  background-color: #666;
  color: #fff;
  padding: 1px 6px 1px 3px;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: top;
  height: 100%;
}
.data-table-alternating tr td {
  color: #000;
}
.data-table-alternating tr.total-line {
  border-top: solid 1px black;
  font-weight: bold;
}
.data-table th,
.data-table th,
.small-data-table th,
.small-data-table th,
.data-table-alternating th,
.data-table th > a,
.data-table th > a,
.small-data-table th > a,
.small-data-table th > a,
.data-table-alternating th > a {
  font-size: 10pt;
  font-weight: bold;
  text-align: left;
  background-color: #666;
  color: #fff;
  padding: 1px 6px 1px 3px;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: top;
  height: 100%;
}
.data-table tr td,
.small-data-table tr td {
  color: #000;
}
/* To zebra string the item, need to use the "alternate" class */
.data-table tr.alternate td,
.small-data-table tr.alternate td {
  color: #000;
  background-color: #E8E8E8;
}
.data-table-alternating tr:nth-child(even) td {
  color: #000;
  background-color: #E8E8E8;
}
/* Make sure the buttons fit in */
.data-table input,
table button,
.small-data-table input {
  font-size: 85%;
  /* Basic font size is 8pt */
}
input.link-button {
  font-size: 100%;
  /* Basic font size is 8pt */
}
/********** Unlined Information table(s) */
table.information-table,
table.unlined-information-table {
  padding: 1px 1px 1px 1px;
  border-collapse: collapse;
}
table.information-table td,
table.information-table th,
table.unlined-information-table td,
table.unlined-information-table th {
  padding: 0.5em 3em 0.5em 3em;
}
table.information-table th,
table.unlined-information-table th {
  text-align: left;
  font-weight: bold;
}
table.information-table th.center_button,
table.unlined-information-table th.center_button {
  text-align: center;
}
.alternate-row {
  background-color: #EEE;
}
.overlined-heavy {
  border-top: 2px solid black;
  padding-top: 0.5em;
}
/*********** Information table */
table.information-table > tbody tr {
  border-top: 1px solid silver;
}
.no-border-end > th td {
  border-right: 0px solid none;
  border-top: 0px solid none;
  border-bottom: 0px solid none;
}
.control-cell {
  text-align: right;
  padding: 0px 0px 0px 0px;
}
.numeric-cell,
th.numeric-cell {
  text-align: right;
}
.no-outline-table-top {
  vertical-align: top;
}
.no-outline-table-middle {
  vertical-align: middle;
  min-height: 20px;
}
/********** Simple Table */
table.simple-table {
  border-collapse: collapse;
}
.overlined-row {
  border-top: 1px solid silver !important;
  margin-top: 0.5em !important;
  padding-top: 0.25em !important;
}
.data-table > tr.overlined-row {
  border-top: 1px solid silver !important;
  margin-top: 0.5em !important;
  padding-top: 0.25em !important;
}
/********** Invoice table */
.invoice-table {
  text-align: left;
  width: 100%;
  border: 2px solid black;
  border-collapse: collapse;
  color: black;
}
.invoice-table tr.line-item-norma {
  /* nothing to do */
}
.invoice-table tr.line-item-trade-in {
  font-style: oblique;
}
.invoice-table td,
.invoice-table .invoice-table th {
  border: 1px solid silver;
  padding: 3px 5px 3px 5px;
}
.invoice-table th {
  border-bottom: 2px solid black;
  font-style: italic;
}
.invoice-table td p {
  padding: 0;
  margin-top: 2px;
  margin-bottom: 2px;
}
.invoice-table tr:nth-child(even) {
  background: #e6ffff;
}
.invoice-table tr:nth-child(even) > td {
  background: #e6ffff;
}
.invoice-table tr:nth-child(odd) {
  background-color: white;
}
.invoice-table tr:nth-child(odd) > td {
  background-color: white;
}
.invoice-table tr.total-line > td {
  background-color: black;
  color: white;
  font-weight: bold;
}
/********** No outline table(s) */
table.no-outline-table,
table.no-outline-spaced-table {
  width: 100%;
}
table.no-outline-spaced-table td {
  padding: 0em 1em 0em 1em;
  vertical-align: top;
}
table.no-outline-table td {
  width: 100%;
}
table.no-outline-table td {
  padding: 0px 0px 0px 0px;
  border: 0px hidden #000;
}
table.no-outline-table-packed,
.button-table-packed {
  text-align: right;
  padding: 0em 0em 0em 0em;
  margin: 0px 0px 0px 0px;
  background-color: inherit;
}
table.no-outline-table-packed th,
table.no-outline-top-table-packed th,
.button-table-packed {
  text-align: right;
  padding: 2px 2px 2px 2px;
}
table.no-outline-table-packed tr,
table.no-outline-top-table-packed tr,
.button-table-packed {
  text-align: right;
  padding: 0px 0px 0px 0px;
  border-width: 0px;
  border-style: none;
}
table.no-outline-table-packed td,
table.no-outline-top-table-packed td,
.button-table-packed {
  text-align: right;
  padding: 0em 0em 0em 0em;
  border-collapse: collapse;
}
table.padded_cells td {
  padding: 10px 10px 10px 10px;
}
.no-outline-spaced-centered {
  text-align: center;
  padding: 0em 1em 0em 1em;
}
.no-outline-spaced-centered td {
  padding: 0em 1em 0em 1em;
}
/********** Display table(s) */
/********** Filter table */
.filter-table td {
  padding: 0em 2em 0em 0em;
}
/********** Edit table */
table.edit-table td.editor-field {
  width: 85%;
}
td.editor-field textarea {
  width: 100%;
}
/************** General table specific styles */
td.bool {
  text-align: center;
}
td.display-label {
  padding: 0.2em 0.5em 0.2em 0.5em;
}
td.display-field {
  padding: 0.2em 0.5em 0.2em 0.5em;
}
/*************  Filtering */
table.filter-submit,
table.search-submit {
  border: 0px solid black;
}
tr.filter-submit,
tr.search-submit {
  border: 0px solid black;
  text-align: left;
}
tr.filter-submit td,
tr.search-submit td {
  border: 0px solid black;
  text-align: left;
}
/*************  A Matrix table (both horizontal and vertical are significant) */
table.matrix-table {
  border-collapse: collapse;
  border: 1px solid #666;
  border-style: solid;
  border-color: #666;
  border-left-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 1px;
  border-top-width: 0px;
  line-height: 200%;
  overflow: scroll;
  table-layout: fixed;
}
table.matrix-table a {
  text-decoration: underline;
  color: white;
}
table.matrix-table td {
  border: 1px solid silver;
  width: 8em;
  text-align: center;
  vertical-align: middle;
}
table.matrix-table th,
table.matrix-table td.matrix-row-head {
  border: 1px solid silver;
  font-size: 110%;
  text-align: left;
  background-color: #666;
  color: #fff;
  padding: 1px 6px 1px 3px;
  text-decoration: none;
  text-align: center;
}
table.matrix-table td.matrix-row-head {
  text-align: left;
}
table.matrix-table td.matrix-row-divider {
  background-color: #EEE;
  border: 0px solid black;
}
table.matrix-table td.matrix-row-item,
table.matrix-table td.matrix-row-indented-item {
  border: 1px solid silver;
  text-align: left;
  background-color: #444;
  color: #fff;
  padding: 1px 6px 1px 3px;
  text-decoration: none;
  padding-left: 5px;
  width: 20em;
  font-size: 90%;
}
table.matrix-table td.matrix-row-indented-item {
  padding-left: 15px;
}
.hover {
  background-color: #DDD;
}
.table-spacer {
  padding: 0 2em 0 2em;
}
.table-small-spacer {
  padding: 0 0.4em 0 0.4em;
}
.highlighted {
  font-weight: bold;
}
.strikethrough {
  text-decoration-line: line-through;
  text-decoration-color: red;
  text-decoration-style: solid;
}
.italic {
  font-style: italic;
}
.bold {
  font-weight: bold;
}
td.highlighted {
  font-weight: bold;
}
.filter-text {
  width: 100%;
}
.filter-text-small {
  width: 25%;
}
/*************  A box table.  Draws a box around the items in it */
table.box-table {
  border: 1px solid silver;
  border-collapse: collapse;
}
.box-table td {
  padding: 0.5em 1em 0.5em 1em;
}
/*************  A tab table.  For use with a tab fieldset, for drawing the tabs */
table.tab-table {
  border: none 0px transparent;
  border-collapse: collapse;
  background-color: white;
  width: auto;
}
.tab-table td,
#info-block-header td {
  color: darkgray;
  padding: 0.5em 1em 0.5em 1em;
}
.tab-table .tab-cell {
  background-color: lightgray;
}
.tab-table-cell a {
  color: black;
  font-size: 100%;
}
.tab-table-selected-cell a {
  color: black;
  font-size: 105%;
  font-weight: bold;
}
/*************** Info blocks ************/
#info-block-header {
  border: none 0px transparent;
  border-collapse: collapse;
  background-color: white;
  width: auto;
  margin-bottom: 5px;
}
#info-block-header a {
  color: black;
  font-size: 100%;
}
.info-block-selected {
  color: black;
  font-size: 100%;
  font-weight: bold;
}
/*************** Table to show a sort of dialog *******************/
table.dialog-table {
  border: 5px ridge silver;
  border-collapse: collapse;
  background-color: White;
}
.dialog-table td {
  padding: 0.5em 1em 0.5em 1em;
  text-align: center;
}
.dialog-table div {
  margin: 0 auto;
  text-align: center;
}
/**************** Some special bits ******************************/
tr.no-outline-row,
tr.no-outline-row > td {
  border-style: none;
  border-width: 0px;
  border: 0;
  background-color: inherit !important;
}
.overlined-object {
  border-top: 1px solid gray;
}
.full_width_table {
  width: 100%;
}
.overlined-row-table tr,
td.overlined-cell {
  border-top: 1px solid gray;
}
tr.no-overlined-row,
table.information-table > tbody tr.no-overlined-row {
  border-top: none;
}
table.no-outline-dl-like {
  text-align: left;
}
table.no-outline-dl-like tr td:first-child {
  font-weight: bold;
  padding-right: 1em;
}
table.no-outline-dl-like tr {
  height: 22px;
}
.no-outline-wide th {
  white-space: nowrap;
  padding-left: 2ch;
  padding-right: 2ch;
}
.no-outline-wide td {
  padding-left: 2ch;
  padding-right: 2ch;
}
.quote-table {
  text-align: left;
  width: 100%;
}
.quote-table th {
  white-space: nowrap;
  padding-left: 2ch;
  padding-right: 2ch;
}
.quote-table td {
  padding-left: 2ch;
  padding-right: 2ch;
}
tr > td.middle-cell {
  vertical-align: middle;
}