div.grid {
  text-align: center;
}

div.grid table {
  table-layout: fixed;
  text-align: center;
  font-size: 14pt;
  border-style: solid;
  border-width: 3px;
  border-color: black;
  border-collapse: collapse;
  empty-cells: show;
  width: 360px;
  vertical-align: middle;
  margin: 0 auto;
}

div.gridmini table {
  table-layout: fixed;
  text-align: left;
  font-size: 10pt;
  border-style: solid;
  border-width: 3px;
  border-color: black;
  border-collapse: collapse;
  empty-cells: show;
  width: 240px;
  margin: 0 auto;
}

div.gridsol table {
  text-align: center;
  font-size: 11pt;
  border-style: solid;
  border-width: 3px;
  border-color: black;
  border-collapse: collapse;
  empty-cells: show;
  width: 700px;
  vertical-align: middle;
  margin: 0 auto;
}

tr.grid {
  height: 40px;
}

tr.gridmini {
  height: 20px;
}

td.normal{
  border-top: 1px solid black;
  border-right: 1px solid black;
  text-align: center;
  vertical-align: middle;
  width: 40px;
  height: 40px;
}

td.normalmini{
  border-bottom: 1px solid black;
  border-right: 1px solid black;
  text-align: center;
  vertical-align: middle;
  width: 20px;
  height: 20px;
}

td.normalsol{
  border-bottom: 1px solid black;
  border-right: 1px solid black;
  text-align: center;
  vertical-align: middle;
}

td.rightedge{
  border-top: 1px solid black;
  border-right: 2px solid black;
  text-align: center;
  vertical-align: middle;
  width: 40px;
  height: 40px;
}

td.rightedgemini{
  border-top: 1px solid black;
  border-right: 2px solid black;
  border-bottom: 1px solid black;
  text-align: center;
  vertical-align: middle;
  width: 20px;
  height: 20px;
}

td.rightedgesol{
  border-top: 1px solid black;
  border-right: 2px solid black;
  border-bottom: 1px solid black;
  text-align: center;
  vertical-align: middle;
}

td.bottomedge{
  border-bottom: 2px solid black;
  border-right: 1px solid black;
  text-align: center;
  vertical-align: middle;
  width: 40px;
  height: 40px;
}

td.bottomedgemini{
  border-bottom: 2px solid black;
  border-right: 1px solid black;
  text-align: center;
  vertical-align: middle;
  width: 20px;
  height: 20px;
}

td.bottomedgesol{
  border-bottom: 2px solid black;
  border-right: 1px solid black;
  text-align: center;
  vertical-align: middle;
}

td.bottomright{
  border-bottom: 2px solid black;
  border-right: 2px solid black;
  text-align: center;
  vertical-align: middle;
  width: 40px;
  height: 40px;
}

td.bottomrightsol{
  border-bottom: 2px solid black;
  border-right: 2px solid black;
  text-align: center;
  vertical-align: middle;
}

td.bottomrightmini{
  border-bottom: 2px solid black;
  border-right: 2px solid black;
  text-align: center;
  vertical-align: middle;
  width: 20px;
  height: 20px;
}

.gridinput {
  border: solid 0;
  width: 20pt;
  font-size: 14pt;
  text-align: center;
  vertical-align: middle;
}

.gridinputsmall {
  border: solid 0;
  margin: 0pt;
  width: 30pt;
  font-size: 8pt;
  text-align: center;
  vertical-align: top;
}

.gridinputred {
  border: solid 0;
  margin: 0pt;
  width: 20pt;
  font-size: 14pt;
  text-align: center;
  vertical-align: middle;
  color: red
}

.gridinputgreen {
  border: solid 0;
  margin: 0pt;
  width: 20pt;
  font-size: 14pt;
  text-align: center;
  vertical-align: middle;
  color: green
}