.body {
  background-color: oklch(0% 0 0);
}

.title {
  color: oklch(100% 0 0);
  text-align: center;
}

#board {
  position: relative;
  width: 1024px;
  height: 863px;
  margin: auto;
  background: url(./images/board.jpg);
  background-repeat: no-repeat;
}

#messageArea {
  position: absolute;
  top: 0px;
  left: 0px;
  color: oklch(67.09% 0.2377 136.82);
}

.table {
  position: absolute;
  top: 99px;
  left: 173px;
  border-spacing: 0px;
}

td {
  width: 94px;
  height: 94px;
}

.form {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 15px;
  background-color: oklch(67.09% 0.2377 136.82);
}

.input {
  background-color: oklch(79.48% 0.1369 133.49);
  border-color: oklch(67.09% 0.2377 136.82);
  font-size: 1em;
}

.hit {
  background: url(./images/ship.png);
  background-repeat: no-repeat;
  background-position: center center;
}

.miss {
  background: url(./images/miss.png);
  background-repeat: no-repeat;
  background-position: center center;
}