/* =============================================================================
   Responsive Table CSS
   ========================================================================== */

.dataTable {
	display: block;
	width: 100%;
	margin: 1em 0;
}

.dataTable thead, .dataTable tbody, .dataTable thead tr, .dataTable th {
	display: block;
}

.dataTable thead {
	float: left;
}

.dataTable tbody {
	width: auto;
	position: relative;
	overflow-x: auto;
}

body table tbody tr td:last-child {
	border-right: 0px solid #fff;
}

.dataTable td, .dataTable th {
	padding: .625em;
	line-height: 1.5em;
	border-bottom: 1px dashed #ccc;
	box-sizing: border-box;
	overflow-x: hidden;
	overflow-y: auto;
}

.dataTable th {
	text-align: left;
	background: rgba(0, 0, 0, 0.14);
	border-bottom: 1px dashed #aaa;
}

.dataTable tbody tr {
	display: table-cell;
}

.dataTable tbody td {
	display: block;
}

.dataTable tr:nth-child(odd) {
	background: rgba(0, 0, 0, 0.07);
}

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

	.dataTable {
		display: table;
	}

	.dataTable thead {
		display: table-header-group;
		float: none;
	}

	.dataTable tbody {
		display: table-row-group;
	}

	.dataTable thead tr, .dataTable tbody tr {
		display: table-row;
	}

	.dataTable th, .dataTable tbody td {
		display: table-cell;
	}

	.dataTable td, .dataTable th {
		width: auto;
	}
}