body {
	margin: 0;
	background-color: black;
	color: white;
}

.midItem {
    display: flex;
    justify-content: center; /* Center the content horizontally */
    text-align: center; /* Center text inside the content */
}

.midItem .midItemContent {
    width: 100%;
    max-width: 800px; /* Maximum width for larger screens */
    margin: 0 20px; /* Default margin */
}

.midItemContentGraph {
    width: 100%;
    /*height: 200px;*/
    max-width: 800px; /* Maximum width for larger screens */
    margin: 0 20px; /* Default margin */
}

.chart-container {
    width: 100%;
    /* height: 400px; Set your desired height here */
    position: relative;
}

canvas {
     /*width: 100% !important;
    height: 100% !important;*/
}

/* Responsive styling for smaller screens */
@media (max-width: 768px) {
    .midItem .midItemContent {
        margin: 0 10px; /* Narrower margins for smaller screens */
    }
}

@media (max-width: 480px) {
    .midItem .midItemContent {
        margin: 0 5px; /* Even narrower margins for very small screens */
    }
}