/*	Xerte dark blue:#164883
	Xerte blue:		#6788ae */

td, th {border: 1px solid #ddd;}

th.VB3column, th.LOAcolumn {cursor: pointer;}

/* make - button to uncollapse table on small screen blue instead of red */
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child::before {
	background-color: #1a82e7;
}

div.dt-button-collection {width: 195px;}

.LOAcolumn {width: 73px;}

.copyright {
	font-style: italic;
	font-size: 14px;
}

.playingCellIndicator {
	background-color: #164883;
	color: #fff;
}

.playingSentenceIndicator {
    background-color: #6788ae;
	color: #fff;
	font-style: italic;
}

#progressBar {
	width: 0;
	background-color: #6788ae;
}

 /* TODO: margin hoger maken voor smallere schermen met media query */
#LOA_button {
	width: 87px;
	height: 22px;
	margin: 0;
	padding: 0;
	background-image: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* to prevent blue focus color */
}

#LOA_button.active {
	background-image: linear-gradient(to bottom, #c6d2fe 0%, #6788ae 100%);
}
#LOA_button.accentuate {
	background-image: linear-gradient(to bottom, #c3fcca 0%, #0acc0c 100%);
}