
@media only screen and (min-width: 1025px) and (max-width: 1440px) {
    .responsive-charts{
        width: 350px;
    }

    .responsive-single-charts{
        width: 350px;
    }
}

@media only screen and (max-width: 1024px) {
    .responsive-charts{
        width: 320px;
    }
    .responsive-single-charts{
        width: 320px;
    }
}


@media only screen and (max-width: 768px) {
    .responsive-charts{
        width: 360px;
    }
    .responsive-single-charts{
        width: 360px;
    }
}


@media only screen and (max-width: 425px) and (orientation: portrait) {
    .responsive-charts{
        width: 395px;
    }
    .responsive-single-charts{
        width: 395px;
    }
}


@media only screen and (max-width: 375px) and (orientation: portrait) {
    .responsive-charts{
        width: 345px;
    }
    .responsive-single-charts{
        width: 345px;
    }
}


@media only screen and (max-width: 320px) and (orientation: portrait) {
    .responsive-charts{
        width: 290px;
    }
    .responsive-single-charts{
        width: 290px;
    }
}


@media (min-width: 576px) {
    /* Tablet: 2 cards */
    .info-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    /* Laptop: 3 cards */
    .info-cards {
        grid-template-columns: repeat(3, 1fr);
    }
}