.main_container {
    display: flex;
    gap: 0.5rem;
}

.menu_container {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.content_container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(25%, 1fr));
    gap: 0.5rem;
}

.content_item {
    flex: 1;
}

@media screen and (max-width: 990px) {
    .content_container {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 700px) {
    .main_container {
        flex-direction: column;
    }

    .menu_container {
        flex-direction: row;
    }

    .menu_container > * {
        flex: 1;
        text-align: center;
    }

    .event {
        display: none;
    }
}

@media screen and (max-width: 500px) {
    .content_container {
        grid-template-columns: 1fr;
    }
}