/* Styles for vue apps */
/************
  Checkbox Set
************/
.checkbox-set-wrapper {
  margin: 0 auto;
  font-size: 1.8em;
  text-align: center; }

.checkbox-set-item {
  margin-right: 1em; }

.checkbox-set-title {
  font-size: 1.2em;
  color: 3e3e3e;
  margin-bottom: 1em; }

/************
  Cloze forced choice
************/
.cloze-forced-choice-wrapper {
  min-height: 14em; }

.cloze-forced-choice-item {
  text-align: center; }

@media (max-width: 575px) {
  /* Taller min-height on mobile, so buttons don't jump around */
  .cloze-forced-choice-item {
    min-height: 12em; } }
@media (min-width: 576px) {
  .cloze-forced-choice-item {
    min-height: 9em; } }
.cloze-forced-choice-target {
  font-size: 2em;
  transition: color 1.0s;
  line-height: 1.2em; }

.cloze-forced-choice-hint {
  font-size: 1.2em;
  font-style: italic; }

.cloze-forced-choice-button-row {
  margin: 2em 0;
  text-align: center; }

.cloze-forced-choice-button {
  font-size: 2.3em;
  min-width: 3em;
  margin: 0 0.5em;
  background-color: #20A3EE;
  color: white; }

.cloze-nav-button {
  width: 5em;
  font-size: 1.8em; }

.cloze-target-slot {
  margin: 0 0.25em; }

.cloze-target-answer {
  /* margin: 0 0.25em; */
  font-weight: bold;
  /* text-decoration: underline; */ }

.cloze-forced-choice-explanation {
  font-size: 1.4em;
  font-style: italic;
  margin-top: 1em; }

.cloze-forced-choice-explanation-highlight {
  font-weight: bold; }

.correct {
  color: #5da423; }

.incorrect {
  color: orange; }

.background-correct {
  background-color: #5da423; }

.background-incorrect {
  background-color: orange; }

.cloze-forced-choice-placeholder {
  margin: 0 auto;
  width: 75%;
  font-size: 1.3em; }

/************
  Apps 
************/
.app-wrapper {
  margin: 0 auto;
  /* padding: 1em 2em; */
  /* background-color: #f9f9f9; */ }

/*# sourceMappingURL=vue.css.map */