body {
    background-color: var(--secondary_background);
}

h2 {
    font-size: 30px;
    font-family: var(--header_font);
}

section {
    padding: 30px 0;
}

.subjects {
    gap: 15px;
}

.subjects .btn {
    color: var(--sub_accent);
}


.cards_list {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}

.card {
    background-color: var(--white);
    border-radius: var(--radius);
    border: var(--border);
    border-bottom-width: 4px;
    padding: 24px;
    min-width: 100%;
    display: flex;
    flex-direction: column;
    color: var(--main);
}

.card .card_subject {
    color: var(--sub_accent);
    font-size: 16px;
    font-weight: var(--main_bolder_weight);
}

.card .title {
    font-size: 18px;
    font-weight: var(--main_bolder_weight);
}

.card .term_count {
    color: var(--secondary);
    margin-top: 15px;
}

#test_id {
    height: 49.5px;
}

#search_menu:not(.searching) *[data-mode="search"],
#search_menu.searching *[data-mode="initial"] {
    display: none;
}

@media (min-width: 560px) {
    .card {
        min-width: calc(50% - 12px);
        max-width: calc(50% - 12px);
    }
}

@media (min-width: 1200px) {
    .card {
        min-width: calc(33.3% - 16px);
        max-width: calc(33.3% - 16px);
    }
}


#cards_btn_main {
    color: var(--blue_text);
    background-color: var(--lightblue);
    border-color: var(--blue_border);
}