/*----- Responsive Table -----*/

@media only screen and (max-width: 767px) {    
    /* Force table to not be like tables anymore */
    .no-more-tables table,
    .no-more-tables caption,
    .no-more-tables thead,
    .no-more-tables tbody,
    .no-more-tables th,
    .no-more-tables td,
    .no-more-tables tr {
        display: block;
        } 
    /* Hide table headers (but not display: none;, for accessibility) */
    .no-more-tables thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
        }
    .table-responsive,
    .table-bordered {border: none;}
    .no-more-tables tr { border-bottom: 1px solid #ccc; }
    .no-more-tables tr:last-child { border-bottom: none; }
    .no-more-tables th {border-top: none; border-right: none; border-left: none;}
    .no-more-tables th.th--heading {border: 2px solid black;}
    .no-more-tables .table>tbody>tr>td {/* need this td specificity to override Bootstrap style */
		/* Behave like a "row" */
		border: none;
		border-bottom: 1px solid #eee;
		position: relative;
		padding-left: 30%;
		white-space: normal;
		text-align:left;
	}
    .no-more-tables td:before {
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		/* top: 6px; */
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
	}    
/* Label the data */
     .no-more-tables td:before { content: attr(data-title); }}

}
