/* this is for the main container of the table, also sets the height of the fixed header row */
.headercontainer {
  position: relative;
  background-color: #E8F4FD;
  padding-top: 47px;
  
}
/* this is for the data area that is scrollable */
.tablecontainer {
  overflow-y: auto;
  max-height: 420px;
  /*background: #fff;*/
}

/* remove default cell borders and ensures table width 100% of its container*/
.tablecontainer table {
  border-spacing: 0;
  width:100%;
}

/* add a thin border to the left of cells, but not the first */
.tablecontainer td + td {
  /*border-left:1px solid #eee; */
}

/* cell padding and bottom border */
.tablecontainer td, th {
  /*border-bottom:1px solid #eee;*/
  /*padding: 10px;*/
}

/* make the default header height 0 and make text invisible */
.tablecontainer th {
    height: 0px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 0;
    visibility: hidden;
    white-space: nowrap;
}

/* reposition the divs in the header cells and place in the blank area of the headercontainer */
.tablecontainer th div{
  visibility: visible;
  position: absolute;
  /*background-color: #E8F4FD;*/
  padding: 14px 10px;
  top: 0;
  margin-left: -10px;
  line-height: normal;
   
}
/* prevent the left border from above appearing in first div header */
th:first-child div{
  border: none;
}

/* alternate colors for rows */
.tablecontainer tbody  tr:nth-child(even){
    background-color: #FFFFFF;
}