/* =============================================================================
   Responsive Table CSS
   ========================================================================== */
   
   .dataTable {
    width: 100%;
  }
  

  .dataTable thead {
    text-align: center;
    background: rgba(0, 0, 0, 0.07);
  }
  
  .dataTable tbody {
    position: relative;
  
 
  }

  
  .dataTable td, .dataTable th {
    text-align: center;
    border-bottom: 1px dashed #ccc;
    width:10%;
    height:50px;

  }
  .dataTable tbody tr td:first-child{
width:5%;
  }
  .dataTable tr:nth-child(even) {
    background: rgba(0, 0, 0, 0.07);

}

  
  @media screen and (min-width: 50em) {

  }
  @media (max-width: 80em) {


    /*********************************/
 
  
    /* Hide table headers (but not display: none;, for accessibility) */


.dataTable{
  text-align: center;
}
table.bt tfoot th::before, table.bt tfoot td::before, table.bt tbody td::before{
  background: rgba(0, 0, 0, 0.07);
  white-space: nowrap;
  text-align: center;
  width:50%;

  /* Top/left values mimic padding */



}
.dataTable tbody tr td:first-child{
width:100%
}
table.bt tfoot th, table.bt tfoot td, table.bt tbody td{
  height: auto !important;
}
    .dataTable td  {
      /* Behave  like a "row" */
      border-bottom: 1px solid #eee;
      position: relative;
      position: relative;
      text-align: center;
     /* padding-right:55%;*/
      text-align: center;
      display: block;
  /*    width:50%;*/
  width:100%;
      direction: rtl; 
      
    }
    table.bt tfoot th .bt-content, table.bt tfoot td .bt-content, table.bt tbody td .bt-content{
      margin:auto;
    }
 

  }