@media print {
    @page {
        size: A4 portrait;
    }
    @page {
        margin-top: 12mm;
        margin-bottom: 12mm;
        margin-left: 13mm;
        margin-right: 13mm;
    }

    hr {
        page-break-after: always;
        /*display: none;*/
        visibility: hidden;
    }

    .card {
        break-inside: avoid;
        page-break-inside: avoid;
    }
    span.screen-only {
        display: none;
    }

    span.print-only {
        display: inline;
    }

    h1, h2, h3, h4, h5, h6 {
        font-family: 'Liberation Sans', Arial, Helvetica, sans-serif;
        margin-bottom: 0;
        margin-top: 2mm;
    }

    body {
        font-family: 'Liberation Sans', Arial, Helvetica, sans-serif;
        font-size: 10pt;
        line-height: 1.3;
    }

    h1 {
        font-size: 16pt;
    }

    h2 {
        font-size: 12pt;
    }

    p {
        margin-top: 0;
        margin-bottom: 3mm;
    }

    .screen-only {
        display: initial;
    }

    .print-only {
        display: none;
    }

    .card {
        display: flex;
        align-items: center;
        gap: 0.25rem;
        font-family: 'Liberation Sans', Arial, Helvetica, sans-serif;
        font-size: 10pt;
    }

    .card img {
        width: 26mm;
        margin: -2mm;
    }

    .card-text {
        margin-left: 2mm;
    }
}

@media screen {
    h1, h2, h3, h4, h5, h6 {
        font-family: 'Liberation Sans', Arial, Helvetica, sans-serif;
        margin-bottom: 0;
        margin-top: 0.5rem;
    }

    body {
        font-family: 'Liberation Sans', Arial, Helvetica, sans-serif;
        font-size: 100%;
        line-height: 1.3;
        max-width: min(40rem, 100% - 4rem);
        margin-inline: auto;
        margin-top: 3rem;
        margin-bottom: 5rem;
    }

    h1 {
        font-size: 1.6rem;
    }

    h2 {
        font-size: 1.2rem;
    }

    p {
        margin-top: 0;
        margin-bottom: 0.75rem;
    }

    .screen-only {
        display: initial;
    }

    .print-only {
        display: none;
    }

    .card {
        display: flex;
        align-items: center;
        gap: 0.25rem;
        font-family: 'Liberation Sans', Arial, Helvetica, sans-serif;
        margin-top: 1rem;
        margin-left: -0.5rem;
    }

    .card img {
        height: 7.5em;
        width: auto;
        margin: -0.5em 0;
    }

    .card-text {
        margin-left: 0.5rem;
    }
}