/* ---- "Field Log" skin for article/project pages ---- */

@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap");

:root {
    --fl-accent: #2d71c4;
    --fl-accent-dark: #1f5391;
    --fl-ink: #1a1a1a;
    --fl-mono: "JetBrains Mono", "Courier New", monospace;
    --fl-sans: "Source Sans Pro", sans-serif;
}

body {
    background: #ffffff;
}

body,
#main h3,
#main p,
#main li {
    font-family: var(--fl-sans);
}

#header {
    border-bottom-color: var(--fl-accent);
}

#header .logo {
    font-family: var(--fl-mono);
    font-weight: 700;
    letter-spacing: -0.01em;
}

#main h1,
#main h2 {
    font-family: var(--fl-mono);
    color: var(--fl-ink);
}

#main h2 {
    border-bottom: solid 3px var(--fl-accent);
    display: inline-block;
    padding-bottom: 0.2em;
}

#main a {
    color: var(--fl-accent);
}

hr.major {
    border-bottom-color: var(--fl-accent);
}

.image,
.image img {
    border-radius: 5px;
}

.image {
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.24);
    overflow: hidden;
}

/* Technical-achievement image grid: force a uniform aspect ratio so
   differently-shaped source images (gifs/pngs) all render as the same
   size box instead of stretching some rows taller than others. */
.col-4.col-12-medium .image.fit img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

iframe {
    border-radius: 5px;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.24);
}

#sidebar {
    background-color: #f7f7f5;
}

#sidebar #menu a {
    font-family: var(--fl-mono);
    font-size: 0.85em;
}

#sidebar #menu a:hover {
    color: var(--fl-accent);
}