:root{

  /*Список уроков*/

  --negnost-color2: transparent; /*Цвет фона уроков*/
  --negnost-color12_1: #E7D0BFF7; /*Цвет правого размытого пятна уроков*/
  --negnost-color12_2: #E7D0BFF7; /*Цвет левого размытого пятна уроков*/
  --negnost-color7: #626261; /*Цвет названия уроков*/
  --negnost-color8: #626261; /*Цвет описания уроков*/
  --negnost-textr-color1:#626261; /*Цвет надписи о задании*/
  --negnost-background9: #fff; /*Цвет фона кнопки уроков*/
  --negnost-color9: #36302C; /*Цвет треугольника кнопки уроков*/

  /*Недоступные уроки*/
  --negnost-color17: #36302C; /*Цвет иконки кнопки у недоступного урока*/
  --negnost-background17:#ab9588;/*цвет фона кнопки у недоступных уроков*/
}
    
    
    
/****Список уроков****/

/*Делаем карточки*/
.lesson-list{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    background:none;
    margin-bottom: -10px!important;
}

.lesson-list.divider,
.lesson-list .gc-tags,
.lesson-list li .info, 
.lesson-list li tbody tr,
span.glyphicon.glyphicon-list-alt,
.lesson-list li .state-icon-block,
.stream-table tr a > div b{
    display:none;
}


.user-state-need_accomplish .user-state-bg,
.user-state-has_mission .user-state-bg,
.lesson-list .item-main-td{
    background:none;
}

.lesson-list table, .lesson-list tbody {
    display:block!important;

}


.lesson-list .info {
    background:none!important;
    border:none!important;

}

.lesson-list li  .info, .lesson-list li tbody tr {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-flow:column nowrap;
    flex-flow:column nowrap;
    margin-left:0!important;
    width:100%!important;
}


.lesson-list li {
    position: relative;
    background: var(--negnost-color2);
    min-height: 200px!important;
    height:auto;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(50% - 20px);
    flex: 0 0 calc(50% - 20px);
    margin: 10px;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    -webkit-box-shadow: var(--negnost-box-shadow);
    box-shadow: var(--negnost-box-shadow);
    border-radius: var(--negnost-border-radius);
    max-width: 400px;

}

.lesson-list li .item-a{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: var(--negnost-border-radius);
    z-index: 1; 
    overflow: hidden;
}



/*Размытые пятна*/
/*левое*/
.lesson-list li .item-a::after{
    content: "";
    background-color: var(--negnost-color12_2);
    position: absolute;
    top: 0px;
    left: -37px;
    width: 204px;
    height: 134px;
    border-radius: 50px;
    z-index: 0;
    -webkit-filter: blur(50px);
    filter: blur(50px);
    z-index:-1!important;
}

/*правое*/
.lesson-list li a::before{
    content: "";
    background-color: var(--negnost-color12_1);
    position: absolute;
    bottom: 0px;
    right: -37px;
    width: 204px;
    height: 134px;
    border-radius: 50px;
    z-index: 1;
    -webkit-filter: blur(50px);
    filter: blur(50px);
    z-index:-1!important;
}



.user-state-label.has-start-at.lesson-date {
    position: relative;
}

.lesson-list .user-state-label {
    font-size: 85% !important;
    padding: 0px 20px 5px;
    display: block !important;
    margin-top: 0px;
    color: var(--negnost-textr-color1)!important;
}


.lesson-list li .pull-right {
    margin-top:auto;
    padding-bottom:2px;
    z-index:1!important;
}

.lesson-list li .no-tags {
    padding-left:10px;
}


/*Убираем цветной фон у разных статусов уроков*/
.user-state-accomplished .user-state-bg,
.user-state-need_accomplish .user-state-bg,
.user-state-has_mission .user-state-bg,
.user-state-answered .user-state-bg,
.user-state-bg{
    background: transparent!important;
}

.user-state-label.user-state-label-ex {
    display:none!important;
}

.user-state-need_accomplish .user-state-label,
.user-state-label.user-state-label-ex.is-stop-lesson{
    font-size:0!important;
}

/*Название урока*/

.lesson-list li .title{
    margin-right: 0px;
    padding: 0px 20px 10px 20px;
    margin-bottom:0;
    line-height: normal;
    color: var(--negnost-color7)!important;
    font-family: var(--negnost-font-family);

}

/*Описание урока*/
.lesson-list .description {
    color: var(--negnost-color8);
    font-family:  var(--negnost-font-family);
    font-weight: 400!important;
    line-height: normal!important;
    padding: 0px 70px 0px 20px!important;
    width: 100%!important;
    margin-bottom:15px;
}


.lesson-list .item-main-td.item-with-image,
.lesson-list li .info .vmiddle{
    padding: 0px!important;
    padding-top: 0px !important;
}


.lesson-list li .info .vmiddle{
    padding-top: 30px !important;
}


/*Кнопка*/
.btn-view-lesson-open{
    background: var(--negnost-background9);
    color: var(--negnost-color9)!important;
    padding: 12px 16px 12px 18px;
    border-radius: 100px;
    margin-top: auto;
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 2;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.gc-main-content br{
    display: block!important;
}



/*Анимация*/

/*Кнопка*/
.lesson-list li:hover .btn-view-lesson-open .fa-play {
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-transform: rotate(365deg);
    -ms-transform: rotate(365deg);
    transform: rotate(365deg);
}


/*Уроки*/
.lesson-list li:hover {
    -webkit-transform:scale(1.05);
    -ms-transform:scale(1.05);
    transform:scale(1.05);
}

/*Недоступные уроки*/


/*Скрываем значек плей у недоступного урока*/
.lesson-list li.user-state-not_reached .btn-view-lesson-open .fa-play {
    display:none;
}

/*У недоступного урока фон кнопки*/
.lesson-list li.user-state-not_reached .btn-view-lesson-open{
    background: var(--negnost-background17)!important;
    color: var(--negnost-color17)!important;

}

/*У недоступного урока ставим значек закрытого замка*/
.lesson-list li.user-state-not_reached .btn-view-lesson-open:after {
    content:"\f023";
    font-family: "fontawesome";

}



.lesson-list li.user-state-not_reached .info {
    border-left: none !important;
}

/* НЕ увеличиваем при наведении курсора */

.lesson-list li.user-state-not_reached:hover{
    -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);

}




.lesson-list li.user-state-not_reached a{
    cursor: default;

}

.lesson-list li.user-state-not_reached {
    opacity: 1 !important;
    filter: grayscale(0.6);
}


.lesson-list li.first-unreached {
    margin-top: 10px;
}

/*Картинки в уроках */

.lesson_wrap_img .lesson-list td.item-image {
    display: block!important;
}


.lesson_wrap_img .lesson-list li .title,
.lesson_wrap_img .lesson-list .description{
    width:270px!important;
    padding-right:10px!important;
    position: relative!important;
    line-height: 1.1 !important;
}

.lesson_wrap_img .lesson-list td.item-image{
    background-size: contain!important;
    display: block;
    position: absolute;
    right: 10px;
    top:10px;
    max-width: 100px!important;
    width: 80px !important;
    height: 80px!important;
    border-radius:12px;
    z-index: 3;
}

.lesson_wrap_img .lesson-list__video-watched {
    color: #222!important;
}


.lesson-list .item-main-td {
   padding-top: none!important;

}


/* Скрываем ВСЕ системные лейблы «необходимo выполнить…», «недоступен» */

/* В браузере */
.lesson-list .user-state-label,
.lesson-list .user-state-label-ex{
    display:none !important;
}

/* В приложении Chatium  */
.chatium_body .lesson-list .user-state-label,
.chatium_body .lesson-list .user-state-label-ex{
    display:none !important;
}

/*Плашка стоп-урок*/

.lesson-list li.divider {
    height: auto;
    margin: 10px;
    padding: 20px;
    min-height: 100px !important;
    background-color: var(--negnost-background9);

}

.lesson-list li.divider .errorMessage{
    color: var(--negnost-color8);
    font-family: var(--negnost-font-family);
    font-weight: 400 !important;
}



/* Адаптируем под разные разрешения */
@media (max-width:1250px) {
    .lesson-list{
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; 
    }

}

@media (max-width: 767px) {
    .lesson-list li .vmiddle {
        margin-left: 0px!important;
    }

    .lesson_wrap_img  .lesson-list td.item-image,
    .lesson_wrap_img .lesson-list a img{
        width: 75px !important;
        height: 75px!important;

    }

}

@media(max-width:640px){
    .lesson-list li {
        margin: 10px auto;
        flex: 0 0 calc(100% - 20px);
    }
}

@media (min-width: 600px) {
    .lesson_wrap_img .lesson-list li {
        min-width: 350px;
    }
}


@media (max-width: 320px) {
    .lesson_wrap_img  .lesson-list td.item-image,
    .lesson_wrap_img .lesson-list a img{
        width: 50px !important;
        height: 50px!important;

    }

}