.navbar {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
}
.active {
  background-color: green;
  color: white;
}

li {
  float: left;
}

li a { 
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover:not(.active) {
  background-color: #111;
  color: white;
}
body {
    background-color: lightgray;
}

.graded {
    text-align: center;
    background-color: #A7A2A9;
    border:0px solid black;
    border-radius: 25px;
    width: 500px;
    margin: auto;
    margin-top: 40px;
}

.quiz {
    text-align: center;
    background-color: #B2AC88;
    border:0px solid black;
    border-radius: 50px;
    width: 500px;
    margin: auto;
    margin-top: 40px;
}

.answer {
    transition: transform .3s;
}

.answer:hover {
    transform: scale(1.4);
}

.correct {
  color: green;
  text-shadow: 1px 1px black;
}

.incorrect {
  color: red;
  text-shadow: 1px 1px black;
}

.dropdown {
    position: relative;
    width: 230px;
}

.submitButton {
    background-color: #FFFDD0;
    border: 1px solid black;
    border-radius: 15px;
    box-shadow: 0 6px gray;
    color: black;
    padding: 5px 10px;
    margin-bottom: 10px;
    cursor: pointer;
}

.submitButton:hover {
    background-color: #F9E4BC;
}

.submitButton:active {
    background-color: #F9E4BC;
    box-shadow: 0 2px #666;
    transform: translateY(4px);
}