/* Skeleton Loading */
.skeleton {
    background: #e0e0e0;
    background: linear-gradient(110deg, #e0e0e0 8%, #d0d0d0 18%, #e0e0e0 33%);
    border-radius: 5px;
    background-size: 200% 100%;
    animation: 1.5s shine linear infinite;
    color: transparent !important;
    pointer-events: none;
    user-select: none;
}

.skeleton img, .skeleton i, .skeleton svg {
    visibility: hidden;
}

@keyframes shine {
    to {
        background-position-x: -200%;
    }
}

/* Skeleton Specific Sizes */
.name-course.skeleton {
    height: 40px;
    width: 60%;
    margin-bottom: 15px;
}

.data-course.skeleton {
    height: 80px;
    width: 100%;
}

.year.skeleton {
    width: 150px;
    height: 30px;
}

.count-lect.skeleton {
    width: 120px;
    height: 30px;
}

.img-course.skeleton {
    min-height: 300px;
    background-color: #ddd;
}

.card-subscrition.skeleton {
    height: 250px;
}

.info-card .number-done.skeleton, 
.info-card .number-total.skeleton,
.info-card .number-progress.skeleton {
    width: 40px;
    height: 20px;
    display: inline-block;
}