/* 
    Typography
*/

:root {
    --default-font-family: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, 
    "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, 
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --code-font-family: "JetBrains Mono", "ui-monospace", "SFMono-Regular", "SF Mono", 
    "Menlo", "Lucida Console", "Consolas", "Liberation Mono", "Courier New", monospace;
}

html {
    font-family: var(--default-font-family);
    font-weight: 400;
    font-size: 13pt;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 300;
    line-height: 1.2em; 
    margin-bottom: 0.5em; 
    margin-top: 1.5em; 
}

h1 { font-size: 2.3em; font-weight: 400; }
h2 { font-size: 2.0em; font-weight: 400; }
h3 { font-size: 1.8em; }
h4 { font-size: 1.45em; }
h5 { font-size: 1.25em; }
h6 { font-size: 1.1em; }

h1:first-of-type { margin-top: 0.5em; }
h2:first-child { margin-top: 0; }

a {
    text-decoration: none;
}

img {
    margin-bottom: 1em;
    width: 100%;
}

pre {
    font-size: 0.8em;
    line-height: 1.5em;
    padding: 1em;
}

code {
    padding: .25em .5em 0.15em;
    margin: 0;
    border-radius: .5em;
    font-family: var(--code-font-family);
    font-size: 0.8em;
}

pre code {
    background-color: transparent;
    border-radius: 0;
    padding: 0;
}

.highlight > pre {
    border-radius: 1em;
}

.footnote-ref {
    padding: .15em .3em;
    border-radius: .5em;
}

.footnotes {
    font-size: 0.8em;
    line-height: 1.15em;
}

.footnotes p {
    margin-bottom: 0.6em;
}

#TableOfContents a {
    text-decoration: none;
}

.blog-date {
    font-weight: 400;
    line-height: 1.15em;
    text-transform: uppercase;
}

.read-more {
    letter-spacing: 0.1em;
    font-size: 0.85em;
}

.navbar-brand {
    font-family: var(--default-font-family);
    font-weight: 300;
    font-size: 1.6em;
}

.nav-link {
    letter-spacing: 0.1em;
}

#banner {
    margin-bottom: 2em;
}

h1.title {
    font-family: var(--default-font-family);
    font-weight: 400;
    font-size: 2.0em;
    margin-bottom: 0.25em;
    margin-top: 0;
}

h2.post_link {
    font-weight: 400;
    font-size: 1.5em;
}

.subtitle {
    font-weight: 300;
    font-size: 1.4em;
    line-height: 1.15em;
    margin-bottom: 0.25em;
}

.intro {
    font-weight: 300;
    font-size: 1.2em;
    letter-spacing: 0.01em;
}

.intro-wrapper {
    padding-top: 1.5em;
    padding-bottom: 1em;
}

.post-meta ul {
    list-style-type: none;
    padding: 0;
    font-size: 0.8em;
    line-height: 1em;
}

.post-meta ul li  {
    display: inline;
}

blockquote {
    padding: .5em;
    padding-left: 1em;
    border-left-width: .3em;
    border-left-style: solid;
}

blockquote p {
    margin: 0.2em;
}

.table td {
    padding-top: .15em;
    padding-bottom: .15em;
    padding-left: .5em;
    padding-right: .5em;
    border: 1px solid var(--cgr-table-border-color);
}

.table tr {
    font-weight: 400;
    font-size: 0.92rem;
}

.table th {
    font-weight: 700;
    font-size: 1rem;
    padding-top: .15em;
    padding-bottom: .15em;
    padding-left: .5em;
    padding-right: .5em;
    border: 1px solid var(--cgr-table-border-color);
}

/*
    Layout
*/

.wrapper {
    padding-bottom: 2em;
}

.table-of-contents {
    border-radius: .5em;
    padding: 1em;
}

#footer {
    text-align: center;
    font-size: 1.2em;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding-top: 1em;
    padding-bottom: 0.5em;
    margin: 0;
}

#footer h5 {
    margin-top: 0.2em;
    margin-bottom: 0.2em;
}

#footer2 {
    text-align: center;
    font-size: 0.8em;
    font-weight: 400;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
}

.follow_us { text-align:center; margin:0 auto;  }
.follow_us a { 
    font-size: 2.5em;
    margin: 0.4em;
    transition: all 0.2s ease-out;
    background: transparent;
    opacity: 0.2;
}