.skeleton-item {
    background-color: #e0e0e0;
    height: 460px;
    margin-right: 20px;
    width: calc(100% / 4 - 20px);

}

.courses-skeleton {
    display: flex;
    gap: 30px;
}
.skeleton-item {
    background-color: #e0e0e0;
    border-radius: 10px;
    animation: skeleton-loading 1.5s infinite;
}
@media screen and (max-width: 1200px) {
    .skeleton-item {
        width: calc(100% / 3 - 20px);
    }
    .skeleton-item:nth-child(4){
        display: none;
    }
}
@media screen and (max-width: 1000px) {
    .courses-skeleton {
        gap: 0;
    }
}
@media screen and (max-width: 768px) {
    .skeleton-item {
        height: 430px;
        width: calc(100% / 2 - 20px);
    }
    .skeleton-item:nth-child(3){
        display: none;
    }
}
@media screen and (max-width: 575px) {
    .skeleton-item {
        width: 100%;
    }
    .skeleton-item:nth-child(2){
        display: none;
    }
}
@keyframes skeleton-loading {
    0% {
        background-color: #e0e0e0;
    }
    50% {
        background-color: #d0d0d0;
    }
    100% {
        background-color: #e0e0e0;
    }
}