nav > div {
    margin: 7px 0;
}

.chapter {
    padding: 0 0 0 1em;
}

/*.ui-menu { width: 150px; }*/
#filmsNav {
    position: sticky;
    top: 0;
    width: 15rem;
    margin-right: 3px;
}
.underlinePlaceholder .hiddenAnswerPlaceholder {
    text-decoration: underline;
    font-weight: bolder;
}
.answerQuestionsWarning {
    display: none;
    color: red;
    font-weight: bold;
    border: red solid 1px;
    margin: 0 0 20px 12px;
    padding: 5px;
    width: 522px;
}

#revealAnswers {
    margin-left: 12px;
}

.hiddenAnswer {
    display: none;
    font-weight: bold;
}
.highlightedQuestion {
    font-weight: bold;
}
.highlightedAnswer {
    font-weight: bold;
}

ul#sortable {
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
}

.ui-accordion .ui-accordion-content {
    padding: 3px 3px 3px 3px;
}

#ytFrame {
    position: sticky;
    top: 0;
    padding-left: 15.2rem;
    height: auto;
}

.vocab {
    cursor: pointer;
    text-decoration: underline;
}

.divmatch > div > div {
    height: 3em;
    min-width: 20em;
    max-width: 20em;
    border: #0d3349 solid 1px ;
}
.divmatch {
    display: flex;
}

.answerRight {
    display: none;
    padding-left: 3em;
    font-style: italic;
}
.answerWrong {
    display: none;
    padding-left: 3em;
    font-style: italic;
}

.grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
    column-gap: 0.5em;
    width: 50%;
}
.grid-container > div.grid-item {
    display: block;
    min-height: 3em;
    min-width: 3em;
    width: 3em;
    max-width: 3em;
}

/* Russian Ukrainian */
.row {
    display: flex;
}

/* Create two equal columns that sits next to each other */
.column {
    flex: 50%;
    padding: 10px;

}