
  /* table {
    table-layout: fixed;
    width: 60vw;
    border-collapse: collapse;

 
 } */
  
table {
    border-collapse: collapse;
    border-spacing: 0;
    box-sizing: border-box;
    table-layout: fixed;
    width: 75%;
    margin-left: 12.5%;
}
 .table-container {
    left: 0px;
    display: grid;
    padding-top: 5vh;
    /* max-width: 100%; */
    overflow-x: auto;
    /* margin: auto; */
    width: 100vw;
    justify-content: center;
    padding: 0 -2em;
    /* margin: 0 -auto; */
    
  }




  th, td {
    padding: 0.25em;
  }
  
  th[role=columnheader]:not(.no-sort) {
      cursor: pointer;
  }
  
  th[role=columnheader]:not(.no-sort):after {
      content: '';
      float: right;
      margin-top: 7px;
    margin-left: 5px;
      border-width: 0 4px 4px;
      border-style: solid;
      border-color: black transparent;
      visibility: hidden;
      opacity: 0;
      -ms-user-select: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      user-select: none;
  }
  
  th[aria-sort=ascending]:not(.no-sort):after {
      border-bottom: none;
      border-width: 4px 4px 0;
  }
  
  th[aria-sort]:not(.no-sort):after {
      visibility: visible;
      opacity: 0.4;
  }
  
  th[role=columnheader]:not(.no-sort):hover:after {
      visibility: visible;
      opacity: 1;
  }


 
  
  button {
    cursor: pointer;
    background: var(--backsplash-color);
    border: none;
  }

  button:active {
    background: var(--accent-color-yellow);
  }

  .start-button {
    background: #fbe19bff;
  }