body {
    width: 100%;
    margin: 0;

    div#main, div#knowledge {
        margin: 4pt;
        padding: 4pt;
    }
}

div#identity {
    display: grid;
    grid-template-columns: 30% 70%;
    grid-template-rows: auto auto;
    grid-gap: 4pt;
    padding: 4pt;

    div.cvtitle {
        grid-column: 2;
        grid-rows: 1;
        text-align:center;
    }

    div#photo-frame {
        grid-column: 1;
        grid-row: 1 / span 2;
        margin-top: auto;
        margin-bottom: auto;
        img {
            max-width: 100%;
            max-height: 100%;
            margin-top: auto;
            margin-bottom: auto;
        }
    }

    div#contact-and-qrcode {
        grid-row: 2;
        grid-column: 2;
        margin-top: auto;
        margin-bottom: auto;
        div#qrcode {
            display: none;
            img {
                max-width: 100%;
                max-height: 100%;
                margin-top: auto;
                margin-bottom: auto;
            }
        }
        table {
            margin-left: auto;
            margin-right: auto;
            tr.extra-details {
                display: none;
            }
        }
    }
}


/* Categories don't render well on very small screen */
div#knowledge {
    display: none;
}


/* Jobs */
div.job {
    h1 {
        span.job-start {
            &:after {
                content: ": "
            }
        }
        span.job-end {
            display: none;
        }
        span.job-company {
        }
    }
}



/* C.V. version when displayed */
div#choose-versions {

    details {

        summary {
            margin-top: 0em;
            font-size: 90%;
        }

        ul.dropdown {
            margin-top:2pt;
            li {
                display: inline-block;
                margin: auto 2pt;
                span {
                    display: none;
                }
            }
        }
    }
}