body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 20px;
}

table {
    width: 850px;
    margin-bottom: 20px;
    border: 1px solid #D0D0D0;
    background-color: #F0F0F0;

    -moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	table-layout: fixed;
}

td {
    font-size: 14px;
    padding: 5px;
    position: relative;
}

thead tr td {
    text-align: center;
}

th {
    font-size: 14px;
    text-align: left;
    padding: 5px;
    background-color: #D0D0D0;
}

thead {
    background-color: #D0D0D0;
}

thead tr td:first-child {
	background-color: #F0F0F0;
}

td.full {
    background-color: #B0E57C;
}

td.partial {
    background-color: #FFF0AA;
}

td.none {
    background-color: #FFAEAE;
}

td.fulls {
    background-color: #A0D56C;
}

td.partials {
    background-color: #EFE09A;
}

td.nones {
    background-color: #EF9E9E;
}

td.s {
	background-color: #E0E0E0;
}

#hints {
	display: none; 
	position: absolute;
	top: 100%;
	left: 0%;
	z-index: 2; 
	pointer-events:none; 
	width: 250px; 
	border: 1px solid #C0C0C0;
	text-align: left;
	background-color: #FFFFFF;
	padding-left: 5px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	margin-top: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}