.navbar{width:100%;padding:20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}.navbar .logo{display:flex;align-items:center;font-weight:700;gap:10px}.navbar .icons{display:flex;align-items:center;gap:20px}@media screen and (max-width: 480px){.navbar .icons .icon{display:none}}.navbar .icons .notification{position:relative}.navbar .icons .notification span{background-color:red;color:#fff;width:16px;height:16px;border-radius:50%;position:absolute;top:-10px;right:-10px;display:flex;align-items:center;justify-content:center;font-size:12px}.navbar .icons .user{display:flex;align-items:center;gap:10px}.navbar .icons .user img{width:26px;height:26px;border-radius:50%;object-fit:cover}@media screen and (max-width: 480px){.navbar .icons .icon{display:none}.navbar .icons .notification,.navbar .icons .user{display:flex}}.home{display:grid;gap:2px;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(70px,auto);grid-auto-flow:dense}@media screen and (max-width: 1200px){.home{grid-template-columns:repeat(3,1fr)}}@media screen and (max-width: 1024px){.home{grid-template-columns:repeat(2,1fr)}}@media screen and (max-width: 768px){.home{grid-template-columns:repeat(1,1fr)}}@media screen and (max-width: 480px){.home{grid-auto-rows:minmax(120px,auto)}}.home .box{padding:20px;border-radius:5px;border:2px solid #384256;background-color:#2a3447}.home .box1{grid-column:span 1;grid-row:span 3}.home .box4{grid-column:span 1;grid-row:span 2}.home .box7{grid-column:span 2;grid-row:span 2}@media screen and (max-width: 768px){.home .box7{display:block;grid-column:span 1;grid-row:span 1}}.topBox{border-radius:8px;padding:20px;margin:20px 0}.topBox h2{color:#fff;margin-bottom:16px;text-align:center}.topBox .list{display:flex;flex-direction:column}@media (max-width: 768px){.topBox .list{flex-direction:column}}.topBox .list .listItem{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:10px;border-radius:4px}.topBox .list .listItem:last-child{margin-bottom:0}.topBox .list .listItem .user{display:flex;align-items:center}.topBox .list .listItem .user img{width:40px;height:40px;border-radius:50%;object-fit:cover;margin-right:10px}.topBox .list .listItem .user .userTexts{display:flex;flex-direction:column}.topBox .list .listItem .user .userTexts .username{font-size:14px;color:#fff;font-weight:700}.topBox .list .listItem .user .userTexts .email{font-size:12px;color:#fff}.topBox .list .listItem .amount{font-size:14px;font-weight:700;color:#fff}@media (max-width: 768px){.topBox .list .listItem{flex-direction:column;align-items:flex-start}.topBox .list .listItem .user{flex-direction:row}}.CovidChartContainer{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:30px;padding:20px;border-radius:10px;width:100%}@media (max-width: 480px){.CovidChartContainer{margin:15px;padding:10px}}.CovidChartContainer h3{color:#fff;font-size:20px;text-align:center;margin-bottom:20px}.CovidChartContainer .recharts-wrapper{border-radius:20px}.CovidChartContainer .recharts-text{font-family:Helvetica,Arial,sans-serif;fill:#fff}.CovidChartContainer .recharts-cartesian-axis-tick-line{stroke:#ccc}.CovidChartContainer .recharts-tooltip-wrapper{border-radius:8px;padding:10px}.CovidChartContainer .recharts-legend-wrapper{padding-bottom:1px;border-radius:8px;margin-top:180px}@media (max-width: 480px){.CovidChartContainer .recharts-legend-wrapper{margin-top:0}}.CovidTinyLineChart{padding:1rem;border-radius:8px;text-align:center}.CovidTinyLineChart .recharts-responsive-container{margin-top:2rem}.CovidTinyLineChart .recharts-responsive-container{width:100%;height:auto;margin-top:2rem}@media (max-width: 480px){.CovidTinyLineChart h3{font-size:1rem}}.CovidTinyLineChart{padding:1rem;border-radius:8px}.CovidTinyLineChart .recharts-responsive-container{margin-top:2rem;width:100%;height:100%}.CovidTinyLineChart h3{color:#fff;font-size:1.2rem;text-align:center;margin-bottom:1rem}.CovidTinyLineChart .recharts-wrapper{margin:auto}.CovidTinyLineChart .recharts-wrapper .recharts-line{stroke-width:3px}.CovidTinyLineChart .recharts-wrapper .recharts-tooltip-wrapper{pointer-events:none}.CovidRocoveredChart{padding:1rem;border-radius:8px}.CovidRocoveredChart .recharts-responsive-container{margin-top:2rem;width:100%;height:auto}.CovidRocoveredChart h4{color:#fff;font-size:1.2rem;text-align:center;margin-bottom:1rem}.CovidRocoveredChart .recharts-wrapper .recharts-line{stroke-width:3px}.CovidRocoveredChart .recharts-wrapper .recharts-tooltip-wrapper{pointer-events:none}.covid-tiny-line-chart{padding:16px;border-radius:8px;text-align:center;color:#fff}.covid-tiny-line-chart h3{margin-bottom:20px}.covid-tiny-line-chart .chart-container{width:100%;max-width:600px;margin:auto}.covid-tiny-line-chart .chart-container .recharts-wrapper svg{width:100%!important;height:auto!important}.covid-pie-chart{display:flex;flex-direction:column;align-items:center;margin:2rem auto}.covid-pie-chart h2{margin-bottom:1rem}.covid-pie-chart .recharts-responsive-container{width:100%;height:100%;border-radius:.5rem;overflow:hidden}.covid-pie-chart .recharts-wrapper{border-radius:.5rem}.covid-pie-chart .recharts-pie .recharts-sector{stroke:#fff;stroke-width:2px}.covid-pie-chart .recharts-tooltip-wrapper .recharts-default-tooltip{border-radius:.5rem;border:none}.covid-pie-chart .recharts-legend-wrapper .recharts-legend-item{margin-bottom:.4rem}.covid-pie-chart .recharts-legend-wrapper .recharts-legend-item span{font-size:.8rem}@media (max-width: 480px){.covid-pie-chart .recharts-legend-wrapper .recharts-legend-item span{font-size:.6rem}}.covidBarChartContainer{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;border-radius:8px}.covidBarChartContainer h3{text-align:center;font-size:1.5rem;color:#fff;margin-bottom:20px}.covidBarChartContainer .recharts-wrapper{border-radius:10px}.covidBarChartContainer .recharts-cartesian-axis-tick{font-family:Helvetica,Arial,sans-serif;font-size:12px;color:#fff}.covidBarChartContainer .recharts-tooltip-wrapper{border-radius:8px;padding:10px;border:1px solid #ddd}.covidBarChartContainer .recharts-legend-wrapper{border-radius:5px;bottom:-10px;padding:5px}.covidBarChartContainer .recharts-bar:hover{fill:#7a6fbe}.covidBarChartContainer{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;border-radius:8px;width:100%}.covidBarChartContainer h3{text-align:center;margin-bottom:15px}.covidBarChartContainer .recharts-wrapper{border-radius:10px;padding:10px}.covidBarChartContainer .recharts-cartesian-axis-tick{font-size:12px;color:#666}.covidBarChartContainer .recharts-text{font-family:Helvetica,Arial,sans-serif;fill:#fff}.covidBarChartContainer .recharts-bar{transition:fill .3s ease}.covidBarChartContainer .recharts-bar:hover{fill:#fff}.covidBarChartContainer .recharts-tooltip-wrapper{border-radius:8px;padding:5px;font-size:14px}.covidBarChartContainer .recharts-legend-wrapper{bottom:-10px;border-radius:5px;padding:5px}.menu .item{gap:10px;margin-bottom:20px}.menu .item .title{font-size:12px;font-weight:200;color:#ddd;text-transform:uppercase}@media screen and (max-width: 1024px){.menu .item .title{display:none}}.menu .item .listItem{display:flex;align-items:center;gap:10px;padding:10px;border-radius:5px;text-decoration:none;color:inherit}.menu .item .listItem:hover{background-color:#384256}.menu .item .listItem img{width:20px;height:auto}.menu .item .listItem .listItemTitle{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media screen and (max-width: 1024px){.menu .item .listItem .listItemTitle{display:none}}.footer{display:flex;align-items:center;justify-content:space-between;padding:30px;flex-wrap:wrap;gap:10px}.footer span:first-child{font-weight:700;flex:1 100%}.footer span:last-child{font-size:14px;text-align:right;flex:0 auto}@media screen and (max-width: 480px){.footer span:last-child{font-size:12px;text-align:left;flex:1 100%}}*{margin:0;padding:0;box-sizing:border-box}a{text-decoration:none;color:inherit}.main{font-family:Inter,sans-serif;background-color:#2a3447;color:#fff}.container{display:flex}.menuContainer{width:180px;padding:5px 20px;border-right:2px solid #384256}@media screen and (max-width: 1024px){.menuContainer{width:max-content}}.contentContainer{padding:5px 20px;width:100%}