.pulsate {
    position: relative;
    background: linear-gradient(90deg, #f6f7f9, #e9ebee, #f6f7f9, #f6f7f9);
    background-size: 400% 400%;
    color: transparent !important;
    margin: 0.1rem !important;
    transition: background-color 0.5s ease;
}

.pulsate::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    background-image: linear-gradient(
        to right,
        #f6f7f9 0%,
        #e9ebee 20%,
        #f6f7f9 40%,
        #f6f7f9 100%
    );
    background-repeat: no-repeat;
    animation: shimmer 2s linear infinite;
}

.expandChart.pulsate::before{
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    border-radius: 50%;
    top: 0;
    left: 0;
    background-image: linear-gradient( to right, #f6f7f9 0%, #e9ebee 20%, #f6f7f9 40%, #f6f7f9 100% );
    background-repeat: no-repeat;
  }

  .skeletonContainer {
    width: 96%;
    height: 70%;
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0.5rem;
    background: linear-gradient(90deg, #f6f7f9, #e9ebee, #f6f7f9, #f6f7f9);
    background-size: 400% 400%;
    animation: shimmer 2s linear infinite;
    transition: background-color 0.5s ease;
}

.skeletonContainer::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: linear-gradient(
        to right,
        #f6f7f9 0%,
        #e9ebee 20%,
        #f6f7f9 40%,
        #f6f7f9 100%
    );
    background-repeat: no-repeat;
    animation: shimmer 2s linear infinite;
    
}


@keyframes shimmer {
    0% {
        background-position: -450px 0;
    }
    100% {
        background-position: 450px 0;
    }
}