/* table wrapper (what the actual block sits in)*/
    .table-wrap {
        display: block;
        max-width: 100%;
        text-align: center;
        margin-bottom: 30px;
      }
  
      /* table block (the actual block)*/
      .table-block {
        display: inline-block;
        margin-left: auto;
        margin-right: auto;
        margin-top: 0.4em;
        margin-bottom: 0.2em;
        max-width: 100%;
        overflow-y: auto;
        -webkit-box-shadow: 0px 4px 15px 2px rgba(0, 0, 0, 0.2),
          0px 30px 30px -14px rgba(80, 53, 199, 0.05);
        box-shadow: 0px 4px 15px 2px rgba(0, 0, 0, 0.2),
          0px 30px 30px -14px rgba(80, 53, 199, 0.05);
        -webkit-border-radius: 11px;
        border-radius: 11px;
        background-color: rgba(0, 0, 0, 0);
        position: relative;
        text-align: left;
      }
  
      /* table caption */
      table caption {
        box-sizing: border-box;
        caption-side: bottom;
        padding: 8px;
        font-size: 0.9em;
        line-height: 1em;
        vertical-align: middle;
        text-align: left;
        border: 1px solid #d3d3d3;
        border-top: 0px;
        -webkit-border-radius: 0 0 11px 11px;
        border-radius: 0 0 11px 11px;
        white-space: normal;
        right: 0px;
        left: 0px;
        position: relative;
        background-color: #fff;
        overflow: auto;
      }
  
      /* Table # */
      table caption strong {
        text-transform: uppercase;
        padding-right: 0.1em;
        font-size: 0.8em;
        color: #555;
        font-weight: normal;
        vertical-align: top;
        line-height: 1.4em;
      }
  
      /* table */
      table {
        -webkit-border-radius: 10px 10px 0 0;
        border-radius: 10px 10px 0 0;
        padding: 0px;
        margin: 0px;
        border: 0px;
        border-collapse: separate;
        border-spacing: 1px;
        background-color: #d3d3d3;
        width: 100%;
      }
  
      th,
      td {
        font-weight: normal;
        border: 0px solid #d3d3d3;
        padding: 10px;
        background-color: #fff;
        width: 1%;
      }
  
      th {
        background-color: #E0E0E0;
        /* background-color: #ebebeb; */
      }
  
      /* border radius fix */
      thead:first-of-type tr:first-child th:first-child {
        -webkit-border-radius: 10px 0 0 0;
        border-radius: 10px 0 0 0;
      }
  
      thead:first-of-type tr:first-child th:last-child {
        -webkit-border-radius: 0 10px 0 0;
        border-radius: 0 10px 0 0;
      }
  
      thead:first-of-type tr:first-child th:only-child {
        -webkit-border-radius: 10px 10px 0 0;
        border-radius: 10px 10px 0 0;
      }
  
      /* table header */
      table thead tr:first-child th {
        background: rgba(76, 175, 80, 0.9);
        color: #fff;
        text-align: center;
      }
  
      /**** Scrollbar ****/
      /* width */
      ::-webkit-scrollbar {
        width: 13px;
      }
  
      /* Track */
      ::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.1);
      }
  
      /* Handle */
      ::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.3);
        -webkit-border-radius: 10px;
        border-radius: 8px;
      }
  
      /* Handle on hover */
      ::-webkit-scrollbar-thumb:hover {
        background: rgba(0, 0, 0, 0.4);
      }
  
      /* table scroll bar */
      /* width */
      .table-block::-webkit-scrollbar {
        height: 13px;
      }
  
      /* Track */
      .table-block::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0);
        -webkit-border-radius: 10px;
        border-radius: 10px;
      }