.bb td, .bb th {
	border-bottom: 1px solid black;
}
  
.topbb td, .topbb th {
	border-top: 1px solid black;
}
  
th {
	padding: 10px;
	font-size: 15px;
	color:#FFFFFF; 
	font-family: Arial, Helvetica, sans-serif;
}
td {
	padding: 10px;
	font-size: 15px;
	color:#FFFFFF; 
	font-family: Arial, Helvetica, sans-serif;
}
td a {
	display:block;
	width:100%;
	color:000000;
	text-decoration:none;
}

a:link {
  color: black;
  background-color: transparent;
  text-decoration: none;
}
a:visited {
  color: black;
  background-color: transparent;
  text-decoration: none;
}


td.redblue {
  position: relative;
  background: #708dc7;
}
td.redblue > span{
   position:relative;
}

td.redblue:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #f48186;
}


td.redgreen {
  position: relative;
  background: #a5d49a;
}
td.redgreen > span{
   position:relative;
}

td.redgreen:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #f48186;
}


td.redgray {
  position: relative;
  background: #DDDDDD;
}
td.redgray > span{
   position:relative;
}

td.redgray:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #f48186;
}



td.bluered {
  position: relative;
  background: #f48186;
}
td.bluered > span{
   position:relative;
}

td.bluered:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #708dc7;
}


td.bluegreen {
  position: relative;
  background: #a5d49a;
}
td.bluegreen > span{
   position:relative;
}

td.bluegreen:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #708dc7;
}


td.greenred {
  position: relative;
  background: #f48186;
}
td.greenred > span{
   position:relative;
}

td.greenred:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #a5d49a;
}

td.greenblue {
  position: relative;
  background: #708dc7;
}
td.greenblue > span{
   position:relative;
}

td.greenblue:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #a5d49a;
}


td.greengray {
  position: relative;
  background: #DDDDDD;
}
td.greengray > span{
   position:relative;
}

td.greengray:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #a5d49a;
}



td.whitered {
  position: relative;
  background: #f48186;
}
td.whitered > span{
   position:relative;
}

td.whitered:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #FFFFFF;
}


td.grayred {
  position: relative;
  background: #f48186;
}
td.grayred > span{
   position:relative;
}

td.grayred:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #DDDDDD;
}

td.grayblue {
  position: relative;
  background: #708dc7;
}
td.grayblue > span{
   position:relative;
}

td.grayblue:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #DDDDDD;
}

td.graygreen {
  position: relative;
  background: #a5d49a;
}
td.graygreen > span{
   position:relative;
}

td.graygreen:before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  right: 50%;
  bottom: 0;
  background: #DDDDDD;
}