table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) {
  border-collapse: separate;
  border-spacing: 0px 5px;
  background: rgba(229, 229, 229, 0.78);
  border-radius: 5px;
  border: 2px solid #b5b5b5;
  display: block;
  padding: 10px;
  overflow-x: auto;
  max-height: calc(100vh - 335px);
  min-height: 250px; }
  table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody {
    display: table;
    width: 100%;
    overflow-y: hidden; }
    table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even {
      width: 100%;
      min-width: 100%;
      border-radius: 5px;
      border: 2px solid transparent;
      background: transparent;
      border-left: 5em solid transparent; }
      table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr:hover td:not(.total-title), table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd:hover td:not(.total-title), table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even:hover td:not(.total-title) {
        color: white;
        background-color: var(--primary-color); }
        table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr:hover td:not(.total-title) a, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd:hover td:not(.total-title) a, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even:hover td:not(.total-title) a {
          color: white; }
        table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr:hover td:not(.total-title) table#lrt th, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd:hover td:not(.total-title) table#lrt th, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even:hover td:not(.total-title) table#lrt th {
          color: white; }
        table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr:hover td:not(.total-title) table#lrt td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd:hover td:not(.total-title) table#lrt td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even:hover td:not(.total-title) table#lrt td {
          color: gray; }
      table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr:hover div.tank_no_title span, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd:hover div.tank_no_title span, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even:hover div.tank_no_title span {
        color: white; }
      table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td {
        background-color: rgba(255, 255, 255, 0.63); }
        table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td.background-green, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td.background-red, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td.background-green, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td.background-red, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td.background-green, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td.background-red {
          color: white; }
      table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr th, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd th, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even th {
        border: 2px solid transparent;
        background: transparent;
        color: gray;
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 0;
        vertical-align: baseline;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis; }
        table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr th td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd th td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even th td {
          background-color: transparent; }
      table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td:first-child, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td:first-child, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td:first-child {
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px; }
      table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td:last-child, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td:last-child, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td:last-child {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px; }
      table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td {
        color: gray;
        padding: 10px;
        border: 1px solid transparent;
        background-color: rgba(255, 255, 255, 0.63); }
        table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td a, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td a, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td a {
          color: gray; }
        table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr td .activated, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.odd td .activated, table:not(.ui-datepicker-calendar):not(.ui-timepicker-table):not(.ui-timepicker):not(.pp-table) tbody tr.even td .activated {
          color: white; }

form {
  background: transparent !important; }

.ordering-buttons {
  float: left; }
  .ordering-buttons span.fas {
    color: gray;
    margin-right: 5px; }
  .ordering-buttons a span {
    color: var(--primary-bright-color);
    padding: 3px; }
    .ordering-buttons a span.background-pale-blue {
      background: var(--bg-color); }

#fields, #sorting, #trans-sorting, #deliveries-sorting, #dip-sorting, #pumptotals-sorting {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 300;
  width: 100%;
  height: 100%;
  background: rgba(128, 128, 128, 0.6);
  overflow-y: scroll; }
  #fields .container, #sorting .container, #trans-sorting .container, #deliveries-sorting .container, #dip-sorting .container, #pumptotals-sorting .container {
    position: absolute;
    box-shadow: 5px 10px #888888;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    left: 0;
    right: 0;
    text-align: center;
    width: 35%;
    top: 100px;
    background: white;
    border-radius: 15px;
    padding: 5px;
    -webkit-box-shadow: 2px 2px 12px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 2px 2px 12px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 2px 2px 12px 0px rgba(0, 0, 0, 0.75); }
    #fields .container h3, #sorting .container h3, #trans-sorting .container h3, #deliveries-sorting .container h3, #dip-sorting .container h3, #pumptotals-sorting .container h3 {
      text-align: left;
      margin-left: 20px;
      font-weight: 600; }
    #fields .container label, #sorting .container label, #trans-sorting .container label, #deliveries-sorting .container label, #dip-sorting .container label, #pumptotals-sorting .container label {
      display: inline-block;
      width: 135px;
      text-align: left;
      color: gray;
      font-weight: 500; }
    #fields .container input, #sorting .container input, #trans-sorting .container input, #deliveries-sorting .container input, #dip-sorting .container input, #pumptotals-sorting .container input {
      width: 187px;
      display: inline-block;
      color: gray;
      font-weight: 300;
      border-radius: 2px;
      height: 20px;
      padding: 0 5px;
      margin-left: -1px; }
    #fields .container select, #sorting .container select, #trans-sorting .container select, #deliveries-sorting .container select, #dip-sorting .container select, #pumptotals-sorting .container select {
      border-radius: 2px;
      height: 20px;
      padding: 0 5px;
      width: 200px;
      display: inline-block;
      color: gray;
      font-weight: 300; }
    #fields .container button, #sorting .container button, #trans-sorting .container button, #deliveries-sorting .container button, #dip-sorting .container button, #pumptotals-sorting .container button {
      width: 150px;
      padding: 5px 5px;
      font-weight: 500;
      border: 0;
      background: #DAD7D7;
      box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.75);
      -webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.75);
      -moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.75);
      border-radius: 3px;
      line-height: 1.8;
      margin-left: 10px; }
      #fields .container button i, #sorting .container button i, #trans-sorting .container button i, #deliveries-sorting .container button i, #dip-sorting .container button i, #pumptotals-sorting .container button i {
        font-size: 20px;
        float: left; }
        #fields .container button i.far.fa-times-circle, #sorting .container button i.far.fa-times-circle, #trans-sorting .container button i.far.fa-times-circle, #deliveries-sorting .container button i.far.fa-times-circle, #dip-sorting .container button i.far.fa-times-circle, #pumptotals-sorting .container button i.far.fa-times-circle {
          color: #E9272E; }
        #fields .container button i.far.fa-check-circle, #sorting .container button i.far.fa-check-circle, #trans-sorting .container button i.far.fa-check-circle, #deliveries-sorting .container button i.far.fa-check-circle, #dip-sorting .container button i.far.fa-check-circle, #pumptotals-sorting .container button i.far.fa-check-circle {
          color: #21A74F; }

#sorting .container div, #trans-sorting .container div, #deliveries-sorting .container div, #dip-sorting .container div, #pumptotals-sorting .container div {
  display: flex;
  justify-content: center;
  align-items: flex-start; }
  #sorting .container div input, #trans-sorting .container div input, #deliveries-sorting .container div input, #dip-sorting .container div input, #pumptotals-sorting .container div input {
    width: 20px;
    margin-right: 10px; }
  #sorting .container div label, #trans-sorting .container div label, #deliveries-sorting .container div label, #dip-sorting .container div label, #pumptotals-sorting .container div label {
    width: 225px; }

div.active-filters {
  width: calc(100% - 13px);
  margin-bottom: 10px;
  border: 1px solid #dadada;
  padding: 5px;
  border-radius: 5px;
  display: flex;
  justify-items: center;
  align-items: center; }
  div.active-filters .filter-list {
    width: calc(100% - 140px);
    display: inline-block; }
    div.active-filters .filter-list .f-label {
      font-weight: bold;
      color: gray; }
    div.active-filters .filter-list .active-filter {
      display: inline-block;
      padding: 5px; }
      div.active-filters .filter-list .active-filter .container {
        padding: 5px;
        background: #DAD7D7;
        color: gray;
        -webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.75);
        -moz-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.75);
        box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.75);
        border-radius: 5px; }
      div.active-filters .filter-list .active-filter .fa.fa-times {
        cursor: pointer; }
  div.active-filters div.clear-filters {
    cursor: pointer;
    font-weight: bold;
    padding: 10px 5px;
    width: 125px;
    display: inline-block;
    text-align: center;
    background: #8e8e8e;
    color: white;
    border-radius: 5px; }

div#transactions table {
  max-height: calc(100vh - 355px); }

div#cards table {
  max-height: calc(100vh - 335px); }

div.no-table-scroll table, div.section table {
  max-height: none !important;
  min-height: unset; }

table.hide-scrollbars {
  overflow: hidden !important; }

table.fix-width tr td {
  width: 70%; }

@media only screen and (max-width: 1600px) and (max-height: 900px) {
  table tbody tr td, table tbody tr.odd td, table tbody tr.even td {
    padding: 5px; } }
table::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
  height: 7px; }

table::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5); }

table::-webkit-scrollbar-corner {
  background-color: transparent; }

div.tank-tables {
  background: rgba(229, 229, 229, 0.78);
  border: 2px solid #b5b5b5;
  border-radius: 5px;
  margin-bottom: 15px;
  position: relative; }
  div.tank-tables table.below-tank {
    position: absolute;
    width: 38%;
    right: 0;
    top: 345px; }
    div.tank-tables table.below-tank td {
      width: 50%; }
  div.tank-tables .tank-table-container {
    width: 50%; }
  div.tank-tables table {
    border: none !important;
    background: transparent !important; }

table tr.bunker-title th {
  color: white !important;
  background: linear-gradient(0deg, var(--section) 70%, var(--section-two) 100%) !important; }
table tr.bunker-title:not(:first-child) th {
  margin-top: 15px; }
table tr.total-row {
  font-weight: bold; }
  table tr.total-row td.border-fix {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px; }
  table tr.total-row td.total-title {
    background-color: transparent !important;
    text-align: right; }

table.sites-table div.tank-graph {
  margin-left: -20px; }
table.sites-table tbody tr th span.extra-info {
  margin-left: 250px; }
  table.sites-table tbody tr th span.extra-info span {
    width: 110px;
    display: inline-block;
    text-align: center; }
    table.sites-table tbody tr th span.extra-info span.dip-date {
      width: 160px; }

table.site-recon-table {
  width: auto; }

table.to-table {
  max-height: calc(100vh - 487px); }
  table.to-table tr td {
    text-align: left; }

table.pp-table {
  width: 100%; }
  table.pp-table tbody tr td {
    border: 1px solid gray;
    background-color: rgba(255, 255, 255, 0.64);
    color: #545454; }