/*
 * PF Responsive
 * -------------------------
 * All default responsive site additions can be added here.
 * Functional responsive elements should be in pf-responsive.js
 */

/* Responsive Table Styles - Only target small screens (767px) */
/* @media (max-width: 767px) { */
@media screen and (max-width: 767px) {

  .table-responsive {
    border: none;
  }

  /* hide the table header */
  .table-responsive > thead,
/*  .table-responsive > thead > tr, */
  .table-responsive > tr > th,
  .table-responsive > tbody > tr > th {
    display: none;
  }

  /* make rows behave like DIVs */
  .table-responsive tbody > tr {
    display: block;
  }
  .table-responsive > tbody > tr + tr {
    /* margin-top: 10px; */
  }

  /* make cells behave like DIVs */
  .table-responsive > tbody > tr > td {
    display: block;
    width: auto !important;
    text-align: left !important;
  }

  /* style the new table header (this is the "data-th" inserted using JS) */
  .table-responsive > tbody > tr > td:before {
    content: attr(data-th);
    display: block;
    float: left;
    margin-right: 15px;

    /* adjust these as needed */
    min-width: 7em;
    font-weight: bold;
  }

  /*
   * Responsive Bordered Table
   * -------------------------
   */
  .table-responsive.table-bordered tbody > tr {
    border: 1px solid #ddd;
  }
  .table-responsive.table-bordered td {
    border-top: 1px solid #ddd;
    border-right: none;
    border-bottom: none;
    border-left: none;
  }
  .table-responsive.table-bordered > tbody > tr > td:first-child {
    border-top: none;
  }
}
