.blocks{
	padding: 10px;
}

#progress-wrp {
    margin: 0 0 0;
}

.block-sections {
    background: var(--transparent-2-w);
    padding: 10px;
    border-radius: var(--br-8);
    margin-bottom: 5px;
    padding-top: 1px;
    height: 171px;
}

.panel {
    background: var(--card);
    max-height: 0;
    border-radius: var(--br-8);
    overflow: hidden;
    transition: max-height .2s ease-out;
    height: 70px;
    max-height: 70px;
    margin-top: 10px;
}

.panel:hover .category-themes{
    opacity:1;
    transition:var(--transition-duration)
}

.panel:hover .category-name a{
    color:var(--span);
    transition:var(--transition-duration)
}

.panel:hover .category-icon img{
    filter:grayscale(0);
    transition:var(--transition-duration)
}

.panel:hover .category-description{
    color:var(--text-default);
    transition:var(--transition-duration)
}

.panel:hover .category-icon{
    border-right:2px solid var(--span-middle);
    transition:var(--transition-duration)
}

.panel center span{
    margin:10px
}

.panel:hover .category-closed{
    opacity:.1;
    transition:var(--transition-duration)
}

.panel:hover .block-last-topic{
    opacity:1
}

.block-naming {
    display: none;
    padding: 5px;
    cursor: pointer;
    user-select: none;
}

.block-category {
    display: inline-flex;
    float: left;
    width: 40%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.category-icon {
    border-right: 2px solid var(--transparent-3-w);
    margin: 10px 5px;
    text-align: center;
    transition: var(--transition-duration);
}

.category-icon img {
    border-radius: var(--br-8);
    width: 50px;
    height: 50px;
    filter: grayscale(1);
    margin: 0px 6px;
    object-fit: cover;
    transition: var(--transition-duration);
    border: 2px solid var(--transparent-3-w);
}

.category-block {
    margin-left: 10px;
    margin-top: 15px;
    z-index: 1;
}

.category-name a {
    color: var(--text-default);
    transition: var(--transition-duration);
    cursor: pointer;
    user-select: none;
}

.category-description {
    color: var(--text-custom);
    font-size: 11px;
    font-weight: 600;
    line-height: 12px;
    margin-top: 2px;
    transition: var(--transition-duration);
    float: left;
}

.pos-relative {
    position: relative;
    z-index: 2;
    width: 30%;
    margin: 0 auto;
}

.category-themes {
    margin-top: 5px;
    left: 20rem;
    opacity: .3;
    text-align: center;
    transition: var(--transition-duration);
}

.themes-count {
    font-size: 30px;
}

.themes-name {
    margin-top: -10px;
}

.block-last-topic {
    width: 200px;
    margin: -55px auto;
    opacity: .5;
    transition: var(--transition-duration);
}

.l-img {
    float: left;
    margin-right: 5px;
    border-radius: var(--br-10);
    border: 2px solid var(--span);
    text-align: center;
    transition: var(--transition-duration);
}

.l-img img {
    width: 50px;
    height: 50px;
    border-radius: var(--br-8);
    border: 2px solid var(--transparent-3-w);
}

.l-row {
    overflow: hidden;
    white-space: nowrap;
    word-wrap: normal;
    text-overflow: ellipsis;
    line-height: 17px;
    font-size: 12px;
}

.l-row a {
    cursor: pointer;
}

.category-closed {
    transform: rotate(-35deg);
    background: #ccc;
    border-radius: 50%;
    filter: grayscale(1) invert(100%);
    overflow: hidden;
    position: absolute;
    z-index: 10;
    opacity: .05;
    top: -15px;
    width: 90px;
    height: 90px;
    left: 10%;
    transition: var(--transition-duration);
}

.category-closed img {
    height: 60px;
    width: 60px;
    margin: 15px;
}

.float-right {
    float: right;
}

@media (min-width: 980px) and (max-width: 1132px) {
    .block-last-topic,.pos-relative{
        display:none!important
    }
    .block-category {
        width:100%!important
    }
}

@media (max-width: 763px) {
    .block-last-topic,.pos-relative{
        display:none!important
    }
    .block-category {
        width:100%!important
    }
}