/*Responsive Tables from https://adrianroselli.com/2017/11/a-responsive-accessible-table.html*/
  

/*ID */


 #myTable {
     margin: 1em 0;
     border-collapse: collapse;

}
 #myTable caption {
     text-align: left;
     font-style: italic;
     padding: 0.25em 0.5em 0.5em 0.5em;
}
 #myTable th,#myTable td {
     padding: 0.25em 0.5em 0.25em 1em;
     text-align: left;

}
 #myTable th {
     vertical-align: bottom;
     background-color: #000000;
     color: #ffffff;
     font-weight: bold;
}
 #myTable td::before {
     display: none;
}
 #myTable tr:nth-child(even) {

}
 #myTable tr:nth-child(odd) {

}
 #myTable td:nth-of-type(2) {

}
 #myTable th:nth-of-type(3), #myTable td:nth-of-type(3) {

}
 .responsive-div {
     overflow: auto;
}
 /*@media screen and (max-width: 50em), print and (max-width: 8in) {*/
@media screen and (max-width: 800px), print and (max-width: 768px) {
         #myTable table, #myTable tr, #myTable td {
             display: block;
        }
         #myTable tr {

        }
         #myTable th  {
             display: none;
        }
        #myTable tr:first-of-type {
             /*display: none;*/
        }
         #myTable td::before {
             display: inline;
             font-weight: bold;
        }
         #myTable td {
             display: grid;
             /*grid-template-columns: 6em auto;*/
             grid-template-columns: 14em auto;
             grid-gap: 1em 0.5em;
        }
         #myTable caption {
             font-style: normal;
             background-color: rgba(0, 0, 0, 0.35);
             color: #fff;
             font-weight: bold;
        }
         #myTable td:nth-of-type(3) {
             text-align: left;
        }
         #myTable td:nth-of-type(4), #myTable td:nth-of-type(5) {

        }
         #myTable td:nth-of-type(4)::before, #myTable td:nth-of-type(5)::before {
             text-align: left;
        }
         #myTable td:nth-of-type(2)::before {
             font-style: normal;
        }
    }
     @media print {
         body {
             font-size: 6pt;
        }
         body, .responsive-main {
             margin: 0;
             padding: 0;
             border: none;
        }
         .responsive-table {
             page-break-inside: avoid;
        }
         .responsive-div {
             overflow: visible;
        }
         #myTable th {
             color: #000;
             border-bottom: 1pt solid #000;
        }
         #myTable tr {
             border-top: 1pt solid #000;
        }
    }
     @media print and (max-width: 5in) {
         #myTable caption {
             background-color: #fff;
             border-bottom: 1pt solid #000;
        }
         #myTable table {
             page-break-inside: auto;
        }
         #myTable tr {
             page-break-inside: avoid;
        }
    }
    
    
    
@media screen and (max-width: 600px), print and (max-width: 6.25in) {
  /* Styles for very small screens */
  
      #myTable td {
             display: grid;
             grid-template-columns: auto;
             grid-gap: 1em 0.5em;
        }
}