

/* Список тренингов  - Модули */
.stream-table {
    margin: 0 0 20px !important;
    
    /* Фон модуля */
    --trBg: #ffffff;              
    /* Фон модуля при наведении*/
    --trBgHover: transparent;         
    /* Параметры границы */
    --trBorder: 1px solid rgba(0, 0, 0, 0.1);          
    /* Радиус скругления модуля */
    --trRadius: 0px;    
    
    /* Икнока количества уроков */
    --lsIco: url("data:image/svg+xml,%3Csvg width='13' height='10' viewBox='0 0 13 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.8125 1.47446C1.53156 1.1921 2.56263 0.887614 3.56525 0.792987C4.64588 0.690728 5.56238 0.841064 6.09375 1.36686V8.80429C5.33406 8.39983 4.37125 8.34412 3.48319 8.42807C2.52444 8.51964 1.55756 8.77987 0.8125 9.04696V1.47446ZM6.90625 1.36686C7.43762 0.841064 8.35413 0.690728 9.43475 0.792987C10.4374 0.887614 11.4684 1.1921 12.1875 1.47446V9.04696C11.4416 8.77987 10.4756 8.51888 9.51681 8.42883C8.62794 8.34412 7.66594 8.39907 6.90625 8.80429V1.36686ZM6.5 0.676991C5.69969 0.0306234 4.53944 -0.0655305 3.48319 0.0336759C2.25306 0.150434 1.01156 0.546497 0.238063 0.876931C0.16709 0.907248 0.106905 0.956107 0.0646921 1.01768C0.0224792 1.07924 2.15893e-05 1.15092 0 1.22415L0 9.61854C1.88191e-05 9.68238 0.0170927 9.7452 0.0496576 9.80124C0.0822226 9.85728 0.129238 9.90475 0.186396 9.9393C0.243555 9.97385 0.30903 9.99437 0.376824 9.999C0.444618 10.0036 0.512564 9.9922 0.574438 9.96576C1.29106 9.66051 2.44563 9.29345 3.56444 9.18738C4.70925 9.07901 5.66881 9.25377 6.18313 9.85664C6.22119 9.9012 6.26943 9.93717 6.32427 9.96188C6.37912 9.9866 6.43917 9.99943 6.5 9.99943C6.56083 9.99943 6.62088 9.9866 6.67573 9.96188C6.73057 9.93717 6.77881 9.9012 6.81688 9.85664C7.33119 9.25377 8.29075 9.07901 9.43475 9.18738C10.5544 9.29345 11.7098 9.66051 12.4256 9.96576C12.4874 9.9922 12.5554 10.0036 12.6232 9.999C12.691 9.99437 12.7564 9.97385 12.8136 9.9393C12.8708 9.90475 12.9178 9.85728 12.9503 9.80124C12.9829 9.7452 13 9.68238 13 9.61854V1.22415C13 1.15092 12.9775 1.07924 12.9353 1.01768C12.8931 0.956107 12.8329 0.907248 12.7619 0.876931C11.9884 0.546497 10.7469 0.150434 9.51681 0.0336759C8.46056 -0.0662937 7.30031 0.0306234 6.5 0.676991Z' fill='black'/%3E%3C/svg%3E%0A");
    /* Цвет иконки количества уроков */
    --lsIcoColor:  invert(24%) sepia(100%) saturate(5178%) hue-rotate(347deg) brightness(84%) contrast(116%);
    /* Цвет иконки количества уроков при наведении */
    --lsIcoColorHover: invert(24%) sepia(100%) saturate(5178%) hue-rotate(347deg) brightness(84%) contrast(116%);
    
    /* Цвет заголовка модуля */
    --trTitle: #000000;               
    /* Цвет описания модуля */
    --trDescr: rgba(0, 0, 0, 0.75);           
    /* Цвет текста количества уроков */
    --lsColor: #E30613;           
    /* Цвет текста количества уроков при наведении */
    --lsColorHover: #E30613; 
}

.stream-table tbody {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    gap: 20px;
}

.stream-table tr {
    position: relative;
    display: block;
    flex: 1 1 100%;

    margin: 0;
    padding: 0 !important;
    width: 100%;
    height: auto;
    
    background: url(https://fs.getcourse.ru/fileservice/file/download/a/178392/sc/80/h/94799b2a65941a9d8481d05f268cb9d8.png) no-repeat center right;
    border: var(--trBorder);
    border-radius: var(--trRadius);
    
    overflow: hidden;
    transition: all .3s;
}

.stream-table tr:hover {
    box-shadow: 4px 4px 32px rgba(0, 75, 128, 0.15), 0px 2px 8px rgba(13, 51, 86, 0.05);
}

.stream-table tr::before {
    content:'';
    position: absolute;
    top:0;
    left:0;
        
    width:100%;
    height:100%;
    
    background: rgba(255,255,255,.9);
    
    opacity:0;
    transition: all .3s;
}

.stream-table tr td {
    position: relative;
    display: block !important; 
    
    padding: 0 !important;
    width: 100% !important;
    height: 100% !important;
    
    z-index: 100;
}

.stream-table tr td:hover {
    background: none !important;
}

.stream-table tr td a {
    position: relative;
    display: block;
    
    padding:  20px;
    height: 100%;
}

.stream-table tr .stream-title {
    position: relative;
    display: block;
    
    font-family: var(--font);
    font-weight: 600;
    font-size: 22px !important;
    line-height: 120%;
    color: var(--trTitle);

    transition: all .3s;
}

.stream-table tr a div {
    position: relative;
    margin: 5px 0;
    padding-right: 0px;
    
    font-family: var(--font_sub) !important;
    font-weight: 400;
    font-size: 14px;
    color: var(--trDescr);
    letter-spacing: 0.03em;
    
    transition: all .3s;
}

.stream-table tr:hover a div {
    color: var(--trDescrHover);
}

.stream-table tr a b {
    display: inline-block;
    margin-bottom: 10px;
  	font-family: var(--font_sub) !important;
    font-weight: 400 !important;
    font-size: 11px;
    line-height: 120%;
    color: var(--lsColor);
}

.stream-table tr:hover a b {
    color: var(--lsColorHover);
}

.stream-table tr a b::before {
    content: var(--lsIco);
    position: relative;
    top: 1px;
    left: 0;
    margin-right: 5px;
    
    filter: var(--lsIcoColor);
}

.stream-table tr:hover td a b::before {
  	filter: var(--lsIcoColorHover);
}

@media (max-width:520px) {
    .stream-table tr::before {
        opacity:.8;
    }
}

/* Сетка тренингов */
.al_flex2 .stream-table tbody tr {
    flex: 1 1 45%;
    max-width: calc(100% / 2 - 10px);
    background: #fff;
}
.al_flex3 .stream-table tbody tr {
    flex: 1 1 30%;
    max-width: calc(100% / 3 - 14px);
    background: #fff;
}
.al_flex4 .stream-table tbody tr {
    flex: 1 1 20%;
    max-width: calc(100% / 4 - 14px);
    background: #fff;
}
.al_flex4 .stream-table .stream-img {
    height: 90px !important;
}
.al_flex4 .stream-table .stream-title {
    font-size: 18px !important;
}

@media (max-width:1200px) and (min-width:992px) {
    .al_flex3 .stream-table tbody tr,
    .al_flex4 .stream-table tbody tr {
        flex: 1 1 45%;
        max-width: calc(100% / 2 - 10px);
    }
}

@media (max-width:520px) {
    .al_flex3 .stream-table tbody tr,
    .al_flex4 .stream-table tbody tr {
        flex: 1 1 45%;
        max-width: calc(100% / 2 - 10px);
    }
}

@media (max-width:425px) {
    .al_flex1 .stream-table tbody tr,
    .al_flex3 .stream-table tbody tr,
    .al_flex4 .stream-table tbody tr {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

/* Добавление обложек */
.al_addPreview .stream-table tbody tr a {
    padding: 15px !important;
}

.al_addPreview .stream-table tbody tr a .stream-img {
    position: relative;
    margin: 0 0 20px;
    
    width: 100%;
    height: 170px;
    
    background-position: center;
    background-size: cover;
    overflow: hidden;

    text-align: center;
}


/* Список тренингов - прогрессия */
.al_trLine .stream-table {
    margin: 0 0 30px 7px !important;
}

.al_trLine .stream-table tbody {
    gap: 0;
}

.al_trLine .stream-table tbody tr {
    margin: 0 !important;
    background: none;
    border: none;
    overflow: visible;
}

.al_trLine .stream-table tbody tr:hover {
    transform: none;
    box-shadow: none;
}

.al_trLine .stream-table tbody tr::before {
    content: "";
    display: block !important;
    
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    
    background: #007AC7;
    opacity: 1;
    z-index: 10;
}

.al_trLine .stream-table tbody tr:first-child::before {
    height: 60%;
    top: inherit;
    bottom: 0;
}

.al_trLine .stream-table tbody tr:last-child::before {
    height: 40%;
}

.al_trLine .stream-table tbody tr:after {
    content: "";
    position: absolute;
    top: 35%;
    transform: translatey(-50%);
    left: -7px;
    
    width: 15px;
    height: 15px;
    
    background: #007AC7;
    border-radius: 100px;
    border: 2px solid #007AC7;
    z-index: 100;
    transition: all .6s;
}

.al_trLine .stream-table tbody tr:hover:after {  
    background: #fff;
    border: 2px solid #007AC7;
    z-index: 100;
}


.al_trLine .stream-table tbody tr td:hover {
    background: none;
}

.al_trLine .stream-table tbody tr td::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0%;
    
    background: url(https://fs.getcourse.ru/fileservice/file/download/a/178392/sc/177/h/1dad657c105f3a1c34664c68b3a4b71b.png) no-repeat bottom right,
        #007AC7;
    border-radius: 0px;
    z-index: 1;
    transition: all .45s;
}

.al_trLine .stream-table tbody tr:hover td::before {
    width: 100%;
}

.al_trLine .stream-table tbody tr a {
    padding: 15px 40px;
    z-index: 100;
}


.al_trLine .stream-table tbody tr a div {
    font-family: var(--font);
    font-weight: 400;
    font-size: 14px;
    line-height: 120%;
    color: rgba(0, 0, 0, .5);
    
    transition: all .3s;
}

.al_trLine .stream-table tbody tr:hover a .stream-title,
.al_trLine .stream-table tbody tr:hover a div {
    color: #fff;
}

.al_trLine .stream-table tbody tr a div::after,
.al_trLine .stream-table tbody tr a b {
    display: none;
}

@media (max-width:320px) {
    .al_trLine .stream-table tbody tr::before {
        display: block;
    }
}
