.q-body ol {
  list-style-type: upper-alpha;
}

.q-body ol li {
  margin-bottom: 3px;
}

.q-body ol > li::marker {
  font-weight: bold;
}


.explain-result ol {
  list-style-type: upper-alpha;
}

.explain-result ol li {
  margin-bottom: 3px;
}

.explain-result ol > li::marker {
  font-weight: bold;
}


.question-number {

  width: 100%;
  margin-top: 10px;
  margin-bottom: 20px;
  padding: 4px;
  padding-left: 0px;
  font-size: 1.1em;
  font-weight: bold;
  /*background-color: #d9d9d9;*/
  /*border-radius: 6px;*/
  border-bottom: 1px solid #d9d9d9;

}

.q-contain {
  max-width: 800px;
  margin: 0 auto;
  position: absolute;
  left: 0px;
  right: 0px;
  top: 60px;
  bottom: 60px;
  overflow: auto;
}

.q-body {
  padding: 15px;
  overflow: hidden;
/*
  position: absolute;
  top:10px;
  left:10px;
  right: 10px;
  bottom: 190px;
  */
  display:none;
}
.q-body img {
  max-width: 100%;
  display: flex;
  flex-direction: column;
}

.button-instruct {
  padding: 20px;
  font-style: italic;
}

.button-contain {
  /*width: 100%;*/
  /*text-align: center;*/
  /*margin-top: 40px;
  margin-bottom: 40px;*/
  /*position: absolute;
  bottom: 0px;
  left:10px;
  right: 10px;
  */

  z-index: 1;
  background-color: white;
  border-top: 1px solid #d9d9d9;
  text-align: center;

  padding: 1em 0;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;

}

.answer-button {

  flex: 0 0 20%;
  margin-right: 10px;
  margin-bottom: 10px;
  text-align: center;

  min-height: 50px;
  min-width: 50px;
  line-height: 33px;

}

.btn-answer.button-selected {
  background-color: #052949;
  color: white;
  /*font-weight: bold;*/
}


.btn-answer:hover {
  color:#17a2b8;
  border-color:#052949;
}


.btn-answer{
    color:#fff;background-color:#17a2b8;border-color:#17a2b8
}

.show-correct-button {

    color: #fff !important;
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}

