body {
  background-color: rgb(29, 63, 76);
  /* Use a system font, if none are available use an available sans-serif */
  font-family: system-ui, sans-serif;
  margin: 1;
  text-align: center;
}
.board {
  display: flex;
  flex-wrap: wrap;
  width: 325px;
  margin: auto;
}
.board2 {
  display: flex;
  flex-wrap: wrap;
  width: 425px;
  margin: auto;
}
.sqr {
  width: 30%;
  aspect-ratio: 1/1;
  border: 3px solid #1e7f9f;
  font-size: 64px;
  border-radius: 9px 9px;
  margin: 2px;
  background-color: #2d4593;
  color: rgb(179, 172, 172);
}
.sqr2 {
  width: 22%;
  aspect-ratio: 1/1;
  border: 3px solid #1e7f9f;
  font-size: 64px;
  border-radius: 9px 9px;
  margin: 2px;
  background-color: #2d4593;
  color: rgb(179, 172, 172);
}
#reset {
  display: flex;
  flex-direction: column;
  font-size: 27px;
  border-radius: 7px 7px;
  margin: auto;
  margin-top: 25px;
  background-color: #2a7f90;
  font: sans-serif;
}
#reset:active {
  transform: scale(90%);
}
#reset2 {
  display: flex;
  flex-direction: column;
  font-size: 27px;
  border-radius: 7px 7px;
  margin: auto;
  margin-top: 25px;
  background-color: #2a7f90;
  font: sans-serif;
}
#reset2:active {
  transform: scale(90%);
}
#message {
  color: rgb(89 139 255);
  border-radius: 5px 5px;
  margin-top: -10px;
  font-size: 27px;
}
#msg {
  color: #1b9069;
  font-size: 40px;
}
.choice1 {
  display: flex;
  flex-direction: column;
  font-size: 40px;
  border-radius: 7px 7px;
  margin: auto;
  margin-top: 135px;
  background-color: #2a7f90;
  font: sans-serif;
}
.choice2:active {
  transform: scale(90%);
}
.choice2 {
  display: flex;
  flex-direction: column;
  font-size: 35px;
  border-radius: 7px 7px;
  margin: auto;
  margin-top: 135px;
  background-color: #2a7f90;
  font: sans-serif;
}
.choice2:active {
  transform: scale(90%);
}
.choice3 {
  display: flex;
  flex-direction: column;
  font-size: 40px;
  border-radius: 7px 7px;
  margin: auto;
  margin-top: 35px;
  background-color: #2a7f90;
  font: sans-serif;
}
.choice3:active {
  transform: scale(90%);
}
.choice4 {
  display: flex;
  flex-direction: column;
  font-size: 35px;
  border-radius: 7px 7px;
  margin: auto;
  margin-top: 25px;
  background-color: #2a7f90;
  font: sans-serif;
}
.choice4:active {
  transform: scale(90%);
}
.back{
  position: absolute;
  top: 45px;
  left: 40px;
  z-index: 999;
  font-size: 25px;
  border-radius: 7px 7px;
  background-color: #2a7f90;
}
.back:active {
  transform: scale(95%);
}
.hidden {
  display: none;
}