table {
    width: 100%;
    font-size: 12px;
    border-collapse: collapse;
  }
  tr:nth-of-type(odd) {
    background: #f5f5f5;
  }
  th {
    background: #bd302c;
    color: white;
    font-weight: bold;
  }
  td,
  th {
    padding: 6px;
    border: 1px solid #ccc;
    text-align: left;
  }
  
  .table-heading {
    text-align: center;
    font-weight: normal;
  }
  
  @media only screen and (max-width: 992px) {
    /* Force table to not be like tables anymore */
    table,
    thead,
    tbody,
    th,
    td,
    tr {
      display: block;
    }
  
    /* Hide table headers (but not display: none;, for accessibility) */
    thead tr {
      position: absolute;
      top: -9999px;
      left: -9999px;
    }
  
    tr {
      border: 1px solid #ccc;
    }
  
    td {
      /* Behave  like a "row" */
      border: none;
      border-bottom: 1px solid #eee;
      position: relative;
      padding-left: 50%;
    }
  
    td:before {
      /* Now like a table header */
      position: absolute;
      /* Top/left values mimic padding */
      top: 6px;
      left: 6px;
      width: 45%;
      padding-right: 10px;
      white-space: nowrap;
    }
  
    /*
      Label the data
      */
    td:nth-of-type(1):before {
      content: "Location";
    }
    td:nth-of-type(2):before {
      content: "Total Cases Count";
    }
    td:nth-of-type(3):before {
      content: "Total Cases Rate*";
    }
    td:nth-of-type(4):before {
      content: "Active Cases Count";
    }
    td:nth-of-type(5):before {
      content: "Active Cases Rate*";
    }
    td:nth-of-type(6):before {
      content: "Recovered Count";
    }
    td:nth-of-type(7):before {
      content: "Death Count";
    }
    td:nth-of-type(8):before {
      content: "Death Rate*";
    }
    td:nth-of-type(9):before {
      content: "Tested Count";
    }
    td:nth-of-type(10):before {
      content: "Tested Rate †";
    }
  }