.role,
.school,
.schoolclass,
.player,
.question,
.challenge,
.role-body,
.school-body,
.schoolclass-body,
.player-body,
.question-body,
.challenge-body,
.role-form,
.school-form,
.schoolclass-form,
.player-form,
.question-form,
.challenge-form {
  display: inline-block;
  position: relative;
  width: 100%;
}
.role-container,
.school-container,
.schoolclass-container,
.player-container,
.question-container,
.challenge-container {
  width: 100%;
  position: relative;
  display: inline-block;
}
.role-buttons,
.school-buttons,
.schoolclass-buttons,
.player-buttons,
.question-buttons,
.challenge-buttons {
  position: relative;
  display: inline-block;
}
.role-btn,
.school-btn,
.schoolclass-btn,
.player-btn,
.question-btn,
.challenge-btn {
  border: 1px solid var(--light-green);
  border-radius: 8px;
  padding: 10px;
  margin-bottom: 10px;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
  background-color: var(--light-orange);
  width: 130px;
  display: inline-block;
}
td {
  border-bottom: 1px dotted black !important;
  border-top: 1px dotted black !important;
  padding-left: 5px;
  padding-right: 5px;
}
.question-input-text {
  width: 70%;
}