/*
  CSS for xTableHeaderFixed demos 4, 5 and 6.
*/

/* xthf-fix-tbl and xthf-abs-tbl are required for xTableHeaderFixed.
   All other styles are for the demos. */

table.xthf-fix-tbl {
  position: fixed;
  /*overflow: hidden;*/
  left: -2000px;
  top: 0;
}
table.xthf-abs-tbl {
  position: absolute;
  /*overflow: hidden;*/
  left: -2000px;
  top: 0;
}
@media print {
  table.xthf-fix-tbl,
  table.xthf-abs-tbl {
    display: none;
  }
}

/* The scrollable containers for demos 5 and 6.
   position can be absolute or relative.
   width can be auto or a pixel value. */

#demo5-container {
  position: relative;
  width: auto;
  height: 300px;
  overflow: auto;
  background-color: #FFF;
  border: 1px solid #596380;
  padding: 10px;
}

#demo6-container {
  position: relative;
  width: 830px;
  height: 250px;
  background-color: #ddd;
  overflow: auto;
  padding: 10px;
}

/* Table with site theme. */

table.xthf-site {
  border-collapse: collapse;
  /*overflow: hidden;*/
  text-align: center;
  border-left: 1px solid #596380;
}
table.xthf-site caption {
  padding: 3px 10px;
  font-size: larger;
  font-weight: bold;
  color: #FFF;
  background: #BF8660;
  border: 1px solid #596380;
  border-bottom: none;
}
table.xthf-site thead {
  background: #CFD4E6;
}
table.xthf-site thead th {
  color: #000;
  font-weight: bold;
}
table.xthf-site td,
table.xthf-site th {
  padding: 6px 10px;
  border: 1px solid #596380;
  text-align: center;
}

/* Table with green theme.
   663, 996, CC9, FFC */

table.xthf-green {
  border-collapse: collapse;
  /*overflow: hidden;*/
  text-align: center;
  border: 1px solid #663;
}
table.xthf-green caption {
  /* this table has no caption */
}
table.xthf-green thead {
  background: #CC9;
}
table.xthf-green thead th {
  color: #663;
  font-weight: bold;
}
table.xthf-green td,
table.xthf-green th {
  padding: 6px 10px;
  text-align: center;
  border: 1px solid #663;
}

/* Table with blue theme.
   366, 699, 9CC, CFF */

table.xthf-blue {
  border-collapse: collapse;
  /*overflow: hidden;*/
  text-align: center;
  border: 1px solid #366;
}
table.xthf-blue caption {
  padding: 3px 10px;
  font-size: larger;
  font-weight: bold;
  color: #366;
  background: #CFF;
  border: 1px solid #366;
  border-bottom: none;
}
table.xthf-blue thead {
  background: #9CC;
}
table.xthf-blue thead td,
table.xthf-blue thead th {
  color: #366;
  font-weight: bold;
}
table.xthf-blue td,
table.xthf-blue th {
  padding: 6px 10px;
  text-align: center;
  border: 1px solid #366;
}