body {
    background-color:slategray;
}

/* prevent default user stylesheet settings */
ol {
  padding: 0;
}

.jumbotron {
    padding: 10px;
  }

  /* header JavaScript Skills Challenge! */
.quizInfo {
    text-align: center;
    padding-top: 50px;
    font-family: fantasy;
    color: cyan;
    text-shadow: 2px 2px slategray;
  }

  /* quiz instructions paragraph */
.instructionsP {
    text-align: center;
    color: slategray;
    text-shadow: 1px 1px cyan
  }

/* timer */
#timer {
  text-align: right;
  font-size: 18px;
  color: slategray;
  float: right;
}

/* the question */
.questions {
  padding: 10px;
  margin: 10px;
  color: slategrey;
  font-weight: bold;
  font-size: 20pt;
  text-shadow: 2px 2px cyan;
}

/* the answers */
#questionList {
  padding: 10px;
  margin: 10px;
  color: cyan;
  font-weight: bold;
  font-size: 20pt;
  text-shadow: 2px 2px slategray;
}

/* message when answer is wrong */
.wrongAnswer {
  font-size: 20pt;
  color: hotpink;
  text-align: center;
}

/* message when answer is right */
.rightAnswer {
  font-size: 20pt;
  color: hotpink;
  text-align: center;
}

/* high scores section */
#scores {
  color: cyan;
  text-align: center;
  font-size: 50pt;
  text-shadow: 2px 2px slategray;
  font-family: fantasy;
}

/* this applies to all buttons */
.btn {
  margin: 10px;
  color: cyan;
  background-color: hotpink;
  margin-left: 10px;
  font-size: 18pt;
  text-align: left;
  padding: 5px;
  border-radius: 10px;
}
.btn:hover {
  background-color: slategray
}

  /* this is the footer */
h6 {
    font-family: fantasy;
    color: cyan;
    text-align: center;
    background-color: hotpink;
    font-size: 24pt;
    padding: 10px;
    margin-top: 10px;
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 0;
    }