/* Typically we like a transparent body but,in addition,
    the IFRAME that includes the sudoku must have 
    the style  allowtransparency="true" */
body
{  background-color:transparent;
}


/* This table contains the sudoku-BLOCKS */
table.sudokubig  
{ background-color:rgb(100,200,255);


  border-width:7px;
  border-color:red;
  border-style:dotted;


  padding:5px;
  margin:5px;
  spacing:5px;


}
table.sudokubig td 
{ background-color:yellow;

  text-align:center;
  align:middle;
  padding:5px;
  margin:5px;
  spacing:5px;


}


/* This kind of table is a sudoku-BLOCK */
table.smalltab
{ background-color:orange;
  border-color:black;
  border-width:4px;
  border-style: dotted;
}

 /* The individual sudoku cells */
table.smalltab td 
{ background-color:rgb(230,230,255); 
  color:rgb(200,50,50);
  border-color:yellow;
  border-width:2px;
  border-style:dotted;


  font-family: OCR A Extended;

  padding:0px;   /*otherwice the cells becomes rectangular instead of square*/


  width:25px;
  height:25px;
  font-size:15px;
}

 /* The hidden cells may have another formatting */
table.smalltab td.hide 
{ background-color: rgb(200,255,255);
  color:rgb(100,155,155);
  font-family:Comic Sans MS;
}