.lesson-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    gap: 10px;
    margin-bottom: 30px !important;
    padding: 0 !important;
    background: 0 !important;
}
.lesson-list li {
    position: relative;
    flex:  1 30%;
    max-width: calc(100% / 3 - 5px);
    margin: 0 !important;
    
    background: #f0f8ff  ;
    border: 3px solid rgba(20, 20, 20, 0.05);
    box-shadow: 3px 3px 6px rgba(0, 122, 163, 0.07);
    border-radius: 10px;
    
    transition: all .3s;
}

.lesson-list li:hover {
    transform: translatey(-5px);
    
    background: #cce3f5;
    border: 1px solid rgba(20, 20, 20, 0.05);
    box-shadow: 12px 24px 27px rgba(0, 0, 0, 0.09), 3px 6px 15px rgba(0, 0, 0, 0.1), 3px 3px 6px rgba(0, 122, 163, 0.07);
    
    cursor: pointer;
}

.lesson-list li.divider,
.lesson-list li .vmiddle div:first-child:not([class]) {
    display: none;
}

.lesson-list li::before {
    content: "";
    position: absolute;
    bottom: 45px;
    left: 50%;
    transform: translatex(-50%);
    width: calc(100% - 30px);
    height: 1px;
    
    border-bottom: 1px solid #eed491;
}

.lesson-list li:hover::before {
    display: none;
}

.lesson-list li a {
    position: relative;
    display: block;
    padding: 25px 15px 50px;
    
    height: 100%;
    background: 0 !important;
    border-radius: 0 !important;
}

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

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

.lesson-list li .info {
    margin-bottom: 10px;
}

.lesson-list li .user-state-label.has-start-at {
    margin-bottom: 10px;
    font-family: var(--main-font);
    font-weight: 400;
    font-size: 12px;
    line-height: 120%;
    color: #141414;
}

.lesson-list li:hover .user-state-label:not(.has-start-at) {
    color: #fff;
}

.lesson-list li div.user-state-label:not(.has-start-at) {
    display: none;
}
													
.lesson-list li div.user-state-label {
    bottom: 3px !important;
}

.lesson-list .item-main-td.item-with-image {
    height: inherit !important;
}

.lesson-list li table {
    min-width: inherit;
    width: 100%;
}

.lesson-list li .item-image {
    display: none;
}

.lesson-list .item-main-td {
    display: block;
    padding: 0 !important;
}

.lesson-list li .info .vmiddle {  
    padding-right: 0;
}

.lesson-list li .title {
    margin-bottom: 10px;
    font-family: var(--main-font);
    font-weight: 500 !important;
    font-size: 18px !important;
   /* color: #170F22;*/
      color:black;
}

.lesson-list li .description {
    font-family: var(--main-font);
    font-weight: 350;
    font-size: 13px;
    color: #141414;
}

.lesson-list li .info .vmiddle::before {
    position: absolute;
    bottom: 0px;
    right: 0;
    color: #000
}

.lesson-list li:hover a::after,
.lesson-list li:hover .description,
.lesson-list li:hover .info .vmiddle::before {
    color: black;
}
.lesson-list li:hover .title{
color:black;
}
.lesson-list li a::after {
    content: "Нет задания";
    position: absolute;
    bottom: 10px;
    left: 35px;
    
    font-size: 18px;
    color: #170F22;
    
    transition: all .2s;
}

.lesson-list li a::before {
    position: absolute;
    bottom: 11px;
    left: 15px;
    transition: all .3s;
}

.lesson-list li.user-state-reached a::after {
    left: 15px;
}

.lesson-list li.user-state-has_mission a::after {
    content: "Есть задание";
}

.lesson-list li.user-state-has_mission a::before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/75858/sc/206/h/7ee26d163976ec56e1716e315d5fccf1.svg);
    color:black;
}

.lesson-list li.user-state-has_mission:hover a::before {
  color:black;
}

.lesson-list li.user-state-answered a::after {
    content: "На проверкe";
  color:#2159E8;
}

.lesson-list li.user-state-answered a::before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/511999/sc/300/h/cb71c1e6d5d7ac48889ed87b35b62be0.png);
    color:#2159E8;
}

.lesson-list li.user-state-answered:hover a::before {
    filter: invert(100%) sepia(0%) saturate(7486%) hue-rotate(183deg) brightness(100%) contrast(104%);
}

.lesson-list li.user-state-accomplished a::after {
    content: "Выполнено";
  color: #f2bf2c;
}

.lesson-list li.user-state-accomplished a::before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/511999/sc/376/h/60112dafa853cd21d68d6d6edcafe17b.png);
    
  
}

.lesson-list li.user-state-accomplished:hover a::before {
    filter: invert(100%) sepia(0%) saturate(7486%) hue-rotate(183deg) brightness(100%) contrast(104%);
}

.lesson-list li.user-state-need_accomplish {
    border-color: #F70F1A;
}

.lesson-list li.user-state-need_accomplish::before {
    border-bottom-color: #501A9B40;
}

.lesson-list li.user-state-need_accomplish a::after {
    content: "Важный";
    color: #F70F1A;
}

.lesson-list li.user-state-need_accomplish:hover a::after {
    color:black;
}

.lesson-list li.user-state-need_accomplish a::before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/511999/sc/14/h/38bd743c459525498b6176b44a69ab42.png);
    color: #F70F1A;
};
}

.lesson-list li.user-state-need_accomplish:hover a::before {
    filter: invert(100%) sepia(0%) saturate(7486%) hue-rotate(183deg) brightness(100%) contrast(104%);
}

.lesson-list li:not(.user-state-not_reached) .user-state-label {
    display: none;
}

.lesson-list li.user-state-not_reached {
    background: #EEEEEE;
    border: 1px solid rgba(20, 20, 20, 0.05);
}

.lesson-list li.user-state-not_reached::before {
    border-bottom-color: rgba(109, 109, 109, 0.4);
}

.lesson-list li.user-state-not_reached:hover::before {
    display: block;
}

.lesson-list li.user-state-not_reached .title,
.lesson-list li.user-state-not_reached .description,
.lesson-list li.user-state-not_reached a::after,
.lesson-list li.user-state-not_reached .info .vmiddle::before {
    color: rgba(23,15,34,.50);
}
.lesson-list li.user-state-not_reached:hover {
    transform: translatey(0px);
    background: #EEEEEE !important;
    box-shadow: 3px 3px 6px rgba(0, 122, 163, 0.07);
}

.lesson-list li.user-state-not_reached a::after {
    display: none;
}

.xdget-lessonList:not(.editable) .lesson-list li.user-state-not_reached .user-state-label {
    position: absolute;
    bottom: 12px;
    left: 40px;
    
    font-size: 18px;
    font-weight: 400;
}

.lesson-list li.user-state-not_reached a::before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/75858/sc/326/h/c5f08c2dafbe4294336f960b1baba4c5.svg);
}


/* Шапка */
.lesson-header-block.row-section {
    background: #ebcd82 !important;
    border: 0 !important;
    box-shadow: 0px 4px 30px rgba(201, 204, 255, 0.3);
    border-radius: 20px;
}

.lesson-header-block h2.lesson-title-value {
    margin: 0 auto;
    padding-bottom: 10px;
    width: 90%;
    
    font-weight: 500;
    font-size: 30px;
    line-height: 120%;
    text-align: center;
    color: black;
}

.lesson-header-block .lesson-description-value {
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    color: black !important;
}

.lesson-description-value,
.lesson-navigation {
    color: black !important;
}

.lesson-header-block .lesson-navigation {
    margin-top: 20px;
    padding-bottom: 30px !important;
}

.lesson-header-block .lesson-navigation td:nth-child(1) {
    padding-left: 0 !important;
}

.lesson-header-block .lesson-navigation td:nth-child(3) {
    padding-right: 0 !important;
}

.lesson-header-block .lesson-navigation a {
    margin-bottom: 10px;
    padding: 6px 15px 8px 30px;
    
    font-weight: 700;
    font-size: 14px;
    color: #000000; 
    
    background: #ffffff;
    border-radius: 0 20px 20px 0;
    transition: all .3s;
}

.lesson-header-block .lesson-navigation td:nth-child(3) a {
    padding: 6px 30px 8px 15px;
    border-radius: 20px 0 0 20px;
}

.lesson-header-block .lesson-navigation td:nth-child(1) .hidden-xs,
.lesson-header-block .lesson-navigation td:nth-child(3) .hidden-xs {
    display: none !important;
}

.lesson-header-block .lesson-navigation a:hover {
    color: #000000;
    background: #e3eefb;
    text-decoration: none;
}

.lesson-header-block .lesson-navigation td:nth-child(2) {
    display: flex;
    justify-content: center !important;
    flex-wrap: wrap;
    gap: 20px;
    
    margin: 0 auto;
    width: 100%;
}

.lesson-header-block .lesson-navigation td:nth-child(2) span,
.lesson-header-block .lesson-navigation td:nth-child(2) div {
    position: relative;
    font-weight: 400;
    font-size: 14px !important;
    color: #fff;
}

.lesson-header-block .lesson-navigation td:nth-child(2) span::before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/637822/sc/199/h/d620f4717d53583ff304a655cff93cac.png);
    position: relative;
    top: 5px;
    margin-right: 10px;
    filter: brightness(0) invert(94%) sepia(23%) saturate(5265%) hue-rotate(179deg) brightness(108%) contrast(97%);
}

.lesson-header-block .lesson-navigation td:nth-child(2) div div::before {
    content: url(https://fs.getcourse.ru/fileservice/file/download/a/637822/sc/346/h/90d5ca1f2c75cf2856e14f3ccd8e66fb.png);
    position: relative;
    top: 5px;
    margin-right: 10px;
    filter:brightness(0) invert(94%) sepia(23%) saturate(5265%) hue-rotate(179deg) brightness(108%) contrast(97%);
}

/* Блок ДЗ */
.lt-lesson-mission-block {
     margin-top: 10px;
    
   /* border-top: 2px solid #f0f0f0;*/
   /*box-shadow: 2px 1px 3px rgb(192 191 191);*/
}

.lt-lesson-mission-block .container,
.lt-lesson-comment-block .container {
    padding:0 !important;
}

.lt-lesson-mission-block h3 {
    position: relative;
    width: 100%;
    padding: 30px 0 20px 20px;
    font-weight: 700;
    font-size: 32px;
    color: #000;
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
    /*background: #fafafa;*/
    text-transform: uppercase;
}

.lt-lesson-mission-block h3::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 20px;
    width: 150px;
    height: 7px;
    border-radius: 15px;
    background: #eed491;
  

}

.lesson-mission-text {
    padding: 25px !important;
    background: #fafafa;
    border: 0;
  
}

.lt-lesson-mission-block .lesson-mission-wrapper {
    margin-top:-1px;
    border: 0;
}
.answer-form {
    padding: 20px;
    background: #fafafa;
  border-radius: 20px;
    border: 2px solid   #eed491;
;
   box-shadow: 1px 1px 3px rgb(192 191 191);
      margin-top: 20px !important;
}
.answer-form-inner{
  font-weight: 400;
    font-size: 14px;
}
.user-profile-image {
    border-radius: 100px;
    border:3px solid   #eed491;
;
}
.lt-lesson-mission-block .uploadifive-button { 
    margin-top: 10px;
    padding: 10px;
    height: 40px !important;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 140% !important;
    color: #000;
    text-transform: capitalize;
    border-radius: 10px !important;
    background: rgba(217,211,217,.5);
}
.lt-lesson-mission-block .btn-send-answer,
#showMoreAnswers,
.lt-lesson-comment-block .simple-answer .btn-send {
    padding: 10px 30px;
    margin-top: 20px;
    font-style: normal;
    font-weight: 700;
    font-size: 15px;
    color: #fff;
    background:   #eed491;
;
    border-radius: 5px;
    border: 1px solid #fff;
    transition: all .3s;
}
.lt-lesson-mission-block .btn-save-draft {
    margin-top: 20px;
    padding: 10px 30px;
    font-weight: 700;
    font-size: 15px;
    color: #000 !important;
    border-radius: 5px;
    border: 1px solid #000;
    
    transition: all .3s;
}
.lt-lesson-mission-block .btn-send-answer:hover,
.lt-lesson-mission-block .btn-save-draft:hover,
.lt-lesson-comment-block .simple-answer .btn-send:hover {
    transform: translatey(-5px);
}

@media (max-width:425px) {
    .btn-save-draft {
        margin-top: 10px !important;
        margin-left:0 !important;
    }
    
    .lesson-answers-title .pull-right {
        width: 100%;
        display: block;
    }
    
    .flex-container.wrap-col {
		flex-flow: row wrap !important;
	}
    
    .lesson-mission-text {
        margin: 0;
    }
}

@media (max-width:375px) {
    .btn-save-draft {
        margin-top:10px;
    }
}
@media (max-width:768px) {
    .lesson-header-block .lesson-navigation a {
        font-size: 12px;
    }
    .lesson-header-block h2.lesson-title-value {
    font-size: 20px;
    font-weight: 300;
    color: black;
}
    }
.lesson-header-block .lesson-description-value {
       font-size: 14px;
   }
}

@media (max-width:320px) {
    .lesson-header-block .lesson-navigation a {
       font-size: 10px;
    }
    .lesson-header-block h2.lesson-title-value {
    font-size: 20px;
    }

.lesson-header-block .lesson-description-value {
   font-size: 14px;
   }
}


@media (max-width: 760px) {
    .lesson-list li {
        flex: 1 1 45%;
        max-width: calc(100% / 2 - 5px);
    }
    
    .lesson-list li .vmiddle {
        margin-left: 0px;
    }
}


@media (max-width: 520px) {
    .lesson-list li {
        flex: 1 1 100%;
        max-width: 100%;
    }
}