/* Общие стили страниц */
@font-face {
    font-family: 'Open Sans';
    font-weight: 400;
    src:
            url('/style/font/OpenSans-Regular.eot?') format('eot'),
            url('/style/font/OpenSans-Regular.woff') format('woff'),
            url('/style/font/OpenSans-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 600;
    src:
            url('/style/font/OpenSans-SemiBold.eot?') format('eot'),
            url('/style/font/OpenSans-SemiBold.woff') format('woff'),
            url('/style/font/OpenSans-SemiBold.ttf') format('truetype');
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Open Sans';
    color: #000000;
    font-style: normal;
    line-height: normal;
}

a {
    text-decoration: none;
}

body {
    padding-top: 13px;
}

.container {
    width: 1160px;
    margin: 0 auto;
}

.content {
    min-height: calc(100vh - 122px);
}

.heading {
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 0.56px;
    position: relative;
    display: block;
}
/*
.heading::after {
    width: 67px;
    height: 3px;
    background: #2E50BE;
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
*/
.btn {
    outline: none;
    border: none;
    transition: all 0.5s;
    height: 42px;
    border-radius: 59px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
}

.btn:hover {
    cursor: pointer;
    transition: all 0.5s;
}

.btn-grey {
    background: #D9D9D9;
    color: #797979;
}

.btn-grey:hover {
    background: #A9A9AB;
    color: #000000;
}

.btn-blue {
    background: #2E4EBF;
    color: #ffffff;
}

.btn-blue:hover {
    background: #4069FF;
}

.btn-green {
    background: #CCF5DD;
    color: #000;
}

.btn-green:hover {
    background: #ACDABF;
}

.btn-red {
    background: #ff2414;
    color: #fff;
}

.btn-red:hover {
    background: rgba(255, 36, 20, 0.55);
}

/* Стили Header */

.header-inner {
    border-radius: 14px;
    background: #F5F5F5;
    padding: 19px 11px 19px 19px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header-logo {
    margin-right: 21px;
    position: relative;
    width: 115px;
    height: 35.161px;
}

.header-logo img {
    width: 100%;
    height: 100%;
    object-position: center;
    object-fit: contain;
}

.header-logo::after {
    position: absolute;
    background: #000000;
    width: 1px;
    height: 35px;
    right: -21px;
    content: '';
    top: 50%;
    transform: translateY(-50%);
}

.header-info {
    margin-left: 16px;
    margin-right: 65px;
}

.header-info-text {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.28px;
}

.header-info-text-sm {
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.24px;
    display: block;
}

.header-left,
.header-action,
.header-nav {
    display: flex;
    align-items: center;
}

.header-nav-link {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    margin-right: 22px;
    display: block;
    transition: 0.5s;
}

.header-nav-link:hover {
    color: #2E4EBF;
    transition: 0.5s;
}

.header-nav-link:last-of-type {
    margin-right: 0;
}

.header-action-link {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    position: relative;
    display: block;
    padding-left: 23px;
}

.header-action-link::before {
    position: absolute;
    content: '';
    left: 0;
    width: 18px;
    height: 18px;
    top: 50%;
    transform: translateY(-50%);
    background-repeat: no-repeat;
    background-position: center;
}

.header-action-link:first-of-type {
    margin-right: 21px;
}

.header-action-link.profile::before {
    background-image: url(../img/icons/user_icon.svg);
}

.header-action-link.exit::before {
    background-image: url(../img/icons/logout_icon.svg);
}

/* Стили Footer */

.footer-inner {
    border-top-right-radius: 14px;
    border-top-left-radius: 14px;
    background: #F5F5F5;
    padding: 5px 0 7px;
}

.footer-copyright-year,
.footer-copyright {
    color: #7E7E7E;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.28px;
}

.footer-copyright {
    display: block;
}

/* Главная страница */

.main {
    padding-top: 48px;
    padding-bottom: 30px;
}

.main-courses {
    margin-bottom: 31px;
}

.main-courses .heading {
    margin-bottom: 32px;
}

.courses {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: center;

}

.courses-item {
    width: 360px;
    margin-right: 40px;
    border-radius: 14px;
    background: #F5F5F5;
    padding: 23px 31px 32px;
    margin-bottom: 41px;
}

.courses-item-info {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.32px;
    color: rgba(0, 0, 0, 0.6);
    display: block;
    text-align: center;
    margin-bottom: 45px;
    height: 22.5px;
}

.courses-item-date {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.32px;
    color: rgba(0, 0, 0, 0.6);
    margin-left: 6px;
}

.courses-item-img {
    margin-bottom: 32px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    height: 90px;
}

.courses-item-img img {
    height: 100%;
}

.courses-item-name {
    text-align: center;
    font-size: 30px;
    font-weight: 600;
    letter-spacing: 0.6px;
    margin-bottom: 4px;
    display: block;
    height: 82px;
}

.courses-item-description {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.36px;
    display: block;
    margin-bottom: 42px;
    text-align: center;
    height: 45px;
}

.progress-bar {
    -webkit-appearance: none;
    width: 100%;
    border-radius: 5px;
    height: 10px;
    border-radius: 37px;
    background: #D9D9D9;
    accent-color: #D9D9D9;
    border: none;
    outline: none;
    margin-bottom: 12px;
}

.progress-bar::-webkit-progress-value {
    border-radius: 37px;
    background: #B8B8B8;
}

progress::-webkit-progress-bar {
    border-radius: 37px;
    background: #D9D9D9;
}

.progress-bar::-moz-progress-bar {
    border-radius: 37px;
    background: #B8B8B8;
}

.progress-bar-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.progress-bar-text {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    display: block;
    color: #D9D9D9;
}

.progress-bar-value {
    color: #2E4EBF;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.32px;
    display: block;
}

.courses-item-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.courses-item.in-progress {
    border: 2px solid #4069FF;
    background-color: transparent;
}


.courses-item.in-progress .progress-bar::-webkit-progress-value {
    background: #2E4EBF;
}

.courses-item.in-progress .progress-bar::-moz-progress-bar {
    background: #2E4EBF;
}

.courses-item.in-progress .progress-bar-value {
    color: #2E4EBF;
}

.courses-item.in-progress .progress-bar-text {
    color: #000000;
}

.courses-item.completed {
    background-color: transparent;
    border: 2px solid #CCF5DD;
}

.courses-item.completed .progress-bar-value {
    color: #D9D9D9;
}

.courses-item.completed .progress-bar::-webkit-progress-value,
.courses-item.completed .progress-bar::-moz-progress-bar {
    background: #CCF5DD;
}

.courses-item.completed .progress-bar-text {
    color: #000000;
}

.courses-item:nth-of-type(3n) {
    margin-right: 0;
}

.courses-item-progress {
    min-height: 46.3px;
    margin-bottom: 29px;
}

.materials .heading {
    margin-bottom: 50px;
}

.materials-item .courses-item-img {
    width: 115px;
    height: 115px;
    margin-bottom: -5px;
}

.materials-item .courses-item-img img {
    width: auto;
    height: auto;
}

.materials-item {
    border: 2px solid #CCF5DD;
    background-color: transparent;
}

.materials-items {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
}

.materials-item {
    margin-bottom: 41px;
}

/* Страница Содержание Курса */
.course-menu {
    margin-top: 11px;
}

.course-menu-search {
    border-radius: 10.737px;
    background: #F5F5F5;
    width: 860px;
    margin-right: 40px;
    padding: 11px 14px 11px 20px;
    display: flex;
    align-items: center;
}

.course-menu-inner {
    display: flex;
    align-items: stretch;
}

.course-menu-title {
    font-size: 16px;
    font-weight: 600;
    margin-right: 15px;
    display: block;
    letter-spacing: 0.32px;
}

.course-menu-progress .courses-item-progress {
    margin-bottom: 0;
}

.search-bar {
    width: 100%;
    display: flex;
    align-items: center;
}

.search-bar-input {
    border-radius: 10.737px;
    background: #FFF;
    border: none;
    outline: none;
    padding: 6px 16px;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.32px;
    width: 100%;
    margin-right: 18px;
}

.search-bar-input::placeholder {
    opacity: 0.3;
}

.search-bar-btn {
    width: 136px;
    height: 34px;
    border-radius: 10.7px;
    font-size: 12.271px;
    font-weight: 600;
    letter-spacing: 0.245px;
}

.course-menu-progress {
    width: 260px;
    border-radius: 10.737px;
    background: #F5F5F5;
    padding: 13px 15px 10px;
}

.course-menu-progress .progress-bar {
    height: 8px;
    margin-bottom: 8px;
}

.course-menu-progress .progress-bar-text {
    color: #000;
    font-size: 12.271px;
    font-weight: 600;
    letter-spacing: 0.245px;
}

.course-menu-progress .progress-bar-value {
    color: #2E4EBF;
    font-size: 12.271px;
    font-weight: 700;
    letter-spacing: 0.245px;
}

.course-menu-progress .progress-bar::-webkit-progress-value {
    background: #2E4EBF;
}

.course-menu-progress .progress-bar::-moz-progress-bar {
    background: #2E4EBF;
}

.heading-center::after {
    display: none;
}

.heading-center {
    text-align: center;
    color: #000;
    font-size: 35px;
    font-weight: 600;
    letter-spacing: 0.7px;
}

.course-content-info .heading-center {
    margin-bottom: 16px;
}

.subheading {
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.36px;
    display: block;
    margin-bottom: 70px;
}

.course-bonus {
    margin-bottom: 64px;
}

.course-bonus-inner {
    padding: 55px 60px 55px 22px;
    border-radius: 10px;
    border: 2px solid #CCF5DD;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.course-bonus-title {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.4px;
    display: block;
}

.course-bonus-description {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    opacity: 0.6;
    display: block;
}

.course-bonus-btn {
    width: 298px;
    color: #6D6D6D;
}

.course-bonus-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    top: 11px;
    left: 0;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

.course-bonus-lesson {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    opacity: 0.6;
    display: block;
}

.course-bonus-progress {
    border-radius: 28.378px;
    background: #CCF5DD;
    color: #6D6D6D;
    text-align: center;
    font-size: 12.271px;
    font-weight: 700;
    letter-spacing: 0.245px;
    display: flex;
    align-items: center;
    padding: 1px 6.5px;
    justify-content: center;
}

.topics-items {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
}

.topics-item {
    width: 360px;
    border-radius: 10px;
    border: 2px solid #4069FF;
    margin-right: 40px;
    height: 243px;
    padding: 10px 20px 15px;
}

.topics-item:nth-of-type(3n) {
    margin-right: 0;
}

.topics-item-title {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.4px;
    display: block;
    margin-bottom: 30px;
    min-height: 55px;
}

.topics-item-btn {
    width: 100%;
    margin-bottom: 15px;
}

.topics-item-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 27px;
}

.topics-item-topic {
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    opacity: 0.6;
    display: block;
}

.topics-item-progress {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 12.271px;
    font-weight: 700;
    letter-spacing: 0.245px;
    padding: 1px 6.5px;
    background: #2E4EBF;
    color: #ffffff;
    border-radius: 28.378px;
}

.topics-item.completed {
    border-color: #CCF5DD;
}

.topics-item.completed .topics-item-progress {
    background: #CCF5DD;
    color: #6D6D6D;
}

.topics-item-details {
    display: block;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    opacity: 0.6;
}

.topics-item {
    margin-bottom: 30px;
}

.topics-item.unavailable {
    background: #F5F5F5;
    border-color: #F5F5F5;
}

.topics-item.unavailable .topics-item-progress {
    color: #797979;
    background: #D9D9D9;
}

.topics-item.unavailable .topics-item-title {
    color: #797979;
}

.topics-section {
    padding-bottom: 70px;
}

.course-menu {
    margin-bottom: 45px;
}

.search-bar-input {
    width: 415px;
}

.course-menu-title {
    white-space: nowrap;
}

/* Страница Вступление и Бонусы */

.page {
    padding-top: 13px;
}

.page-inner {
    display: flex;
    align-items: flex-start;
}

.page-content {
    width: 100%;
}

.page-content a {
    font-weight: 600;
}

.sidebar {
    margin-left: 39px;
    width: 260px;
    min-width: 260px;
}

.breadcrumbs {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    margin-left: 17px;
}

.breadcrumbs-link {
    color: #A3A3A3;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    display: block;
    margin-right: 10px;
}

.breadcrumbs-link:last-of-type {
    margin-right: 0;
    color: #000;
    transition: all 0.5s;
}

.breadcrumbs-link:last-of-type:hover {
    color: #2E4EBF;
    transition: all 0.5s;
}

.breadcrumbs-link::after {
    content: '/';
    padding-left: 10px;
}

.breadcrumbs-link:last-of-type::after {
    display: none;
}

.sidebar-course {
    border-radius: 14px;
    background: #F5F5F5;
    padding: 20px 15px 12px;
    margin-bottom: 10px;
}

.sidebar-course-img {
    width: 33px;
    min-width: 33px;
    margin-right: 15px;
}

.sidebar-course-img img {
    width: 100%;
}

.sidebar-course-top {
    display: flex;
    align-items: flex-end;
    margin-bottom: 18px;
}

.sidebar-course-name {
    font-size: 29px;
    font-weight: 600;
    letter-spacing: 0.58px;
    display: block;
    margin-bottom: -4px;
}

.sidebar-course-description {
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.3px;
    display: block;
}

.sidebar-tables .sidebar-course-top {
    align-items: baseline;
}


.sidebar-tables .sidebar-course-description {
    position: absolute;
    left: 10px;
    bottom: 10px;

}

.sidebar-course .progress-bar {
    height: 8px;
    margin-bottom: 5px;
}

.sidebar-course .progress-bar-text {
    color:#000000;
}

.sidebar-course .progress-bar::-webkit-progress-value {
    background: #2E4EBF;
}

.sidebar-course .progress-bar::-moz-progress-bar {
    background: #2E4EBF;
}

.sidebar-course .courses-item-progress {
    margin-bottom: 0;
}
/* Временно отключено
.progress-bar-text {
    color: #000;
    font-size: 12.271px;
    font-weight: 600;
    letter-spacing: 0.245px;
}

.progress-bar-value {
    color: #2E4EBF;
    font-size: 12.271px;
    font-weight: 700;
    letter-spacing: 0.245px;
}

*/

.courses-item-progress {
    min-height: initial;
}

.courses-item-progress .progress-bar-value {
    color:#D9D9D9;
}

.course-menu-progress .progress-bar-value, .courses-item-progress .progress-bar-value{
    color: #2E4EBF;
}

.sidebar-search {
    border-radius: 10.737px;
    background: #F5F5F5;
    padding: 15px;
    margin-bottom: 20px;
}

.sidebar-search-text {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.28px;
    display: block;
    margin-bottom: 7px;
}

.sidebar-search-input {
    border-radius: 10.737px;
    background: #FFF;
    height: 34px;
    width: 100%;
    padding: 7.5px 5px;
    position: relative;
}

.sidebar-search-btn {
    position: absolute;
    background-image: url(../img/icons/search_icon.svg);
    width: 19px;
    height: 19px;
    background-color: transparent;
    z-index: 30;
}

.sidebar-search-input input {
    width: 100%;
    height: 100%;
    background: transparent;
    position: absolute;
    top: 0;
    left: 0;
    border: none;
    outline: none;
    padding-left: 30px;
    color: #000;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.26px;
}

.sidebar-search-input input::placeholder {
    opacity: 0.3;
}

.sidebar-schedule-item {
    padding: 10px 16px;
    border-radius: 10px;
    border: 2px solid;
    margin-bottom: 10px;
}

.sidebar-schedule-item:last-of-type {
    margin-bottom: 0;
}

.sidebar-schedule-title {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.36px;
}

.sidebar-schedule-top {
    display: flex;
    align-items: center;
}

.sidebar-schedule-icon {
    height: 16px;
    width: 16px;
    min-width: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-right: 10px;
}

.sidebar-schedule-item.done {
    border-color: #4DA967;
}

.sidebar-schedule-item.done .sidebar-schedule-title {
    color: #4DA967;
}

.sidebar-schedule-item.done .sidebar-schedule-icon {
    background-image: url(../img/icons/check_icon.svg);
}

.sidebar-schedule-top {
    position: relative;
}

.sidebar-schedule-top::after {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-image: url(../img/icons/chevron_green_icon.svg);
    height: 17px;
    width: 17px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto;
    content: '';
}

.sidebar-schedule-item.process .sidebar-schedule-top::after {
    background-image: url(../img/icons/chevrons_down_icon.svg);
}

.sidebar-schedule-lessons {
    list-style-type: none;
    padding-top: 12px;
}

.sidebar-schedule-lessons-item a {
    color: #000;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.28px;
    display: flex;
    align-items: flex-start;
    transition: all 0.5s;
}

.sidebar-schedule-lessons-item {
    margin-bottom: 15px;
}

.sidebar-schedule-lessons-item:last-of-type {
    margin-bottom: 0;
}

.sidebar-schedule-lessons-number {
    min-width: 16px;
    display: block;
    margin-right: 5px;
}

.sidebar-schedule-lessons-item a:hover {
    color: #4069FF;
    transition: all 0.5s;
}

.sidebar-schedule-item.process {
    border-color: #4069FF;
}

.sidebar-schedule-item.process .sidebar-schedule-icon {
    background-image: url(../img/icons/folder_icon.svg);
}

.sidebar-schedule-lessons {
    display: none;
}

.sidebar-schedule-item.open .sidebar-schedule-lessons {
    display: block;
}

.sidebar-schedule-item.open .sidebar-schedule-top::after {
    transform: rotate(-180deg) translateY(50%);
}

.sidebar-schedule-item.locked {
    border-color: #E3E3E3;
}

.sidebar-schedule-item.locked .sidebar-schedule-title {
    color: #E3E3E3;
}

.sidebar-schedule-item.locked .sidebar-schedule-icon {
    background-image: url(../img/icons/lock_icon.svg);
}

.sidebar-schedule-item.locked .sidebar-schedule-top::after {
    background-image: url(../img/icons/chevrons_down_grey_icon.svg);
}

.course-info {
    border-radius: 14px;
    background: #F5F5F5;
    padding: 22px 17px;
}

.page-inner .heading-center {
    margin-bottom: 40px;
}

.course-info-heading {
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
    display: block;
}

.course-info-subheading {
    color: #2B2B2B;
    font-size: 18px;
    font-weight: 600;
    line-height: 150%;
    display: block;
    margin-bottom: 10px;
}

.ordered-list {
    margin-left: 20px;
}

.unordered-list {
    list-style-type: disc;
    margin-left: 30px;
}

.unordered-list li::marker {
    font-size: 0.8em;
}

.ordered-list li {
    color: #2B2B2B;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.unordered-list li span {
    font-weight: 600;
}

.ordered-list li a {
    color: #2E4EBF;
    border-bottom: 1px solid;
}

.course-info {
    margin-bottom: 44px;
}

.course-info.no-bg {
    background: transparent;
    border-radius: 0;
}

.course-info-paragraph {
    color: #2B2B2B;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

.bonus-item {
    padding: 20px 15px;
    border-radius: 14px;
    background: #F5F5F5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.bonus-item-info {
    font-size: 16px;
    font-weight: 600;
    line-height: 150%;
    width: 577px;
}

.bonus-item-btn {
    width: 145px;
    height: 42px;
    border-radius: 59px;
    padding-left: 20px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    text-align: left;
    position: relative;
}

.bonus-item-btn::after {
    width: 18px;
    height: 18px;
    content: '';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.bonus-item.download .bonus-item-btn::after {
    background-image: url(../img/icons/download_icon.svg);
}

.bonus-item.open .bonus-item-btn::after {
    background-image: url(../img/icons/link_icon.svg);
}

.bonus-item.view .bonus-item-btn::after {
    background-image: url(../img/icons/view_icon.svg);
}

.bouns-items {
    margin-bottom: 74px;
}

.bonus-nav-link {
    border-radius: 10px;
    background: #2E4EBF;
    height: 49px;
    display: flex;
    align-items: center;
    margin-right: 20px;
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    position: relative;
}

.bonus-nav-link:last-of-type {
    margin-right: 0;
}

.bonus-nav {
    margin-bottom: 208px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bonus-nav-link.prev {
    padding-left: 45px;
    padding-right: 35px;
}

.bonus-nav-link.achieved {
    padding-left: 23px;
    padding-right: 49px;
}

.bonus-nav-link.next {
    padding-left: 24px;
    padding-right: 38px;
}

.bonus-nav-link::before {
    content: '';
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.bonus-nav-link.prev::before {
    background-image: url(../img/icons/prev_icon.svg);
    width: 6px;
    height: 12px;
    left: 24px;
}

.bonus-nav-link.achieved::before {
    background-image: url(../img/icons/award_icon.svg);
    width: 24px;
    height: 24px;
    right: 19px;
}

.bonus-nav-link.next::before {
    background-image: url(../img/icons/next_icon.svg);
    width: 6px;
    height: 12px;
    right: 21px;
    top: calc(50% + 2px);
}

.bonus-nav-link:hover {
    background: #4069FF;
    transition: all 0.5s;
}

.sidebar {
    margin-top: -72px;
}

.page-grammar .breadcrumbs {
    margin-bottom: 22px;
}

.grammar .heading {
    margin-bottom: 43px;
}

.topics-item-subheading {
    color: #000;
    text-align: center;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.26px;
    display: block;
    text-align: center;
}

.grammar-item .topics-item-title {
    min-height: initial;
    margin-bottom: 10px;
    font-size:19px;
}

.grammar-item.topics-item {
    height: 245px;
    padding: 27px 10px 17px;
    position: relative;
}

.grammar-item:nth-of-type(n) {
    margin-right: 40px;
}

.grammar-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: calc(25% - 30px);
    margin-right: 40px;
    margin-bottom: 40px;
}

.grammar-item:nth-of-type(4n) {
    margin-right: 0;
}

.grammar-item .btn-green {
    margin-bottom: 0;
    width: 215.222px;
    margin-left: auto;
    margin-right: auto;
}

a.btn {
    display: flex;
    align-items: center;
    justify-content: center;
}

a.btn:hover {
    transition: 0.5s;
    background: #4069FF;
}

.grammar-item-number {
    position: absolute;
    top: 9px;
    left: 11px;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
}

.grammar-item .topics-item-btn {
    height: 30.333px;
    font-size: 11.556px;
    letter-spacing: 0.231px;
}

.grammar-item.disabled {
    border-color: #D9D9D9;
}

.grammar-item.disabled .btn {
    background: #D9D9D9;
    color: #797979;
}

.grammar-item.disabled .grammar-item-number,
.grammar-item.disabled .topics-item-title,
.grammar-item.disabled .topics-item-subheading {
    color: #D9D9D9;
}

.grammar {
    margin-bottom: 134px;
}

.breadcrumbs-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.breadcrumbs-nav {
    display: flex;
    align-items: center;
}

.breadcrumbs-nav-link {
    border-radius: 5px;
    border: 1px solid #2E4EBF;
    color: #2E4EBF;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.32px;
    display: flex;
    align-items: center;
    margin-right: 10px;
    width: 100px;
    height: 31px;
    position: relative;
}

.breadcrumbs-nav-link::before {
    content: '';
    position: absolute;
    width: 5px;
    height: 10px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 50%;
    transform: translateY(-50%);
}

.breadcrumbs-nav-link.prev {
    padding-left: 30px;
}

.breadcrumbs-nav-link.next {
    padding-left: 15px;
}

.breadcrumbs-nav-link.prev::before {
    background-image: url(../img/icons/nav_prev.svg);
    left: 15px;
}

.breadcrumbs-nav-link.next::before {
    background-image: url(../img/icons/nav_next.svg);
    right: 10px;
}

.breadcrumbs-nav-link:last-of-type {
    margin-right: 0;
}

.breadcrumbs-wrap {
    padding-right: 280px;
}

.lesson-content-img {
    height: 568px;
    border-radius: 14px;
    background: #FBFBFB;
    margin-bottom: 77px;
}

.comment-heading {
    color: #000;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.5px;
    display: block;
    margin-bottom: 9px;
}

.comment-paragraph {
    color: #2B2B2B;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

.comment-description {
    margin-bottom: 40px;
}

.comment-dialogue {
    border-radius: 10.737px;
    background: #F5F5F5;
    padding: 16px 8px 22px 22px;
}

.ki_title_print {
    width: 100%;
    margin-bottom: 20px;
}

.ki_title_print td {
    padding: 3px 0px 6px 0px;
    border: 1px solid #000;
}
.block_ready a, .block_ready span {
    color: #40aa6c!important;
}
.block_enabled a, .block_enabled span {
    color: #003eff!important;
}
.lesson-content {
    margin-bottom: 74px;
    max-width: 860px;
}

.comment-message-top {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.comment-message-avatar {
    width: 27.246px;
    height: 27.246px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 13px;
}

.comment-message-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.comment-message-name {
    color: #000;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.28px;
    display: block;
}

.comment-message-content {
    padding: 6.524px 12.28px;
    width: 417px;
}

.comment-message-content p {
    color: #FFF;
    font-size: 16px;
    font-weight: 400;
    line-height: 158.5%;
}

.comment-message.question .comment-message-content {
    border-radius: 0px 15.962px 15.962px 15.96px;
    background: #0F82FF;
}

.comment-message.reply .comment-message-content {
    border-radius: 16px 0px 16px 16px;
    background: #2E4EBF;
}

.comment-message {
    display: flex;
    flex-direction: column;
    margin-right: 16px;
}

.comment-message.question {
    align-items: flex-start;
}

.comment-message.reply {
    align-items: flex-end;
}

.comment-messages {
    margin-bottom: 23px;
    max-height: 247px;
    overflow-y: scroll;
}

.comment-messages::-webkit-scrollbar {
    width: 5px;
    height: 100%;
    border-radius: 100px;
    background-color: #D9D9D9;
}

.comment-messages::-webkit-scrollbar-thumb {
    background: #2E4EBF;
    border-radius: 100px;
}

.comment-messages {
    scrollbar-color: #2E4EBF #D9D9D9 !important;
    scrollbar-width: thin !important;
}

.comment-input-wrap {
    border-radius: 59px;
    background: #FFF;
    display: flex;
    align-items: center;
    height: 42px;
    padding-left: 12px;
    padding-right: 12px;
    min-width: calc(100% - 195px);
    margin-right: 20px;
}

.comment-input::placeholder {
    color: rgba(0, 0, 0, 0.3);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.26px;
}

.comment-input {
    border: none;
    outline: none;
    width: 100%;
}

.comment-new {
    display: flex;
    align-items: center;
}

.btn-send {
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    width: 145px;
    height: 42px;
    padding-left: 17px;
    padding-right: 36px;
    position: relative;
}

.btn-send::after {
    position: absolute;
    background-image: url(../img/icons/send_icon.svg);
    width: 16px;
    height: 16px;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    content: '';
}

.breadcrumbs-wrap .breadcrumbs {
    margin-bottom: 0;
}

.breadcrumbs-wrap {
    margin-bottom: 40px;
}

.show-mob {
    display: none;
}

.lesson-content-img.selected {
    border-radius: 10px;
    border: 5px solid #0F82FF;
    background: #FFF;
    text-align: center;
    padding: 60px 15px 36px;
    height: auto;
    position: relative;
}

.lesson-content-img img {
    height: auto;
    width: 100%;
}

.btn-print {
    width: 117px;
    height: 31px;
    border-radius: 7px;
    background: #0F82FF;
    position: absolute;
    top: 14px;
    right: 14px;
    padding-left: 10px;
    color: #FFF;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%;
    text-align: left;
}

.btn-print::after {
    content: '';
    position: absolute;
    background-image: url(../img/icons/print_icon.svg);
    width: 14px;
    height: 14px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
}

.show-answer {
    padding: 6.5px 20px;
    border-radius: 7px;
    background: #0F82FF;
    color: #FFF;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%;
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 277.186px;
    height: 31px;
}

.breadcrumbs-nav-link.context {
    width: 140px;
    text-align: center;
    justify-content: center;
}

.grammar-tables .sidebar-schedule-item.process {
    border-color: #4DA967;
}

.grammar-tables .sidebar-schedule-item.process .sidebar-schedule-icon {
    background-image: url(../img/icons/folder_green_icon.svg);
}

.grammar-tables .sidebar-schedule-item.process .sidebar-schedule-top {
    padding-bottom: 18px;
    border-bottom: 1px solid #E4E4E4;
}

.grammar-tables .sidebar-schedule-item.process .sidebar-schedule-lessons-item {
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 0;
    border-bottom: 1px solid #E4E4E4;
}

.grammar-tables .sidebar-schedule-item.process .sidebar-schedule-lessons-item:last-of-type {
    margin-bottom: 13px;
}

.grammar-tables .sidebar-schedule-item.process .sidebar-schedule-lessons {
    padding-top: 0;
}

.sidebar-tables .sidebar-course-name {
    /*color: #2E4EBF;*/
    color: #000000;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.44px;
    display: block;
    margin-bottom: 3px;
}

.sidebar-tables {
    padding-left: 9px;
    padding-right: 9px;
    padding-top: 12px;
    display: flex;
    height: 82px;
    position: relative;
}

.sidebar-tables .sidebar-course-top {
    margin-bottom: 0;
}

.sidebar-tables .sidebar-course-img {
    width: 24px;
    margin-right: 7px;
}

.table-copybook {
    width: 100%;
}

.table-copybook img {
    height: auto;
    max-width: 100%;
    width:100%;
}

.btn-translate {
    width: auto;
    padding-left: 13px;
    padding-right: 36px;
}

.btn-translate::after {
    background-image: url(../img/icons/translate_icon.svg);
    width: 16.514px;
    height: 14.778px;
    content: '';
    position: absolute;
}

.instructions {
    border-radius: 10px;
    border: 5px solid #CCF6DE;
    padding: 33px 14px 15px;
    margin-bottom: 24px;
    position: relative;
}

.instructions-heading {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.4px;
    display: block;
}

.instructions-subheading {
    color: #2B2B2B;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    display: block;
    margin-bottom: 30px;
}

.hint-btn {
    position: absolute;
    width: 24px;
    height: 24px;
    background-image: url(../img/icons/hint_icon.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    right: 17px;
    top: 15px;
    cursor: pointer;
}

.instructions-items {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    margin-bottom: 16px;
}

.instructions-item {
    border-radius: 12px;
    background: #CCF6DE;
    width: 239.077px;
    padding: 11px 12px 25px;
    position: relative;
}

.instructions-item::after {
    position: absolute;
    right: -15px;
    transform: translate(100%, -50%);
    top: 50%;
    background-image: url(../img/icons/arrow-right.svg);
    width: 24.416px;
    height: 24px;
    content: '';
}

.instructions-item:last-of-type {
    margin-right: 0;
}

.instructions-item:last-of-type::after {
    display: none;
}

.instructions-item-text {
    color: #2B2B2B;
    text-align: center;
    font-size: 14px;
    line-height: 150%;
    display: block;
    margin-bottom: 18px;
}

.instructions-item-text b {
    font-weight: 600;
}

.instructions-progress {
    display: flex;
    align-items: center;
    justify-content: center;
}

.instructions-progress-item {
    width: 24.416px;
    height: 24px;
    background-image: url(../img/icons/circle_black_icon.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 11.19px;
    position: relative;
}
.instructions-progress-item:hover {
    background-image: url(../img/icons/check_circle_icon.svg);
    cursor:pointer;
}
.cb_now {
    background-image: url(../img/icons/check_circle_icon.svg);
    opacity: 0.5;
}

.instructions-progress-item:last-of-type {
    margin-right: 0;
}

.instructions-progress-item.done {
    background-image: url(../img/icons/check_circle_icon.svg);
}

/* Player */

.player {
    border-radius: 10.737px;
    background: #CCF6DE;
    padding: 28px 20px;
    margin-bottom: 8px;
    z-index: 99999;
}

.player-download-audio {
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%;
    display: block;
}

.btn-play {
    min-width: 29px;
    max-width: 29px;
    border: 2px solid #000;
    border-radius: 50%;
    min-height: 29px;
    max-height: 29px;
    position: relative;
    background-color: transparent;
    margin-right: 30px;
}

.btn-play::after {
    position: absolute;
    top: 50%;
    left: calc(50% + 1.5px);
    content: '';
    transform: translate(-50%, -50%);

    background-position: center;
    background-repeat: no-repeat;
    width: 17px;
    height: 17px;
}

.player-audio {
    width: 404px;
}

.player-wrap {
    display: flex;
    align-items: center;
}

.player-audio .ui-widget.ui-widget-content {
    height: 8px;
    background: #0F82FF;
    border: none;
}

.player-control .ui-widget.ui-widget-content {
    height: 5px;
}

.player-audio .ui-widget.ui-widget-content {
    border: none;
}

.player-audio .ui-widget-header {
    background: #fff;
}

.ui-corner-all {
    border-radius: 5px;
}

.player-audio .ui-state-default,
.player-audio .ui-widget-content .ui-state-default {
    background: #0F82FF;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: none;
    outline: none;
}
.player-left .ui-state-default {
    margin-top: 2px;
}

.player-audio {
    position: relative;
}

.player-audio-times {
    position: absolute;
    display: flex;
    align-content: center;
    justify-content: space-between;
    width: 100%;
    left: 0;
    margin-top: 7px;
    padding-top:10px;
}

.player-audio-time {
    color: #2B2B2B;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%;
    display: block;
}

.player-control .ui-widget.ui-widget-content {
    background: #fff;
}

.player-control .ui-state-default,
.player-control .ui-widget-content .ui-state-default {
    background: #000;
}

.player-control {
    position: relative;
}

.player-control-title {
    position: absolute;
    color: #2B2B2B;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%;
    display: block;
    width: 100%;
    left: 0;
    margin-top: 7px;
}

.player-audio.volume {
    width: 89px;
    min-width: 89px;
    margin-right: 33px;
}

.player-control.speed {
    width: 89px;
    min-width: 89px;
}

.player-control-wrap {
    display: flex;
    align-items: center;
}

.btn-volume {
    background-image: url(../img/icons/volume_icon.svg);
    width: 24px;
    height: 24px;
    margin-right: 12px;
    background-color: transparent;
    border-radius: 0;
}

.btn-speed {
    border-radius: 0;
    background-image: url(../img/icons/fast_forward_icon.svg);
    width: 24px;
    height: 24px;
    margin-right: 12px;
    background-color: transparent;
}

.player-audio-control {
    margin-right: 40px;
}

.player-controls-wrap {
    display: flex;
    align-items: center;
}

.player-left {
    display: flex;
    align-items: center;
}

.btn-hide {
    display: none;
}

.instructions-teacher {
    border-color: #fff3c7;
    padding-top: 58px;
}

.instructions-teacher .player {
    background: #fff3c7;
}

.instructions-teacher .instructions-heading {
    margin-bottom: 27px;
}

.instructions-teacher-img {
    width: 71px;
    height: 71px;
    border: 5px solid #fff3c7;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 0;
    overflow: hidden;
}

.instructions-teacher-img img {
    width: 100%;
    height: 100%;
    object-position: center;
    object-fit: cover;
}

.gov_table_bottom_title {
    border-color: #fff3c7!important;
}
.gov_table_bottom_title .button_red{
    background-color: #fff3c7!important;
    color: #000!important;
}
.gov_table_bottom_title .btn-rollup::after {
    background-image: url(../img/icons/up_black_icon.svg);
}

.btn-rollup {
    width: 117px;
    height: 31px;
    padding-left: 25px;
    text-align: left;
}

.btn-rollup::after {
    right: 19px;
    width: 7.083px;
    height: 8.5px;
    background-image: url(../img/icons/up_white_icon.svg);
}

.btn-rolldown:after {
    right: 19px;
    width: 7.083px;
    height: 8.5px;
    top: 12px;
    background-image: url(../img/icons/up_white_icon.svg);
    transform: rotate(180deg);
}

/* Моя страница */
.personal .heading {
    margin-bottom: 27px;
}

.personal .heading::after {
    display: none;
}

.personal-avatar {
    width: 258px;
    height: 325px;
    background: #EEEEEE;
    border-radius: 12px;
    position: relative;
    text-align: center;
    margin-right: 75px;
}

.personal-avatar img {
    max-width: 100%;
    max-height: 100%;
}

.btn-white {
    border-radius: 170px;
    background: rgba(255, 255, 255, 0.80);
    width: 231px;
    padding: 0 15px;
    color: #3C3D3E;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.15px;
}

.personal-avatar-btn {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 11px;
}

.personal-info-wrap {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.personal-info-label {
    color: #000;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.15px;
    opacity: 0.5;
    display: block;
    margin-bottom: 5px;
}

.personal-info {
    display: flex;
    align-items: stretch;
}

.personal-info-item {
    margin-bottom: 20px;
}

.personal-info-item:last-of-type {
    margin-bottom: 0;
}

.personal-info-items {
    margin-right: 36px;
}

.personal-info-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-left: auto;
}

.personal-info-btns {
    display: flex;
    flex-wrap: wrap;
}

.personal-info-btns .btn {
    padding: 10px 30px;
    border-radius: 59px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
}

.personal-info-btns .edit {
    background: #F5F5F5;
    color: #000;
    margin-right: 24px;
}

.personal-info-btns .save {
    background: #2E4EBF;
    color: #fff;
}

.personal-info-wrap {
    margin-bottom: 90px;
}

.heading-sm {
    display: block;
    margin-bottom: 44px;
    color: #000;
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 0.56px;
    position: relative;
}

.heading-sm::after {
    width: 67px;
    height: 3px;
    background: #2E50BE;
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.personal-topic {
    border-radius: 10.737px;
    background: #F5F5F5;
    padding: 14px 20px 20px;
    position: relative;
}

.personal-achievement-item,
.personal-topic {
    margin-right: 40px;
    width: calc(33.3% - 26.5px);
}

.personal-topic:last-of-type {
    margin-right: 0;
}

.personal-topic-week {
    top: 20px;
    right: 20px;
    color: #2B2B2B;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    position: absolute;
}

.personal-topic-name {
    display: block;
    color: #000;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.5px;
    max-width: 70%;
}

.personal-topic-content {
    display: block;
    color: #2B2B2B;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    margin-bottom: 17px;
}

.btn.personal-topic-btn {
    border-radius: 59px;
    background: #2E4EBF;
    height: 32px;
    text-align: left;
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.32px;
    padding: 0;
    padding-left: 18px;
    justify-content: flex-start;
    width: 215px;
    position: relative;
}

.btn.personal-topic-btn::after {
    background-image: url(../img/icons/log-in.svg);
    width: 18px;
    height: 18px;
    right: 10px;
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.personal-achievement-items,
.personal-topics {
    margin-bottom: 77px;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
}

.personal-achievement-item {
    min-width: 360px;
}

.personal-achievement-item.disabled .sidebar-course-name,
.personal-achievement-item.disabled .sidebar-course-description,
.personal-achievement-item.disabled .progress-bar-text,
.personal-achievement-item.disabled .progress-bar-value {
    opacity: 0.2;
}

.personal-achievement-item.disabled .progress-bar::-webkit-progress-value {
    background: #A4A4A4;
}

.personal-achievement-item.disabled .progress-bar::-moz-progress-bar {
    background: #A4A4A4;
}

/* Модальное окно – Словарь */
.modal {
    background: rgba(18, 29, 67, 0.6);
    position: fixed;
    height: 100vh;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 30;
    display: none;
}

.vocab-popup {
    border-radius: 23px;
    background: #FFF;
    width: 560px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 35;
    padding: 20px 73px 25px;
}

.red {
    color: #F00;
}

.btn-close {
    width: 24px;
    height: 24px;
    top: 15px;
    right: 15px;
    background-image: url(../img/icons/close_icon.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: transparent;
    position: absolute;
}

.vocub-heading {
    color: #000;
    text-align: center;
    font-size: 30px;
    font-weight: 600;
    letter-spacing: 0.6px;
    margin-bottom: 18px;
    display: block;
}

.vocub-subheading {
    display: block;
    color: #000;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.36px;
    margin-bottom: 40px;
}

.vocab-word {
    display: flex;
    align-items: center;
}

.vocab-word-input {
    margin-right: 14px;
    width: 255px;
    height: 42px;
    border-radius: 59px;
    background: #F5F5F5;
    position: relative;
    padding-right: 12px;
    padding-left: 22px;
}

.vocab-word-input input {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    outline: none;
    border: none;
    background-color: transparent;
    left: 0;
    padding-left: 22px;
    color: #A6ADB5;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.36px;
}

.btn-vocab-delete {
    width: 19px;
    height: 19px;
    position: absolute;
    background-image: url(../img/icons/trash_icon.svg);
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background-color: transparent;
}

.vocab-word .btn-translate {
    width: 145px;
    height: 42px;
    position: relative;
}

.vocab-word .btn-translate::after {
    right: 11px;
    width: 19px;
    height: 16.889px;
    background-repeat: no-repeat;
    background-position: center;
    top: 50%;
    transform: translateY(-50%);
}

.vocab-word {
    margin-bottom: 20px;
}

.vocab-info-text {
    color: #000;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.28px;
    margin-bottom: 13px;
    display: block;
}

.vocab-word-info {
    width: 100%;
    border-radius: 10px;
    background: #F5F5F5;
    padding: 6px 0 13px;
}

.vocab-word-ru.top {
    color: #000;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.36px;
    display: block;
}

.vocab-word-ru.bottom {
    display: block;
    color: #219A3C;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.36px;
    margin-bottom: 11px;
}

.vocab-word-he {
    width: 240px;
    height: 42px;
    border-radius: 59px;
    background: #FFF;
    padding: 6px 30px;
    color: #000;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.44px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}

.vocab-info {
    margin-bottom: 26px;
}

.vocab-details {
    display: flex;
    align-items: center;
}

.vocab-details-logo {
    margin-right: 13px;
    min-width: 70px;
    max-width: 70px;
}

.vocab-details-logo img {
    width: 100%;
}

.vocab-details-info {
    color: #2B2B2B;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    display: block;
    line-height: 125%;
}

.personal-info-right:last-of-type {
    margin-right: 0;
}

.personal-info-items.personal-info-right .personal-info-right-top {
    margin-bottom: 35px;
}

.personal-topic:last-of-type {
    margin-bottom: 0;
}

.personal-achievement-item:last-of-type {
    margin-bottom: 0;
}
/* модальное окно */
.lightbox {
    position: fixed;
    overflow: auto;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index:1000;
}

.lightbox_modal {
    text-align: center;
    white-space: nowrap;
}

.lightbox_modal::after {
    display: inline-block;
    vertical-align: middle;
    width: 0;
    height: 100%;
    content: '';
}

.lightbox .modal {
    display: inline-block;
    vertical-align: middle;
}

.lightbox .modal_container {
    margin: 50px;
    padding: 20px;
    white-space: normal;
    background-color: #fff;
    color: #000;
    text-align: right;
}

.lightbox .close {
    display: inline-block;
    position: absolute;
    width: 30px;
    height: 30px;
    margin-top: -33px;
    margin-left: 4px;
    background: url('/style/img/close.png');
    opacity: 0.9;
    cursor: pointer;
}

.lightbox .close:hover {
    opacity: 1;
}

.lightbox .block {
    text-align: left;
}
.file-upload {
    display: inline-block;
    position: relative; /* ���� ����������� ������ ����������������, ������ ������� �������� */
    overflow: hidden; /* ��� ��� ������� �� ������� - �������� */
    width: 120px; /* ������ ������ ������ ������ ����� */
    height: 35px; /* ������ ������ ������ ������ ����� */
    background: #6da047;
    border-radius: 3px;
    padding: 8px 4px;
    color: #fff;
    text-align: center;
}

.file-upload:hover {
    background: #7aad55;
}

.file-upload input[type="file"] {
    display: none; /* ����������� �������� ��������� Input File */
}

.file-upload label {
    /* ����������� label �� ��� ��������� ������� ����� .file-upload */
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.file-upload span {
    line-height: 36px; /* ������ ������������ ������������ ������, ������� ������� �� ������ */
}

.filename {
    background: #fff;
    border: 0;
    text-align: center;
    padding: 0;
    font-size: 12px;
}
.iris_form {
    text-align: left;
    font-size: 16px;
    margin-top: 0;
    vertical-align: top;
}

.iris_form .cb_dir {
    vertical-align: middle;
}

.iris_form #iris_comment {
    vertical-align: middle;
    padding-top: 10px;
}

.iris_form #delete_word {
    display: inline-block;
    position: absolute;
    width: 30px;
    height: 30px;
    margin-top: -2px;
    margin-left: -31px;
    background: url('/style/img/close.png');
    opacity: 0.9;
    cursor: pointer;
}

.iris_form #delete_word:hover {
    opacity: 1;
    cursor: pointer;
}

.iris_form #iris_comment div {
    font-weight: 100;
    max-width: 100%;
    padding: 5px 8px;
    background-color: #f2f2f2;
    display: inline-block;
    font-size: 12px;
    color: #555;
    vertical-align: middle;
}

.iris_form #iris_copyright {
    vertical-align: middle;
    padding-top: 10px;
}

.iris_form #iris_copyright img {
    width: 100px;
    margin-right: 5px;
    display: inline-block;
    vertical-align: middle;
}

.iris_form #iris_copyright div {
    max-width: 196px;
    display: inline-block;
    font-size: 12px;
    color: #555;
    vertical-align: middle;
}

.iris_form #perevod_but {
    padding: 5px 10px 5px 10px !important;
}

#iris_translation {
    font-size: 18px;
    max-width: 100%;
    border: 1px solid #ccc;
    margin-top: 5px;
    overflow-y: scroll;
}

.iris_form td {
    vertical-align: top;
}

#iris_translation #translation {
    color: #000;
}

#iris_translation .cycle1 {
    background-color: #ffffff;
    padding: 5px;
    max-width: 100%;
}

#iris_translation .cycle-1 {
    background-color: #f1f1f1;
    padding: 5px;
    max-width: 100%;
}

#iris_translation .splitter {
    border-top: 1px solid #ccc;
}

#iris_translation .rtl {
    direction: rtl;
    text-align: right;
}

#iris_translation .word {
    font-weight: 400;
    color: #000;
}

#iris_translation .wordaccent {
    color: #ff0000;
}

#iris_translation .translit {
    font-weight: 400;
    color: #009900;
}

#iris_translation .translitaccent {
    color: #ff0000;
}

#iris_translation .wordtype {
    color: #919191;
}
.yprajnenia {
    margin-left: auto;
}
#iris_translation .not_found {
    padding: 10px;
    background-color: #ff9ca0;
    text-align: center;
}
.tooltip-text {
    border: 5px solid #03A9F4;
    background-color: #fff;
    color: #000;
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    text-transform: none;
    padding: 20px 18px 18px 22px;
    border-radius: 10px;
    width: 256px;
    position: absolute;
    z-index: 999;
    transform: translateX(-50%);
    display: none;
    margin-top:50px;
}
.breadcrumbs-wrap .tooltip-text {
    margin-top:175px;
}
.unavailable .tooltip-text {
    margin-top:0px;
}
.tooltip-toggle:hover + .tooltip-text,
.tooltip-toggle:focus + .tooltip-text {
    display: block;
}
.tooltip-text:before {
    content: "";
    border: 15px solid transparent;
    border-bottom: 15px solid #03A9F4;
    position: absolute;
    left: 50%;
    margin-left: 50px;
    margin-top: -50px;
    width: 0;
}
.material_tema {
    padding: 10px 20px 12px 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 15px;
    color: #000;
    font-family: 'Open Sans';
    font-size: 20pt;
}

.min-content, .min-container {
    max-width:320px;
    margin: 0 auto;
}

.form_1 {
    text-align: center;
    display: inline-block;
    vertical-align: top;
    margin: 10px;
    font-family: 'Open Sans';
}

.form_1 .input1 {
    font-size: 16px;
    width: 100%;
    padding: .65em 10px;
}

.form_1 .button_green, .form_1 .button_red {
    font-size: 20px;
    width: 100%;
}

.form_1 .min-container {
    display: block;
    margin: 30px 10px;
}

.form_1 .podpis {
    position: absolute;
    margin-top: -24px;
    margin-left: 5px;
    font-size: 16px;
}

.form_1 #form_error {
    margin-top: 10px;
    font-size: 18px;
    background-color: #ffe4e4;
    line-height: 2;
    max-width: 292px;
}

.form_1 #form_msg {
    margin-top: 10px;
    font-size: 18px;
    background-color: #efffec;
    line-height: 2;
    max-width: 292px;
}

.link_d {
    display: inline-block;
    color:blue;
    border-bottom: 1px dotted blue;
    cursor: pointer;
}

.pay_table
{
    text-align: center;
    max-width:660px;
    margin:auto;
}

.pay_table .td_to_div
{
    vertical-align: top;
    display: table-cell;
    width:200px;
    padding: 10px;
    border: 1px solid #ccc;
}

.pay_table .flag {
    border: 1px solid #888;
    height: 145px;
    width: 145px;
    border-radius: 100px;
}

.pay_table .opis
{
    padding-top: 10px;
    padding-bottom: 10px;
    height: 90px;
    width: 200px;
}

.pay_table .button_green
{
    width: 200px;
}

.order_next_step
{
    font-size: 16pt;
    padding: 10px 0;
    max-width: 664px;
    display: inline-block;
}

.order_tov_card {
    padding:20px;
    margin: 10px 0;
    width: 330px;
    display: inline-block;
    background-color: #fff;
    border:3px double #ccc;
    border-radius: 10px;
}

.order_title
{
    font-size: 18pt;
    padding: 10px 0 30px 0;
    display: inline-block;
    font-family: 'Open Sans';
    font-weight: 500;
}

.order_already_payed
{
    background-color: #ddffe7;
    width:352px;
    font-size: 18pt;
    padding: 10px 0 10px 0;
    display: inline-block;
    font-family: 'Open Sans';
    font-weight: 500;
}

.order_already_payed_block
{
    width:352px;
    font-size: 12pt;
    padding: 10px 0 10px 0;
    display: inline-block;
    font-family: 'Open Sans';
}

.order_price {
    font-size: 30pt;
    font-family: 'Open Sans';
    font-weight: 500;
    margin-top: 20px;
    margin-bottom: 10px;
    max-width: 664px;
    display: inline-block;
}

.order_regular_price {
    font-size: 30pt;
    margin-right: 25px;
    display: inline-block;
    color: #555;
    font-family: 'Open Sans';
    font-weight: 300;
    margin-top: 20px;
    margin-bottom: 10px;
    text-decoration: line-through;
}

.order_vigoda {
    color: #8e2b3b;
}

.order_previous_data {
    background-color: #f2f2f2;
    text-align: left;
    padding: 10px;
    font-size: 12pt;
    display: inline-block;
    width: 334px;
}



.pay_form {
    display: inline-block;
    vertical-align: top;
    font-family: 'Open Sans';
}

.pay_form .input1 {
    font-size: 16px;
        width: 100%;
        padding: .65em 10px;
    background: #fafafa;
}

.pay_form .button_red, .pay_form .button_green {
    font-size: 20px;
    width: 348px;
}

.pay_form .container {
    display: block;
    margin: 30px 10px;
}

.pay_form .podpis {
    position: absolute;
    margin-top: -24px;
    font-size: 16px;
}

.pay_form #form_error {
    margin: 10px 7px 7px 7px;
    font-size: 16px;
    background-color: #ffe4e4;
    line-height: 2;
    max-width: 356px;
}

.pay_form #form_msg {
    margin-top: 10px;
    font-size: 16px;
    background-color: #efffec;
    line-height: 2;
    max-width: 356px;
}

.pay_form .pay_method_tr td {
    text-align: left;
    padding: 3px;
    border-bottom: 1px dotted #ccc;
    border-top: 1px dotted #ccc;
    cursor:pointer;
}
.test {
    display: none;
    max-width: 800px;
    opacity: 0;
}

.test .question_of_block {
    font-size: 13pt;
    text-align: center;
}

.test .questions {
    text-align: right;
    margin-top: 20px;
}

.test .questions .question_block {
    display: block;
    padding: 10px;
    border-bottom: 1px dashed #ccc;
    font-family: 'Open Sans';
}

.test .questions .question_block .question {
    text-align: right;
    direction: rtl;
    font-size: 15pt;
    margin-bottom: 10px;
    font-weight: 500;
    margin-right: 43px;
}

.test .questions .question_block .variant {
    text-align: right;
    direction: rtl;
    font-size: 15pt;
    vertical-align: middle;
    cursor: pointer;
    padding:1px 0px 2px 0px;
}
.gov_table_title {
    margin-bottom: 20px;

    width: 100%;
}
.audio_gov .player-audio.player-audio-control.audio_progres_in.ui-slider.ui-corner-all.ui-slider-horizontal.ui-widget.ui-widget-content {
    width: 340px;
}
.cb_nows {
    opacity: 0.5;
}
.test .questions .question_block .variant:hover {
    background-color: #cbf0ff;
}

.test .questions .question_block .variant .text {
    display: inline-block;
    vertical-align: middle;
}

#test_results {
    margin-top: 20px;
}

.test_results_table_name {
    padding:5px;
    border: 1px solid #ccc;
    text-align: left;
    max-width: 150px;
}

.test_results_table_td {
    padding: 5px 10px 5px 10px;
    border:1px solid #ccc;
}

.test_results_table_td .total {
    color:#aaa;
}
.checkbox {
    width: 20px;
    height: 20px;
    display: inline-block;
    cursor: pointer;
    border-radius: 20px;
    margin:0px 8px;
    vertical-align: middle;
}

.cb_now {
    background: url(/style/img/checkbox_radio.png) 0px 20px;
}

.cb_now:hover {
    box-shadow: #000 0 0 6px;
}

.cb_off {
    background: url(/style/img/checkbox_radio.png) 80px 50px;
}

.cb_on {
    background: url(/style/img/checkbox_radio.png) 160px 80px;
}

.gov_table_title .gt_img img {
    width: 150px;
}

#webinar .comment-message {
    display:initial;
}

#webinar .comment-message.question {
    align-items: revert;
}

#webinar .comment-message-top {
    display: revert;
    align-items: revert;
    margin-bottom: revert;
    min-width: 220px;
}

#webinar .comment-message-avatar {
    width: 27.246px;
    height: 27.246px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 13px;
    float: left;
}

#webinar .comment-message-name {
    color: #000;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.28px;
    display: block;
    float: left;
    margin-right: 8px;
    line-height: 150%;
}

#webinar .comment-message.question .comment-message-content {
    border-radius: revert;
    background: revert;
}

#webinar .comment-message-content {
    padding: revert;
    width: revert;
    display: inline;
}

#webinar .comment-message-content p {
    color: #000;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    padding-bottom: calc(15px - 0.80vw);
}