html {
	font-family:'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
}

input { padding: 4px; }

#recorder_data {
	height:600px;
	width:5000px;
}

.tbl {
	font-size:.75rem;
	height: 100%;
}
.row {
	display:flex;
}
.row > div {
	min-width: 60px;
	border:1px solid #aaa;
	padding: .5rem 0 .5rem .5rem;
	overflow:hidden;
	cursor:pointer;
	user-select: none;
}
.tbody .row:nth-child(odd) {
	background: #ccc;
}
.thead {
	font-weight:bold;
	height:3rem;
	border-bottom:.1em solid black;
}
.thead > div {
	font-size:1rem;
}
.tbody {
	height:calc(100% - 3rem);
	overflow-y:auto;
}
	.tbody::-webkit-scrollbar {
		display: none;
	}

.asc::after {
  content: '\25b2';
  padding-left:.2rem;
  font-size:.75rem;
}
.desc::after {
  content: '\25bc';
  padding-left:.2rem;
  font-size:.75rem;
}

.flash_green {
	background-color: green;
}




/* maybe redundant */
.overlay_container {
	position: fixed;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.overlay {
    width: 500px;
    padding: 20px;
    position: relative;
    margin: 50px auto 0 auto;
    z-index: 1001;
	background-color: white;
    border: 2px solid #e0e8ed;
    max-height: 80%;
    overflow: auto;
}

.overlay_close {
	position: absolute;
	top: 0;
	right: 10px;
	color: #7b7b7b;
	font-size: 20px;
	font-family: sans-serif;
	font-weight: bolder;
	cursor: pointer;
	padding: 10px;
}