body {font-family:arial; margin:20px 50px;}
table {width:450px; height:450px; border:1px solid black; border-collapse: collapse; margin-bottom:20px; font-size:25px; font-weight:bold;}
td {border:1px solid black; width:11.11%; text-align:center; }
td:nth-child(3n+3) { border-right:3px solid black;}
td:last-child { border-right:1px solid black; }
td.hgood { background-color:lightgreen; }
td.hbad { background-color:lightpink; }
tr { height:11.11%; }
tr:nth-child(3n+3) {border-bottom:3px solid black;}
tr:last-child { border-bottom:1px solid black; }
input[type=text] { border:none; border-bottom:1px inset #bbbbbb; width:80%; height:80%; text-align:center; font-size:inherit; font-weight:inherit;}
input[type=submit] { background-color:#4CAF50; border:none; color:white; padding:16px 32px; text-decoration:none; margin:4px 2px; cursor:pointer; font-weight:bold; font-size:20px; border-radius:12px; }
@media screen and (max-width: 992px) {
  table { width: 100%; }
}