/* Misc Styles */
html, body {
  margin: 0;
}

.prevnext > a {
  display: none;
}

.sblg-next-has > a,
.sblg-prev-has > a {
  display: inline-block;
}

footer {
  padding: 1rem 0;
}

a {
  color: #63f563;
  text-decoration: none;
}

h1 {
  font-weight: 700;
}

@keyframes cursor-blink {
  0% {
    opacity: 0;
  }
}

body > header > h1::after {
  margin-left: 2px;
  margin-right: 5px;
  content: "";
  width: 10px;
  height: 1em;
  background: #63f563;
  display: inline-block;
  animation: cursor-blink 1.2s steps(2) infinite;
}

body > header > h1 {
  display: flex;
  align-items: end;
  gap: 2px;
}

#search {
  background-color: inherit;
  color: inherit;
  border: 1px solid #ccc;
  border-radius: 5px;
  width: 100%;
  margin: 0 auto;
}

nav[data-sblg-nav] {
  padding: 2rem 0;
}

nav[data-sblg-nav] li + li {
  padding-top: 2rem;
}

h2 {
  font-weight: 700;
  margin-bottom: 0;
  font-size: inherit;
}

h2 + div {
  color: #888;
}

/* Tag Styles */
.tags {
  color: #888;
  margin: 0;
  float: right;
}

.tags .sblg-tag	{
  color: #63f563;
  cursor: pointer;
}

.tags .sblg-tag + .sblg-tag:before {
  content: ', ';
}

/* Header Styles */
header > h1 {
  margin-bottom: 5px;
}

header > h1 > a {
  color: inherit;
  font-size: inherit;
}

/* Body Styles */
body {
  font-family: sans-serif;
  font-size: 11pt;
  color: #ddd;
  background-color: #1e1e1e;
}

p {
  line-height: 1.4em;
}

body > header,
body > footer,
body > nav,
body > section,
body > ul,
#searchSection {
  max-width: 96%;
  margin: 0 auto;
}

body > header {
  color: #eee;
  margin-bottom: 60px;
}

body > ul {
  margin-top: 20px;
}

body > header > p {
  opacity: 0.8;
  color: #ccc;
  margin: 0;
}

.article-info {
  font-size: 8pt;
}

/* Section Styles */
body > section {
  color: #aaa;
}

section > p q {
  display: inline-block;
  margin-bottom: 1em;
}

/* Article Styles */
#article-list {
  list-style-type: none;
  padding: 0;
}

article	{
  color: #c9d1d9;
}

article > p > a > img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 901px) {
  article > p > a > img {
    width: 50%;
  }
}

@media screen and (max-width: 900px) {
  article > p > a > img {
    width: 75%;
  }
}

@media screen and (max-width: 800px) {
  article > p > a > img {
    width: 100%;
  }
}

article > header {
  display: none;
}

article > blockquote {
  border-left: 2px solid #63f563;
  padding-left: 2rem;
  padding-top: 0.1rem;
  padding-bottom: 0.1rem;
  background-color: rgba(110,118,129,0.4);
}

article > p > code {
  background-color: rgba(110,118,129,0.4);
}

article > p > code {
  padding-right: 2px;
  padding-left: 2px;
  border-radius: 5px;
}

article > pre {
  background-color: rgba(110,118,129,0.4);
  word-wrap: break-word;
  box-decoration-break: clone;
  padding: .3rem .9rem .3rem;
  border-radius: .2rem;
}
