/* Page height and width */
#editorContainer {
    width: 8.5in;
}

#content {
    height: 11in;
}

/* Quill Toolbar */
.ql-toolbar {
    background: #eaecec;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
}

/* Dropdowns */
#toolbar .ql-dropdownLabel {
    font-size: 14px;
    pointer-events: none;
    width: auto;
}

#toolbar .ql-picker {
    font-size: 14px;
}

.ql-picker-item::before,
.ql-picker-label::before {
    content: attr(data-label);
}

#toolbar .ql-picker-label {
    padding-left: 0px;
    border-right: 1px solid darkgray;
}

/* Checkboxes */
#toolbar label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#toolbar label {
    cursor: pointer;
}

#toolbar label input {
    cursor: pointer;
}

/* Quill Content */
#content div {
    border: 1px solid transparent;
    cursor: default;
}

#content .hoverStyle {
    border: 1px solid red;
}

#content .selectedStyle {
    border: 1px solid orange;
}


/* UI outside of Quill */
#instructionsContainer {
    width: 8.5in;
}

#instructions {
    min-height: 0.5in;
    border: 1px solid black;
    padding: 5px;
    margin-bottom: 5px;
}

#feedback {
    min-height: 25px;
    padding: 5px;
    margin-bottom: 5px;
}

.controlBtn {
    width: 50px;
}

#doneButton {
    margin-bottom: 5px;
}

.incorrectFeedback {
    background-color: pink;
}

.correctFeedback {
    background-color: lightgreen;
}