css responsive

css

//ipad pro
//@media(min-width:1023px) and (max-width:1200px) {
//}

---:New:----
.shadow-box {
    background: #fff;
    box-shadow: 0 4px 24px 0 rgb(34 41 47 / 10%);
}
/* Mobile devices */
@media(min-width:320px) and (max-width:480px) {
    .dashboard-chart {
        width: 100%;
    }

    .analytic-number {
        width: 100%
    }
}

/* iPads, Tablets */
@media(min-width:481px) and (max-width:768px) {
    .dashboard-chart {
        width: 100%;
    }

    .analytic-number {
        width: 100%
    }
}

/* Small screens, laptops */
@media(min-width:769px) and (max-width:1024px) {
    .dashboard-chart {
        width: 50%;
    }

    .analytic-number {
        width: 47%
    }
}

/*  Desktops, large screens */
@media(min-width:1025px) and (max-width:1200px) {
    .dashboard-chart {
        width: 50%;
    }

    .analytic-number {
        width: 30%
    }
}

/* Extra large screens, TV */
@media(min-width:1201px) and (max-width:1828px) {
    .dashboard-chart {
        width: 50%;
    }

    .analytic-number {
        width: 30.6%
    }
}

/* Extra large screens, TV */
@media(min-width:1829px){
    .dashboard-chart {
        width: 33.33%;
    }

    .analytic-number {
        width: 23.6%
    }
}