/******************************************************************************
 * 	Question Shortcode - Multiple Choice, Multiple Correct Choice, Draggable
 ******************************************************************************/
 .ss-quiz-question-explanation {
    display: none;
}
.ss-quiz-question-body {
    padding: 0.4em 2em 0.4em 0.4em;
}
.ss-quiz-question-response {
    cursor: pointer;
    padding: 0.4em 1em;
    border-radius: 0.4em;
    transition: all 0.2s;
    position: relative;
}
.ss-quiz-question-explanation-toggle {
    cursor: pointer;
    display: inline-block;
    padding: 0.4em 0.8em;
    margin: 0.8em;
    border-radius: 0.4em;
    transition: all 0.2s;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 92%
}
.ss-quiz-question-explanation {
    margin: 0.5em 2em 1em 1em;
    font-size: 92%;
    color: #454;
}
.ss-quiz-question-explanation-toggle:hover {
    background: rgba(0, 0, 0, 0.1);
}
.ss-quiz-question-explanation-toggle:active {
    background: rgba(0, 0, 0, 0.2);
}
.ss-quiz-question-response {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    transition: all 0.2s;
}
.ss-quiz-question-response:hover {
    background: rgba(200,200,200,0.15);
}
.ss-quiz-question-response .ss-quiz-question-response-letter {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3em;
    height: 1.7em;
    flex: 1.7em 0 0;
    text-align: center;
    text-transform: capitalize;
    transition: all 0.2s;
    position: relative;
    top: 1px;
}

.subtle-button.ss-quiz-question-submit-response {
    padding: 0.4em 0.8em;
}

.ss-quiz-question-prompt{
    display: flex;
    flex-direction: row;
}

/******************************************************************************
 * Multiple Choice
 ******************************************************************************/

.ss-quiz-question-response.ss-selected .ss-quiz-question-response-letter {
    background: rgba(0, 0, 0, 0.76);
    color: #fff;
}
.ss-quiz-question-response .ss-quiz-question-response-body {
    padding: 0 0.8em 0 0.5em;
    /* flex: 1 1 12em; */
    margin-right: 0.1em;
}

.ss-quiz-question-multiple-choice .ss-quiz-question-response.ss-selected {
    background: rgba(255, 0, 0, 0.1);
}
.ss-quiz-question-multiple-choice .ss-quiz-question-response.ss-selected:before {
    font-family: var(--7s-fonts-icons);
    content: '\f00d';
    color: #900;
    font-size: 130%;
    position: absolute;
    right: 0.6em;
}
.ss-quiz-question-multiple-choice .ss-quiz-question-response.ss-selected.ss-quiz-question-credited-response {
    background: rgba(0, 255, 0,0.2);
}
.ss-quiz-question-multiple-choice .ss-quiz-question-response.ss-selected.ss-quiz-question-credited-response:before {
    content: '\f00c';
    color: #090;
}

/******************************************************************************
 * Multiple Correct Choice
 ******************************************************************************/
 /*Selected*/
 .ss-quiz-question-multiple-correct-choice ul {
    list-style: none;
}

.ss-quiz-question-multiple-correct-choice ul li::before {
    content: "\2022";
    color: white;
    margin-left: -2em;
  }

.ss-quiz-question-multiple-correct-choice ul li {
    display: flex;
}

.ss-quiz-question-multiple-correct-choice .ss-quiz-question-response {
    width: 100%;
}

 .ss-quiz-question-multiple-correct-choice .ss-quiz-question-response.ss-selected {
    background: rgba(0, 0, 0, 0.12);
}

.ss-quiz-question-multiple-correct-choice .ss-quiz-question-response .ss-response-comment {
    display:none;
}

/*Didn't select, but not supposed to have chosen this one (green)*/
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-quiz-question-response {
    background: rgba(0, 255, 0,0.2) ;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-quiz-question-response:before {
    font-family: var(--7s-fonts-icons);
    content: '\f00c' !important;
    color: #090 !important;
    font-size: 130%;
    position: absolute;
    right: 0.6em;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-quiz-question-response .ss-response-comment{
    display:none;
}

/*Selected, but not supposed to have chosen this one (red)*/
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-selected.ss-quiz-question-response {
    background: rgba(255, 0, 0,0.2) ;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-selected.ss-quiz-question-response:before {
    font-family: var(--7s-fonts-icons);
    content: '\f00d' !important;
    color: #900 !important;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-selected.ss-quiz-question-response .ss-response-comment{
    margin-left: 2.5em;
    display:inline;
    font-size: 92%;
    color: #454;
}

/*Selected, but you were supposed to have chosen this one (green)*/
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-selected.ss-quiz-question-credited-response {
    background: rgba(0, 255, 0,0.2) ;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-selected.ss-quiz-question-credited-response:before{
    content: '\f00c' !important;
    color: #090 !important;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-selected.ss-quiz-question-credited-response .ss-response-comment{
    display:none;
}

/*Didn't select, but you were supposed to have chosen this one (red)*/
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-quiz-question-credited-response {
    background: rgba(255, 0, 0,0.2) ;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-quiz-question-credited-response:before {
    content: '\f00d' !important;
    color: #900 !important;
}
.ss-quiz-question-multiple-correct-choice.ss-quiz-question-show-response .ss-quiz-question-credited-response .ss-response-comment{
    margin-left: 2.5em;
    display:inline;
    font-size: 92%;
    color: #454;
}

/******************************************************************************
 * Draggable
 ******************************************************************************/
.ss-quiz-question-draggable-choice ul {
    list-style: none;
}

.ss-quiz-question-draggable-choice ul li::before {
    content: "\2022";
    color: white;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -2em;
  }

.ss-quiz-question-draggable-choice ul li {
    display: flex;
}

.ss-quiz-question-draggable-choice .ss-quiz-question-response {
    width: 100%;
    cursor: grab;
 }

.ss-quiz-question-draggable-choice .ss-quiz-question-response:active{
    width: 100%;
    cursor: grabbing;
 }

.ss-quiz-question-draggable-choice .fa-stack {
    font-size : 0.5em;
    margin-top: 8px;
}

.ss-quiz-question-draggable-choice .ss-response-comment {
    margin-left: 1.5em;
    font-size: 92%;
    color: #454;
    /* flex: 0 0 9em; */
}

.ss-quiz-question-draggable-choice .ss-quiz-question-response .ss-response-comment .fa-long-arrow-alt-up {
    margin-top: 8px;
    margin-right: 8px;
    color: #454;
}

.ss-quiz-question-draggable-choice .ss-quiz-question-response .ss-response-comment .fa-long-arrow-alt-down {
    margin-top: 8px;
    margin-right: 8px;
    color: #454;
}

.ss-quiz-question-draggable-choice.ss-quiz-question-show-response .ss-quiz-question-response {
    background: rgba(255, 0, 0, 0.2);
}

.ss-quiz-question-draggable-choice.ss-quiz-question-show-response .ss-quiz-question-response:before {
    font-family: var(--7s-fonts-icons);
    content: '\f00d';
    color: #900;
    font-size: 130%;
    position: absolute;
    right: 0.6em;
}

.ss-quiz-question-draggable-choice.ss-quiz-question-show-response .ss-quiz-question-correct-response {
    background: rgba(0, 255, 0,0.2) ;
}
.ss-quiz-question-draggable-choice.ss-quiz-question-show-response .ss-quiz-question-correct-response:before {
    content: '\f00c';
    color: #090;
}
