#card-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px;
}

.card {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.Card {
    cursor: pointer;
}

.header-card-area {
    text-align: center;
}

@media print {
    button, nav, header, .sidebar, h1, h2, p, span, form, input, #cardBinderContainer {
        display: none !important;
    }

    #card-grid {
        display:grid;
        grid-template-columns: repeat(4, 1fr);
    }

    .card {
        break-inside: avoid;
    }
}