/* style.css */

/* Set default height of html and body elements to 100% to fill screen */
html, body {
  height: 100%;
  margin: 0px;
}

/* Set default height of container to 100% */
.container-fluid {
  height: 100%;
}

/* Make answer button container align buttons to the left */
.btnContainer {
  align-self: flex-start;
}

/* theme-styled button bkgd and border colors */
.btn {
  background-color: rgb(79, 55, 109);
  border-color: rgb(180, 147, 226);
  width: min-content;
}

/* theme-styled button:hover bkgd and border colors */
.btn:hover{
  border-color:rgb(178, 135, 238);
  background-color: rgb(178, 135, 238);
}

/* theme-styled button:active bkgd and border colors */
.btn:active{
  border-color:rgb(178, 135, 238);
}

/* theme-styled display-highscore link */
#highscoreElement {
  color: rgb(120, 80, 169);
}

/* theme-styled highscore-list-item bkgd */
.highscoreEl {
  background-color: rgb(239, 231, 250);
}

/* Answer-status-indicator text */
.statusText{
  color:grey;
}

/* Answer-status-indicator hr to spec width */
hr {
  width: 100%;
}

/* To style text to fit spec */
.smallText {
  font-size: medium;
}