.scroller-wrap {
  position: relative; /* anchors the overlays */
}

.dt-layout-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: block;
  max-width: 100%;
}

table.dataTable {
  width: auto !important;
  min-width: 100%;
}

.shadow-edge {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 24px;
  pointer-events: none; /* lets scroll/clicks pass through to the table */
  z-index: 5;            /* now it sits ABOVE the striped rows */
}

.shadow-left {
  left: 0;
  background: radial-gradient(farthest-side at 0 50%, rgba(0,0,0,0.2), rgba(0,0,0,0));
}

.shadow-right {
  right: 0;
  background: radial-gradient(farthest-side at 100% 50%, rgba(0,0,0,0.2), rgba(0,0,0,0));
}