#briefing {
      text-align: center;
}

#text_1 {
      font-weight: 900;
      text-shadow: black 0px 5px 5px;
}

#briefing_button {
      cursor: pointer;
      color: white;
      background-color: #222831;
      border: solid 2px #151922;
      transition: 0.20s ease-in-out;
}

#briefing_button:hover {
      background-color: #36454F;
}

.briefing_fade {
      opacity: 0;
      transition: opacity 0.25s ease-in-out;
}

#loading {
      transition: opacity 0.15s ease-in-out;
}

.loading_hidden {
      opacity: 0;
}

.loading_visible {
      opacity: 1;
}

#question_buttons {
      position: absolute;
      text-align: center;
}

.question_button {
      cursor: pointer;
      color: white;
      background-color: #222831;
      border: solid 2px #151922;
}

.question_button:hover {
      background-color: #36454F;
      font-weight: 700;
}

.selected {
      border-color: #2F4F4F;
      font-weight: 700;
}

#timer {
      position: absolute;
      font-weight: 800;
      color: #50C878;
}

@media screen and (orientation: landscape) {
      .briefing_text {
            font-size: 2.5vh;
      }

      input {
            height: 1.5vh;
            width: 1.5vh;
      }

      #briefing_button {
            font-size: 2vh;
            padding: 2vh;
            width: 25vh;
      }

      #briefing_label {
            font-size: 1.75vh;
      }

      #loading {
            width: 10vw;
            height: 10vw;
      }

      #question_buttons {
            top: 1vh;

      }

      .question_button {
            width: 4vh;
            height: 4vh;
            margin: 0.5vh;
            font-size: 2vh;
      }

      #timer {
            left: 5vh;
            font-size: 3vh;
      }
}

@media screen and (orientation: portrait) {
      #question_buttons {
            top: 1vw;
      }

      .briefing_text {
            font-size: 2.5vw;
      }

      #briefing_button {
            font-size: 2vw;
            padding: 2vw;
            width: 25vw;
      }

      input {
            height: 1.5vw;
            width: 1.5vw;
      }

      #briefing_label {
            font-size: 1.75vw;
      }

      #loading {
            width: 10vh;
            height: 10vh;
      }

      .question_button {
            width: 4vw;
            height: 4vw;
            margin: 0.75vw;
            font-size: 2vw;
      }

      #timer {
            left: 5vw;
            font-size: 3vw;
      }
}