
table.body, table.body tr, table.body td {
  table-layout:fixed; /* to make masonry working on small screens */ 
  border-collapse:collapse;
}

table.body td {
  font-size:20px;
  text-align:center;
  border:1px solid #C0C0C0;
  min-width:30px;
  max-width:30px;
  width:30px;
  min-height:30px;
  max-height:30px;
  height:30px;
  padding:0;
  cursor:pointer;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;        
}

table.body > tbody > tr {
  position:relative;
}

.selector {
  position:absolute;
  left:-12px;
  top:-10px;
  background: white;
  z-index: 1;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#t00 { border-color:black silver black black; } 
#t01 { border-color:black silver black silver; } 
#t02 { border-color:black silver black silver; } 
#t03 { border-color:black silver black silver; } 
#t04 { border-color:black silver black silver; } 
#t05 { border-color:black silver black silver; } 
#t06 { border-color:black silver black black; } 
#t07 { border-color:black silver black silver; } 
#t08 { border-color:black silver black silver; } 
#t09 { border-color:black black  black silver; } 

#t00:hover, #t01:hover, #t02:hover,
#t03:hover, #t04:hover, #t05:hover, 
#t06:hover, #t07:hover, #t08:hover, 
#t09:hover { 
  background-color:rgb(240,240,240); 
} 



#c00,#c30,#c60 { border-color:black silver silver black; } 
#c01,#c31,#c61 { border-color:black silver silver silver; } 
#c02,#c32,#c62 { border-color:black black silver silver; } 
#c03,#c33,#c63 { border-color:black silver silver black; } 
#c04,#c34,#c64 { border-color:black silver silver silver; } 
#c05,#c35,#c65 { border-color:black black silver silver; } 
#c06,#c36,#c66 { border-color:black silver silver black; } 
#c07,#c37,#c67 { border-color:black silver silver silver; } 
#c08,#c38,#c68 { border-color:black black silver silver; } 

#c10,#c40,#c70 { border-color:silver silver silver black; } 
#c11,#c41,#c71 { border-color:silver silver silver silver; } 
#c12,#c42,#c72 { border-color:silver black silver silver; } 
#c13,#c43,#c73 { border-color:silver silver silver black; } 
#c14,#c44,#c74 { border-color:silver silver silver silver; } 
#c15,#c45,#c75 { border-color:silver black silver silver; } 
#c16,#c46,#c76 { border-color:silver silver silver black; } 
#c17,#c47,#c77 { border-color:silver silver silver silver; } 
#c18,#c48,#c78 { border-color:silver black silver silver; } 

#c20,#c50,#c80 { border-color:silver silver black black; } 
#c21,#c51,#c81 { border-color:silver silver black silver; } 
#c22,#c52,#c82 { border-color:silver black black silver; } 
#c23,#c53,#c83 { border-color:silver silver black black; } 
#c24,#c54,#c84 { border-color:silver silver black silver; } 
#c25,#c55,#c85 { border-color:silver black black silver; } 
#c26,#c56,#c86 { border-color:silver silver black black; } 
#c27,#c57,#c87 { border-color:silver silver black silver; } 
#c28,#c58,#c88 { border-color:silver black black silver; } 

.fixed {
    background-color:rgb(240,240,240);
    color:rgb(100,100,100);
}

.selected {
  background-color:wheat;
}