table.mobile {border-collapse: collapse; margin: 0; padding: 0; width: 100%; table-layout: auto;}
table.mobile tr {background-color: #f8f8f8; border: 1px solid #ddd; padding: .35em;}
table.mobile th,  table td {padding: .625em !important; text-align: left; max-width: 150px;}
table.mobile th {font-size: .85em; letter-spacing: .1em; text-transform: uppercase;}

@media screen and (max-width: 1200px) {
  table.mobile { order: 0; }
  table.mobile caption { font-size: 1.3em; }
  table.mobile thead { order: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
  table.mobile tr { border-bottom: 3px solid #ddd; display: inline-block; width: 49%; margin-bottom: .625em; vertical-align: top;}
  table.mobile tr:nth-child(even) {margin-left: 1%;}
  table.mobile td { border-bottom: 1px solid #ddd !important; display: block; font-size: .8em; text-align: right; min-height: 30px;}
  table.mobile td::before { content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase; }
  table.mobile td:last-child { border-bottom: 0 !important; }
  table.mobile th,  table td {max-width: initial;}
}

@media screen and (max-width: 675px) {
  table.mobile tr { width: 100%;}
  table.mobile tr:nth-child(even) {margin-left: initial;}
}