



/* ------------- 
content start - css
------------- */

:root {
    --main-font-color: #214B57; /* Цвет основного шрифта */
    --first-color: #9AACAF; /* Цвет обводки полей, значков (emoji, микрофон, скрепка и др.) */
    --second-color: #F2F9F9; /* Второй цвет (цвет некоторых кнопок и элементов (в основном при наведении), должен быть темнее первого) */
    --send-btn-color: #73D1D4; /* Цвет некоторых кнопок (Отправить ответ и др.) */ 
    --send-btn-color-hover: #9ED1E1; /* Цвет некоторых кнопок при наведении (Отправить ответ и др.) */ 
    }
    
    /* Цвет фона ДЗ и комментариев */
    .lt-lesson-mission-block .container .row .col-md-12 div:not(.lesson-mission-wrapper, .lesson-mission-wrapper div), .simple-answer, .other-answers {
    background: #ffffff;
    }
    
    /* Цвет плейсхолдера полей (Ваш ответ: и т.д.) */
    input[type="text"]::placeholder, textarea::placeholder {
    color: #b3b3b3;
    }
    
    /* Цвет надписи "Сохранить черновик" и отмены редактирования комментария */
    .btn-save-draft, .comment-cancel-edit-link {
    color: #9AACAF !Important;
    }
    
    /* Цвет надписи "Сохранить черновик" и отмены редактирования комментария при наведении */
    .btn-save-draft:hover, .btn-save-draft:focus, .btn-save-draft:active, .btn-save-draft:active:focus, .comment-cancel-edit-link:hover, .comment-cancel-edit-link:focus, .comment-cancel-edit-link:active, .comment-cancel-edit-link:active:focus {
    color: #9AACAF !Important;
    }
    
    /* Цвет кнопки добавления файлов */
    .answer-form-inner .uploadifive-button {
    background-color: #9ED1E1; /* Задний фон кнопки */
    background-image: none !Important;
    color: #ffffff !Important; /* Текст на кнопке */
    }
    
    /* Цвет кнопки добавления файлов при наведении */
    .answer-form-inner .uploadifive-button:hover {
    background: #9EDDE1 !Important;
    }
    
    /* Цвет текста подписей (Максимальный размер файла) */
    .text-muted {
    color: #54565d !Important;
    }
    
    /* Цвет кнопки "Нравится" и кнопки "Подписаться" (Генератор цвета: https://codepen.io/sosuke/pen/Pjoqqp) */
    .answer-content .b-like-and-subscribe-notifications .button:before {
    filter: brightness(113%) saturate(7146%) invert(100%) sepia(18%) hue-rotate(209deg) contrast(84%);
    }
    
    /* Цвет кнопки "Нравится" и кнопки "Подписаться" при наведении или активности (Генератор цвета: https://codepen.io/sosuke/pen/Pjoqqp) */
    .answer-content .b-notifications-subscribe .button:hover:before, .answer-content .b-like-and-subscribe-notifications .button:hover:before, .answer-content .b-notifications-subscribe .button.subscribed:before, .answer-content .b-like-and-subscribe-notifications .button.positive.like:before {
    filter: brightness(83%) saturate(220%) invert(72%) sepia(45%) hue-rotate(350deg) contrast(90%);
    }
    
    /* Цвет разделителя между кнопками "Нравится" и "Подписаться" */
    .b-like-and-subscribe-notifications .word-separator {
    color: transparent;
    user-select: none;
    }
    
    /* Стили формы ДЗ */
    .lt-lesson-mission-block .container .row .col-md-12 div:not(.lesson-mission-wrapper, .lesson-mission-wrapper div) {
    transition: all 0.4s;
    box-shadow: none; /* Тень (Генератор тени: https://active-vision.ru/icon/box-shadow) */
    border-radius: 20px;
    }
    
    /* Тень формы ДЗ при наведении (Генератор тени: https://active-vision.ru/icon/box-shadow) */
    .lt-lesson-mission-block .container .row .col-md-12 div:not(.lesson-mission-wrapper, .lesson-mission-wrapper div):hover {
    box-shadow: 0px 20px 40px rgb(217 195 171 / 20%);
    }
    
    /* Стили блока отправки комментария */
    .simple-answer {
    border-radius: 20px;
    transition: all 0.4s;
    background: none !Important;
    box-shadow: none; /* Тень (Генератор тени: https://active-vision.ru/icon/box-shadow) */
    }
    
    /* Тень блока отправки комментария при наведении (Генератор тени: https://active-vision.ru/icon/box-shadow) */
    .simple-answer:hover {
    box-shadow: 0px 20px 40px rgb(217 195 171 / 20%);
    }
    
    /* Стили блока комментариев */
    .other-answers {
    border-radius: 20px;
    transition: all 0.4s;
    margin-top: 20px;
    background: none !Important;
    box-shadow: none; /* Тень (Генератор тени: https://active-vision.ru/icon/box-shadow) */
    }
    
    /* Тень блока комментариев при наведении (Генератор тени: https://active-vision.ru/icon/box-shadow) */
    .other-answers:hover {
    box-shadow: 0px 20px 40px rgb(217 195 171 / 20%);
    }
    
    /* Заменяем стандартную иконку пользователя */
    .center-block .user-default-profile-image {
    content: url("https://img.icons8.com/ios-filled/100/151622/user.png"); /* Замена иконки пользователя около формы ДЗ, если нет аватарки ("https://img.icons8.com/ios-filled/100/Здесь код цвета без решётки/user.png") */
    }
    
    /* Цвета фона комментариев */
    .user-answer .addfield, .lesson-answer-comment {
    background: rgb(243,230,214, 0.4);
    }
    
    .comment-wrapper.comments-container {
    background-color: transparent !Important;
    }
    
    /* Стили ответа на комментарий при появлении */
    .comment-wrapper.comments-container[style*="rgba"] {
    background-color: rgba(243,230,214, 0.6) !Important; /* Цвет */
    -webkit-transition: background-color 700ms linear;
    -ms-transition: background-color 700ms linear;
    transition: background-color 700ms linear;
    border-radius: 20px;
    margin-right: 45px !important;
    margin-bottom: 11px;
    padding: 0px;
    }
    
    .user-answer .comment-wrapper .comments {
    margin-top: 0px !important;
    }
    
    .comment-wrapper.comments-container[style*="rgba"] .lesson-answer-comment {
    margin-bottom: 0px !important;
    }
    
    /* Стили комментария при появлении */
    .user-answer.type-free_comment[style*="rgba"]{
    background-color: rgba(243,230,214, 0.3) !Important; /* Цвет */
    -webkit-transition: background-color 700ms linear;
    -ms-transition: background-color 700ms linear;
    transition: background-color 700ms linear;
    border-bottom-left-radius:  20px;
    border-bottom-right-radius:  20px;
    } 
    
    .user-answer.type-free_comment {
    background-color: transparent !important;
    }
    
    .answer-form .addfield-type-checkbox {
    padding-left: 20px;
    }
    
    .answer-form .addfield-type-checkbox label {
    display: block;
    margin-left: 0;
    padding-left: 30px;
    padding-top: 0px;
    position: relative;
    }
    
    .answer-form .addfield-type-checkbox input[type="checkbox"] {
    display: flex;
        left: 128px;
        position: absolute;
        z-index:1;
        opacity: 0;   
    }
    
    .answer-form .addfield-type-checkbox label:before {
    content: '';
    color: var(--first-color);
    position: absolute;
    width: 20px;
    height: 20px;
    max-width: 20px;
    max-height: 20px;
    left: 0px;
    top: 0px;
    font-size: 20px;
    padding-left: 5px;
    padding-top: 8px;
    line-height: 0;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid var(--first-color) !important;
    }
    
    .answer-form .addfield-type-checkbox input[type="checkbox"]:checked ~ label:before {
    content: '\f00c';
    }
    
    .answer-form input[type="checkbox"][id="user_hide_answer"] {
    position: absolute;
    left: -1000px
    }
    
    .answer-form input[type="checkbox"][id="user_hide_answer"]:before {
    content: '';
    color: var(--first-color);
    position: absolute;
    width: 20px;
    height: 20px;
    max-width: 20px;
    max-height: 20px;
    left: 1085px;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid var(--first-color) !important;
    }
    
    .answer-form input[type="checkbox"][id="user_hide_answer"]:checked:before {
    content: '\f00c';
    font-size: 20px;
    padding-left: 5px;
    padding-top: 7.5px;
    line-height: 0;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid var(--first-color) !important;
    font-weight: bold;
    }
    
    .answer-form label[for="user_hide_answer"]{
    margin-left: 30px !important;
    margin-bottom: 10px;
    }
    
    .answer-form #user_hide_answer {
    margin-top: 0px !important;
    }
    
    .addfield label:empty {
    display: none !important;
    }
    
    @media only screen and (max-width: 767px) {
    .answer-form input[type="checkbox"][id="user_hide_answer"]:before {
    left: 58px !Important;
    top: 10px;
    }
    
    .answer-form label[for="user_hide_answer"] {
    margin-bottom: 0px !Important;
    }
    }
    
    .lt-lesson-mission-block h3 {
    color: var(--main-font-color);
    padding: 30px 20px 0px;
    font-weight: 800;
    padding-top: 35px!Important;
    letter-spacing: 0.02em;
    transition: color 0.5s;*/
    background: none !Important;
    }
    
    .user-profile-image:not(.user-default-profile-image) {
    border-radius: 100px;
    }
    
    .user-profile-image {
    width: 40px;
    height: 40px;
    }
    
    .answer-form .addfield label {
    color: var(--main-font-color);
    font-weight: bold !Important;
    }
    
    .lesson-mission-text p {
    color: var(--main-font-color);
    }
    
    label[for="user_hide_answer"] {
    color: var(--main-font-color);
    font-weight: 400;
    }
    
    .lesson-mission-wrapper {
    color: var(--main-font-color);
    border: none;
    margin-top: 0px;
    transition: all 0.4s;
    background: none !Important;
    }
    
    .lesson-mission-text {
    border-bottom: none !Important;
    }
    
    .answer-form {
    background: transparent !Important;
    }
    
    .emoji-textarea, .emoji-wysiwyg-editor, .new-comment-textarea.edited-comment-text {
    border-color: var(--first-color);
    border-radius: 20px;
    outline: none;
    padding: 10px;
    resize: none !Important;
    color: var(--main-font-color) !Important;
    }
    
    .emoji-button {
    padding: 10px;
    }
    
    .emoji-button span.fa {
    color: var(--first-color);
    }
    
    .emoji-wysiwyg-editor {
    margin-bottom: 21px;
    }
    
    .addfield .type-string, .addfield .type-currency, .addfield .type-float {
    border: 1px solid var(--first-color);
    border-radius: 20px;
    outline: none;
    padding: 10px;
    color: var(--main-font-color) !Important;
    }
    
    .edit-comment-active-element {
    color: transparent;
    user-select: none;
    }
    
    .type-text.emoji-textarea {
    margin-bottom: 15px;
    color: var(--main-font-color) !Important;
    }
    
    .answer-form-inner div {
    color: var(--main-font-color) !Important;
    }
    
    .uploadifive-button {
    border-radius: 50px !Important;
    transition: all 0.2s;
    font: bold 12px;
    letter-spacing: 0.02em;
    }
    
    input[type="file"] {
    cursor: pointer;
    }
    
    .btn-send-answer, .btn-primary[name="send-answer"], .save-edited-comment-btn {
    background: var(--send-btn-color);
    border: none;
    border-radius: 50px !Important;
    transition: all 0.2s;
    font: bold 12px;
    font-size: 12px;
    letter-spacing: 0.02em;
    height: 40px !Important;
    }
    
    .btn-send-answer:hover, .btn-send-answer:focus, .btn-send-answer:active, .btn-send-answer:active:focus, .btn-primary[name="send-answer"]:hover, .btn-primary[name="send-answer"]:focus, .btn-primary[name="send-answer"]:active, .btn-primary[name="send-answer"]:active:focus, .save-edited-comment-btn:hover, .save-edited-comment-btn:focus, .save-edited-comment-btn:active, .save-edited-comment-btn:active:focus {
    background: var(--send-btn-color-hover) !Important;
    }
    
    .btn-save-draft, .comment-cancel-edit-link {
    font: bold 12px!Important;
    font-weight: bold;
    font-size: 12px;
    letter-spacing: 0.02em;
    height: 40px !Important;
    }
    
    .comment-cancel-edit-link {
    margin-left: -3px;
    }
    
    .text-muted {
    font-size: 11px !Important;
    width: 100%!Important;
    font-weight: 500;
    letter-spacing: 0.01em;
    }
    
    .simple-answer .emoji-button {
    top: 1px;
    }
    
    .btn-send {
    background: var(--send-btn-color);
    border: none;
    border-radius: 50px !Important;
    transition: all 0.2s;
    font: bold 12px;
    font-size: 12px;
    letter-spacing: 0.02em;
    height: 40px !Important;
    }
    
    .btn-send:hover, .btn-send:focus, .btn-send:active, .btn-send:active:focus {
    background: var(--send-btn-color-hover) !Important;
    }
    
    .simple-answer .emoji-wysiwyg-editor {
    color: var(--main-font-color) !Important;
    }
    
    .comments-tree .user-image-wrapper img {
    width: 40px !Important;  
    }
    
    @media screen and (max-width: 1001px) {
    .btn-send-answer, .btn-save-draft {
    margin-top: 10px;
    }
    }
    
    @media (max-width: 767px) {
    .new-comment .textarea-block {
    width: 100%;
    padding: 12px;
    }
    
        .answer-form .addfield-type-checkbox input[type="checkbox"] {
    display: flex;
        left: 78px;
        position: absolute;
        z-index:1;
        opacity: 0;   
    }
        
    .simple-answer .new-comment-textarea {
    height: unset;
    min-height: 85px !Important;
    }
    
    .comment-form-wrapper .new-comment-textarea::placeholder {
    max-width: 65%;
    }
    
    .comment-form-wrapper .new-comment-textarea {
    min-height: 60px !Important;
    height: unset !Important;
    }
    }
    
    .comment-form-wrapper .new-comment-textarea {
    border: 1px solid var(--first-color);
    border-radius: 20px;
    outline: none;
    padding: 10px;
    color: var(--main-font-color) !Important;
    min-height: 43px !Important;
    }
    
    .new-comment {
    margin-top: 5px;
    }
    
    .type-mission_answer .emoji-button {
    top: 4px !Important;
    }
    
    .user-answer {
    border: none !Important;
    padding-bottom: 0px;
    }
    
    .user-answer .addfield {
    border-radius: 20px;
    font-size: 12px;
    line-height: 14px;
    letter-spacing: 0.02em;
    color: var(--main-font-color) !Important;
    margin-bottom: 10px;
    }
    
    .user-answer .addfield .value {
    color: var(--main-font-color) !Important;
    }
    
    .user-answer .main {
    margin-right: 50px;
    }
    
    .user-answer .simple-filelist {
    padding-left: 0px;
    }
    
    .user-answer .simple-filelist-filesize {
    color: var(--main-font-color) !Important;
    }
    
    .lesson-answer-comment {
    border-radius: 20px;
    font-size: 12px;
    line-height: 14px;
    letter-spacing: 0.02em;
    color: var(--main-font-color) !Important;
    margin-bottom: 10px;
    padding: 15px 10px 0px !Important;
    }
    
    .answer-content .b-like-and-subscribe-notifications .button {
    border-bottom: none;
    font-size: 12px;
    letter-spacing: 0.02em;
    color: var(--main-font-color);
    }
    
    .other-answers, .other-answers .emoji-text, .other-answers .comment-time, .other-answers .title span, .answer-date, .answer-date a, .user-answer .title span, .user-answer .emoji-text, .user-answer .comment-time {
    color: var(--main-font-color) !Important;
    }
    
    .answer-content .b-like-and-subscribe-notifications .button:before {
    content:"";
    display: inline-block;
    vertical-align: text-top;
    width: 14px;
    height: 14px;
    margin: 0 6px 0 0;
    background-image: url("https://fs.getcourse.ru/fileservice/file/download/a/682244/sc/347/h/979cf192d6e170c6f636efd8aa0bee2a.svg");
    background-size: cover;
    }
    
    .answer-content .b-notifications-subscribe .button:before {
    background-image: url("https://fs.getcourse.ru/fileservice/file/download/a/682244/sc/204/h/559bcaf384164b29eeff27d3e62522f4.svg");
    }
    
    .answer-content .b-like-and-subscribe-notifications .positive-count {
    display: none;
    }
    
    .answer-content .b-like-and-subscribe-notifications .button.positive.like:before {
    background-image: url("https://fs.getcourse.ru/fileservice/file/download/a/682244/sc/58/h/d5547616277a6630d293d5f1fb3308ff.svg");
    }
    
    .more-comments {
    color: var(--main-font-color) !Important;
    font-weight: 600;
    }
    
    .comment-form-wrapper .new-comment.active .btn-send {
    text-transform: capitalize;
    color: #ffffff !Important; /* Цвет надписи на кнопке "Отправить" (комментарий) */
    }
    
    .answer-status-label {
    border-radius: 10px !Important;
    font-weight: bold;
    }
    
    .user-answer .answer-status {
    margin-right: 50px;
    }
    
    .other-answers .answer-status {
    margin-right: 50px;
    }
    
    .answer-status a {
    color: #313131; /* Цвет надписи "Модерация" */
    opacity: 0.9;
    font-weight: bold;
    transition: all 0.1s;
    }
    
    .answer-status a:hover {
    opacity: 1;
    }
    
    .answer-status a[href*="/pl/../../teach/control/answers/review"]:before {
    content: "\270f";
    font-size: 12px;
    margin-right: 5px;
    display: inline-block;
    text-decoration: none !Important;
    }
    
    #answers {
    font-weight: bold;
    }
    
    #answers a {
    color: var(--first-color);
    text-decoration: none;
    transition: all 0.1s;
    }
    
    #answers a:hover {
    color: var(--second-color);
    }
    
    .user-answer .comments-tree .level-1 .comment-wrapper {
    margin-right: 35px;
    }
    
    .lesson-answers-title a {
    color: var(--first-color);
    text-decoration: none;
    transition: all 0.1s;
    }
    
    
    .lesson-answers-title a:hover {
    color: var(--second-color);
    }
    
    #showMoreAnswers {
    background: var(--first-color);
    border: none;
    border-radius: 50px !Important;
    transition: all 0.2s;
    font-weight: bold;
    letter-spacing: 0.02em;
    margin-top: 20px;
    }
    
    #showMoreAnswers:hover {
    background: var(--send-btn-color-hover) !Important;
    }
    
    .user-image-wrapper span span {
    display: none;
    }
    
    .uploadifive-queue {
    margin-top: 10px;
    margin-right: 50px;
    }
    
    .uploadifive-queue-item {
    border-radius: 20px !Important;
    border: none;
    }
    
    .uploadifive-queue-item:not(:last-child) {
    margin-bottom: 10px;
    }
    
    .uploadifive-queue-item div {
    color: var(--main-font-color) !Important;
    }
    
    .comment-form-wrapper .file-uploader {
    width: 100%;
    margin: 0px;
    }
    
    .public-level-block {
    margin-top: 5px;
    margin-right: 0px;
    }
    
    .public-level-block.user-can-hide-answer {
    color: var(--main-font-color) !Important;
    font-weight: 50;
    }
    
    .change-public-level-link {
    margin-left: 5px;
    color: var(--second-color) !Important;
    font-weight: 600 !Important;
    text-decoration: none !Important;
    transition: all 0.2s;
    }
    
    .change-public-level-link .glyphicon {
    color: var(--main-font-color);
    }
    
    .change-public-level-link:hover {
    color: var(--first-color) !Important;
    }
    
    .answer-status > br {
    display: none;
    }
    
    a[href*="/pl/../teach/control/answers/edit"] {
    float: right;
    color: #313131 !Important; /* Цвет надписи "Редактировать ответ" */
    font-weight: bold;
    font-size: 12px;
    text-decoration: none !Important;
    transition: all 0.2s;
    margin-top: 5px;
    }
    
    a[href*="/pl/../teach/control/answers/edit"]:hover {
    color: #464343 !Important; /* Цвет надписи "Редактировать ответ" при наведении */
    }
    
    .emoji-container .emoji-wysiwyg-editor {
    color: var(--main-font-color) !Important;
    }
    
    .simple-filelist-icon img {
    border-radius: 10px;
    margin-bottom: 10px;
    }
    
    .comment-files-widget img {
    border-radius: 10px;
    margin-top: 10px;
    }
    
    .answer-files .file > a > img {
    margin-bottom: 10px;
    }
    
    .files.active .file {
    display: flex;
    flex-direction: row;
    align-items: center;
    }
    
    .glyphicon-file:before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/230006/sc/44/h/6e63192da616236d3f15de13c100d959.svg);
    }
    
    .simple-filelist-filename {
    margin-top: 4.5px;
    }
    
    @media only screen and (max-width: 767px) {
    .user-answer .main, .user-answer .answer-status, .other-answers .answer-status, .uploadifive-queue, .user-answer .comments-tree .level-1 .comment-wrapper, .comments-tree {
    margin-right: 0px !Important;
    }
    
    .other-answers .new-comment .textarea-block {
    padding: 0px;
    }
    
    .user-answer .comment-form-wrapper {
    padding-left: 0px;
    }
    
    .comment-form-wrapper {
    padding-right: 0px;
    }
    
    .user-answer .answer-status {
    text-align: right;
    display: inline-block;
    }
    
    a[href*="/pl/../teach/control/answers/edit"] {
    margin-right: 12px;
    }
    
    .b-like-and-subscribe-notifications {
    display: block;
    }
    
    .user-answer {
    padding: 0px 20px;
    }
    
    .text-muted {
    display: block;
    }
    
    .type-free_comment .answer-status {
    margin-right: -10px !Important;
    }
    
    .simple-answer.user-answer {
    padding-left: 10px;
    padding-right: 10px;
    }
    
    .type-mission_answer .answer-status {
    float: right;
    }
    
    .type-mission_answer .change-public-level-link {
    display: inline-block;
    }
    
    .type-mission_answer a[href*="/pl/../teach/control/answers/edit"] {
    margin-right: 0px !Important;
    }
    
    .type-mission_answer .public-level-block {
    margin-bottom: -5px !Important;
    }
    
    .type-mission_answer .new-comment .textarea-block {
    padding: 0px;
    }
    
    .lesson-answers-title > h3 {
    font-size: 16px;
    margin-bottom: 0px !Important;
    }
    
    .lesson-answers-title {
    display: flex;
    flex-direction: column-reverse;
    }
    
    .lesson-answers-title .pull-right {
    margin-bottom: 20px;
    }
    
    .other-answers .answer-content .title .text {
    display: inline-block;
    }
    }
    
    .audio-comment, 
    .audio-skill {
    right: 67px;
    top: 15px;
    color: var(--first-color);
    font-size: 17px !Important;
    transition: all 0.2s;
    }
    
    .attach-file-button-container {
    right: 40px;
    top: 12px;
    color: var(--second-color) !Important;
    font-size: 15px !Important;
    transition: all 0.2s;
    }
    
    .attach-file-button-container .uploadifive-button {
    color: var(--first-color) !Important;
    width: 17px !Important;
    transition: all 0.2s;
    }
    
    .uploadifive-button .glyphicon-paperclip {
    top: 4px;
    }
    
    .audio-status {
    font-weight: bold;
    }
    
    .audio-tip {
    border-color: var(--first-color);
    box-shadow: 0 0 8px rgb(96,138,219, 0.2);
    padding: 10px 0px;
    margin-right: 20px;
    border-radius: 20px;
    }
    
    .audio-tip .tooltip-inner {
    background: none;
    border-radius: unset;
    }
    
    .audio-save, .audio-cancel, .audio-record, .audio-pause, .audio-comment .fa.fa-microphone {
    color: var(--first-color) !Important ;
    font-weight: 50;
    transition: all 0.2s;
    }
    
    .audio-save:hover, .audio-cancel:hover, .audio-record:hover, .audio-pause:hover {
    color: var(--second-color) !Important;
    }
    
    .answer-form-inner br {
    display: none;
    }
    
    .simple-filelist {
    padding-left: 0px;
    padding-top: 10px;
    }
    
    .simple-filelist li .simple-filelist-icon {
    margin-bottom: 0px;
    }
    
    .simple-filelist-filesize {
    color: var(--main-font-color);
    }
    
    .simple-filelist-filename a {
    color: var(--main-font-color);
    }
    
    .emoji-button span.fa:hover, .attach-file-button-container .uploadifive-button:hover, .audio-comment .fa.fa-microphone:hover, .audio-skill:hover,
    .emoji-button span.fa:active, .attach-file-button-container .uploadifive-button:active, .audio-comment .fa.fa-microphone:active, .audio-skill:active {
    color: var(--second-color) !Important;
    }
    
    .addfield.type-file_list .simple-filelist li {
    display: flex;
    align-items: center;
    }
    
    .simple-filelist li .simple-filelist-filename {
    margin-top: 10px !Important;
    }
    
    .simple-filelist li .simple-filelist-filesize {
    display: inline;
    }
/* ------------- 
content finish - css
------------- */
