#header {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    padding-bottom: 20px;
}

#master-container {
    position: relative;
    width: 100%;
    
}


div.question-container {
  position: relative;
  width: 30%;
  height: 120%;
  margin: 0 2%;
  border: 2px solid black;
  float: left;
  background-color: transparent;
}

div.answer {
  font-weight: bold;
  text-align: center;
}
div.answer-container {
  float: left;
  margin-left: 2.5%;
  width: 20%;
  height: 100%;
  background-color: transparent;
  text-align: center;
}

div.word-bank {
  float: left;
  width: 100%;
  height: 100%;
  border: 2px solid black;
  font-size: small;
  margin-bottom: -10%;
}
/* div.submit-container{
    top: 20%;
    text-align: center;
    display: table-cell;
    border: 2px solid black;
} */
#submit {
  margin: 20px 20px;
  font-size: 1.5vw;
  background-color: #4caf50;
  margin: 10% auto;
  width: 80%;
  color: white;
  text-align: center;
  cursor: pointer;
}

/* styling of the individual answer blanks */
.dropBox {
  position: relative;
  text-align: center;
  border-bottom: 2px solid black;
  font-weight: 700;
  margin: 0 auto;
  height: 30px;
  width: 60%;
}

.dropBox.answer-hover {
  background: yellow;
}

/* .dropBox.has-answer.answer-hover{
    background: yellow;
}

.dropBox.has-answer{
    background: sandybrown;
} */

.answer {
  list-style-type: square;
  cursor: pointer;
  margin: 5%;
  font-size: 1.2vw;
}

/* .dropBox > .answer{
    margin: 50px;
} */

h1 {
  text-align: center;
  top: 50ppx;
}
h3 {
  text-indent: 2em;
  font-size: 1.5vw;
  margin: 5% 5%;
  text-align: left;
}
h4 {
  font-size: 1.2vw;
  margin: 5% 5%;
  margin-bottom: -5%;
}


#result {
    position: absolute;
    top: 90%;
    font-size: 1.5vw;
    font-weight: bold;
    float: center;
}