/*
 *                        ___
 *                       /\_ \
 *  _____     ___     ___\//\ \      __
 * /\ '__`\  / __`\  / __`\\ \ \   /'__`\
 * \ \ \_\ \/\ \_\ \/\ \_\ \\_\ \_/\  __/
 *  \ \ ,__/\ \____/\ \____//\____\ \____\
 *   \ \ \/  \/___/  \/___/ \/____/\/____/
 *    \ \_\
 *     \/_/
 *
 * Designed, built, and released under MIT license by @mdo. Learn more at
 * https://github.com/poole/poole.
 */


/*
 * Contents
 *
 * Body resets
 * Custom type
 * Messages
 * Container
 * Masthead
 * Posts and pages
 * Reverse layout
 * Themes
 */


/*
 * Body resets
 *
 * Update the foundational and global aspects of the page.
 */

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

html, .style-root {
  font-size: 16px;
  line-height: 1.5;
}
@media (min-width: 38em) {
  html, .style-root {
    font-size: 18px;
  }
}

body {
  --color-background: #ffffff;
  --color-alternate-background: #f9f9f9;
  --color-quote-background: #fffaf0;
  --color-text: #515151;
  --color-link: #268bd2;
  --color-headings: #313131;
  --color-title: #505050;
  --color-byline: #c0c0c0;
  --color-post-title: #303030;
  --color-post-byline: #9a9a9a;
  --color-ruler: #eeeeee;
  --color-table-border: #e5e5e5;
  --color-mce-text: #515151;
  --color-mce-button: #eeeeee;
}

body {
  color: var(--color-text);
  background-color: var(--color-background);
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}

@media screen and (prefers-color-scheme: dark) {
  body {
    --color-background: #343739;
    --color-alternate-background: #444749;
    --color-quote-background: #373f4a;
    --color-text: #cecece;
    --color-link: #6699ee;
    --color-headings: #eeeeee;
    --color-title: #cfcfcf;
    --color-byline: #a0a0a0;
    --color-post-title: #efefef;
    --color-post-byline: #9a9a9a;
    --color-ruler: #555555;
    --color-table-border: #545759;
    --color-mce-text: #efefef;
    --color-mce-button: #555555;
  }
}

/* No `:visited` state is required by default (browsers will use `a`) */
a {
  color: var(--color-link);
  text-decoration: none;
}
a strong {
  color: inherit;
}
/* `:focus` is linked to `:hover` for basic accessibility */
a:hover,
a:focus {
  text-decoration: underline;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  margin-bottom: .5rem;
  font-weight: bold;
  line-height: 1.25;
  color: var(--color-headings);
  text-rendering: optimizeLegibility;
}
h1 {
  font-size: 2rem;
}
h2 {
  margin-top: 1rem;
  font-size: 1.5rem;
}
h3 {
  margin-top: 1.5rem;
  font-size: 1.25rem;
}
h4, h5, h6 {
  margin-top: 1rem;
  font-size: 1rem;
}

/* Body text */
p {
  margin-top: 0;
  margin-bottom: 1rem;
}

strong {
  color: var(--color-post-title);
}


/* Lists */
ul, ol, dl {
  margin-top: 0;
  margin-bottom: 1rem;
}

dt {
  font-weight: bold;
}
dd {
  margin-bottom: .5rem;
}

/* Code */
code,
pre {
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
}
code {
  padding: .25em;
  font-size: 0.8em;
  background-color: var(--color-ruler);
  border-radius: 3px;
}
pre {
  display: block;
  margin-top: 0;
  margin-bottom: 1rem;
  padding: 1rem;
  font-size: .8rem;
  line-height: 1.4;
  white-space: pre;
  white-space: pre-wrap;
  word-break: break-all;
  word-wrap: break-word;
  background-color: var(--color-alternate-background);
}
pre code {
  padding: 0;
  font-size: 100%;
  color: inherit;
  background-color: transparent;
}

/* Pygments via Jekyll */
.highlight {
  margin-bottom: 1rem;
  border-radius: 4px;
}
.highlight pre {
  margin-bottom: 0;
}

/* Gist via GitHub Pages */
.gist .gist-file {
  font-family: Menlo, Monaco, "Courier New", monospace !important;
}
.gist .markdown-body {
  padding: 15px;
}
.gist pre {
  padding: 0;
  background-color: transparent;
}
.gist .gist-file .gist-data {
  font-size: .8rem !important;
  line-height: 1.4;
}
.gist code {
  padding: 0;
  color: inherit;
  background-color: transparent;
  border-radius: 0;
}

/* Quotes */
blockquote {
  font-size: 90%;
  padding: .5rem 1rem;
  margin: .8rem 0;
  background: var(--color-quote-background);
}
blockquote p:last-child {
  margin-bottom: 0;
}
@media (min-width: 30em) {
  blockquote {
    padding-right: 1.25rem;
    padding-left: 1.25rem;
  }
}

img {
  display: block;
  max-width: 100%;
  margin: 0 0 1rem;
  border-radius: 5px;
}

/* Tables */
table {
  font-size: 0.8rem;
  margin-bottom: 1rem;
  width: 100%;
  border: 1px solid var(--color-table-border);
  border-collapse: collapse;
}
td,
th {
  padding: .25rem .5rem;
  border: 1px solid var(--color-table-border);
}
tbody tr:nth-child(odd) td,
tbody tr:nth-child(odd) th {
  background-color: var(--color-alternate-background);
}


@media (max-width: 60em)  {
  table {
    display: block;
    max-width: fit-content;
    overflow-x: auto;
    white-space: nowrap;
    margin-left: auto;
    margin-right: auto;
  }
}

/*
 * Custom type
 *
 * Extend paragraphs with `.lead` for larger introductory text.
 */

.lead {
  font-size: 1.25rem;
  font-weight: 300;
}


/*
 * Container
 *
 * Center the page content.
 */

.container {
  max-width: 38rem;
  padding-left:  1rem;
  padding-right: 1rem;
  margin-left:  auto;
  margin-right: auto;
}

/* index table */

.index {
  font-size: 1rem;
  border: none;
}

.index td {
  border: none;
}

.index-date {
  color: var(--color-post-byline);
  min-width: 8rem;
}

/* subscription and share */
.sub-share {
  padding-top: 0.5rem;
  padding-bottom: 0.25rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}

.sub-share-subscription {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

.sub-share-social {
  display: flex;
  flex-direction: row;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

.sub-share-social div {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  margin-top: 0;
  margin-bottom: 0;
}

.sub-share-social img {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  margin-top: 0;
  margin-bottom: 0;
  height: 1.5em;
  width: 1.5em;
}

.sub-share-social svg {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  margin-top: 0;
  margin-bottom: 0;
  height: 1.5em;
  width: 1.5em;
  color: var(--color-headings);
}

/* Input elements (for newsletter) */
.mc-field-group {
  display: flex;
  flex-flow: row nowrap;
}

.mce-email {
  color: var(--color-mce-text);
  background-color: var(--color-background);
  font-size: 1rem;
  line-height: 1rem;
  margin-right: 0;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  border-color: var(--color-mce-text);
  border-style: solid;
  border-radius: 0.25em 0em 0em 0.25em;
  width: 12rem;
  height: 1.5em;
}

.mce-email:focus {
  outline: none;
}

.mce-button {
  color: var(--color-ruler);
  background-color: var(--color-mce-text);
  border-color: var(--color-mce-text);
  border-style: solid;
  border-radius: 0 0.25em 0.25em 0;
  cursor: pointer;
  font-size: 1rem;
  margin-left: 0;
  line-height: 1rem;
  height: 1.5em;
  -webkit-appearance: button;
}

@media (max-width: 607px) {
  .sub-share {
    justify-content: space-around;
  }
}