/*css
//==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>
//
//
//==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<
*/
/* dtble*/
.dtbl{
}
/* tblbtnbox */
.dtbl-tblbtnbox{
	display:flex;
	justify-content:flex-start;
	align-items:center;
	flex-wrap:wrap;
	line-height:0;
}
.dtbl-tblbtnbox .btn{
	margin-right:8px;
	margin-bottom:10px;
}
.dtbl-tblbtnbox .btn:last-child{
	margin-right:0;
}
/* dtble-heading,body,footer */
.dtbl-heading,
.dtbl-body,
.dtbl-footer{
	display:flex;
	overflow:hidden;
}
.dtbl-body{
	overflow:auto;
	margin-bottom:10px;
}
/* table */
.dtbl-table{
	border-collapse: collapse;
	background-color:white;
}
/* th,td */
.dtbl-table th,
.dtbl-table td{
	border:1px solid #ccc;
	text-align:left;
	vertical-align:middle;
}
.dtbl-table th{
	padding:6px 10px;
}
.dtbl-table td{
	padding:10px 10px;
}
/* no padding */
.dtbl-table .dtbl-nopad{
	padding:0;
}
/* align */
.dtbl-table .dtbl-left{
	text-align:left;
}
.dtbl-table .dtbl-center{
	text-align:center;
}
.dtbl-table .dtbl-right{
	text-align:right;
}
/* tr */
.dtbl-table tbody tr:nth-child(odd){
	background-color:#f8f8f8;
}
.dtbl-table tbody tr:hover{
	background-color:#eee;
}
.dtbl-table tbody tr.dtbl-sel{
	background-color:#b2d7fe;
}
/* fhead */
.dtbl-fhead{
	display:flex;
	justify-content:center;
	align-items:center;
}
/* sortbtn */
.dtbl-sortbtnbox{
	position:relative;
	top:2px;
	display:flex;
	justify-content:center;
	align-items:center;
}
.dtbl-sortbtnbox~.dtbl-label{
	margin-left:8px;
}
.dtbl-sortbtn{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:20px;
	height:20px;
	border-radius:50%;
	color:#888;
	cursor:pointer;
	user-select:none;
}
.dtbl-sortbtn:hover{
	color:#000;
	background-color:#ddd;
}
.dtbl-sortbtn:active{
	top:1px;
	color:#000;
	background-color:#eee;
}
.dtbl-sortbtn.dtbl-sortbtn-sel{
	color:#000;
	background-color:#ddd;
}
.dtbl-sortbtn svg.sicon{
	pointer-events:none;
	width:12px;
	height:12px;
}
.dtbl-sortbtn:first-child{
	margin-right:2px;
}
/* selrec */
.dtbl-selrec-outer{
	display:flex;
	justify-content:center;
	align-items:center;
}
input.dtbl-selrec{
	position:relative;
	-webkit-appearance:none;/* safari */
	appearance:none;
	margin:4px;
	width:30px;
	height:30px;
	cursor:pointer;
	background-color:#fff;
	border:1px solid #ccc;
	border-radius:4px;
}
input.dtbl-selrec::before{
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	border-radius:4px;
}
input.dtbl-selrec::after{
	content:"";
	position:absolute;
	top:20%;
	bottom:20%;
	left:20%;
	right:20%;
}
input.dtbl-selrec:hover::before{
	background-color:#ddd;
}
input.dtbl-selrec:checked::before{
	background-color:#337ab7;
}
input.dtbl-selrec:checked::after{
	ransform-origin:bottom left;
	clip-path:polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
	background-color:#fff;
}
/* recbtn */
.dtbl-recbtnbox{
	display:flex;
	justify-content:center;
	align-items:center;
	line-height:0;
	margin:4px;
}
.dtbl-recbtn{
	position:relative;
	display:inline-block;
	color:#333;
	cursor:pointer;
	margin-right:6px;
	width:30px;
	height:30px;
	padding:4px;
	border-radius:5px;
}
.dtbl-recbtn:last-child{
	margin-right:0;
}
.dtbl-recbtn:hover{
	color:#000;
	background-color:#fff;
}
.dtbl-recbtn:active{
	top:1px;
	color:#333;
	background-color:#ddd;
}
.dtbl-recbtn .sicon{
	pointer-events:none;
	width:22px;
	height:22px;
}
/* sicon */
.dtbl-sicon .sicon{
	width:22px;
	height:22px;
}
/* navibtnbox */
.dtbl-navibtnbox{
	display:flex;
	justify-content:center;
	align-items:center;
	line-height:0;
}
.dtbl-navibtn{
	position:relative;
	display:inline-block;
	color:#ccc;
	margin-right:6px;
	width:30px;
	height:30px;
	padding:4px;
	border-radius:5px;
	cursor:default;
}
.dtbl-navibtn .sicon{
	width:22px;
	height:22px;
}
.dtbl-navibtn:last-child{
	margin-right:0;
}
.dtbl-navibtn-enabled{
	color:#333;
	cursor:pointer;
}
.dtbl-navibtn-enabled:hover{
	color:#000;
	background-color:#ddd;
}
.dtbl-navibtn-enabled:active{
	top:1px;
	color:#333;
	background-color:#eee;
}
/* footer */
.dtbl-footer{
	flex-wrap:wrap;
	margin-bottom:0;
}
.dtbl-footer > div{
	margin-bottom:10px;
	margin-right:20px;
}
/* statsbox */
.dtbl-statsbox{
	display:flex;
	justify-content:center;
	align-items:center;
}
/* recidx, rectotal */
.dtbl-recidxs,
.dtbl-recidxe,
.dtbl-rectotal{
	font-weight:bold;
}
