/*  Deze kunnen gebruikt worden in het programma

	.container { height: calc(100vh - 250px); }
	th { background-color: #C6C6C2; }
	th, td { height: 15px; }
	.centreer { text-align: center; }

	// Schuiven in tabel 	
	<tr class="ths">
	<tr class="trs">

*/

.ellips { 
	max-width: 500px;
	overflow: hidden;
	text-overflow: ellipsis;
}


#container {
	overflow-x:auto; 
	overflow-y:auto;
	scrollbar-color: gray white;
}

.container {
	overflow-x:auto; 
	overflow-y:auto;
	scrollbar-color: gray white;
}

.fix { table-layout:fixed !important; } 

table {
	display: table;
	border-spacing: 0;
}

thead th {
	position: -webkit-sticky;
	position: sticky;
	top: 0; 
	font-weight: bold;
	background-color: #c1c1bf;
	border-bottom: 1.5px solid grey;
    border-right: 1.5px solid grey;
	z-index: 2;
}

th, td {
	white-space: nowrap;
	color: black;
	border: 1.5px solid rgb(181, 175, 175); 
	padding: 3px;
}

tfoot {	background-color: #6e6d6a;  } 

tr:nth-child(even) {  background-color: rgba(238,251,251, 0.6); }
tr:nth-child(odd) {  background-color: rgba(230,230,238, 0.6); }
tr:hover {background-color:#CDCBC9;}

/* Scroll Bar voor o.a. google */
.scrollable { 
	overflow: auto;	 
}
::-webkit-scrollbar {
	height: 14px;
	width: 12px;
	background: #fff;
}
::-webkit-scrollbar-thumb {
	background: gray;
	-webkit-border-radius: 1ex;	
}



/* MAKE LEFT COLUMN FIXEZ */
.ths > :first-child {
  position: -webkit-sticky;
  position: sticky; 
  background: #c1c1bf; 
  left: 0; 
  padding: 4px;
}

.trs > :first-child {
  position: -webkit-sticky;
  position: sticky; 
  background: #c1c1bf;
  left: 0; 
  padding: 4px;
}

.ths3 > :nth-child(3) {
	background: #c1c1bf;
	z-index: 2;
}

.trs3 > :nth-child(3) {
  position: -webkit-sticky;
  position: sticky; 
  background: rgb(230,230,238);
  left: 0; 
  padding: 4px;
}

/* <tfoot  class="trb"> */
.trb { 	position:sticky; bottom:0;" }