#table { border-collapse: collapse; margin: 1.25em 0 0; width: 100%; }
#table tr, #table th, #table td { border: none;   /*font-family: 'Lato', sans-serif;*/}
#table th, #table td { padding: 10px 12px; text-align: left; }
#table th { text-transform: uppercase; }

#table tr:nth-of-type(2n+2) td { background: #ffffff; }
#table.bt tfoot th, #table.bt tfoot td, #table.bt tbody td {padding: 0; }
#table.bt tfoot th:before, #table.bt tfoot td:before, #table.bt tbody td:before { padding: 2px 10px; }
#table.bt tfoot th .bt-content, #table.bt tfoot td .bt-content, #table.bt tbody td .bt-content { display: inline-block; padding: 2px 5px; }
#table.bt tfoot th:first-of-type:before, #table.bt tfoot th:first-of-type .bt-content, #table.bt tfoot td:first-of-type:before, #table.bt tfoot td:first-of-type .bt-content, #table.bt tbody td:first-of-type:before, #table.bt tbody td:first-of-type .bt-content { padding-top: 10px; }
#table.bt tfoot th:last-of-type:before, #table.bt tfoot th:last-of-type .bt-content, #table.bt tfoot td:last-of-type:before, #table.bt tfoot td:last-of-type .bt-content, #table.bt tbody td:last-of-type:before, #table.bt tbody td:last-of-type .bt-content { padding-bottom: 10px; }

/*
 * Example 4:
 * Media query over js resize
 */
@media screen and (max-width: 1024px) and (min-width: 0px) {
#table thead { display: none; }
#table tbody td { border: none !important; display: block;  font-size: 12px; padding: 0; vertical-align: top; }
#table tbody td:before { content: attr(data-th) ": "; display: inline-block; font-weight: bold; padding: 2px 5px; width: 5em; }
#table tbody td .bt-content { display: inline-block; padding: 2px 5px; word-wrap: break-word; word-break: normal;}
#table tbody td:first-of-type:before,  #table-no-resize tbody td:first-of-type .bt-content { padding-top: 10px; }
#table tbody td:last-of-type:before,  #table-no-resize tbody td:last-of-type .bt-content { padding-bottom: 10px; }
}


/*
 * Example 6:
 * Max height
 */
.bt-wrapper.active { margin-top: 1.5em; }
.bt-wrapper.active #table { margin: 0; }
#table { width: 100%; }
.#table { margin: 30px 0; border-collapse: collapse; border-spacing: 0; empty-cells: show; border: 1px solid #e0e0e0; }
.#table td, .#table th { border-left: 1px solid #e0e0e0; border-width: 0 0 0 1px; font-size: inherit; margin: 0; overflow: visible; font-weight: normal; }
.#table td:first-child, .#table th:first-child { border-left-width: 0; }
.#table thead, .#table tfoot { text-align: left; vertical-align: bottom; }
.#table td { background-color: transparent; }

/*
 * jQuery Basic #table
 * Author: Jerry Low
 */

#table.bt thead, #table.bt tbody th { display: none; }
#table.bt tfoot th, #table.bt tfoot td, #table.bt tbody td { border: none; display: block; vertical-align: top; }
#table.bt tfoot th:before, #table.bt tfoot td:before, #table.bt tbody td:before { content: attr(data-th) ": "; font-weight: bold; width: 6.5em; display: inline-block; }
#table.bt tfoot th.bt-hide, #table.bt tfoot td.bt-hide, #table.bt tbody td.bt-hide { display: none; }
#table.bt tfoot th .bt-content, #table.bt tfoot td .bt-content, #table.bt tbody td .bt-content { vertical-align: top; }
.bt-wrapper.active { max-height: 310px; overflow: auto; -webkit-overflow-scrolling: touch; }