
table.xlTable {
	max-width: 100%;
	min-width: 100%;
	border: solid 1px;
	font-size: 14px;
	border-collapse: collapse;
	width:  100%;
}

.xlTable tr {
	border: solid 1px;
	font-size: 14px;
	width: 100%;
}

.xlTable tr:hover {
	background-color: #FFFC6A;
}

.xlTable td {
	/*padding: 4px;*/
	border: solid 1px;
	font-size: 14px;
}

.xlTable th {
	padding: 4px;
	border: solid 1px;
	font-size: 14px;
	word-break: break-word;
}


/*Anything under 330px wide*/
@media (max-width: 330px) {
	.xlTable td {
		font-size: .35rem;
	}
	.xlTable th {
		font-size: .25rem;
	}
}




/*extra Small devices (landscape phones, 330px and up)*/
@media (min-width: 330px) {
	.xlTable td {
		font-size: .65rem;
	}
	.xlTable th {
		font-size: .3rem;
	}

}

/*extra Small devices (landscape phones, 400px and up)*/
@media (min-width: 400px) {
	.xlTable td {
		font-size: .65rem;
	}
	.xlTable th {
		font-size: .35rem;
	}

}



/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
	.xlTable td {
		font-size: .65rem;
	}
	.xlTable th {
		font-size: .45rem;
	}



}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
	.xlTable td {
		font-size: .75rem;
	}
	.xlTable th {
		font-size: .75rem;
	}




}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) { 
	.xlTable td {
		font-size: .9rem;
	}
	.xlTable th {
		font-size: .9rem;
	}

}


/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
	.xlTable td {
		font-size: 1rem;
	}
	.xlTable th {
		font-size: 1rem;
	}


}



#tableHighlight {
	padding: 4px;
	border-radius: 6px;
	background-color: rgba(255,255,255,0.3);
}