#boardContainer {
  display: block;
  width: max-content;         
  margin: 20px auto !important; 
  padding: 10px;
  background-color: rgb(89, 110, 119);
  border: 4px solid black;
  border-radius: 6px;
}


#chessboard {
  border-collapse: collapse !important;
  margin: 0 auto !important;
  background-color: tan;
  border: 4px solid black;
  border-radius: 10px;
  table-layout: fixed; 
}

#chessboard td {
  width: 80px !important;
  height: 80px !important;
  border: 4px solid black !important;
  font-size: 60px !important;
  text-align: center !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  padding: 0 !important;          
  border-radius: 4px;
  font-family: monospace;
  box-sizing: border-box;
}

#chessboard th {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  font-size: 14px !important;
  font-weight: bold !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  text-align: center !important;
  vertical-align: middle !important;
  padding: 0 !important;          
  box-sizing: border-box;
}

#chessboard thead th,
#chessboard tfoot th {
  width: 80px !important;
  min-width: 80px !important;
  height: 28px !important;
}

#chessboard thead th:first-child,
#chessboard tfoot th:first-child {
  width: 28px !important;
  min-width: 28px !important;
}

#chessboard tbody tr:nth-child(odd) td:nth-child(even) {
  background: #D2B48C;
}
#chessboard tbody tr:nth-child(even) td:nth-child(odd) {
  background: #D2B48C;
}

#chessboard tbody tr:nth-child(odd) td:nth-child(odd),
#chessboard tbody tr:nth-child(even) td:nth-child(even) {
  background: #F5DEB3;
}

#chessboard, #chessboard * {
  border-spacing: 0 !important;
}

/* Board rotation (black perspective) */
#board.rotated { transform: rotate(180deg); }
#board.rotated .square { transform: rotate(180deg); }