.qti-interaction-editor {
    padding: 6px;
    border: 1px solid grey;
}

.qti-render-prompt {
    margin-bottom: 10px;
}

.qti-render-prompt > object {
    margin-bottom: 10px;
	border: 1px solid grey;
}

.qti-render-prompt > p {
    margin-top: 0;
    margin-bottom: 0;
}

.qti-title {
	padding: 3px;
	margin-bottom: 8px;
	font-style: italic;
}

.qti-title-close {
	float: right;
	display: inline-block;
}

.qti-title-close:hover {
	opacity: 1;
}

.qti-toolbar {
	margin-bottom: 20px;
	padding: 6px;
	border: 1px solid #ccc;
}

.qti-toolbar-button {
	cursor: pointer;
	display: inline-block;
	border: 1px solid transparent;
}

.qti-examples-button {
	padding: 3px 5px;
}

.qti-toolbar-button:hover {
	border-color: #bbb;
	background-color: #ddd;
}

.qti-toolbar-button > span {
	padding-left: 20px;
	display: inline-block;
	height: 16px;
	font-size: smaller;
	background-repeat: no-repeat;
}

.qti-preview-icon {
	background-image: url(../images/preview.png);
}

.qti-preview-icon:after {
	content: "Preview...";
}

.qti-examples-icon {
	background-image: url(../images/lightbulb.png);
}

.qti-examples-icon:after {
	content: "Examples...";
}

.qti-eee {
	color: #222;
	background: #eee;
	background: -ms-linear-gradient(top, #eee, #ddd);
	background: -webkit-linear-gradient(top, #eee, #ddd);
	background: -moz-linear-gradient(top, #eee, #ddd);
	background: linear-gradient(top, #eee, #ddd);
}

.qti-f8f8f8 {
	color: #222;
	background: #f8f8f8;
	background: -ms-linear-gradient(top, #f8f8f8, #eee);
	background: -webkit-linear-gradient(top, #f8f8f8, #eee);
	background: -moz-linear-gradient(top, #f8f8f8, #eee);
	background: linear-gradient(top, #f8f8f8, #eee);
}

.qti-ddd-hover:hover {
	background: #ddd;
	background: -ms-linear-gradient(top, #ddd, #ccc);
	background: -webkit-linear-gradient(top, #ddd, #ccc);
	background: -moz-linear-gradient(top, #ddd, #ccc);
	background: linear-gradient(top, #ddd, #ccc);
}

.qti-666 {
	color: white;
	background: #666;
	background: -ms-linear-gradient(top, #666, #444);
	background: -webkit-linear-gradient(top, #666, #444);
	background: -moz-linear-gradient(top, #666, #444);
	background: linear-gradient(top, #666, #444);
}

.qti-header {
	font-size: small;
	padding-left: 4px;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-bottom: 2px;
}

.qti-cke-justify-left {
	text-align: left;
}

.qti-cke-justify-center {
	text-align: center;
}

.qti-cke-justify-right {
	text-align: right;
}

.qti-cke-justify-full {
	text-align: justify;
}


/* qtiv prefix classes are for validation only */
.qtiv-title-success {
    background-color: #dff0d8 !important;
}
.qtiv-title-error {
    background-color: #f2dede !important;
}
.qtiv-title-warn {
    background-color: #fcf8e3 !important;
}
.qtiv-box-success {
    border: 1px solid #468847 !important;
}
.qtiv-box-error {
    border: 1px solid #b94a48 !important;
    background-color: #f2dede !important;
}
.qtiv-box-warn {
    border: 1px solid #c09853 !important;
    background-color: #fcf8e3 !important;
}
.qtiv-icon-info, .qtiv-icon-success, .qtiv-icon-warn, .qtiv-icon-error {
    #border: 1px solid;
    #margin: 1px 0px;
    padding: 3px 2px 3px 20px;
    background-repeat: no-repeat;
    background-position: 2px center;
    color: black;
}
.qtiv-icon-info {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('../images/info.png');
}
.qtiv-icon-success {
    color: #4F8A10;
    background-image:url('../images/greencheck.png');
}
.qtiv-icon-warn {
    color: #7B3F00;
    background-image: url('../images/warning.png');
    background-size:15px 15px;
    background-repeat:no-repeat;
}
.qtiv-icon-error {
    color: red;
    background-image: url('../images/red_x.png');
}

.qtiv-strike {
    text-decoration:line-through;
}

.qti-messages {
    border-top: 1px solid;
    margin: 10px 0px 0px 0px;
    padding: 10px;
    font-family: "Lucida Grande", Tahoma;
	font-size: 14px;
	font-weight: lighter;
	font-variant: normal;
	color: black;
	letter-spacing: 0.1em;
	line-height: 1.2em;
    background-color:whitesmoke;
}

.qti-messages.hidden {
    display:none;
    visibility:hidden;
}

/* CAN NOT SET Global tag styles like this for a plugin.
 * Need to scope it into some container.
 */
/*
img {
    max-width:100%;
    max-height:100%;
}
*/

/* Rubric formatting */

.qti-rubric {
    font-family: "Lucida Grande", Tahoma;
	font-weight: lighter;
	font-variant: normal;
	color: #666666;
    margin-top: 10px;
}
div.qti-rubric-content{
    overflow-x: auto;
}
span.qti-rubric-content-data {
    font-weight: bold;
}

table.qti-rubric-content-criteria {
    border-collapse: collapse;
    margin-top: 10px;
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	width: 95%;
}

table.qti-rubric-content-criteria > thead > tr > th {
    padding: 2px 4px;
}

table.qti-rubric-content-criteria > tbody > tr > th{
	text-align: inherit;
	background-color: #FFFFFF;
}
table.qti-rubric-content-criteria > tbody > tr > th,
table.qti-rubric-content-criteria > tbody > tr > td {
    vertical-align: top;
    border: 1px solid #ccc;
    padding: 2px 4px;
}

table.qti-rubric-content-criteria > tbody > tr > td.title,
table.qti-rubric-content-criteria > tbody > tr > td.pointvalue {
    text-align: center;
}

.qti-transparent-div {
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	top: 0;
	background-color: rgba(0,0,0,0.2);
}

.qti-no-scroll {
	overflow: hidden;
}

.qti_isa_info, .qti_isa_success, .qti_isa_warning, .qti_isa_error {
    border: 1px solid;
    margin: 10px 0px;
    padding: 15px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
    -moz-border-radius:.5em;
    -webkit-border-radius:.5em;
    border-radius:.5em;
}

.qti_isa_info {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('../images/info.png');
}

.qti_isa_success {
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image:url('../images/greencheck.png');
}

.qti_isa_warning {
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('../images/warning.png');
}

.qti_isa_error {
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('../images/red_x.png');
}

/* Standalone Testing for OLA tools */
.qti-erasercursor {
    CURSOR: url(../images/standalone/eraser.cur);
}
.qti-eliminatorcursor{
    CURSOR: url(../images/standalone/eliminator.cur);
}
.qti-elim
{
    background-image:url(../images/standalone/tb-elim-u.png);
}
.qti-eras
{
    background-image:url(../images/standalone/tb-eras-u.png);
}

.qti-ola-clra {
	float: right;
}

label[for="elim"], label[for="eras"] {
	float: right;
}

label[for="elim"] > .ui-button-text,
label[for="eras"] > .ui-button-text,
label[for="clra"] > .ui-button-text {
	padding: 0;
}

.qti-ola-elim, .qti-ola-eras, .qti-ola-clra {
    background-repeat: no-repeat;
    background-position: center center;
    height: 26px;
    width: 26px;
	display: inline-block;
}

.qti-ola-elim { background-image: url(../images/standalone/tb-elim-u.png); }
.qti-ola-eras { background-image: url(../images/standalone/tb-eras-u.png); }
.qti-ola-clra { background-image: url(../images/standalone/tb-clra-u.png); }

/* end standalone Testing for OLA tools */

.qti-hidden {
    display:none;
    visibility:hidden;
}

.qti-disabled-ptr-evts {
    pointer-events: none;
    opacity: 0.4;
    background-color: #ffd5d5 ;
}

.qti-bad-xml.ui-dialog {
	font-size: smaller;
}

.qti-bad-xml textarea {
	position: absolute;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 4px;
	left: 0;
	top: 70px;
	bottom: 0;
	width: 95%;
}

body .cke_button__examples_label, body .cke_button__qti_preview_label , body .cke_button__templates_label , body .cke_button__sidebysideconverter_label {
	display: inline;
}

body .qti-composer-validation-message {
	float: left;
	margin-bottom: 6px;
	margin-top: 4px;
	display: none;
	color: #c00;
	cursor: default;
	white-space: normal;
}

div.wsc-badge--animationMove {
    /* !important here is required to override vendor CSS */
    left: 9rem !important;
}

.select2-selection math {
	padding: 3px 0;
	font-size: 18px;
}

.select2-results math {
	font-size: 18px;
}

.cke_editable .select2-selection__rendered {
	min-height: 100%;
	display: flex !important;
	align-items: center
}

#textReader {
	position: absolute;
	left: 50%;
	right: 50%;
	height: 50px;
	width: 50px;
	bottom: 100px;
	border-radius: 50%;
	background-color: #12B19F;
}

.tts-reader {
	height: 30px;
	width: 30px;
	padding-right: 5px;
	padding-left: 6px;
	position: absolute;
	top: 7px;
	border-radius: 30px;
	cursor: pointer;
}
.qti-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

#MathJax_Message {
	visibility: hidden !important;
}

li.select2-results__option [id^="MathJax-Element-"][id$="-Frame"] * {
	color: #0a0a0a !important;
}

feedbackinline {
	font-size: 13px;
}

/* Tooltip text styling */
.tooltip-text {
    border-bottom: 2px dotted #666;
    position: relative;
    cursor: default;
}

/* Hide remove button in preview mode */
.tooltip-text .tooltip-remove {
    display: none;
}

/* Show remove button only in editor */
.cke_editable .tooltip-text .tooltip-remove {
    display: inline;
    background: none;
    border: none;
    color: #999;
    cursor: pointer;
    font-size: 12px;
    margin-left: 2px;
}

/* Text wrap styling */
/* Note: These styles are also in textwrap.css for editor mode */
.textwrap-text {
    white-space: normal; /* Allow text to wrap */
    word-wrap: break-word; /* Legacy property for older browsers */
    overflow-wrap: break-word; /* Modern standard property for word wrapping */
    word-break: break-all; /* Break words at appropriate points */
}
#qti_popup_container {
    font-family: Arial, sans-serif;
    font-size: 12px;
    min-width: 300px; /* Dialog will be no smaller than this */
    max-width: 600px; /* Dialog will wrap after this width */
    background: #FFF;
    border: solid 5px #999;
    color: #000;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

#qti_popup_title {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    line-height: 1.75em;
    color: #575757;
    background: #CCC url(../js/alerts/images/title.gif) top repeat-x;
    border: solid 1px #FFF;
    border-bottom: solid 1px #999;
    cursor: default;
    padding: 0em;
    margin: 0em;
}

#qti_popup_content {
    background: 16px 16px no-repeat url(../js/alerts/images/info.gif);
    padding: 1em 1.75em;
    margin: 0em;
}

#qti_popup_content.alert {
    background-image: url(../js/alerts/images/info.gif);
}

#qti_popup_content.confirm {
    background-image: url(../js/alerts/images/important.gif);
}

#qti_popup_content.prompt {
    background-image: url(../js/alerts/images/help.gif);
}

#qti_popup_message {
    padding-left: 48px;
}

#qti_popup_panel {
    text-align: center;
    margin: 1em 0em 0em 1em;
}

#qti_popup_prompt {
    margin: .5em 0em;
}

/* Custom dialog styles */
#qti_popup_container.style_1 {
        font-family: Georgia, serif;
        color: #A4C6E2;
        background: #005294;
        border-color: #113F66;
}

#qti_popup_container.style_1 #qti_popup_title {
        color: #FFF;
        font-weight: normal;
        text-align: left;
        background: #76A5CC;
        border: solid 1px #005294;
        padding-left: 1em;
}

#qti_popup_container.style_1 #qti_popup_content {
        background: none;
}

#qti_popup_container.style_1 #qti_popup_message {
        padding-left: 0em;
}

#qti_popup_container.style_1 INPUT[type='button'] {
        border: outset 2px #76A5CC;
        color: #A4C6E2;
        background: #3778AE;
}

.qq-uploader {
    position: relative;
    width: 100%;
}
.qq-upload-button {
    display: block;
    width: 105px;
    padding: 7px 0;
    text-align: center;
    background: #880000;
    border-bottom: 1px solid #DDD;
    color: #FFF;
}
.qq-upload-button-hover {
    background: #CC0000;
}
.qq-upload-button-focus {
    outline: 1px dotted #000000;
}
.qq-upload-drop-area, .qq-upload-extra-drop-area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 30px;
    z-index: 2;
    background: #FF9797;
    text-align: center;
}
.qq-upload-drop-area span {
    display: block;
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: -8px;
    font-size: 16px;
}
.qq-upload-extra-drop-area {
    position: relative;
    margin-top: 50px;
    font-size: 16px;
    padding-top: 30px;
    height: 20px;
    min-height: 40px;
}
.qq-upload-drop-area-active {
    background: #FF7171;
}
.qq-upload-list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.qq-upload-list li {
    margin: 0;
    padding: 9px;
    line-height: 15px;
    font-size: 16px;
    background-color: #FFF0BD;
}
.qq-upload-file, .qq-upload-spinner, .qq-upload-size,
.qq-upload-cancel, .qq-upload-retry, .qq-upload-failed-text,
.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
    margin-right: 12px;
    display: inline;
}
.qq-upload-file {
}
.qq-upload-spinner {
    display: inline-block;
    background: url("../../libs/fine-uploader/loading.gif");
    width: 15px;
    height: 15px;
    vertical-align: text-bottom;
}
.qq-drop-processing {
    display: block;
}
.qq-drop-processing-spinner {
    display: inline-block;
    background: url("../../libs/fine-uploader/processing.gif");
    width: 24px;
    height: 24px;
    vertical-align: text-bottom;
}

.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
    display: inline;
}

.qq-upload-retry, .qq-upload-delete, .qq-upload-cancel,
.qq-upload-pause, .qq-upload-continue {
    color: #000000;
}

.qq-upload-size, .qq-upload-cancel, .qq-upload-retry,
.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
    font-size: 12px;
    font-weight: normal;
}
.qq-upload-failed-text {
    display: none;
    font-style: italic;
    font-weight: bold;
}
.qq-upload-failed-icon {
    display:none;
    width:15px;
    height:15px;
    vertical-align:text-bottom;
}
.qq-upload-fail .qq-upload-failed-text {
    display: inline;
}
.qq-upload-retrying .qq-upload-failed-text {
    display: inline;
    color: #D60000;
}
.qq-upload-list li.qq-upload-success {
    background-color: #5DA30C;
    color: #FFFFFF;
}
.qq-upload-list li.qq-upload-fail {
    background-color: #D60000;
    color: #FFFFFF;
}
.qq-progress-bar {
    display: block;
    background: -moz-linear-gradient(top,  rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(125,185,232,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C */
    width: 0%;
    height: 15px;
    border-radius: 6px;
    margin-bottom: 3px;
}

.qq-total-progress-bar {
    height: 25px;
    border-radius: 9px;
}

.qq-total-progress-bar-container {
    margin: 9px;
}

INPUT.qq-edit-filename {
    position: absolute;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: -1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.qq-upload-file.qq-editable {
    cursor: pointer;
}

.qq-edit-filename-icon.qq-editable {
    display: inline-block;
    cursor: pointer;
}

INPUT.qq-edit-filename.qq-editing {
    position: static;
    margin-top: -5px;
    margin-right: 10px;
    margin-bottom: -5px;

    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.qq-edit-filename-icon {
    display: none;
    background: url("../../libs/fine-uploader/edit.gif");
    width: 15px;
    height: 15px;
    vertical-align: text-bottom;
    margin-right: 5px;
}

.qq-hide {
    display: none;
}

/* <dialog> element styles */
.qq-uploader DIALOG {
    display: none;
}

.qq-uploader DIALOG[open] {
    display: block;
}

.qq-uploader DIALOG {
    display: none;
}

.qq-uploader DIALOG[open] {
    display: block;
}

.qq-uploader DIALOG .qq-dialog-buttons {
    text-align: center;
    padding-top: 10px;
}

.qq-uploader DIALOG .qq-dialog-buttons BUTTON {
    margin-left: 5px;
    margin-right: 5px;
}

.qq-uploader DIALOG .qq-dialog-message-selector {
    padding-bottom: 10px;
}

.qq-uploader DIALOG::backdrop {
    background-color: rgba(0, 0, 0, 0.7);
}

/* PowerSchool: keep the 5.0.x behaviour of hiding cancel while editing a filename. */
INPUT.qq-edit-filename.qq-editing ~ .qq-upload-cancel {
    display: none;
}

.popup-menu {
	border-radius: 0;
	box-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	padding: 0;
	position: absolute;
	z-index: 1000;
	font-size: x-small;
	cursor: default;
	list-style: none;
	margin: 0;
	display: block;
	outline: 0;
}

.popup-menu a {
	cursor: default;
}

.popup-menu .ui-menu-item {
	white-space: nowrap;
	display: block;
	padding: 0;
	margin: 0;
}

.popup-menu .ui-menu-item-wrapper {
	position: relative;
	padding: 3px 1em 3px 0.4em;
	display: block;
	cursor: default;
	outline: 0;
	text-decoration: none;
}

/*
 * jQuery UI 1.13.3 adds ui-menu-item-wrapper to the existing item link and
 * applies ui-state-active for both pointer and keyboard focus. Preserve the
 * jQuery UI 1.10.4 Smoothness appearance that this menu used before the shared
 * runtime upgrade instead of inheriting the newer flat blue base theme.
 */
.popup-menu .ui-menu-item-wrapper:hover,
.popup-menu .ui-menu-item-wrapper.ui-state-hover,
.popup-menu .ui-menu-item-wrapper.ui-state-focus,
.popup-menu .ui-menu-item-wrapper.ui-state-active,
.popup-menu .ui-menu-item > a:hover,
.popup-menu .ui-menu-item > a.ui-state-hover,
.popup-menu .ui-menu-item > a.ui-state-focus,
.popup-menu .ui-menu-item > a.ui-state-active {
	margin: -1px;
	border: 1px solid #999999;
	background: #dadada url("../images/ui-bg_glass_75_dadada_1x400.png") 50% 50% repeat-x;
	color: #212121;
	font-weight: normal;
	text-decoration: none;
}

/* Local Variables: */
/* tab-width: 4 */
/* End: */

.qti-rf {
    width: 100%;
    height: 100%;
    background-color: #eee;
}

.qti-rf * {
    box-sizing: border-box;
    font-family: "Open Sans" !important;
}

.qti-rf .heading {
    font-size: 18px;
    font-weight: 600;
    color: #333333;
    margin-bottom: 10px;
    margin-top: 10px;
}

.qti-rf .rubric-filter {
    background: #F1F4F4;
    padding:15px;
    box-sizing: border-box;
}

.qti-rf .has-search {
    position: relative;
    flex-grow: 10;
}

.has-search #pm-icon-search {
    filter: invert(.5);
    position: absolute;
    top: 28px;
    right: 4%;
}

.has-search>label {
    font-size: 16px;
    font-weight: 400;
    color: #333333;
    margin-bottom: 0px
}

.qti-rf input[type="text"] {
    border: 1px solid #838E91;
    border-radius: 4px;
    box-sizing: border-box;
    width: calc(100% - 120px);
    height: 34px;
    margin: 4px 0;
    font-size:14px;
    background: #FFFFFF;
}

input[type=number]::-webkit-inner-spin-button {
    opacity: 1;
}

.qti-rf .checkbox {
    display: flex;
    flex-grow: 1;
    align-items: center;
    margin: 0 0 0 20px;
}

.qti-rf .checkbox input {
    position: unset;
    margin: 0;
    margin-left: 5px;
    cursor: pointer;
}

.qti-rf .checkbox input:checked {
    background-color: #0075DB;
    border: #0075DB;
}

.qti-rf .checkbox input:checked + span {
    font-weight: 600;
}

.qti-rf .checkbox span {
    box-sizing: border-box;
    font-size: 16px;
    color: #333333;
    padding: 5px;
}

#flexDiv {
    display: flex;
    align-items:flex-end;
    margin-top:10px
}

.qti-rf input#maxPoints,
.qti-rf select#gradeLevels {
    box-sizing: border-box;
    width: 170px;
    height:32px;
    border: 1px solid #838E91;
    border-radius: 4px;
    padding-left: 5px;
    background: #FFFFFF;
}

#flexDiv .select2-container--default * {
    cursor: pointer;
}

#flexDiv .select2-dropdown {
    background-color: white;
    border: 1px solid #aaa;
}

#flexDiv .select2-results__option {
    padding: 6px;
}

.qti-rf .rubric-filter-label {
    font-size:16px;
    margin-bottom:5px;
    color:#333333;
}

.qti-rf #rubric-reset {
    box-sizing: border-box;
    border: 1px solid #0075DB;
    padding: 5px;
    font-size: 16px;
    background: #fff;
    color: #0075DB;
    border-radius: 4px;
    width: 106px;
    height:32px;
    text-align: center;
}

.qti-rf #rubric-reset:hover {
    cursor: pointer;
}

.qti-rf > table {
    width: 100%;
    height: 100%;
}

.qti-rf > table > tbody > tr:nth-child(1) {
    height: 1px;
}

#rubricDisplayTable,
#rubricDisplayTable th,
#rubricDisplayTable td.results {
    min-width: 200px;
    width: 505px;
}

#rubricDisplayTable {
    box-sizing: border-box;
    height: 400px;
    border: 1px solid #F1F1F1;
    margin: 0;
}

#rubricDisplayTable thead tr {
    height: 40px;
    box-sizing: border-box;
}

#rubricDisplayTable th span {
    box-sizing: border-box;
    display: inline-block;
    width: 60px;
    padding: 10px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    font-weight: bold;
    color: #333333;
}

#rubricDisplayTable th {
    background: none;
    vertical-align: middle;
    border-bottom: 1px solid #F1F1F1;
}

#rubricDisplayTable td.results {
    max-width: 505px;
    overflow: auto;
    vertical-align: text-top;
    padding: 0;
}

.qti-rf div.result {
    cursor: pointer;
    min-height: 40px;
    display: flex;
    box-sizing: border-box;
}

.qti-rf div.result * {
    cursor: pointer;
}

.qti-rf div.result:hover {
    background-color: #F1F4F4;
    text-decoration: underline;
}

.qti-rf div.result.selected {
    background-color: #C2E2FF;
}

.qti-rf div.result.selected td {
    font-weight: bold;
}

.qti-rf div.result div {
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    padding: 10px;
    box-sizing: border-box;
}

.qti-rf div.id {
    width: 60px;
    color: #333333;
    box-sizing: border-box;
}

.qti-rf .no-results-text {
    padding:10px;
    color:#333333;
    font-size:14px;
}

.qti-rf .qti-rf-result-overflow {
	overflow: auto;
	max-height: 350px;
    vertical-align: top;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.qti-rf .qti-rf-preview-overflow {
	overflow: auto;
	max-height: 350px;
    font-size: 14px;
    color: #333333;
    box-sizing: border-box;
}

#preview-table {
    width: 100%;
    max-width: 700px;
    padding-left: 15px;
}

#preview {
    height:400px;
    box-sizing: border-box;
    border: 1px solid #F1F1F1;
    padding:10px;
}

/*Spinner css is getting overidden so using id's instead of class*/
#rubricSpinner {
    width: 100px;
    height: 100px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: auto auto;
    margin-left: -50px;
    margin-top: -50px;
}

#arch_0 {
    position: relative;
    height: 25px;
    width: 25px;
    background-color: transparent;
    border-right: 10px solid #b9bbbd;
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid #b9bbbd;
    border-radius: 50%;
    margin: 2px auto;
    -webkit-animation: spinCCW 1s infinite linear;
    -moz-animation: spinCCW 1s infinite linear;
    -ms-animation: spinCCW 1s infinite linear;
    -o-animation: spinCCW 1s infinite linear;
    animation: spinCCW 1s infinite linear;
}
#arch_1 {
    position: relative;
    height: 50px;
    width: 50px;
    background-color: transparent;
    border-right: 10px solid #cfd6d2;
    border-top: 10px solid #cfd6d2;
    border-left: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-radius: 50%;
    margin: 3px auto;
    -webkit-animation: spinCW 3s infinite linear;
    -moz-animation: spinCW 3s infinite linear;
    -ms-animation: spinCW 3s infinite linear;
    -o-animation: spinCW 3s infinite linear;
    animation: spinCW 3s infinite linear;
}
@-ms-keyframes spinCCW {
    from {
        -ms-transform: rotate(360deg);
    }
    to {
        -ms-transform: rotate(0deg);
    }
}
@-moz-keyframes spinCCW {
    from {
        -moz-transform: rotate(360deg);
    }
    to {
        -moz-transform: rotate(0deg);
    }
}
@-webkit-keyframes spinCCW {
    from {
        -webkit-transform: rotate(360deg);
    }
    to {
        -webkit-transform: rotate(0deg);
    }
}
@keyframes spinCCW {
    from {
        transform: rotate(360deg);
    }
    to {
        transform: rotate(0deg);
    }
}
#arch_2 {
    position: relative;
    height: 75px;
    width: 75px;
    background-color: transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid transparent;
    border-left: 10px solid #9d9fa1;
    border-bottom: 10px solid #9d9fa1;
    border-radius: 50%;
    margin: 3px 3px;
    -webkit-animation: spinCCW 5s infinite linear;
    -moz-animation: spinCCW 5s infinite linear;
    -ms-animation: spinCCW 5s infinite linear;
    -o-animation: spinCCW 5s infinite linear;
    animation: spinCCW 5s infinite linear;
}
@-ms-keyframes spinCW {
    from {
        -ms-transform: rotate(-360deg);
    }
    to {
        -ms-transform: rotate(0deg);
    }
}
@-moz-keyframes spinCW {
    from {
        -moz-transform: rotate(-360deg);
    }
    to {
        -moz-transform: rotate(0deg);
    }
}
@-webkit-keyframes spinCW {
    from {
        -webkit-transform: rotate(-360deg);
    }
    to {
        -webkit-transform: rotate(0deg);
    }
}
@keyframes spinCW {
    from {
        transform: rotate(-360deg);
    }
    to {
        transform: rotate(0deg);
    }
}
#arch_3 {
    height: 100px;
    width: 100px;
    background-color: transparent;
    border-right: 10px solid #E0E0E0;
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid #E0E0E0;
    border-radius: 200px;
    margin: 0px auto;
    transform: rotate(45deg);
    -webkit-animation: spinCW 12s infinite linear;
    -moz-animation: spinCW 12s infinite linear;
    -ms-animation: spinCW 12s infinite linear;
    -o-animation: spinCW 12s infinite linear;
    animation: spinCW 12s infinite linear;
}

/*
    Copyright 2008-2021
        Matthias Ehmann,
        Michael Gerhaeuser,
        Carsten Miller,
        Bianca Valentin,
        Andreas Walter,
        Alfred Wassermann,
        Peter Wilfahrt

    This file is part of JSXGraph.

    JSXGraph is free software dual licensed under the GNU LGPL or MIT License.

    You can redistribute it and/or modify it under the terms of the

      * GNU Lesser General Public License as published by
        the Free Software Foundation, either version 3 of the License, or
        (at your option) any later version
      OR
      * MIT License: https://github.com/jsxgraph/jsxgraph/blob/master/LICENSE.MIT

    JSXGraph is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU Lesser General Public License for more details.

    You should have received a copy of the GNU Lesser General Public License and
    the MIT License along with JSXGraph. If not, see <http://www.gnu.org/licenses/>
    and <http://opensource.org/licenses/MIT/>.
 */

.jxgbox {
    /* for IE 7 */
    position: relative;
    overflow: hidden;
    background-color: #fff;
    border-style: solid;
    border-width: 1px;
    border-color: #356aa0;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-touch-action: none;
    /* touch-action: none; */ /* Set with JavaScript */
}

.jxgbox svg text {
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.JXGtext {
    font-family: Courier, monospace;
    /**
     * The default font family is now set in
     * JXG.Options.text.cssdefaultstyle = 'font-family: Arial, Helvetica, Geneva, sans-serif;'
     */

    /* font-family: Arial, Helvetica, Geneva, sans-serif; */
    /* "background-color: transparent;" may produce artefacts in IE. Solution: setting a color explicitly. */

    background-color: transparent;
    /*background-color: rgba(255, 255, 255, 0.6);*/ /* From 1.2.4 */
    padding: 0;
    margin: 0;
}

.JXGinfobox {
    border-style: none;
    border-width: 0px;
    border-color: black;
}

/*
    CSS attributes will (permantely) overwrite attributes set in JSXGraph
*/
.JXGimage {
    /* opacity: 1.0; */
}

.JXGimageHighlight {
    /* opacity: 0.6; */
}

/* CSS rules for the navigation bar */

.JXG_navigation {
    position: absolute;
    right: 5px;
    bottom: 5px;

    z-index: 100;

    background-color: transparent;
    padding: 2px;
    font-size: 14px;
    cursor: pointer;
}

.JXG_navigation:hover {

}

.JXG_navigation_button {
    color: #666;
}

.JXG_navigation_button:hover {
    border-radius: 2px;
    background-color: #c0c0c0;
    background: rgba(184, 184, 184, 0.5);
}

/* CSS rules for the wrapping div in fullscreen mode */

.JXG_wrap_private:-moz-full-screen {
    background-color: #ccc;
    padding: 0;
    width: 100%;
    height: 100%;
}

.JXG_wrap_private:-webkit-full-screen {
    background-color: #ccc;
    padding: 0;
    width: 100%;
    height: 100%;
}

.JXG_wrap_private:fullscreen {
    background-color: #ccc;
    padding: 0;
    width: 100%;
    height: 100%;
}

.JXG_wrap_private:-ms-fullscreen {
    background-color: #ccc;
    padding: 0;
    width: 100%;
    height: 100%;
}
.qti-ctrlr {
    padding: 6px;
    margin-bottom: 10px;
    position:relative;
    width:100%;
    background-color:parent;
}

.qti-controller{
    overflow: auto;
}

.cke_editable .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #3076d4 !important;
}

.qti-controller img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.qti-controller .previewggap > img {
    height: auto;
}

.qti-controller object {
    max-width: 100%;
}

.qti-controller-toolbar {
        margin-bottom: 20px;
        padding: 6px;
        border: 1px solid #ccc;
}

.qti-controller-toolbar1 {
        margin-bottom: 8px;
}

.qti-controller-toolbar-button {
        display: inline-block;
        border: 1px solid #ccc;
        padding: 4px 8px;
        font-style: italic;
        cursor: move;
        margin-right: 4px;
    margin-bottom:4px;
}

.qti-controller-prompt {
        position: absolute;
        width: 100%;
}

.qti-controller-prompt > table {
        width: 100%;
        min-height: 160px;
}

.qti-controller-prompt > table > tbody > tr > td {
        text-align: center;
}

.qti-content-object {
    width: 950px;
    height: 300px;
}

.qti-controller hr {
	border-color: #888;
}

.qti-air {
    overflow: auto;
}

@media (max-width:610px) {
    .qti-controller .qti-gir table tr {
        display: grid;
    }
}

.qti-controller .select2-container {
  min-width: 70px;
}

.cke_editable .select2-container .select2-dropdown {
  border-top: 1px solid #aaa !important;
  border-top-right-radius: 4px !important;
  margin-top: -1px;
}

.cke_editable .select2-container .select2-search {
  display: none;
}

/* Speech-to-text accommodation toolbar (Extended Text) */
.pm-stt-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
    padding-left: 3px; /* prevents focus outline on the language dropdown from being clipped */
}

.pm-stt-lang {
    max-width: 220px;
}

.pm-stt-lang:focus,
.pm-stt-lang:focus-visible {
    outline: 2px solid #005fcc;
    outline-offset: 1px;
}

.pm-stt-mic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 32px;
    padding: 4px;
    cursor: pointer;
    background: transparent;
    border: 1px solid #757777;
    border-radius: 4px;
}

.pm-stt-mic:focus,
.pm-stt-mic:focus-visible {
    outline: 2px solid #005fcc;
    outline-offset: 1px;
}

.pm-stt-mic-icon {
    width: 20px;
    height: 20px;
    display: block;
    pointer-events: none;
}

.pm-stt-mic.pm-stt-listening {
    border-color: #c00;
    box-shadow: 0 0 0 1px #c00;
}

.pm-stt-mic.pm-stt-listening:focus,
.pm-stt-mic.pm-stt-listening:focus-visible {
    outline: none; /* red border+shadow from pm-stt-listening is the focus indicator */
}

.pm-stt-status {
    font-size: 12px;
    color: #333;
}

.pm-stt-status.pm-stt-error {
    color: #c00;
    font-weight: 600;
}

.qti-cir-choice-table {
	border-spacing: 0;
	border-collapse: collapse;
    width: 95%;
}

.qti-cir-choice-control {
	/* Must be wide enough to accomodate the eliminator image */
    width: 28px;
	text-align: center;
}

.qti-cir-choice-table > tbody > tr:hover {
	background-color: #ddd;
}

.qti-cir-choice-table > tbody > tr > td {
	padding: 4px;
	touch-action: manipulation;
}

.qti-cir-choice-table input {
    cursor: inherit;
}

.qti-cir-choice-text p  {
	margin-top: 0;
	margin-bottom: 0;
}

.qti-cir-eliminated {
    text-decoration: line-through;
    color: red;
}

.qti-cir-elim-radio
{
    display:block;
    background-repeat:no-repeat;
    background-position:center center;
    height: 20px;
    width: 20px;
    background-image:url(../images/standalone/radio-elim.png);
	cursor: inherit;
}

/* Local Variables: */
/* tab-width: 4 */
/* End: */

.qti-hsir {
    padding: 6px;
}

.qti-hsir-container {
    position:relative;
    background-color:parent;
}

.qti-hsir-hotspot-container
{
    height:auto;
    overflow:hidden;
}

.qti-hsir-hotspot-toolbar
{
    min-height: 430px;
    overflow: hidden;
    width: 100px;
    float:left;
}

div.qti-hsir-hotspot-area
{
    float:none;
    overflow: hidden;
    min-height: 430px;;
}

/* Keyboard focus styles for hotspot elements */
.qti-hsir svg circle:focus,
.qti-hsir svg polygon:focus,
.qti-hsir svg rect:focus {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
}

/* Local Variables: */
/* tab-width: 4 */
/* End: */


.qti-htir-overlay-active
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
     height: 100%;
    width: 100%;
    background: rgba(232, 232, 232, 0.5);
    z-index: 100;
}

.qti-htir-choice-table {
	border-spacing: 0;
	border-collapse: collapse;
    width: 95%;
}

.qti-htir-choice-control {
    width: 20px;
}

.qti-htir-choice-table > tbody > tr:hover {
	background-color: #ddd;
}

.qti-htir-choice-table > tbody > tr > td {
	padding: 4px;
}

.qti-htir-choice-table input {
    cursor: inherit;
}

.qti-htir-choice-text p  {
	margin-top: 0;
	margin-bottom: 0;
}

.qti-htir-eliminated {
    text-decoration: line-through;
    color: red;
}

.qti-htir-elim-radio
{
    display:block;
    background-repeat:no-repeat;
    background-position:center center;
    height: 20px;
    width: 20px;
    background-image:url(../images/standalone/radio-elim.png);
}

span.qti-htir-choice {
	border: 1px solid #d0d0d0;
	background-color: #ddd;
	margin: 2px 2px 0 4px;
	padding: 2px 4px;
	cursor: pointer;
	display: inline-block;
}

span.qti-htir-choice.qti-htir-selected {
	background-color: orange;
	font-weight: bold;
}

span.qti-htir-choice:hover {
    border: 1px solid orange;
}

.qti-dir {
    padding: 6px;
}

.qti-dir-container {
    position:relative;
    background-color:parent;
}

.qti-dir-canvas {
    border: solid 2px black;
    cursor: crosshair;
    float: left;
    background-color: white;
}

.qti-dir-colors {
    margin:0;
    padding:0;
    float: left;
}
.qti-dir-colors li {
    height: 20px;
    width: 20px;
    display: block;
    cursor: pointer;
}
.qti-dir-colors li.selected{
    height: 18px;
    width: 18px;
    display: block;
    border: solid 1px #eee;
}
.qti-dir-label{
    float: left;
}

.qti-dir-canvas-container
{
    height:auto;
    overflow:auto;
}

.qti-dir-canvas-container .qti-dir-readonly img {
    max-width: none;
    max-height: none;
}

.qti-dir-canvas-toolbar
{
    min-height: 430px;
    overflow: hidden;
    width: 100px;
    float:left;
}

div.qti-dir-canvas-area
{
    float:none;
    overflow: auto;
    min-height: 430px;
}
/* Canvas Tools */
.qti-dir-crayon { height: 15px; margin-bottom:2px; border: none; display: block; outline: none;}
.qti-dir-sm  { background: url(../images/canvas/crayon-short.png) right no-repeat; width: 50px; margin-left: 50px;}
.qti-dir-smb { background: url(../images/canvas/crayon-short-black.png) right no-repeat;   margin-top:3px; width: 50px; margin-left: 50px;}
.qti-dir-lg  { background: url(../images/canvas/crayon-long.png) right no-repeat; width: 85px; margin-left: 15px;}
.qti-dir-lgb { background: url(../images/canvas/crayon-long-black.png) right no-repeat;   margin-top:3px; width: 85px; margin-left: 15px;}
.qti-dir-on.qti-dir-eraser  { height:30px; background: url(../images/canvas/tool-eraser-off.png) right no-repeat; margin:5px 0; }
.qti-dir-off.qti-dir-eraser { height:30px; background: url(../images/canvas/tool-eraser.png) right no-repeat; margin:5px 0; }
.qti-dir-ruler { transform: scale(0.95); left:-12px; position:relative; height:55px; width:100px; background: url(../images/canvas/tool-ruler.png) right no-repeat;}
.qti-dir-on.qti-dir-size-huge  { float:right; height:30px; width:30px; background: url(../images/canvas/tool-size-4.png) right no-repeat;  margin-top:15px; border: none; outline: none; }
.qti-dir-on.qti-dir-size-large  { float:right; height:30px; width:25px; background: url(../images/canvas/tool-size-3.png) right no-repeat;  margin-top:18px; border: none; outline: none;}
.qti-dir-on.qti-dir-size-normal  { float:right; height:30px; width:20px; background: url(../images/canvas/tool-size-2.png) right no-repeat;  margin-top:19px;  border: none; outline: none;}
.qti-dir-on.qti-dir-size-small  { float:right; height:30px; width:15px; background: url(../images/canvas/tool-size-1.png) right no-repeat;  margin:20px 8px 0 0;  border: none; outline: none;}
.qti-dir-off.qti-dir-size-huge { float:right; height:30px; width:30px; background: url(../images/canvas/tool-size-4o.png) right no-repeat;  margin-top:15px; border: none; outline: none;}
.qti-dir-off.qti-dir-size-large { float:right; height:30px; width:25px; background: url(../images/canvas/tool-size-3o.png) right no-repeat;  margin-top:18px; border: none; outline: none;}
.qti-dir-off.qti-dir-size-normal { float:right; height:30px; width:20px; background: url(../images/canvas/tool-size-2o.png) right no-repeat;  margin-top:19px;  border: none; outline: none;}
.qti-dir-off.qti-dir-size-small { float:right; height:30px; width:15px; background: url(../images/canvas/tool-size-1o.png) right no-repeat;  margin:20px 8px 0 0;  border: none;  outline: none;}
.qti-dir-export { float:right }
.qti-dir-btngrp {
    width:100%;
    display:inline-block;
    overflow: auto;
    white-space: nowrap;
    margin:0px auto;
}
button:focus-visible {
    outline: 4px solid #C85100;
}
.qti-dir-on:focus-visible,
.qti-dir-off:focus-visible {
    position: relative;
    z-index: 10;
    outline: 4px solid #C85100;
}
.qti-dir-undo:focus-visible,
.qti-dir-clear:focus-visible {
    outline: revert;
    outline-offset: revert;
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Keyboard accessibility cursor */
.qti-dir-keyboard-cursor {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: red;
    border-radius: 50%;
    pointer-events: none;
    z-index: 1000;
    display: none;
    border: 2px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}

/* Enhanced focus styles for canvas */
.qti-dir-canvas:focus {
    outline: 4px solid #C85100;
    outline-offset: 2px;
}
@media (max-width: 768px) {
    .qti-dir {
        width: 500px;
    }
}
/* Local Variables: */
/* tab-width: 4 */
/* End: */

.qti-air-selection-inline{
	display: inline-block;
}

.qti-air-overlay-active
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(232, 232, 232, 0.5);
    z-index: 100;
}

.qti-associate-container-render {
	border: 1px solid #ccc;
	background-color: white;
	width: 660px;
}

.qti-associate-text-1-render {
	border: 1px solid #ccc;
	padding: 2px;
	background-color: white;
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: top;
	width: 25%;
	height: 100px;
}

.qti-associate-text-2-render {
	padding: 2px;
	background-color: white;
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: top;
	width: 45%;
	height: 100px;
}

.qti-associate-text-3-render {
	border: 1px solid #ccc;
	padding: 2px;
	background-color: white;
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: top;
	width: 25%;
	height: 100px;
}

.bottomborder-render {
	position: relative;
	top: 50px;
	border-bottom: 10px solid #ccc;
}

.draggable-size {
	float: left;
	width: 140px;/* -10 for margins, and border*/
	height: 90px;/* -10 for margins, and border*/
}

.qti-draggable-disabled {
	border: 1px solid #FFFFFF;
}
/*.ui-state-good-highlight{
	border: 1px solid orange;
	background-color: pink;
	box-shadow: 0px 0px 10px 2px pink;

}
.ui-state-active{
	border:1px dashed pink;
}*/
.ui-draggable-style {
	margin:5px 5px;
	border: 0px solid rgb(252, 8, 252);
	border-radius: 5px;
	box-shadow: 0px 0px 11px -2px;
	padding: 2px 5px;
}
.ui-droppable-style{
	border: 1px solid rgb(216, 216, 216);
	border-radius: 5px;
	box-shadow: inset 0px 0px 11px -2px;
	background-color: #F1F1F1;
}
.ui-big-board{
	margin:0px auto;
}
.ui-droppable-style-1stRowLeft{
	margin-left: 4px;
}
.ui-86-Outline{
	border-width: 0px;
}
.ui-connectable-style{
	border-radius: 11px;
	height: 10px;
	margin-top: -10px;
	position: relative;
	background: #7e7e7e;
	border: 4px solid #7e7e7e;
}
.ui-connectable-style:after, .ui-connectable-style:before{
	/*left: 100%;*/
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.ui-connectable-style:after{
	border-color: transparent transparent transparent #7e7e7e;
	border-width: 17px;
	margin-top: -17px;
	margin-left: -11px;
	left: 100%;
}
.ui-connectable-style:before{
	border-color: transparent #7e7e7e transparent transparent;
	border-width: 17px 17px 17px 5px;
	margin-top: -17px;
	margin-left: -11px;
	left: 0px;
}




.qti-air-choice-table {
	border-spacing: 0;
	border-collapse: collapse;
    width: 95%;
}

.qti-air-choice-control {
    width: 20px;
}

.qti-air-choice-table > tbody > tr:hover {
	background-color: #ddd;
}

.qti-air-choice-table > tbody > tr > td {
	padding: 4px;
}

.qti-air-choice-table input {
    cursor: inherit;
}

.qti-air-choice-text p  {
	margin-top: 0;
	margin-bottom: 0;
}

.qti-air-eliminated {
    text-decoration: line-through;
    color: red;
}

.qti-air-elim-radio
{
    display:block;
    background-repeat:no-repeat;
    background-position:center center;
    height: 20px;
    width: 20px;
    background-image:url(../images/standalone/radio-elim.png);
}

.qti-air-overflowyauto{
     overflow-y: auto;
     -webkit-overflow-scrolling: touch;
}

/* Keyboard accessibility styles for associate interaction */
.qti-draggable:focus {
    outline: 2px solid #0066cc;
    outline-offset: 2px;
}

.qti-drop-target:focus {
    outline: 2px solid #0066cc;
    outline-offset: 2px;
    background-color: #e6f3ff;
}

.qti-draggable.qti-associate-selected {
    background-color: #ffeb3b;
    outline: 2px solid #ffc107;
    outline-offset: 2px;
    box-shadow: 0 0 5px rgba(255, 193, 7, 0.5);
} 
.qti-etr {
	display: flex;
	flex: 0 0 100%;
	flex-direction: column;
	height: 100%;
}

.qti-etr-container {
	position: relative;
	width: 100%;
	background-color: inherit;
}

.qti-etr-container-hidden {
	display: none;
}

div.qti-etr-item {
	overflow: auto;
	border: 1px solid #aaa;
	padding: 6px;
}

/* Local Variables: */
/* tab-width: 4 */
/* End: */


.qti-gmir-choice-container {
    margin: 10px 0px;
}

.qti-gmir-choice-header {
    border: 1px solid #ccc;
    border-bottom: 0;
    line-height: 26px;
    width:100%;
    font-style: italic;
    color: #6c6e6e;
    text-align:center;
}
.qti-gmir-choice-area {
    border: 1px solid #ccc;
    border-top: 0;
    width:100%;
    min-height:20px;
    background-color:#eee;
    padding-bottom: 30px;
    overflow: hidden;
}

.qti-gmir-cell {
    text-align:center;
}

.qti-gmir-inner-item {
    padding:0px 3px;
    background: linen;
    border: 1px solid #ccc;
    cursor: move;
    text-align: center;
	margin: 3px 3px;
	float: left;
	display: block;
}

/* Keyboard accessibility styles */
.qti-gmir-inner-item:focus {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
    box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
}

.qti-gmir-inner-item.gmir-keyboard-selected {
    background: #e6f3ff;
    border-color: #005fcc;
    box-shadow: 0 0 0 2px #005fcc;
}

/* Mouse click-based accessibility styles (WCAG 2.5.7 compliance) */
.qti-gmir-inner-item.gmir-mouse-selected {
    background: #fff8e6;
    border: 3px solid #0078d7;
    box-shadow: 0 0 8px 3px rgba(0, 120, 215, 0.5);
    cursor: pointer;
}

.qti-gmir-gap.gmir-valid-drop-target {
    border: 3px solid #28a745;
    box-shadow: 0 0 5px 2px rgba(40, 167, 69, 0.5);
    cursor: pointer;
}

.qti-gmir-choice-area.gmir-valid-drop-target {
    border: 3px solid #28a745;
    box-shadow: 0 0 5px 2px rgba(40, 167, 69, 0.3);
    background-color: rgba(40, 167, 69, 0.05);
}

.qti-gmir-gap {
    border: 1px solid #949595;
    min-height:20px;
    min-width: 100px;
    max-width:99%;
    display:inline-block;
}

/* Keyboard accessibility styles for gaps */
.qti-gmir-gap:focus {
    outline: 2px solid #005fcc;
    outline-offset: 2px;
    box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
    border-color: #005fcc;
}

.qti-gmir-gap:empty:focus::after {
    content: "Drop zone - Press Enter to place selected item";
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Screen reader only content */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .qti-gmir-inner-item:focus {
        outline: 3px solid;
    }
    
    .qti-gmir-gap:focus {
        outline: 3px solid;
    }
    
    .qti-gmir-inner-item.gmir-keyboard-selected {
        outline: 3px solid;
    }
    
    .qti-gmir-inner-item.gmir-mouse-selected {
        outline: 3px solid;
    }
    
    .qti-gmir-gap.gmir-valid-drop-target {
        outline: 3px solid;
    }
    
    .qti-gmir-choice-area.gmir-valid-drop-target {
        outline: 3px solid;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .qti-gmir-inner-item,
    .qti-gmir-gap {
        transition: none;
    }
}

/* Local Variables: */
/* tab-width: 4 */
/* End: */

.pmf-graphinginteraction-board {
	width: 450px;
	height: 450px;
}

/* https://thestizmedia.com/radio-buttons-as-toggle-buttons-with-css/ */
.pm-gi-element-controls {
	font-family: "Lucida Grande", Tahoma, Verdana, sans-serif;
	padding: 5px;
	overflow: hidden;
}

.pmf-gi-tool-selection-title { /* not currently used */
  margin-bottom: 6px;
}

.pm-gi-element-controls input {
	position: absolute !important;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	width: 1px;
	border: 0;
	overflow: hidden;
}


.pm-gi-element-controls label {
	display: block;
	white-space: nowrap;
	width: 90px;
	background-color: #e4e4e4;
	color: rgba(0, 0, 0, 0.6);
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	text-shadow: none;
	padding: 6px 14px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition:    all 0.1s ease-in-out;
	-ms-transition:     all 0.1s ease-in-out;
	-o-transition:      all 0.1s ease-in-out;
	transition:         all 0.1s ease-in-out;
}

/* Focus styles for keyboard navigation */
.pm-gi-element-controls input:focus + label {
	outline: 2px solid #E24A4A;
	outline-offset: 2px;
	box-shadow: 0 0 0 3px rgba(226, 74, 74, 0.3);
}

/*!* Enhanced selected state *!*/
.pm-gi-element-controls input:checked + label {
	background-color: #A5DC86;
	border-color: #2E7D1C;
	box-shadow: inset 0 2px 4px rgba(46, 125, 28, 0.2);
	font-weight: 600;
}

/* Focus state for selected radio button */
.pm-gi-element-controls input:focus:checked + label {
	outline: 2px solid #2E7D1C;
	box-shadow: 0 0 0 3px rgba(46, 125, 28, 0.3);
}

.pm-gi-element-controls label:first-of-type {
	border-radius: 4px 4px 0 0;
}

.pm-gi-element-controls label:last-of-type {
	border-radius: 0 0 4px 4px;
}


.pm-gi-controls button {
	white-space: nowrap;
	width: 120px;
	background-color: #A5DC86;
	-webkit-box-shadow: none;
	box-shadow: none;
	color: rgba(0, 0, 0, 0.6);
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	text-shadow: none;
	padding: 9px 14px;
	border-radius: 4px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	margin: 5px;
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition:    all 0.1s ease-in-out;
	-ms-transition:     all 0.1s ease-in-out;
	-o-transition:      all 0.1s ease-in-out;
	transition:         all 0.1s ease-in-out;
}

.pm-gi-controls-td {
	vertical-align: top;
}

/* Keyboard cursor styling */
.pm-gi-keyboard-cursor {
	fill: #E24A4A !important;
	stroke: #FFFFFF !important;
	stroke-width: 3px !important;
	r: 8 !important;
	opacity: 0.9 !important;
	z-index: 1000;
}

/* Keyboard mode indicator */
.pm-gi-keyboard-active {
	outline: 3px solid #2E7D1C;
	outline-offset: -3px;
	position: relative;
}

/* Enhanced visual feedback for keyboard mode */
.pm-gi-keyboard-active::before {
	content: "Keyboard Mode - Use arrow keys to move, Enter to place, Escape to exit";
	position: absolute;
	top: -30px;
	left: 0;
	right: 0;
	background: #2E7D1C;
	color: white;
	padding: 5px 10px;
	font-size: 12px;
	text-align: center;
	border-radius: 3px;
	z-index: 1001;
	white-space: nowrap;
	overflow: hidden;
}

.qti-mir {
	width: 95%;
}

table.qti-mir-table {
	display: table;
    border-collapse: collapse;
    border-spacing: 2px;
    overflow: auto;
}

.qti-mir-table > tbody > tr:hover {
    background-color: #ddd;
}

.qti-mir-table th,
.qti-mir-table td {
    border: 1px solid #ccc;
    min-height: 22px;
}

.qti-mir-table > tbody > tr > td > input {
    cursor: inherit;
    min-height: inherit;
}

.qti-mir-cell {
    text-align:center;
}

.qti-mir-text p  {
    margin-top: 0;
    margin-bottom: 0;
}

.qti-mir-elim-checkbox
{
    cursor: inherit;
    display:block;
    background-image:url(../images/standalone/checkbox-elim.png);
    background-repeat:no-repeat;
    background-position:center center;
    min-height: inherit;
    width: 100%;
}

/* Reset default th styling for headers to allow independent formatting */
.qti-mir-table .matchInteraction-col-header,
.qti-mir-table .matchInteraction-row-header {
    font-weight: normal;
    text-align: left;
}

/* Ensure div inside headers also inherits normal font-weight */
.qti-mir-table .matchInteraction-col-header > div,
.qti-mir-table .matchInteraction-row-header > div {
    font-weight: inherit;
    text-align: inherit;
}

/* Screen reader only content */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Local Variables: */
/* tab-width: 4 */
/* End: */

.qti-oir {
    padding: 6px;
}

/* Screen reader only content */
.qti-oir .oir-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Screen reader announcement region */
.qti-oir .oir-sr-announcement {
    position: absolute;
    left: -9999px;
    top: -9999px;
}

.qti-oir-2col-container {
	width: 100%;
	cursor: default;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.qti-oir-2col-container > tbody > tr:nth-child(1) > td {
	width: 50%;
	text-align: center;
	font-weight: normal;
    font-size: small;
}

.qti-oir-2col-container > tbody > tr:nth-child(2) > td {
	vertical-align: top;
	background-color: #c8c8c8;
}

.qti-oir-answer-region > div {
	position: relative;
	height: 100%;
}

.qti-oir-answer-tiles-container {
	width: 100%;
	height: 100%;
}

.qti-oir-drop-prompt {
	position: absolute;
	width: 100%;
	height: 100%;
	display: none;
}

.qti-oir-drop-prompt > table {
	width: 100%;
	height: 100%;
}

.qti-oir-drop-prompt > table > tbody > tr > td {
	text-align: center;
	vertical-align: middle;
	color: white;
}

.qti-oir-inner-item {
    padding: 5px;
    background: linen;
    border: 1px solid #ccc;
    cursor: move;
    text-align: center;
	margin: 2px;
	display: block;
}

/* Keyboard focus styling */
.qti-oir .qti-oir-inner-item:focus {
    outline: 2px solid #007cba;
    outline-offset: 2px;
    z-index: 1;
    position: relative;
}

/* Selected item styling for keyboard users */
.qti-oir .qti-oir-inner-item.oir-selected {
    background: #fff3cd;
    border: 2px solid #fd7e14;
    box-shadow: 0 0 0 2px rgba(253, 126, 20, 0.25);
}

/* Drop indicator styling */
.qti-oir .oir-drop-indicator {
    border: 2px dashed #007cba;
    background: rgba(0, 124, 186, 0.1);
    padding: 8px;
    margin: 4px 2px;
    text-align: center;
    color: #007cba;
    font-weight: bold;
    cursor: pointer;
    border-radius: 4px;
    min-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.qti-oir .oir-drop-indicator:focus {
    outline: 2px solid #007cba;
    outline-offset: 2px;
    background: rgba(0, 124, 186, 0.2);
}

.qti-oir .oir-drop-indicator:hover {
    background: rgba(0, 124, 186, 0.15);
    border-color: #0056b3;
}

.qti-oir-inner-item-vertical {
	display: block;
}

.qti-oir-inner-item-horizontal {
	display: inline-block;
	float: left;
}

/* Local Variables: */
/* tab-width: 4 */
/* End: */

.qti-uir-file-drop {
    position: relative;
    border: 2px dashed #959595;
    min-height: 200px;
    min-height: 100%;
    max-width:100%;
    margin: 0px auto 10px;
    background-size: contain;
    background-color: #fff;
}
.qti-uir-file-drop.hover {
    border: 2px dashed #333 !important;
}

.qti-uir-drop-placeholder {
    text-align:center;
    font-size:32px !important;
    margin-top: 35px;
    color: #757777;
    opacity:0.4;
    display:block;
    font-style: italic;
}

.qti-uir-table {
    display: table;
}

.qti-uir-cell {
    display: table-cell;
}

input[name="uri"] {  padding-left:5px; }
input[name="uri"]::-webkit-input-placeholder { font-style:italic; letter-spacing:1px; color:#757777; }
input[name="uri"]:-moz-placeholder { font-style:italic; letter-spacing:1px; color:#999; }
input[name="uri"]::-moz-placeholder { font-style:italic; letter-spacing:1px; color:#999; }
input[name="uri"]::-ms-input-placeholder { font-style:italic; letter-spacing:1px; color:#999; }

.qti-uir-submit-selector {
	text-align: right;
	margin-bottom: 10px;
}

/* FineUploader customization */
.qti-uir-qq-button-hover {
    background: none;
}

.pm-os-download {
    display: inline;
    font-size: 12px;
    margin-right: 12px;
    font-weight: normal;
    color: #000000;
}

.pm-os-hide {
    display: none;
}


/* Local Variables: */
/* tab-width: 4 */
/* End: */

.qti-ngr-container {
	position:relative;
	display:inline-block;
	vertical-align:top;
}


.qti-ngr-container span.labelleft {
	margin-right: 5px;
}

.qti-ngr-container span.labelright {
	margin-left: 5px;
}

span.qti-ng-grid-container {
	position:relative;
	display:inline-block;
	vertical-align:top;
	text-align: center;
}

.qti-ngr-container table {
	display: table;
	table-layout: fixed;
    border-collapse: collapse;
    border-spacing: 2px;
    border: 2px solid #000;
}

.qti-ngr-container col:nth-child(odd) {
	background: #fff;
}

.qti-ngr-container col:nth-child(even) {
	background: #ececec;
}

.qti-ngr-container tbody span:not(.qti-ngr-blank) {
    height: auto;
    width: auto;
    min-height: 15px;
    min-width: 15px;
    line-height: 15px;
    border: 2px solid #454545;
    border-radius: 50px;
    margin: 2px;
    display:block;
    font-size:x-small;
}

.qti-ngr-container tbody span:hover {
	-moz-box-shadow: 0 0 10px #000;
	-webkit-box-shadow: 0 0 10px #000;
	box-shadow: 0 0 10px #000;
}

.qti-ngr-container  .qti-ngr-sel {
    margin: 2px;
    background:pink;
}

.qti-ngr-container .qti-ngr-ans > th {
	margin:0;
	padding:0;
	font-weight:600;
	text-align:center;
    width: 12px;

}

.qti-ngr-container  .qti-ngr-ans input {
	height:30px;
    width: 25px;
    position:relative;
    border:none;
    background: inherit;
    text-align:center;
    font-size: small;
    font-weight:600;
}

.qti-ngr-container .qti-ngr-hr-ans-bottom {
	border-bottom: 2px solid #000;
}

.qti-ngr-container .qti-ngr-hr-bottom {
	border-bottom: .5px solid #a6a6a6;
}

.qti-ngr-container .qti-ngr-selected {
	background-color: black;
	color:white;
}

.qti-ngr-container .qti-ngr-fixed {
	background-color: black;
	color:white;
}

.qti-ngr-container  .qti-ngr-neg::after { content:"-" }
.qti-ngr-container  .qti-ngr-div::after { content:"/" }
.qti-ngr-container  .qti-ngr-dec::after { content:"." }
.qti-ngr-container  .qti-ngr-0::after { content:"0" }
.qti-ngr-container  .qti-ngr-1::after { content:"1" }
.qti-ngr-container  .qti-ngr-2::after { content:"2" }
.qti-ngr-container  .qti-ngr-3::after { content:"3" }
.qti-ngr-container  .qti-ngr-4::after { content:"4" }
.qti-ngr-container  .qti-ngr-5::after { content:"5" }
.qti-ngr-container  .qti-ngr-6::after { content:"6" }
.qti-ngr-container  .qti-ngr-7::after { content:"7" }
.qti-ngr-container  .qti-ngr-8::after { content:"8" }
.qti-ngr-container  .qti-ngr-9::after { content:"9" }


/* Local Variables: */
/* tab-width: 4 */
/* End: */




.pmf-numberlineinteraction-board {
	width: 450px;
	height: 450px;
}

.numberlineinteraction-response-ge {
	background: url(../images/numberline/ge.svg);
}

.numberlineinteraction-response-le {
	background: url(../images/numberline/le.svg);
}

.numberlineinteraction-response-gele {
	background: url(../images/numberline/gele.svg);
}

.numberlineinteraction-response-gt {
	background: url(../images/numberline/gt.svg);
}

.numberlineinteraction-response-lt {
	background: url(../images/numberline/lt.svg);
}

.numberlineinteraction-response-gtlt {
	background: url(../images/numberline/gtlt.svg);
}

.numberlineinteraction-response-gtle {
	background: url(../images/numberline/gtle.svg);
}

.numberlineinteraction-response-gelt {
	background: url(../images/numberline/gelt.svg);
}

.numberlineinteraction-response-eq {
	background: url(../images/numberline/eq.svg);
}

.numberlineinteraction-response{
	margin-left: 11px;
	margin-bottom: 10px;
	border: 1px solid #ccc;
	background-repeat: no-repeat;
	background-position: 11px center;
	border-radius: 4px;
	height: 32px;
	width: 148px;
}
.audiovideo-instruction-text {
	font-family: Roboto, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 400;
}

.audiovideo-table {
	width: 100%;
}

.audiovideo-table-main-container {
	display: flex;
	width: 100%;
}

.audiovideo-table-cell-align {
	flex-grow: 1;
	display: flex;
	align-items: center;
}

.audiovideo-table-cell-spacing {
	padding-right: 20px;
	width: 714px;
	height: 488px;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
}

.audiovideo-button-container {
	display: flex;
	justify-content: flex-start;
	background: #F1F4F4;
	flex: 1;
	flex-direction: row;
}

.audiovideo-button-container button {
	margin-right: 10px;
}

.audiovideo-button {
	height: 32px;
	cursor: pointer;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	font-family: Open Sans, sans-serif;
	font-size: 16px;
	font-weight: 600;
	padding-left: 30px;
	margin-top: 15px;
}

.audiovideo-button.record-video {
	background: url('../images/audiovideo/video-white.svg') no-repeat left;
	background-position: 5px;
	background-size: 20px 20px;
	background-color: #0075DB;
	border: 1px solid #0075DB;
	border-radius: 4px;
	color: #FFFFFF;
	margin-left: 15px;
}

.audiovideo-button.stop {
	background: url('../images/audiovideo/stop.svg') no-repeat left;
	background-position: 5px;
	background-size: 20px 20px;
	background-color: #0075DB;
	border: 1px solid #0075DB;
	border-radius: 4px;
	color: #FFFFFF;
	margin-left: 15px;
	display: none;
}

.audiovideo-button.record-audio {
	background: url('../images/audiovideo/speaker-white.svg') no-repeat left;
	background-position: 5px;
	background-size: 20px 20px;
	background-color: #0075DB;
	border: 1px solid #0075DB;
	border-radius: 4px;
	color: #FFFFFF;
	margin-left: 15px;
}

.audiovideo-button.preview {
	background: url('../images/audiovideo/play.svg') no-repeat center left;
	background-position: 10px;
	background-size: 20px 20px;
	border: none;
	color: #677274;
}

.audiovideo-button.play {
	margin-left: 15px;
	background: url('../images/audiovideo/play-blue.svg') no-repeat center left;
	background-position: 5px;
	background-color: #FFFFFF;
	background-size: 20px 20px;
	border-width: 1px;
	color: #0075DB;
	border-color: #0075DB;
	border-radius: 4px;
}

.audiovideo-button.pause {
	background: url('../images/audiovideo/pause.svg') no-repeat center left;
	background-position: 10px;
	background-size: 20px 20px;
	border: none;
	color: #677274;
}

.audiovideo-button.pause-playback {
	margin-left: 15px;
	background: url('../images/audiovideo/pause-blue.svg') no-repeat center left;
	background-position: 5px;
	background-color: #FFFFFF;
	background-size: 20px 20px;
	border-width: 1px;
	color: #0075DB;
	border-color: #0075DB;
	border-radius: 4px;
}

.audiovideo-button.refresh {
	background: url('../images/audiovideo/refresh.svg') no-repeat center left;
	background-position: 5px;
	background-size: 20px 20px;
	border: none;
	color: #677274;
}

.audiovideo-button.submit {
	background-color: #0075DB;
	border: 1px solid #0075DB;
	border-radius: 4px;
	color: #FFFFFF;
	padding: 0px 10px;
	margin-left: auto;
	margin-right: 15px;
}

.audiovideo-button.submitted {
	background: url('../images/audiovideo/status-check.svg') no-repeat center left;
	background-position: 5px;
	background-size: 20px 20px;
	border: none;
	color: #677274;
	margin-left: auto;
	margin-right: 15px;
}

.audiovideo-button.hidden {
	display: none;
}

.audiovideo-record-frame {
	display: flex;
	flex-direction: column;
	padding: 3px;
	justify-content: center;
	align-items: center;
	background: #F1F4F4;
	flex: 1;
	margin: 0;
}

.audiovideo-answer-frame {
	height: 165px;
	padding: 10px;
	font-family: Roboto, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	text-align: left;
}

.audiovideo-submit-status-container {
	display: flex;
	padding: 15px;
}

.audiovideo-submit-status-container-warning {
	background: url('../images/warning.png') no-repeat center left;
	padding-left: 10px;
	position: relative;
}

.audiovideo-submit-status-container-error {
	background: url('../images/red_x_32.png') no-repeat center left;
	padding-left: 10px;
	position: relative;
}

.audiovideo-submit-status-container span {
	color: #797979;
	align-content: center;
}

.audiovideo-submit-status-container-padding {
	padding-left: 25px;
}

.audiovideo-media-container {
	position: relative;
	height: 383px;
	width: 682px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.audiovideo-recording-placeholder {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}

.audiovideo-file-awaiting {
	position: absolute;
	display: none;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}

.audiovideo-file-awaiting.visible {
	display: flex;
}

.audiovideo-still-canvas {
	position: absolute;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	display: none;
}

.audiovideo-canvas-highligthed {
	background: #cdcdcd4d;
}

.audiovideo-record-frame #web-cam {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.audiovideo-icon-large {
	display: inline-block;
	width: 52px;
	height: 52px;
	background: url('../images/audiovideo/video.svg') no-repeat center center;
	background-size: cover;
}

.audiovideo-icon-large.video {
	background-image: url('../images/audiovideo/video.svg');
}

.audiovideo-icon-large.audio {
	background-image: url('../images/audiovideo/speaker.svg');
}

.permissions-blocked {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

.permissions-blocked-header-text {
	margin-top: 15px;
	font-size: 12px;
}

.permissions-blocked-subheader-text {
	font-size: 10px;
}

.audio-blocked {
	width: 52px;
	height: 52px;
	background: url('../images/audiovideo/mic-off.svg') no-repeat center center;
	background-size: cover;
}

.video-blocked {
	width: 52px;
	height: 52px;
	background: url('../images/audiovideo/camera-off.svg') no-repeat center center;
}

.audiovideo-recording-indicator-container {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.audiovideo-recording-indicator-status-group {
	display: flex;
	align-items: center;
	padding-left: 16px;
}

.audiovideo-recording-indicator-feedback-hidden {
	visibility: hidden;
}

.audiovideo-recording-indicator-rec-circle {
	width: 8px;
	height: 8px;
	background-color: red;
	border-radius: 50%;
	margin-right: 5px;
	display: none;
}

.audiovideo-recording-indicator-feedback {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 500;
	padding-right: 16px;
	padding-top: 5px;
}

.audiovideo-recording-indicator-feedback.rec-text {
	display: none;
}

.audiovideo-recording-status-bar {
	width: 100%;
	height: 7px;
	background: #D9D9D9;
	border-radius: 10px;
	margin-top: auto;
}

.audiovideo-waveform-canvas {
	max-width: 100%;
	flex: 1;
	background: #cdcdcd4d;
}

.audiovideo-paused-overlay {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: grey;
	opacity: 0.5;
	font-size: x-large;
	font-weight: bold;
	padding: 10px;
	display: none;
}

.audiovideo-disabled {
  background-color: rgba(128, 128, 128, 0.3);
}

.audiovideo-preview {
	width: 100%;
	height: 95%;
	object-fit: cover;
	display: none;
}

.audiovideo-preview-seek-bar {
	width: 100%;
	display: none;
}

.audiovideo-button.disabled {
	opacity: 0.3;
	cursor: default;
}

#submitted-recording.audiovideo-button.disabled {
	opacity: 1;
}