/* Global styles */

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* Fix jumping scrollbar when switching to long pages */

html {
    margin-left: calc(100vw - 100%);
    margin-right: 0;
}

/* link */

a {
    color: #4582EC;
}

a:hover {
    color: #1559cf;
}

/* button */

.btn-outline-primary {
    color: #4582EC;
    border-color: #4582EC;
}

.btn-outline-primary:hover {
    color: #FFFFFF;
    background-color: #4582EC;
    border-color: #4582EC;
}

/* author */

author {
    font-weight: 700;
    text-decoration: underline;
}

/* Partial: Colors */

.text-patreon {
    color: #F96854 !important;
}

.text-ko-fi {
    color: #DF5000 !important;
}

.text-bmc {
    color: #FF813F !important;
}

/* Partial: Header */

.header a:hover {
    text-decoration: none;
}

.header .logo {
    max-height: 90px;
}

.header h1.name {
    color: #333333;
    font-weight: 500;
    font-size: 3rem;
}

.header ul.nav li a {
    color: #7f7f7f;
    font-size: 14px;
    padding: 3px 10px 0 10px;
}

.header ul.nav li a:hover {
    color: #343a40;
}

.header ul.nav li:first-child a {
    padding-left: 2px;
}

.header ul.nav li:last-child a {
    padding-right: 2px;
}

/* Partial: Content */

.content .page-heading {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.005rem;
    text-transform: "capitalize";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    color: #333333;
    margin-bottom: 16px;
}

.content h1, h2, h3, h4, h5, h6 {
    color: #333333;
}

.content .blog-post-title {
    font-size: 2rem;
}

.content .meta {
    font-size: 1rem;
    color: #738491;
    margin-bottom: 10px;
}

.content .meta a {
    text-decoration: none;
}

.content .middot:before {
    margin: 0 3px;
    content: "·";
}

.content .tags ul li a {
    color: #7f7f7f;
}

.content .tags ul li a:hover {
    color: #343a40;
}

.content .caption {
    text-align: center;
    margin-top: 10px;
    color: #738491;
    font-size: 0.9rem;
}

.content .markdown {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1rem;
    color: #333333;
    line-height: 1.75rem;
}

.content twitterwidget {
    margin: auto;
}

.content .meta, .content .markdown h1, .content .markdown h2, .content .markdown h3, .content .markdown h4, .content .markdown h5, .content .markdown h6, .content .markdown p, .content .markdown ul, .content .markdown ol, .content .markdown dl, .content .markdown blockquote, .gist-file {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}

/* centered, boxed blog post images */

.content .figure img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    max-width: 100%;
}

.content .markdown code, .content .markdown pre {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
    font-size: 0.9rem;
    background-color: #f7f7f7;
}

.content .markdown code {
    /* enclosed by single backtick (`) */
    padding: 0.15em 0.5em;
    border-radius: 2px;
}

.content .markdown pre {
    /* Hugo specific: consider using the 'highlight' shortcode */
    display: block;
    margin-top: 1rem;
    margin-bottom: 2rem;
    padding: 1rem;
    line-height: 1.5em;
    white-space: pre;
    word-break: break-all;
    word-wrap: break-word;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}

.content .markdown pre code {
    /* enclosed by 4 backticks (````) */
    padding: 0;
    font-size: 0.9rem;
}

.content .markdown blockquote {
    padding: 0.5rem 0.5rem;
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
    color: #7a7a7a;
    border-left: 0.25rem solid #e5e5e5;
}

.content .markdown blockquote p:last-child {
    margin-bottom: 0;
}

.content .markdown figure {
    background: #fff;
}

.content .groupby {
    list-style: none;
    color: #333333;
    font-size: 1.2rem;
    margin-top: 10px;
    margin-bottom: 8px;
}

.content .post-item {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -ms-flex;
    display: flex;
}

.content .post-item .meta {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
    font-size: 0.9rem;
    color: #738491;
    line-height: 2rem;
    display: block;
}

.content .post-item .meta a {
    font-size: 1rem;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.content .post-item .meta a:hover {
    text-decoration: underline;
}

.content .navigation .icon {
    width: 16px;
    height: 16px;
}

/* Partial: Disqus Comments */

.comments {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    max-width: 100%;
}

/* Partial: Footer */

.footer a {
    font-size: 0.9rem;
    margin-left: 6px;
    margin-right: 6px;
    opacity: 0.6;
    transition: opacity 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
    -webkit-transition: opacity 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
    -moz-transition: opacity 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
    -ms-transition: opacity 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
    -o-transition: opacity 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
    text-decoration: none;
}

.footer a:first-child {
    margin-left: 0;
}

.footer a:last-child {
    margin-right: 0;
}

.footer a:hover {
    opacity: 0.8;
}

.footer a .icon {
    width: 16px;
    height: 16px;
}

.footer span.title {
    font-size: 14px;
    color: #666;
}

/* Small devices (landscape phones, less than 768px) */

@media (max-width: 767.98px) {
    html {
        font-size: 0.9rem;
    }
    .content .meta, .content .markdown h1, .content .markdown h2, .content .markdown h3, .content .markdown h4, .content .markdown h5, .content .markdown h6, .content .markdown p, .content .markdown ul, .content .markdown ol, .content .markdown dl, .content .markdown blockquote {
        margin-left: 0;
        margin-right: 0;
    }
}