

.grid-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 100px);
  background-color: rgb(173, 239, 241);
}

.deplacement {
  grid-column-start: 1;
  grid-column-end: 3;
}

.grid-container > div {
  /* display: block; */
  /* background-color: rgb(241, 220, 180); */
  border: none;
  border-width: 1px;
  border-color: darkmagenta;
  /* padding: 0; */
  /* width: 75%; */
  /* margin: auto auto; */
  margin: auto auto;
}

.aCentrer {
  margin: auto auto;
}

.button {
  border: 1px solid black;
  color: black;
  font-size: 20px;
  font-weight: bold;
  border-radius: 4px;
  transition-duration: 0.5s;
  width: 60px;
}

.button:hover {
  background-color: rgb(0, 0, 0);
  color: rgb(255, 255, 255);
}

.button:active {
  transition-duration: 0.1s;
  transform: translateY(4px);
}

.vertPale {
  background-color: rgb(191, 236, 175);
}

.orangePale {
  background-color: #fff2ccff;
}

.orangeFonce {
  background-color: rgb(253, 200, 143);
}

.rose {
  background-color: rgb(248, 185, 185);
}
