.main.front-page .single-community-topic-skeleton {
    display: flex;
    max-height: 100px;
    min-height: 100px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.48);
    padding: 13px;
}

.main.front-page .single-community-topic-skeleton:first-of-type {
    border-top: 1px solid rgba(0, 0, 0, 0.48);
}

.main.front-page .single-community-topic-skeleton .users {
    display: none;
}

.main.front-page .single-community-topic-skeleton .content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 70px;
}

.main.front-page .single-community-topic-skeleton .content .title {
    position: relative;
    overflow: hidden;
    width: 80%;
    height: 28px;
    border-radius: 5px;
    background-color: #e3e3e3;
}

.main.front-page .single-community-topic-skeleton .content .bottom-content {
    display: flex;
    width: 100%;
}

.main.front-page .single-community-topic-skeleton .content .bottom-content .category {
    position: relative;
    overflow: hidden;
    width: 40%;
    height: 24px;
    border-radius: 5px;
    margin-right: 5px;
    background-color: #e3e3e3;
}

.main.front-page .single-community-topic-skeleton .content .bottom-content .tags {
    position: relative;
    overflow: hidden;
    width: 20%;
    height: 24px;
    border-radius: 5px;
    background-color: #e3e3e3;
}

.main.front-page .single-community-topic-skeleton .content .title:before,
.main.front-page .single-community-topic-skeleton .content .bottom-content .category:before,
.main.front-page .single-community-topic-skeleton .content .bottom-content .tags:before
{
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 35%;
    background: linear-gradient(120deg, transparent 0%, #eaeaea 50%, transparent 100%);
    animation: load 1s cubic-bezier(0.4, 0.0, 0.2, 1) infinite;
}

@media (min-width: 768px) {
    .main.front-page .single-community-topic-skeleton {
        border-bottom: 1px solid #DCDFEC;
    }

    .main.front-page .single-community-topic-skeleton:first-of-type {
        border-top: unset;
    }

    .main.front-page .single-community-topic-skeleton:last-of-type {
        border-bottom: unset;
    }
}

@keyframes load {
    from {
        left: 0%;
    }
    to   {
        left: 100%;
    }
}
