/* ------------- 
content start - lessonNavs
------------- */

.dropdown-el  span {
  font-family: var(--main-font);
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: var(--black-color);

}

.dropdown-el-wrapper {
    min-height: 36px;
  max-height: 36px;
  overflow: visible;
  position:relative;
    z-index:10;
  cursor: pointer;
  text-align: left;
  white-space: nowrap;
  outline: none;
  
  border-radius: 9px;
  background-color: transparent;
   padding-right:0px;
  margin:.8em auto .8em 0;
  max-width:500px;
}

.dropdown-el {
  border:1px solid var(--closed-gray);
  overflow: hidden;
  max-height: 36px;
 position:absolute;
  width: 100%;
  display: block;
  right: 0;
  left: 0;
 z-index:11;
   border-radius: 6px;
  transition: 0.3s all ease-in-out;
}
.expanded .dropdown-el {

  background: white;
  border-radius: 6px;
  padding: 0;
  max-height: 10em;
  overflow-y: auto;
  padding-right:0px;
}

.dropdown-el a,.dropdown-el div {
  padding: 8px 0!important;
  padding-left:18px!important;
  border:none!important;
  border-radius:0!important;
  display: block!important;
  max-width: 100%!important;
  margin:0!important;
}
.dropdown-el a span {
  max-width: calc(100% - 50px)!important;
  white-space: nowrap;
  overflow: hidden;
  margin-right: auto;
  text-overflow: ellipsis;
  display: block;

}
.current-lesson span {
opacity:.7;
}

.dropdown-el::after {
  content: "";
  background: url("data:image/svg+xml,%3Csvg width='24' height='14' viewBox='0 0 24 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.9393 13.0607C11.5251 13.6464 12.4749 13.6464 13.0607 13.0607L22.6066 3.51472C23.1924 2.92893 23.1924 1.97918 22.6066 1.3934C22.0208 0.807612 21.0711 0.807612 20.4853 1.3934L12 9.87868L3.51472 1.3934C2.92893 0.807612 1.97918 0.807612 1.3934 1.3934C0.807612 1.97918 0.807612 2.92893 1.3934 3.51472L10.9393 13.0607ZM10.5 11V12H13.5V11H10.5Z' fill='black'/%3E%3C/svg%3E%0A");
  background-size: 100% 100%;
  width: 11px;
  height: 6px;
  position: absolute;
  right: 0.8em;
  top: 15px;
  transition: 0.4s all ease-in-out;

}


.dropdown-el::-webkit-scrollbar { width: 4px; border-radius: 16px;}
.dropdown-el::-webkit-scrollbar-button {  background-color: transparent; height: 20px;}
.dropdown-el::-webkit-scrollbar-track {  background: var(--color-0);}
.dropdown-el::-webkit-scrollbar-track-piece { background-color: var(--body-back);}
.dropdown-el::-webkit-scrollbar-thumb { background-color: var(--color-0); border-radius: 16px;}
.dropdown-el::-webkit-scrollbar-corner { background-color: var(--color-0); border-radius: 16px;}
.dropdown-el::-webkit-resizer { background-color: var(--color-0);}
body.isLessonPage .lesson-navigation td .dropdown-el.expanded a {
  color: black!important;
}
.expanded .dropdown-el::after {
  transform: rotate(-180deg);
  top: 0.55em;

}
.expanded .dropdown-el>a:hover {
  background:var(--gray-color)!important;

}
@media (max-width:768px) {
   .dropdown-el {
    width: 100%;
    padding: 0 15px;
  }
  .isChatium .dropdown-el {
  position:static!important;
}
}
.dropdown-el:not(.not-empty) {
border:none;
}
/* ------------- 
content finish - lessonNavs
------------- */