
.table-wrapper {
  max-height:calc(100vh - 300px);      /* 100viewport heght - height of scroll area */
  overflow-y: auto;       /* vertical scroll */
}

.sticky-header thead th {
  position: sticky;
  top: 0;
  background: white;      /* or your table header color */
  z-index: 10;            /* keeps header above rows */
}


.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-responsive table {
  width: max-content;   /* keeps table as wide as it needs to be */
  min-width: 100%;      /* prevents shrinking smaller than screen */
  table-layout: auto;   /* allows natural column width */
 /* white-space: nowrap;*/  /* avoid wrapping */
}

.table-responsive thead th {
    text-align: center !important;
    vertical-align: middle !important;
}