/*.k-icon {
    font: 22px/1 WebComponentsIcons;
}*/

.k-editor .k-i-View-all {
    background-image: url("../../Images/popup.png");
    background-repeat: no-repeat;
    background-size: 100%;
}


    .k-editor .k-i-View-all::before {
        content: none !important;
    }


.k-editor .k-i-Cut {
    background-image: url("../../Images/cut.png");
    background-repeat: no-repeat;
    background-size: 100%;
}


    .k-editor .k-i-Cut::before {
        content: none !important;
    }



.k-editor .k-i-Copy {
    background-image: url("../../Images/copy.png");
    background-repeat: no-repeat;
    background-size: 100%;
}


    .k-editor .k-i-Copy::before {
        content: none !important;
    }




.k-editor .k-i-Paste {
    background-image: url("../../Images/paste.png");
    background-repeat: no-repeat;
    background-size: 100%;
}


    .k-editor .k-i-Paste::before {
        content: none !important;
    }


.k-editor .k-i-Undo {
    background-image: url("../../Images/undo.png");
    background-repeat: no-repeat;
    background-size: 100%;
}


.k-editor .k-i-Undo::before {

    content: none !important;
}.k-editor .k-i-Mark-hot-text::before {
    content: none !important;
}

.k-editor .k-i-Mark-hot-text {
    background-image: url("../../Images/hottextwords-6-5.png");
    background-repeat: no-repeat;
    background-size: 100%;
    font: 22px/1 WebComponentsIcons;
}


    .k-editor .k-i-Mark-hot-text-key::before {
        content: none !important;
    }

.k-editor .k-i-Mark-hot-text-key {
    background-image: url("../../Images/hottextwords-7-5.png");
    background-repeat: no-repeat;
    background-size: 100%;
    font: 22px/1 WebComponentsIcons;
}


    .k-editor .k-i-Mark-hot-text-words::before {
        content: none !important;
    }

.k-editor .k-i-Mark-hot-text-words {
    background-image: url("../../Images/hottextwords-3-2.png");
    background-repeat: no-repeat;
    background-size: 100%;
    font: 22px/1 WebComponentsIcons;
}


    .k-editor .k-i-Mark-hot-text-sentences::before {
        content: none !important;
    }

.k-editor .k-i-Mark-hot-text-sentences {
    background-image: url("../../Images/hottextwords-5.png");
    background-repeat: no-repeat;
    background-size: 100%;
    font: 22px/1 WebComponentsIcons;
}


    .k-editor .k-i-Remove-all-hot-text::before {
        content: none !important;
    }

.k-editor .k-i-Remove-all-hot-text {
    background-image: url("../../Images/hottextwords-8-5.png");
    background-repeat: no-repeat;
    background-size: 100%;
    font: 22px/1 WebComponentsIcons;
}



.k-editor .k-i-Insert-paragraph-button::before {
    content: none !important;
}

.k-editor .k-i-Redo {
    background-image: url("../../Images/redo.png");
    background-repeat: no-repeat;
    background-size: 100%;
}


    .k-editor .k-i-Redo::before {
        content: none !important;
    }

.k-editor .k-i-Insert-paragraph-button {
    background-image: url("../../Images/ParagraphSymbol2.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

    .k-editor .k-i-Insert-drop-zone::before {
        content: none !important;
    }

.k-editor .k-i-Insert-drop-zone::before {
    content: none !important;
}
.k-editor .k-i-Insert-drop-zone {
    background-image: url("../../Images/dropzone.gif");
    background-repeat: no-repeat;
    background-size: 100%;
}

.k-i-Insert-drop-down {
    background-image: url("../../Images/adddropdown.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

.k-editor .k-i-Insert-inline-text {
    background-image: url("../../Images/InlineText.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

.k-editor .k-i-Insert-audio-placeholder::before {
    content: none !important;
}
.k-editor .k-i-Insert-audio-placeholder {
    background-image: url("../../images/audio.jpg");
    background-size: contain;
    width:100%;
    height:100%;
}

.k-editor .k-i-Insert-graphic-placeholder::before {
    content: none !important;
}
.k-editor .k-i-Insert-graphic-placeholder {
    background-image: url("../../images/palette.png");
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .k-i-Replace-graphic::before {
    content: none !important;
}
.k-editor .k-i-Replace-graphic {
    background-image: url("../../images/paletteswap.png");
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .DropZone {
    background-image: url(../../images/dropzone.gif);
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .HotText {
    background-image: url(../../images/hottext.png);
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .DropDown {
    background-image: url(../../images/adddropdown.png);
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .AnswerHotText {
    background-image: url(../../images/hottextanswer.png);
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .k-i-Wiris-formula::before {
    content: none !important;
}
.k-editor .k-i-Wiris-formula {
    background-image: url("~/wiris/radeditor_wiris/core/icons/formula.gif");
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .InlineText {
    background-image: url("../../images/InlineText.png");
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .CustomStyleClass {
    background-image: url("../../images/customstyleclass.png");
    background-size: contain;
    width: 100%;
    height: 100%;
}

.k-editor .k-i-Attachment {
    background-image: url("../../images/attach.png");
    background-size: contain;
    width: 100%;
    height: 100%;
}



/*.k-editor .k-editable-area textarea {
    white-space: pre;
}*/
/* This is here to override the ol in style.css that sets the list-style to none which makes the numbers not appear. */
.k-editor ol {
    list-style: decimal !important;
}

.k-editor ol, ul {
    margin-left: 0;
    margin-top: 0;
    margin-bottom: 0;
}

/* This is so the button click will trigger the editor, not just the image click */
#editorIcon {
    padding: 5px;
}

/* This stuff is dumb but the wiris default widths are dumb so here we are */
/*.wrs_editor > label, a, div {
    font-size: 12px;
}*/
.wrs_editor .wrs_select {
    max-width: 100px !important;
}


    .wrs_editor .wrs_select > div {
        max-width: 100px !important;
    }

.wrs_editor > .wrs_contextPanel > .wrs_toolbarElement_setFontSize > div:not(:first-child) {
    width: 50%;
}

.wrs_selectPanel > div:first-child {
    display: table-cell !important;
    width: 136px !important;
}

.htmlEditorCharCountContainer {
    display: inline-block;
    float: right;
}

.htmlEditorCharCountContainer label {
    font-size: 12px;
    /*font-weight: normal;*/
}

.TelerikContent {
    font-weight: normal;
}


.CharacterCountError {
    font-weight: bold;
    color: var(--color-error);
}

/* This is to fix wiris modal dialogs to be centered */
.wrs_modal_dialogContainer {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    -ms-transform: translateX(-50%) translateY(-50%) !important;
    -webkit-transform: translate(-50%,-50%) !important;
    transform: translate(-50%,-50%) !important;
}


body[contenteditable='true'], body[contenteditable='false'] {
    height: auto !important;
}