@keyframes skeleton-glow {
  0% {
    background-position: 200% 50%;
  }
  100% {
    background-position: -200% 50%;
  }
}

.postCard:not(.is-loaded),
.postCardAll:not(.is-loaded) {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background-color: #1c1c1e;

    background-image: radial-gradient(
        circle at 50% 0,
        rgba(100, 115, 150, 0.1), 
        rgba(100, 115, 150, 0) 50%
    );
    background-repeat: no-repeat;
    background-size: 200% 200%;
    animation: skeleton-glow 3s infinite ease-in-out;
}

.postCard:not(.is-loaded) > *,
.postCardAll:not(.is-loaded) > * {
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}

.postCard.is-loaded,
.postCardAll.is-loaded {
    background-image: none;
    animation: none;
}

.postCard.is-loaded > *,
.postCardAll.is-loaded > * {
    opacity: 1;
}


/** **/

