/* PAGE LAYOUT */

#game {}
.quiz-page .game-container {
  display: flex;
  height: 100vh;
}
.quiz-page .game-container .c-1 {
  width: 60%;
  padding: 3vw 6vw 0;
}
.quiz-page .game-container .c-2 {
  width: 20%;
  padding: 2vw 0 0;
}
.quiz-page .game-container .c-3 {
  width: 30%;
  padding: 2vw 2vw 0 0;
  overflow: hidden;
  text-align: right;
}
.quiz-page .game-container .c-3 .note-img {
  width: auto;
  height: 100%;
}

/* QUESTIONS */
.questions .choice-container p {
  margin-bottom: 0;
}

.questions h2 {
  font-size: calc(1rem + 1vw);
  margin-bottom: 3vw;
}

.choice-container {
  display: flex;
  margin-bottom: 1vw;
  width: 80%;
  font-size: calc(1rem + 0.5vw) ;
  font-weight: bold;
  border: 0.3vw solid #000;
  -webkit-border-radius: 4vw;
  -moz-border-radius: 4vw;
  border-radius: 4vw;
}

.choice-container:hover {
  cursor: pointer;
}

.choice-prefix {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background-color: #000;
  font-weight: bold;
  text-transform: lowercase;
  color: #fff;
  width: 4vw;
  height: 4vw;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
}

.choice-text {
  padding: 0 2vw;
  width: 100%;
  display: flex;
  align-items: center;
}

.correct {
  background-color: #28a745;
}

.incorrect {
  background-color: #dc3545;
}

/* HUD */
#hud {
  margin-bottom: 2vw;
}
.score-main-text {
  text-align: center;
}

#question-string {
  display: none;
}

#progressBar {
  width: 20vw;
  height: 3vw;
  border: 0.3vw solid #000;
}

#progressBarFull {
  height: 100%;
  background-color: #000;
  width: 0%;
}

.circle-container {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 10px;
  background: #000;
  color: #fff;
  width: 10vw;
  height: 10vw;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  text-align: center;
}
.score-prefix {
  font-size: calc(1rem + 0.5vw);
}
.circle-container h2 {
  font-size: calc(1rem + 1vw);
  color: #fff;
  margin-bottom: 0;
}