/* pause menu styling */

.pauseMenu,
.gameLost,
.gameWon {
  position: fixed;

  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;

  padding: 5em;
  width: 20rem;
  height: 5rem;

  background: linear-gradient(
    186.1deg,
    rgba(110, 198, 65, 0.2) 13.63%,
    rgba(110, 198, 65, 0) 95.41%
  );
  border: 10px solid;
  border-image: linear-gradient(
    180deg,
    rgba(137, 238, 86, 0.966) 22.63%,
    rgba(32, 85, 6, 0.767) 95.41%
  );

  border-image-slice: 80;

  color: rgba(137, 238, 86, 0.966);
  text-align: center;
  font-size: 1.5rem;
}

/* buttons */

.buttonContainer {
  display: flex;
  align-items: center;
  justify-content: center;

  margin-top: 2rem;
}

.resumeButton {
  justify-content: flex-start;
  align-items: flex-end;
  margin-right: 0 !important;

  background: linear-gradient(
    186.1deg,
    rgba(110, 198, 65, 0.2) 13.63%,
    rgba(110, 198, 65, 0) 95.41%
  );

  background-image: url(../assets/images/button-frame.png);
  background-size: cover;

  border-radius: 0rem !important;
  border-style: none !important;
  border: none !important;

  width: 9rem !important;
  height: 3.2rem !important;
}

.backToMain {
  background: linear-gradient(
    186.1deg,
    rgba(110, 198, 65, 0.2) 13.63%,
    rgba(110, 198, 65, 0) 95.41%
  );

  background-image: url(../assets/images/button-back-to-menu.png);
  background-size: cover;

  border-radius: 0rem !important;
  border-style: none !important;
  border: none !important;

  width: 21rem !important;
  height: 3.2rem !important;
}

.backToMainButton {
  background: linear-gradient(
    186.1deg,
    rgba(110, 198, 65, 0.2) 13.63%,
    rgba(110, 198, 65, 0) 95.41%
  );

  background-image: url(../assets/images/button-frame.png);
  background-size: cover;

  border-radius: 0rem !important;
  border-style: none !important;
  border: none !important;

  width: 10rem !important;
  height: 5rem !important;
}