/*Банер*/
.wrapper_block_training {
    position: relative;
    background: url(/fileservice/file/download/a/514433/sc/44/h/51e88175cf403f159f807552a2ba2f00.png) 100% 50%, linear-gradient(91.45deg, #A1A39F 36.96%, rgba(161, 163, 159, 0) 54.04%);
    border-radius: 5px;
    min-height: 266px;
    margin-bottom: 60px;
}

.wrapper_training {
    position: absolute;
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid #FFFFFF;
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    border-radius: 10px;
    margin: 26px 511px 32px 37px;
    padding: 30px 54px;
    z-index: -1;
}

.wrapper_tittle_training {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 36px;
    line-height: 110%;
    color: #032107;
    margin: 0 0 15px 0;
}

.wrapper_text_training p {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 22px;
    line-height: 26px;
    color: #000000;
    margin: 0;
}

.wrapper_text_training p span {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 26px;
    color: #000000;
}

.wrapper_block_training:before {
    content: '';
    position: absolute;
    background: url(/fileservice/file/download/a/514433/sc/85/h/4773a02f23cb04278d29b067f2a31a7e.png) no-repeat;
    height: 99px;
    width: 108px;
    top: 0;
    left: 0;
    border-radius: 10px;
}

/*Как работать с платформой кнопка*/
.work_platform_btn {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.2)), to(rgba(255, 255, 255, 0))), #63A91F;
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%), #63A91F;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%), #63A91F;
    border-radius: 10px;
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    color: #FFFFFF;
    width: 100%;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    position: relative;
    border: none;
    text-align: left;
    min-height: 60px;
    padding-left: 15px;
    margin-bottom: 20px;
}

.work_platform_btn:before {
    content: '';
    position: absolute;
    background: url(/fileservice/file/download/a/514433/sc/291/h/be998c33b5dae904fa50c14dd7127b8d.svg) no-repeat;
    height: 16px;
    width: 21px;
    top: 50%;
    right: 15px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.work_platform_btn:hover {
    -webkit-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    transform: translateY(-4px);
}

/*Банер*/
.banner_wrapper {
    background: rgba(255, 255, 255, 0.35);
    border: 1px solid #D3D8DB;
    border-radius: 10px;
    margin-bottom: 15px;
}

.banner_img img {
    border-radius: 10px 10px 0px 0px;
    width: 100%;
}

.banner_text p {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    color: #141414;
    padding: 17px 15px 10px 15px;
}

.banner_btn {
    background: #63A91F;
    border: 1px solid #63A91F;
    border-radius: 5px;
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    letter-spacing: 0.05em;
    color: #FFFFFF;
    padding: 10px 40px;
    min-height: 40px;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    margin: 0 15px 15px 15px;
}

.banner_btn:hover {
    background: #fff;
    color: #63A91F;
}

/*Режим работы тех поддержки*/
.operating_mode {
    background: rgba(255, 255, 255, 0.35);
    border: 1px solid #D3D8DB;
    border-radius: 10px;
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.operating_mode_tittle1 {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    text-align: center;
    color: #000000;
    padding: 24px 20px 10px 20px;
    text-align: center;
    margin: 0;
}

.operating_mode_tittle2 {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    color: #1A512E;
    padding: 0px 20px 14px 20px;
}

.operating_mode_text1 p {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 120%;
    text-align: center;
    color: #000000;
    padding: 0 15px;
}

.operating_mode_text2 p {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 120%;
    text-align: center;
    color: #000000;
    padding: 0 15px;
}

.operating_mode_text1 p span {
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 120%;
    text-align: center;
    color: #000000;
}

.operating_mode_btn {
    background: #1A512E;
    border: 1px solid #1A512E;
    border-radius: 5px;
    min-height: 40px;
    margin: 0 40px 20px 40px;
    font-family: 'Gilroy', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    letter-spacing: 0.05em;
    color: #FFFFFF;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.operating_mode_btn:hover {
    background: #63A91F;
    border: 1px solid #63A91F;
    color: #fff;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;

}

/*Соц сети*/
.social_network {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.social_network .vk,
.social_network .inc,
.social_network .wa {
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.social_network .vk:hover {
    -webkit-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    transform: translateY(-4px);
}

.social_network .inc:hover {
    -webkit-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    transform: translateY(-4px);
}

.social_network .wa:hover {
    -webkit-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    transform: translateY(-4px);
}

/*Заголовок*/
.al_tr-header {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    text-transform: uppercase;
    color: #032107;
    margin-left: 20px;
    margin-bottom: 23px;
}

.al_tr-header {
    position: relative;
}

.al_tr-header:before {
    content: '';
    position: absolute;
    background: url(/fileservice/file/download/a/514433/sc/207/h/91d5453e8290cf0804ce7ff5f207eb7f.svg) no-repeat;
    width: 14px;
    height: 12px;
    top: 50%;
    left: -20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

/*Курсы al_tr-projects*/
.al_tr-projects .stream-title p,
.al_tr-health .stream-title p {
    display: none;
}

.al_tr-projects .stream-table,
.al_tr-health .stream-table {
    margin-left: 0px;
}

.al_tr-projects .stream-table tr,
.al_tr-health .stream-table tr {
    margin: 0 0 10px 0px;
    transition: .3s ease-in-out;
}

.al_tr-projects .stream-table tr:hover,
.al_tr-health .stream-table tr:hover {
    transform: translateY(-4px);
}

.al_tr-projects .stream-table tbody,
.al_tr-health .stream-table tbody {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

.al_tr-projects .stream-table tbody td,
.al_tr-health .stream-table tbody td {
    display: block;
    padding: 0;
    height: 270px;
}

.al_tr-projects .stream-table tbody td a,
.al_tr-health .stream-table tbody td a {
    height: 270px;
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 20px 64px 20px 20px;
    background: linear-gradient(295.06deg, #D3D8DB 0%, rgba(255, 255, 255, 0) 98.85%), linear-gradient(0deg, #EDEDED, #EDEDED), #D9D9D9;
    border-radius: 10px;
}

.al_tr-projects .stream-img,
.al_tr-health .stream-img {
    position: absolute;
    right: 0;
    bottom: 0;
}

.al_tr-projects img,
.al_tr-health img {
    border-radius: 0 0 10px 0;
}

.al_tr-projects .stream-title,
.al_tr-health .stream-title {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
    color: #000000;
    z-index: 999;
}

.al_tr-projects .stream-table tr a,
.al_tr-health .stream-table tr a {
    display: flex;
    flex-direction: column;
    height: 240px;
    justify-content: space-between;
}

.al_tr-projects .stream-table tr td div b,
.al_tr-health .stream-table tr td div b {
    margin-top: auto;
}

/* стилизуем количество уроков */
.al_tr-projects .stream-table tr td div b,
.al_tr-health .stream-table tr td div b {
    color: #032107;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    position: relative;
    margin-left: 30px;
    z-index: 999;
}

.al_tr-projects .stream-table tr td div b:before,
	.al_tr-health .stream-table tr td div b:before {
    content: '';
    position: absolute;
    background:url(/fileservice/file/download/a/514433/sc/160/h/6ff5e1151c8267f6bb21eb9569548ae4.svg);
    top:5px;
    left:-30px;
    width:15px;
    height:13px;
}
/*Доступные тренинг al_tr-intense*/
.al_tr-beauty .stream-table tbody,
.al_tr-astro .stream-table tbody,
.al_tr-intense .stream-table tbody {
    display: flex;
    flex-wrap: wrap;
}
.al_tr-beauty .stream-table tr,
.al_tr-astro .stream-table tr,
.al_tr-intense .stream-table tr {
    background: linear-gradient(0deg, #EDEDED, #EDEDED), #FFFFFF;
    border: 1px solid #D3D8DB;
    border-radius: 10px;
    display: block;
    margin: 0 10px 20px 0;
    padding: 0;

    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% - 0px);
    height: auto;
    transition: .3s ease-in-out;
}
.al_tr-beauty .stream-table tr:hover,
.al_tr-astro .stream-table tr:hover,
.al_tr-intense .stream-table tr:hover {
    transform: translateY(-4px);
}
.al_tr-beauty .stream-table tr td,
.al_tr-astro .stream-table tr td,
.al_tr-intense .stream-table tr td {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0;
    position: relative;
    transition: all 0.3s;
}
.al_tr-beauty .stream-table tr a,
.al_tr-astro .stream-table tr a,
.al_tr-intense .stream-table tr a {
    color: inherit;
    flex-basis: 100%;
    padding: 34px 160px 34px 20px;
}

/* меняем старый эффект наведения */
.al_tr-header .stream-table tr td:hover {
    background: linear-gradient(0deg, #EDEDED, #EDEDED), #FFFFFF !important;
}
.al_tr-beauty .stream-table tr td::before,
.al_tr-astro .stream-table tr td::before,
.al_tr-intense .stream-table tr td::before {
    content: '';
    display: block;
    width: 170px;
    height: 118px;
    position: absolute;
    bottom: 0;
    right: 0;
    left: auto;
    background: url(/fileservice/file/download/a/514433/sc/261/h/84c8e5e1170baafeb502501cc401fd1b.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    /* z-index: -1; */
}

/* стилизуем название модуля */
.al_tr-beauty .stream-table .stream-title,
.al_tr-astro .stream-table .stream-title,
.al_tr-intense .stream-table .stream-title {
    color: #000000;
    font-size: 24px;
    line-height: 1.1;
}

/* стилизуем количество уроков */
/* .al_tr-intense .stream-table tr td div b, */
.al_tr-beauty .stream-table tr td div b,
.al_tr-astro .stream-table tr td div b {
    color: #032107;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    position: relative;
    margin-left: 30px;
}
/* .al_tr-intense .stream-table tr td div b:before, */
.al_tr-beauty .stream-table tr td div b:before,
.al_tr-astro .stream-table tr td div b:before {
    content: '';
    position: absolute;
    background: url(/fileservice/file/download/a/514433/sc/160/h/6ff5e1151c8267f6bb21eb9569548ae4.svg);
    top: 5px;
    left: -30px;
    width: 15px;
    height: 13px;
}

/* стилизуем описание к модулю */
.al_tr-beauty .stream-table tr td div,
.al_tr-astro .stream-table tr td div,
.al_tr-intense .stream-table tr td div {
    margin-top: 6px;
    color: #032107;
}

/*Демоверсия al_tr-information*/
.al_tr-information tr {
    background: url(/fileservice/file/download/a/514433/sc/204/h/01c8bdbd509481b389a6ebf835f910f9.png) no-repeat center left !important;
}

.al_tr-information .stream-table tr a {
    display: block !important;
    padding: 20px 20px 5px 120px !important;
}

.al_tr-information .stream-table tr .stream-title {
    grid-area: title;
    align-items: flex-end;
    display: grid;
}

.al_tr-beauty .stream-title p,
.al_tr-astro .stream-title p,
.al_tr-intense .stream-title p,
.al_tr-information tr a p {
    display: block;
    margin-bottom: 40px;
    font-size: 16px;
    line-height: 120% !important;
    color: #032107;
}

.al_tr-information .stream-table tr a>div:last-child {
    grid-area: descr;
}

.al_tr-information tr a div {
    display: none;
}

.al_tr-information .stream-table tbody {
    display: flex;
    flex-wrap: wrap;
}

.al_tr-information .stream-table tr {
    background: #FFFFFF;
    border: 1px solid #D3D8DB;
    border-radius: 10px;
    display: block;
    margin: 0 10px 20px 0;
    padding: 0;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% - 0px);
    height: auto;
    transition: .3s ease-in-out;
}

.al_tr-information .stream-table tr:hover {
    transform: translateY(-4px);
}

.al_tr-information .stream-table tr td {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0;
    position: relative;
    transition: all 0.3s;
}

.al_tr-information .stream-table tr a {
    color: inherit;
    flex-basis: 100%;
    padding: 0;
}

/* меняем старый эффект наведения */

.al_tr-information .stream-table tr td:hover {
    background: transparent !important;
}

.al_tr-information .stream-table .stream-title {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 29px;
    color: #032107;
}

/* стилизуем описание к модулю */
.al_tr-information .stream-table tr a>div:last-child {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    line-height: 21px;
    color: #032107;
    opacity: 0.75;
    margin-top: 10px;
}

@media (max-width: 640px) {
    .al_tr-projects .stream-table tbody,
    .al_tr-health .stream-table tbody {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 15px;
    }
    .al_tr-beauty .stream-table tr a,
    .al_tr-astro .stream-table tr a,
    .al_tr-intense .stream-table tr a {
        color: inherit;
        flex-basis: 100%;
        padding: 34px 10px 100px 20px;
    }
}

@media (max-width: 1108px) {
    .wrapper_training {
        margin: 26px 80px 29px 37px;
    }
}

@media (max-width: 879px) {
    .wrapper_training {
        margin: 26px 80px 29px 37px;
    }
}

@media (max-width: 620px) {
    .wrapper_block_training {
        position: relative;
        background: url(/fileservice/file/download/a/514433/sc/96/h/c4e2c6b44844709b71c980bf03e606a4.png), -o-linear-gradient(90.75deg, #A1A39F 18.85%, rgba(161, 163, 159, 0) 99.32%) no-repeat;
        background: url(/fileservice/file/download/a/514433/sc/96/h/c4e2c6b44844709b71c980bf03e606a4.png), linear-gradient(359.25deg, #A1A39F 18.85%, rgba(161, 163, 159, 0) 99.32%) no-repeat;
        border-radius: 5px;
        min-height: 508px;
        margin-bottom: 50px;
    }

    .wrapper_training {
        margin: 26px 15px 225px 15px;
        padding: 30px 16px 30px 16px;
        z-index: -1;

    }

    .wrapper_tittle_training {
        font-size: 24px;
    }

    .al_tr-information .stream-table tr a>div:last-child {
        margin-top: 0px;
    }
}

/* Настройки макета */
:root {
    --main-font: 'Gilroy';
    /*Основной шрифт*/

    --li-bg-color: #ffffff;
    /*Фон уроков*/
    --li-bg-color-not-reached: #F7F7F7;
    /*Фон недоступного урока*/

    --li-border-color: #D3D8DB;
    /*Цвет границы уроков*/
    --li-border-color-hover: #63A91F;
    /*Цвет границы при наведении*/
    --li-border-color-answered: #1A512E;
    /*Цвет границы урока на проверке*/
    --li-border-color-accomplished: #63A91F;
    /*Цвет границы принятого урока*/
    --li-border-color-needaccomplish: #A91F1F;
    /*Цвет границы стоп-урока*/

    --li-status-text-color: #313131;
    /*Цвет текста статуса урока*/

    --li-status-bg-color-hasmission: #1A512E;
    /*Фон статуса урока с заданием*/
    --li-status-bg-color-answered: #1A512E;
    /*Фон статуса урока на проверке*/
    --li-status-bg-color-accomplished: #63A91F;
    /*Фон статуса принятого задания*/
    --li-status-bg-color-needaccomplish: #A91F1F;
    /*Фон статуса стоп-урока*/
    --li-status-bg-color-notreached: #D3D8DB;
    /*Фон статуса недоступного урока*/

    --li-title-color: #1A512E;
    /*Цвет заголовка урока*/
    --li-title-color-needaccomplish: #A91F1F;
    /*Цвет заголовка стоп-урока*/
    --li-title-color-notreached: #313131;
    /*Цвет заголовка недоступного урока*/

    --li-decription-color: #032107;
    /*Цвет текста описания урока*/
    --li-decription-color-notreached: #8A8A8A;
    /*Цвет текста описания недоступного урока*/

    --li-status-text-hasmission: 'Есть задание';
    /*Текст статуса урока с ДЗ*/
    --li-status-text-answered: 'Задание на проверке';
    /*Текст статуса урока с ДЗ на проверке*/
    --li-status-text-accomplished: 'Задание выполнено';
    /*Текст статуса урока с принятым ДЗ*/

    --li-status-img-hasmission: url(/fileservice/file/download/a/514433/sc/140/h/dcc41d778ef9346066dae4c2524d2011.png);
    /*Иконка урока с ДЗ*/
    --li-status-img-answered: url(/fileservice/file/download/a/514433/sc/161/h/77cf902554cbb96cb066d84a6f60b768.png);
    /*Иконка урока с ДЗ на проверке*/
    --li-status-img-accomplished: url(/fileservice/file/download/a/514433/sc/90/h/a2904d7473463b2e5f30fe1897ab1c02.png);
    /*Иконка урока с принятым ДЗ*/
    --li-status-img-needaccomplish: url(/fileservice/file/download/a/514433/sc/20/h/4fdbd1a653469b0538ef276791912875.png);
    /*Иконка стоп-урока*/
    --li-status-img-notreached: url(/fileservice/file/download/a/514433/sc/113/h/f01c19a983e480b125ee78d783d8e229.png);
    /*Иконка недоступного урока*/

    --li-title-size: 18px;
    /*Размер заголовка урока*/
    --li-description-size: 15px;
    /*Размер текста описания урока*/
    --li-status-text-size: 13px;
    /*Размер текста статуса урока*/
}

/* Список уроков */
.lesson-list {
    padding: 0 !important;

    background: transparent !important;
}

.lesson-list li {
    position: relative;
    margin: 0 0 20px 0 !important;

    background: var(--li-bg-color) !important;
    border-radius: 10px !important;
    border: 1px solid var(--li-border-color);

    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.lesson-list li.with-image {
    padding: 0;
}

.lesson-list li:hover {
    border-color: var(--li-border-color-hover);

    -webkit-transform: translatey(-5px);
    -ms-transform: translatey(-5px);
    transform: translatey(-5px);
}

.lesson-list li a {
    background: transparent !important;
}

.lesson-list li .hidden-xs {
    display: none;
}

.lesson-list li table,
.lesson-list li table tbody,
.lesson-list li table tbody tr {
    display: block;
    width: 100%;
}

.lesson-list li table tbody tr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
    gap: 10px;
    -ms-flex-line-pack: center;
    align-content: center;
}

.lesson-list li table tbody tr .item-image {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 180px;
    flex: 1 1 180px;
    max-width: 180px;
}

.lesson-list li table tbody tr .item-with-image {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%;
    height: inherit !important;
    min-height: 120px;
}

.lesson-list li table tbody tr .item-main-td:not(.item-with-image) {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
}

.lesson-list li .info {
    margin-left: 0 !important;
    padding-left: 30px !important;

    background: transparent !important;
    border: none !important;
}

.lesson-list li.with-image .info {
    padding-left: 0 !important;
}

.lesson-list li .info .vmiddle {
    position: relative;
    top: 50%;
    -webkit-transform: translatey(-50%);
    -ms-transform: translatey(-50%);
    transform: translatey(-50%);
}

.lesson-list li .info .vmiddle div:not([class]) {
    display: none;
}

.lesson-list li .info .title {
    display: block;
    width: 100% !important;
    font-weight: 500;
    font-family: var(--main-font);
    font-size: var(--li-title-size);
    color: var(--li-title-color);
}

.lesson-list li .info .description {
    padding-top: 15px;

    font-weight: 300;
    font-family: var(--main-font);
    font-size: var(--li-description-size);
    color: var(--li-decription-color) !important;
}

.lesson-list li::after {
    position: absolute;
    top: 0;
    right: 0;

    width: 35px;
    height: 35px;

    background: var(--li-status-bg-color-hasmission);
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 0 0 0 10px;

    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.lesson-list li .vmiddle::after {
    display: block;

    font-weight: 400;
    font-family: var(--main-font);
    font-size: var(--li-status-text-size);
    color: var(--li-status-text-color);

    opacity: 0.5;
}

/* Есть задание */
.lesson-list li.user-state-has_mission::after {
    content: "";
    background-image: var(--li-status-img-hasmission);
}

.lesson-list li.user-state-has_mission .vmiddle::after {
    content: var(--li-status-text-hasmission);
}

/* Урок на проверке */
.lesson-list li.user-state-answered {
    border-color: var(--li-border-color-answered);
}

.lesson-list li.user-state-answered::after {
    content: "";
    background-color: var(--li-status-bg-color-answered);
    background-image: var(--li-status-img-answered);
}

.lesson-list li.user-state-answered .vmiddle::after {
    content: var(--li-status-text-answered);
}

/* Урок выполнен */
.lesson-list li.user-state-accomplished {
    border-color: var(--li-border-color-accomplished);
}

.lesson-list li.user-state-accomplished::after {
    content: "";
    background-color: var(--li-status-bg-color-accomplished);
    background-image: var(--li-status-img-accomplished);
}

.lesson-list li.user-state-accomplished .vmiddle::after {
    content: var(--li-status-text-accomplished);
}

/* Стоп-урок */
.lesson-list li.user-state-need_accomplish {
    border-color: var(--li-border-color-needaccomplish);
}

.lesson-list li.user-state-need_accomplish::after {
    content: "";
    background-color: var(--li-status-bg-color-needaccomplish);
    background-image: var(--li-status-img-needaccomplish);
}

.lesson-list li.user-state-need_accomplish .vmiddle {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
}

.lesson-list li.user-state-need_accomplish .vmiddle .user-state-label {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;

    font-weight: 400;
    font-family: var(--main-font);
    font-size: var(--li-status-text-size);
    color: var(--li-status-bg-color-needaccomplish);
}

.lesson-list li.user-state-need_accomplish .vmiddle .user-state-label.lesson-date {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0;
    margin-bottom: 5px;
    width: 100%;

    color: var(--li-title-color-needaccomplish) !important;
}

.lesson-list li.user-state-need_accomplish .vmiddle .title {
    padding-top: 0;

    color: var(--li-title-color-needaccomplish);
}


/* Урок недоступен */
.lesson-list li.user-state-not_reached {
    background: var(--li-bg-color-not-reached) !important;
    border: 0;
}

.lesson-list li.user-state-not_reached:hover {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

.lesson-list li.user-state-not_reached::after {
    content: "";
    background-color: var(--li-status-bg-color-notreached);
    background-image: var(--li-status-img-notreached);
}

.lesson-list li.user-state-not_reached .info {
    background: 0;
    border-color: transparent !important;
}

.lesson-list li.user-state-not_reached .title {
    padding-top: 5px;
}

.lesson-list li.user-state-not_reached .vmiddle {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
}

.lesson-list li.user-state-not_reached .vmiddle .user-state-label {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;

    font-weight: 400;
    font-family: var(--main-font);
    font-size: var(--li-status-text-size);
    color: var(--li-status-text-color);

    opacity: 0.5;
}

.lesson-list li.user-state-not_reached .vmiddle .title {
    padding-top: 0;

    color: var(--li-title-color-notreached);

    opacity: 0.3;
}

.lesson-list li.user-state-not_reached .vmiddle .description {
    color: var(--li-decription-color-notreached);
}

.lesson-list li.user-state-not_reached.with-image .item-image {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

/* Разделитель */
.lesson-list li.divider {
    margin-top: 50px;
    padding: 0 20px;
    min-height: 40px;

    text-align: center;

    background: -webkit-gradient(linear, left top, left bottom, from(#032107), to(#235434)), #309977;
    background: -o-linear-gradient(top, #032107 0%, #235434 100%), #309977;
    background: linear-gradient(180deg, #032107 0%, #235434 100%), #309977;
    border-radius: 10px;
    border: 0;
}

.lesson-list li.divider .error-message-text {
    font-weight: bold;
    color: #fff;
}

@media (max-width:425px) {
    .lesson-list li:not(.with-image) .info {
        padding-left: 20px;
    }

    .lesson-list li .info .vmiddle {
        margin-left: 0 !important;
    }

    .lesson-list li .info .title {
        font-size: 20px;
    }
}

@media (max-width:375px) {
    .lesson-list li.user-state-need_accomplish .user-state-label.is-stop-lesson,
    .lesson-list li.user-state-not_reached .user-state-label.lesson-date,
    .lesson-list li.user-state-not_reached .user-state-label.lesson-date {
        left: 10px;
        font-size: 12px;
    }
}