body {
  background-color: rgb(56, 28, 82);
  display: flex;
  flex-direction: column;
  align-items: center;
}
h3 {
  color: rgb(247, 157, 247);
  font-size: 20px;
}
h2 {
  color: white;
  font-size: 40px;
}
a {
  text-decoration: none;
}
p {
  font-size: 20px;
  color: white;
  font-weight: 300;
}
span {
  font-size: 20px;
  color: greenyellow;
}

#gameContainer {
  width: 800px;
  height: 150px;
  margin-top: 100px;
  border: 2px solid black;
  border-radius: 15px;
  box-shadow: 0 0 15px rgb(247, 157, 247);
  display: flex;
  justify-content: space-between;
  background-color: rgb(45, 23, 66);
  visibility: hidden;
}
#playerPanel,
#computerPanel {
  width: 250px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
#playerPanel {
  border-right: 2px solid black;
}
#computerPanel {
  border-left: 2px solid black;
}

#gameplayPanel {
  width: 300px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 100px;
  align-items: center;
}

#display {
  background-color: white;
  height: 60px;
  width: 280px;
  border: 2px solid black;
  box-shadow: 0 0 10px rgb(247, 157, 247);
  border-radius: 15px;
  text-align: center;
  line-height: 60px;
  font-weight: 700;
  font-size: 16px;
  color: blueviolet;
}
.playBtn,
.action-btn,
.choice-btn {
  width: 300px;
  height: 50px;
  font-size: large;
  border: 2px solid black;
  border-radius: 10px;
  box-shadow: 0 0 10px rgb(247, 157, 247);
  background-color: rgb(45, 23, 66);
  color: white;
  font-weight: 600;
  cursor: pointer;
}
#topLink {
  color: wheat;
}
#projectLink {
  color: rgb(247, 157, 247);
}
#menuContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#projectHeader {
  display: flex;
  align-items: center;
  gap: 5px;
}
.btn-hover {
  color: rgb(247, 157, 247);
  background-color: rgb(50, 25, 73);
}
.avatar {
  border-radius: 15px;
  background-color: white;
  border: 2px solid black;
  box-shadow: 0 0 10px rgb(247, 157, 247);
}
#playerStats,
#computerStats {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.action-btn {
  width: 110px;
  height: 40px;
  font-size: 14px;
}
.choice-btn {
  width: 80px;
  height: 70px;
  border-radius: 15px;
  font-size: 40px;
  text-align: center;
}
#buttonsContainer {
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  margin-bottom: 10px;
}
#crownPlayer,
#crownComputer {
  visibility: hidden;
}
