/* table breakpoint @ 580px*/
.stack-table th {
  display: none;
}
.stack-table td {
  display: block;
}

.stack-table td:before {
  content: attr(data-th) "";
  /*font-weight: bold;*/
  text-transform: uppercase;
  display: inline-block;
}

@media (min-width: 580px) {
  .stack-table td:before {
    display: none;
  }
  .stack-table tr {
      background: linear-gradient(to right, transparent 4px,transparent 4px) !important;
  }
}
.stack-table th, .stack-table td {
  text-align: left;
}
@media (min-width: 580px) {
  .stack-table th, .stack-table td {
    display: table-cell;
  }
  .stack-table td div.color-block{
      display:none;
  }
  
}

@media (max-width: 580px) {
  .stack-table{
      border-bottom-width:0px !important;
      font-size: 0.75em;
      border-collapse: collapse !important;
  }
  .stack-table tr {
    border-bottom: 1px solid #ddd;
  }

  .stack-table td {
    width:inherit !important;
    text-align: right;
    border-width: 0px !important;
  }
  .stack-table td:before {
      float:left;
      /*padding-left:3px;*/
  }
  .stack-table td:first-child {
      border-left-width: 0px !important;
      border-right-width: 0px !important;
  }
  .stack-table td.bold:first-child{
      text-align: left;
  }
  .stack-table td.bold-left {
        text-align: left;
  }

  .stack-table td.bold {
      font-weight: bold;
  }
  .stack-table td.hide-this{
     display:none;
  }
  .stack-table td div.color-block{
      display:inline-block;
      width: 15px;
      position: absolute;
      height: 15px;
      margin-top: -2px;
  }
  .stack-table td div.name-block{
      display:inline-block;
      padding-left:20px;
  }
  /*enable striped rows*/
  table.stack-table > tbody > tr > .row-data {
      background-color: inherit !important;
  }
  /*dashboard sub title as-of-date*/
  .show-max-580{
      display:block !important;
  }
  /*used in dashboard data table*/
  div.float-right-max-580{
      float:right;
      max-width:70% !important;
  }

  /*grouped header should left-align*/
  .stack-table tr.group-name-darker td:first-child, 
  .stack-table tr.group-total-darker td:first-child,
  .stack-table tr.group-name td:first-child,
  .stack-table tr.full-total td:first-child{
      text-align: left;
  }


  .stack-table td:empty {
     display: none;
  }
  .stack-table td.text-align-left{
      text-align:left;
  }
}