cv.css

body {
    font-family: 'Roboto Slab', sans-serif;
    font-weight: 300;
    max-width: 1024px;
    margin: 1.6cm;
}

a {
    color: #0366d6;
    text-decoration: none;
}

b {
    font-weight: 400;
}

h1, h2, h3 {
    font-family: 'Didact Gothic', serif;
    font-weight: 300;
    margin-bottom: 0;
}

hr {
    border: 0;
    border-top: 1px solid #aaa;
}

li {
    margin-left: -10px;
    margin-top: 3px;
}

ul {
    margin: 0;
}

#contact-info {
    display: flex;
}

#contact-info .contact-left {
    align-self: flex-start;
}

#contact-info .contact-right {
    margin-left: auto;
    text-align: right;
}

#name {
    font-size: 1.6em;
    text-align: center;
}

#name h1 {
    margin-top: 0;
}

#name .first-name {
    font-weight: 200;
}

#name .last-name {
    font-weight: 700;
}

.section-title {
    /* These background properties draw a horizontal line to the left of each section title */
    background-image: linear-gradient(#aaa, #aaa);
    background-size: 7em 3px;
    background-repeat: no-repeat;
    background-position: left center;
    margin: 0.8em 0;
    padding-left: calc(7em + 0.8em);
    page-break-after: avoid;
}

.subsection {
    display: grid;
    grid-gap: 0.8em;
    grid-template-columns: 7em auto;
    margin-top: 0.8em;
    page-break-inside: avoid;
}

.subsection-left {
    color: #666;
    grid-column-start: 1;
    text-align: right;
}

.subsection-right {
    grid-column-start: 2;
}

@media print {
    body {
        font-size: 0.8em;
        /* Use page margin (below) instead when printing as it works per page */
        margin: 0;
    }
    @page {
        size: letter;
        margin: 1.6cm;
    }
}