.flex {
    display: flex;
}

.sidebar {
    width: 30%; 
    padding-right: 20px;
}

.main-content {
    width: 70%; 
}

/* Flexbox container */
.content-container {
    display: flex;
    justify-content: space-between;
}

/* Main content and sidebar styles */
.main-content {
    flex: 3; /* This means the main content will take up 3/4 of the width */
    padding-right: 20px; /* Add some space between the content and the sidebar */
}

.sidebar {
    flex: 1; /* This means the sidebar will take up 1/4 of the width */
    padding-left: 20px; /* Add some space between the sidebar and the content */
}