/* MOBILE */
@media (max-width: 1700px) {
    .container {
        width: calc(100% - 30px);
        margin: 0 auto;
        padding: 0;
        padding-left: 90px;
    }
}

@media (max-width: 1610px) {
    /*.report-view-wr{
        overflow-y: auto;
    }*/
    /*.report-view{
        min-width: 1000px;
    }*/
    .report-wrapper.report-view {
        max-width: 100%;
    }

    .report-content .content-wr pre.active,
    .report-content .content-wr > div.active {
        margin-bottom: 150px;
    }

    .report-content .content-wr > div.active, .report-content .content-wr h1.active, .report-content .content-wr h2.active, .report-content .content-wr h3.active, .report-content .content-wr h4.active, .report-content .content-wr h5.active, .report-content .content-wr h6.active, .report-content .content-wr p.active, .report-content .content-wr blockquote.active, .report-content .content-wr ol.active, .report-content .content-wr ul.active {
        padding-bottom: 150px;
    }

    .report-wrapper .comment-form {
        right: calc(50% - 300px);
        width: 600px;
        top: auto;
        bottom: 10px;
        background: #ED1364;
        color: #FFF;
    }

    .report-wrapper .comment-form .comment-content textarea {
        border-color: #111E3D;
        color: #000;
        background-color: #FFF;
    }

    .report-wrapper .comment-form .line {
        display: none;
    }

    .report-content .content-wr pre.active .comment-form,
    .report-content .content-wr > div.active .comment-form {
        bottom: -135px;
    }

    .report-with-history-wr .report-view-wr {
        padding-right: 40px;
    }
}

@media (max-width: 1460px) {
    /*.container {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }*/
    header .logo {
        margin-right: 20px;
    }

    .profile-wrapper {
        right: 20px;
    }

    .main-navigation li {
        position: relative;
    }

    .main-navigation li a {
        margin: 0 10px;
    }

    .two-columns-statistic {
        margin-left: -20px;
        margin-right: -20px;
    }

    .module-page-wr .module-lessons {
        width: calc(100% - 575px - 40px);
    }

    .module-page-wr {
        padding-top: 30px;
    }

    .lesson-page-wrapper {
        padding-top: 30px;
    }

    .lesson-page-wrapper .lesson-page-left-side {
        width: calc(100% / 3 * 2 - 20px);
    }

    .lesson-page-wrapper .lesson-page-right-side {
        width: calc(100% / 3 * 1 - 20px);
    }

    .user-mark {
        right: 205px;
    }

    .lesson-bottom-description img {
        width: 100% !important;
    }

    .users-search-form .search-form-btns-wr {
        flex-flow: column;
    }

    .users-search-form .search-form-btns-wr a {
        margin-bottom: 15px;
    }

    .logo-upload-row-wr .col-lg-6 {
        width: 75% !important;
    }
}

@media (min-width: 1376px) {
    .main-navigation {
        display: block !important;
    }
}

@media (max-width: 1375px) {

    .main-navigation {
        display: none;
    }

    /*.profile-wrapper {
        display: none;
    }*/
    header {
        height: 71px;
        padding: calc((84px - 64px) / 2) 0;
        background: #111E3D;
    }

    header .logo {
        margin: 0;
    }

    .header-wrapper {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .prev-button-header {
        display: block;
        background: url("/images/back.svg") no-repeat center;
        background-size: cover;
        width: 15px;
        height: 25px;
        position: absolute;
        left: 20px;
        filter: invert(100%);
    }

    .mobile-menu-toggle-btn {
        display: block;
        cursor: pointer;
        background: url("/images/open-menu.svg") no-repeat center;
        background-size: cover;
        height: 25px;
        width: 25px;
        position: absolute;
        right: 20px;
        filter: invert(100%);
    }

    .main-navigation {
        position: absolute;
        background: #111E3D;
        top: -9px;
        left: 0;
        right: 0;
        z-index: 10;
        -webkit-box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.25);
        box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.25);
        padding: 60px 20px 10px;
    }

    .main-navigation .logout-btn {
        display: block;
        margin: 15px 0 10px;
        color: #585858;
    }

    .main-navigation #logout-btn:hover {
        color: #61A9D8;
    }

    .main-navigation ul {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column;
        flex-flow: column;
    }

    .main-navigation li {
        margin: 5px 0;
    }

    .main-navigation li a {
        margin: 0;
        font-weight: 400;
    }

    .close-menu {
        display: block;
        width: 25px;
        height: 25px;
        cursor: pointer;
        background: url("/images/close.svg") no-repeat center;
        background-size: cover;
        position: absolute;
        right: 20px;
        top: 30px;
        filter: invert(100%);
    }

    .main-navigation li:hover > a {
        color: #585858;
    }

    .main-navigation li:hover ul.menu-subpage {
        padding: 0;
        border: 0;
        border-radius: 0;
    }

    .main-navigation li ul.menu-subpage {
        display: block !important;
        position: static !important;
    }

    .main-navigation ul.menu-subpage li a {
        margin: 0 0 0 20px;
    }

    .user-mark {
        top: 15px;
        right: 70px;
    }

    .permissions-wr .permission-content .form-row .form-group {
        display: block;
    }

    .permissions-wr .permission-content .form-row .form-group .form-control,
    .permissions-wr .permission-content .form-row .form-group .control-label {
        width: 100%;
    }
}

@media (max-width: 1300px) {
    .module-image-wr .free-label {
        font-size: .8em;
    }

    .search-results-page-wr .lessons-wrapper .lesson-video {
        width: 30%;
    }

    .search-results-page-wr .lessons-wrapper .lesson-desc {
        width: 68%;
    }

    .search-results-page-wr .lessons-wrapper .lesson-desc h2 {
        font-size: 22px;
        line-height: 22px;
        margin-bottom: 20px;
    }

    .bookmark:not(.bookmark-status):hover {
        background-image: url(/images/bookmark_dark_blue.png);
    }

    .bookmark.active {
        background-image: url(/images/bookmark-full_dark_blue.png) !important;
    }

    .lesson-wr .bookmark:not(.bookmark-status):hover {
        background-image: url(/images/bookmark_dark_blue_min.png);
    }

    .lesson-wr .bookmark.active {
        background-image: url(/images/bookmark-full_dark_blue_min.png) !important;
    }

    .self-grades-tabs-navigation a {
        font-size: 14px;
    }

    .self-grades-subcategory [role="radiogroup"] {
        font-size: 12px;
    }

    .self-grades-subcategory {
        border-width: 6px;
    }

    .prof-grade-wr .two-columns {
        display: block;
    }

    .prof-grade-wr .two-columns > div:first-child {
        border: none;
        margin-bottom: 15px;
    }

    .prof-grade-wr .two-columns > div {
        width: 100% !important;
    }
}

@media (max-width: 1280px) {
    /*1140*/
    .banner .container {
        font-size: 18px;
    }

    .banner .add-text {
        font-size: 16px;
        margin-top: 0;
    }

    .module-information .module-description {
        font-size: 16px;
    }

    .module-image-wr .free-label {
        font-size: .6em;
    }

    h2 {
        font-size: 24px;
    }

    .module-page-wr .module-information {
        width: calc(50% - 15px);
    }

    .module-page-wr .module-lessons {
        width: calc(50% - 15px);
    }

    .lesson-group .lesson-group-title {
        font-size: 16px;
    }

    .lesson-page-wrapper {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .lesson-page-wrapper .lesson-page-left-side {
        width: 100%;
        margin-bottom: 40px;
    }

    .lesson-page-wrapper .lesson-page-right-side {
        width: 100%;
    }

    .btn-blue-on-hover,
    .btn-blue {
        font-size: 16px;
    }

    .modules-wr {
        margin-bottom: 30px;
    }
}

@media (max-width: 1210px) {
    .users-page .table {
        overflow-y: scroll;
    }

    .users-page #user-statistic-data_wrapper {
        width: 1168px;
        min-width: 1168px;
    }

    .users-page #user-statistic-data_wrapper .row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .users-page #user-statistic-data_wrapper .col-sm-6 {
        width: 100%;
    }

    .users-page div.dataTables_wrapper div.dataTables_filter {
        text-align: left;
        margin: 10px 0;
    }

    .users-page div.dataTables_wrapper div.dataTables_paginate {
        text-align: left;
    }

    .users-page #user-statistic-data_wrapper #user-statistic-data_length,
    .users-page #user-statistic-data_wrapper #user-statistic-data_info {
        text-align: left;
    }

    /*.super-quiz-statistic .col-sm-6 {
        width: 100%;
    }*/
    .challenge-final-results-wrapper .col-flex {
        display: block;
    }

    .challenge-final-results-wrapper .col-flex .col-40,
    .challenge-final-results-wrapper .col-flex .col-60 {
        width: 100%;
    }

    .challenge-final-results-wrapper .col-flex .col-40 {
        margin-bottom: 20px;
    }

    .search-results-page-wr .lesson-wrapper {
        flex-wrap: wrap;
    }

    .search-results-page-wr .lessons-wrapper .mobile-lesson-header {
        display: block;
        width: 100%;
    }

    .search-results-page-wr .lessons-wrapper .mobile-lesson-header h2 {
        margin-bottom: 20px;
    }

    .search-results-page-wr .lessons-wrapper .lesson-desc h2 {
        display: none;
    }
}

@media (max-width: 1100px) {
    .settings-wr {
        width: 100%;
        max-width: 100%;
    }

    .faq-wrapper {
        flex-flow: column;
    }

    .faq-wrapper .contact-from-wr,
    .faq-wrapper .question-answer-wr {
        width: 100%;
        margin: 0;
    }

    .faq-wrapper .question-answer-wr {
        margin-bottom: 30px;
    }

    .report-wrapper .sign .sign-top {
        min-height: 75px;
    }
}

@media (max-width: 991px) {
    .users-page.top-padding {
        padding-top: 30px;
    }

    .users-page .flex-md {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .users-page .flex-md .col-md-4 {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-bottom: 25px;
        width: 100%;
    }

    .users-page .flex-md .col-md-8 {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        width: 100%;
    }

    .bottom-title {
        font-size: 16px;
    }

    .complete-percentage-wr {
        width: auto;
    }

    .challenge-final-results-wrapper,
    .challenge-final-results-wrapper .col-flex {
        margin-top: 0;
    }

    .challenge-final-results-wrapper .col-md-11,
    .challenge-final-results-wrapper .col-flex > div {
        padding: 0 !important;
    }

    .challenge-final-results-wrapper img {
        max-width: 460px;
        margin: 0 auto 40px;
    }

    .challenge-final-results-wrapper .link-wrapper {
        text-align: center;
    }

    .challenge-final-results-wrapper .text {
        margin-top: 20px;
    }

    .search-results-page-wr .lessons-wrapper .lesson-video {
        width: 100%;
        max-width: 400px;
    }

    .search-results-page-wr .lessons-wrapper .lesson-desc {
        width: 100%;
    }

    .search-results-page-wr .lessons-wrapper .lesson-desc-text {
        max-height: none;
        margin: 20px 0;
    }

    .content-wr.user-profile-wr .menu {
        display: none;
    }

    .content-wr.user-profile-wr .content {
        padding-left: 20px;
        width: 100%;
        min-height: 540px;
    }

    .menu-open-link {
        display: flex;
    }

    .menu-open-link.opened span {
        transform: rotate(180deg);
    }

    .content-wr.user-profile-wr .menu {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 0;
        overflow: hidden;
        background-color: #F8F8F8;
        padding: 30px 0;
        z-index: 1;
    }

    .content-wr.user-profile-wr .menu.opened {
        box-shadow: rgb(0 0 0 / 25%) 12px 0px 12px 0px;
    }

    .content-wr.user-profile-wr .menu li {
        min-width: 230px;
    }

    .logo-upload-row-wr .col-lg-6 {
        width: 100% !important;
    }

    .roles-wr .col-md-6:last-child {
        margin-top: 30px;
    }
}

@media (max-width: 960px) {
    .super-quiz-page {
        padding: 30px 0;
        margin: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .top-padding {
        padding: 30px 0;
    }

    .profile, .users-register-form {
        margin-top: 30px;
    }

    .login-box {
        margin-top: 30px;
    }

    .questions-outer-wrapper {
        padding-top: 0;
        margin: 0 -20px;
    }

    .question-wr {
        margin: 0;
    }

    .question-inner-wr {
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .question-text {
        font-size: 16px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .question-answer-field label {
        padding-left: 20px;
        padding-right: 20px;
    }

    .question-answer-field > input[type="text"] {
        padding-left: 20px;
        padding-right: 20px;
    }

    .question-bts {
        padding-left: 20px;
        padding-right: 20px;
    }

    .questions-outer-wrapper .button-btns-wrapper {
        padding: 0 20px;
    }

    .statistic-bubbles-wr {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-bottom: -25px;
        margin-left: -10px;
        margin-right: -10px;
    }

    .statistic-bubbles-wr .statistic-bubble {
        width: calc(50% - 20px);
        margin: 0 10px 25px;
    }

    .statistic-bubble .val {
        font-size: 2em;
    }

    .hello-link-wrapper {
        margin: 30px 0;
    }

    .hello-link-wrapper .text-wrapper {
        width: 60%
    }

    .hello-link-wrapper .search-form-wrapper {
        width: 35%
    }

    .module-wr {
        width: calc(50% - 20px);
    }

    .module-image-wr .free-label {
        font-size: .9em;
    }

    .challenge-final-results-wrapper {
        padding: 20px 20px 0;
    }

    .container > h1 {
        margin-top: 30px;
    }

    .with-btns .btns-wr {
        text-align: right
    }

    .with-btns .btns-wr a {
        margin-bottom: 10px;
    }
}

@media (max-width: 800px) {
    header {
        height: 60px;
        padding: calc((60px - 40px) / 2) 0;
    }

    header .logo {
        margin: 0;
        width: 40px;
        height: 40px;
    }

    .close-menu {
        top: 18px;
    }

    .banner {
        padding: 10px 0;
    }

    .chart-wr {
        margin-top: 25px;
    }

    .two-columns-statistic {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        /*margin-top: 0;
        margin-bottom: -25px;*/

        margin: 0;
        width: 100%;
        overflow: hidden;
    }

    .column-stat {
        /*width: calc(100% - 50px);*/
        margin-bottom: 25px;

        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    .super-quiz-statistic {
        margin-bottom: 0;
    }

    .hello-link-wrapper .text-wrapper {
        font-size: 16px;
    }

    .hello-link-wrapper .search-form-wrapper {
    }

    .user-mark {
        top: 5px;
    }

    .report-header {
        flex-flow: column;
    }

    .report-header .text-wr {
        width: 100%;
        padding-left: 18px;
        padding-right: 18px;
    }

    .report-wrapper.report-view {
        margin: 0 -15px;
        max-width: calc(100% + 30px);
        width: calc(100% + 30px);
    }

    .report-wrapper .sign-wr {
        flex-wrap: wrap;
    }

    .report-wrapper .sign-wr .sign {
        width: calc(50% - 30px);
        margin-bottom: 25px;
    }

    .report-wrapper .sign .sign-top {
        min-height: 50px;
    }
}

@media (max-width: 768px) {
    .profile, .users-register-form {
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        padding: 0;
    }

    .module-image-wr .free-label {
        font-size: .7em;
    }

    .module-page-wr {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .module-page-wr .module-information {
        width: 100%;
        margin-bottom: 40px;
    }

    .module-information .module-wr {
        max-width: 560px;
        margin: 0 auto;
    }

    .module-page-wr .module-lessons {
        width: 100%;
    }

    .module-page-wr h2 {
        text-align: center;
    }

    .module-page-wr .module-wr .free-label {
        font-size: .9em;
    }

    .field-userform-rules_accept {
        margin-top: 20px;
    }

    #user-reports-table_wrapper .row:nth-child(2) .col-sm-12 {
        padding: 0;
        margin: 0 15px;
        overflow-x: auto;
    }

    #user-reports-table_wrapper .dataTables_scroll {
        width: 770px;
    }
}

@media (max-width: 740px) {
    .stat-tasks-wr .top {
        flex-wrap: wrap;
    }

    .stat-tasks-wr .top > div {
        width: 50%;
        padding: 0;
    }

    .stat-tasks-wr .top .date {
        text-align: left;
    }

    .stat-tasks-wr .top .date,
    .stat-tasks-wr .top .status {
        margin-top: 5px;
    }

    .report-content .content-wr pre.active,
    .report-content .content-wr > div.active {
        margin-bottom: 190px;
    }

    .report-content .content-wr > div.active, .report-content .content-wr h1.active, .report-content .content-wr h2.active, .report-content .content-wr h3.active, .report-content .content-wr h4.active, .report-content .content-wr h5.active, .report-content .content-wr h6.active, .report-content .content-wr p.active, .report-content .content-wr blockquote.active, .report-content .content-wr ol.active, .report-content .content-wr ul.active {
        padding-bottom: 190px;
    }

    .report-wrapper .comment-form {
        left: 5px;
        right: 5px;
        width: calc(100% - 10px);
        top: auto;
        bottom: 10px;
        height: 162px;
    }

    .report-wrapper .comment-form .comment-content textarea {
        min-height: 106px;
    }

    .report-wrapper .comment-form .line {
        display: none;
    }

    .report-content .content-wr pre.active .comment-form,
    .report-content .content-wr > div.active .comment-form {
        bottom: -175px;
    }

    .report-wrapper .comment-form .user-info {
        width: 100%;
    }

    .logo-upload-row-wr .logo-upload-wr {
        display: block;
    }

    .logo-upload-row-wr .logo-upload-wr .logo-upload-info {
        margin-top: 30px;
        width: 100%;
    }
}

@media (max-width: 660px) {
    .question-bts {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .question-bts:after {
        content: '';
        width: 100%;
        display: block;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    .question-bts .submit-btn {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin: 30px auto;
    }

    .question-wr .prev-btn,
    .question-wr .next-btn {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
        font-size: 16px;
        width: 40%;
    }

    .question-wr .next-btn {
        text-align: right;
    }

    .lesson-bookmark-rate-wrapper {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .lesson-bookmark-rate-wrapper .bookmark-wr {
        margin-bottom: 8px;
    }

    .lesson-bookmark-rate-wrapper .bookmark-wr,
    .lesson-bookmark-rate-wrapper .lesson-rate-wrapper {
        width: 100%;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .self-grades-tabs-navigation {
        flex-wrap: wrap;
        justify-content: center;
    }

    .self-grades-tabs-navigation li {
        margin-bottom: 15px;
    }

    .report-index .statistic-block {
        flex-wrap: wrap;
    }

    .report-index .statistic-elem {
        margin-bottom: 15px;
    }
}

@media (max-width: 600px) {
    .module-wr {
        width: calc(100% - 20px);
    }

    .module-image-wr .free-label {
        font-size: .9em;
    }

    h2 {
        font-size: 20px !important;
    }

    .hello-link-wrapper {
        display: block;
    }

    .hello-link-wrapper .text-wrapper {
        width: 100%
    }

    .hello-link-wrapper .search-form-wrapper {
        margin-top: 20px;
        width: 100%
    }

    footer .container {
        flex-wrap: wrap;
        flex-direction: column;
        align-items: center;
    }

    footer .container .right {
        order: 1;
        margin: 0;
    }

    footer .container .left {
        order: 2;
        margin: 15px 0 0;
    }

    footer li {
        margin: 0 7px;
    }

    h1 {
        font-size: 24px;
    }

    .upload-form-wr .elem-wr.fl {
        display: block;
    }

    .upload-form-wr .elem-wr.fl .elem-label,
    .upload-form-wr .elem-wr.fl .elem-field {
        width: 100%;
    }

    .user-files-wr .user-file-date-wr, .user-files-wr .user-file-date-wr {
        flex-direction: column;
    }

    .user-files-wr .user-file-date-wr > div,
    .user-files-wr .user-file-date-wr > div {
        width: 100%;
    }

    .user-files-wr .user-file-avatar {
        margin-top: 10px;
    }

    .back-btn {
        font-weight: 500;
        font-size: 18px;
    }

    .report-with-history-wr .report-view-wr {
        padding: 20px;
    }

    .report-with-history-wr .report-history-wr {
        position: static;
        width: 100%;
        box-shadow: none;
        margin-bottom: 30px;
    }

    .report-with-history-wr .slide-header {
        display: none !important;
    }

    .with-btns {
        display: block;
    }

    .with-btns.report-btns .btns-wr a {
        margin: 5px 0;
        width: 100%;
    }
}

@media (max-width: 550px) {
    .forgot-password-link {
        flex-flow: column;
    }

    .forgot-password-link a:first-child {
        margin-bottom: 15px;
    }

    .self-grades-subcategory [role="radiogroup"] {
        flex-flow: column;
        margin-top: 15px;
    }

    .self-grades-subcategory [role="radiogroup"] label {
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }

    .self-grades-subcategory [role="radiogroup"] label .iradio_square-blue {
        margin-left: 0;
        margin-right: 10px;
        margin-bottom: 0;
    }

    .left-form-wr .field-wr {
        flex-direction: column !important;
    }

    .left-form-wr .field {
        width: 100%;
    }

    .content-wr.user-profile-wr .content {
        padding-left: 30px;
    }

    .report-wrapper .text-wr p {
        margin-bottom: 5px;
    }

    .report-wrapper .text-wr p:not(:first-child) b {
        width: 100%;
    }

    .btns-block.text-right {
        display: flex;
        flex-flow: column;
    }

    .btns-block.text-right .btn {
        margin-bottom: 15px;
    }

    .btn-dark-blue, .btn-dark-blue:focus {
        font-size: 14px;
    }

    .login-box .register-link {
        flex-direction: column;
    }

    .login-box .register-link span {
        text-align: left;
        margin-top: 15px;
    }

    .roles-wr .permission-content {
        display: block;
    }

    .permissions-wr .permission-content .first-row,
    .permissions-wr .permission-content .form-row {
        width: 100%;
    }

    .custom-permissions-switch-wr {
        display: block;
    }

    .custom-permissions-switch-wr .control-label,
    .custom-permissions-switch-wr .form-control {
        width: 100%;
    }

    .stat-tasks-wr .top {
        display: block;
    }

    .stat-tasks-wr .top > div {
        width: 100%;
        padding: 0;
        margin-bottom: 5px !important;
    }

    .stat-tasks-wr .top .status {
        text-align: left;
    }
}

@media (max-width: 500px) {
    .statistic-bubbles-wr .statistic-bubble {
        width: calc(100% - 20px);
    }

    .chart-wr {
        padding-left: 0;
        padding-right: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .super-quiz-statistic,
    .stat-elem {
        padding-left: 0;
        padding-right: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .stat-tasks-wr,
    .chart-wr,
    .super-quiz-statistic,
    .stat-elem {
        background-color: unset;
    }

    .stat-tasks-wr {
        border-radius: 0;
        box-shadow: none;
        padding: 0;
    }

    .task-card-wr {
        margin-bottom: 20px !important;
        padding: 15px 20px !important;
    }

    .profile-wrapper .user-avatar-wr {
        flex-flow: column;
        align-items: center;
    }

    .profile-wrapper .avatar-text {
        order: 1;
        margin: 0 0 20px;
        padding: 0;
        text-align: center;
    }

    .profile-wrapper .avatar-wr {
        order: 2;
    }

    .report-wrapper .sign {
        font-size: 10px;
    }

    .report-wrapper .comment-form .comment-content textarea {
        font-size: 12px;
    }
}

@media (max-width: 460px) {
    .question-wr .prev-btn,
    .question-wr .next-btn {
        max-width: 120px;
    }

    .login-box {
        padding: 70px 30px;
    }

    .module-image-wr .free-label {
        font-size: .7em;
    }

    .module-image-wr .free-label {
        right: -36%;
    }

    .lesson-group .lesson-group-title {
        font-size: 14px;
    }

    .lesson-wr {
        font-size: 14px;
    }

    .lesson-group .lesson-group-title,
    .lesson-wr .lesson-title {
        margin-left: 10px;
    }

    .lesson-note {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .lesson-note-text-wr {
        width: 100%;
    }

    .lesson-note-delete {
        margin: 20px auto 30px;
    }

    .lesson-bookmark-rate-wrapper .lesson-rate-wrapper p {
        max-width: unset;
        margin-right: 7px;
    }

    .lesson-group {
        padding: 15px 55px 15px 15px;
    }

    .lesson-wr {
        padding: 14px 55px 14px 15px;
    }

    .lesson-wr .lesson-progress,
    .lesson-group-arrow {
        right: 15px;
    }

    .reward-link.reward-link-mini {
        right: 37px;
    }

    .module-information .bottom-info-wr {
        padding: 20px;
    }

    .module-information .module-description {
        padding: 0 20px 30px;
    }

    .bottom-info-wr {
        padding: 0 20px 25px;
    }

    .multi-wrapper .search-input {
        padding: 10px 10px
    }

    .multi-wrapper .non-selected-wrapper, .multi-wrapper .selected-wrapper {
        padding: 0;
    }

    .multi-wrapper .item {
        padding: 5px;
    }

    .module-page-wr .module-wr .free-label {
        font-size: .7em;
    }

    .self-grades-tabs-navigation {
        flex-flow: column;
        align-items: center;
    }

    .prof-grade-wr .elem-wr {
        flex-wrap: wrap;
    }

    .prof-grade-wr .elem-wr .form-group:first-child {
        width: 100%;
    }

    .prof-grade-wr .elem-wr .form-group:nth-child(2) {
        padding-left: 0;
        margin-bottom: 10px;
    }

}

@media (max-width: 440px) {
    .stat-tasks-wr .top .avatar-wr,
    .stat-tasks-wr .top .date,
    .stat-tasks-wr .status {
        width: 100%;
        margin-bottom: 10px;
    }

    .stat-tasks-wr .priority-wr {
        margin-bottom: 10px;
    }

    .report-submenu li {
        margin-left: 0;
    }

    .report-submenu li a {
        font-size: 16px;
    }

    .statistic-elem {
        width: 110px;
        min-height: 110px;
    }

    .statistic-elem .description {
        font-size: 12px;
    }

    .statistic-elem .value {
        font-size: 40px;
        line-height: 50px;
        margin-bottom: 10px;
    }
}

@media (max-width: 870px) {
    .navigation {
        display: none;
    }

    .container {
        width: 100%;
        padding: 0 15px;
    }

    .m-60 {
        margin: 30px 0;
    }

    header {
        display: block;
    }

    #user-reports-table_wrapper .row:last-child {
        margin-top: 5px;
    }
}

@media (max-width: 345px) {
    .user-mark {
        right: auto;
        left: 15px;
    }
}

@media (min-width: 768px) {
    .row.equal {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 30px;
    }
}

@media (max-width: 380px) {
    .report-wrapper .logo-wr {
        width: 100%;
    }
}

/* HEIGHT */

@media (max-height: 850px) {
    .navigation .logo,
    .navigation nav a {
        width: 40px;
        height: 40px;
    }
}

@media (max-height: 750px) {
    .navigation .logo,
    .navigation nav a {
        width: 35px;
        height: 35px;
    }
}