/* General Style */
html, button, input, select, textarea {
  color: #222;
}
body {
  display: flex;
  padding: 0;
  margin: 0;
  flex: 1;
  flex-direction: column;
  color: #222;
  background-color: white;
  line-height: 1.4;
  font-size: 1.3em;
  font-family: 'EB Garamond 12';
  -moz-font-feature-settings: "liga", "calt", "xtex";
  -webkit-font-feature-settings: "liga", "calt", "xtex";
  -ms-font-feature-settings: "liga", "xtex";
  -o-font-feature-settings: "liga", "xtex";
  font-feature-settings: "liga", "xtex";
}
code, pre, .code.literal-block {
  font-family: 'Nanum Gothic Coding';
}
.code.literal-block, pre {
  font-size: 0.9em;
}
code {
  font-size: 0.87em;
  padding: 0px 3px;
}
pre {
  padding: 16px;
  border-radius 6px;
  border-radius: 3px;
}
article p:first-child::first-letter, .initial::first-letter, .header-image + p::first-letter, pre.code + p::first-letter {
  font-size: 5.15em;
  font-family: 'Kanzlei';
  padding-right: 3px;
  float: left;
  color: #990000;
  text-indent: 0;
  line-height: .8em;
}
article p.noinitial:first-child::first-letter, p.noinitial::first-letter,
article p.more:first-child::first-letter, p.more::first-letter {
  font-size: inherit !important;
  font-family: inherit !important;
  padding-right: inherit !important;
  float: inherit !important;
  color: inherit !important;
  text-indent: inherit !important;

}
p.more {
  text-align: right;
}
h1 a, h2 a {
  font-weight: normal;
}
h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-weight: normal;
  color: #007171;
  margin-top: 20px;
  margin-bottom: 0;
}
h1, .entry-title {
  font-size: 48px;
}
h2 {
  font-size: 36px;
}
h3 {
  font-size: 24px;
}
a {
  font-weight: bold;
}
a:link {
  color: #007171;
  text-decoration: none;
}
a:hover {
  color: #1a4c3b;
}
a:visited {
  color: #007171;
}
::selection {
  background: #b3d4fc;
  text-shadow: none;
}
hr {
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}
img {
  vertical-align: middle;
}
a#chaossocial {
  display: none
}
header#global-header {
  display: flex;
  flex-direction: column;
  background-color: white;
  margin: 0;
  padding: 0;
  position: sticky;
  top: 0px;
  z-index: 9000;
  box-shadow: 0 1px 5px rgba(0,0,0,0.12),0 1px 3px rgba(0,0,0,0.24);
  font-weight: normal;
}
header a {
  font-weight: normal;
}
.postindex, main > article {
  margin-left: auto;
  margin-right: auto;
  padding: 24px;
  max-width: 800px;
  overflow-wrap: break-word;
  background: white;
  /* box-shadow: 0 1px 5px rgba(0,0,0,0.12),0 1px 3px rgba(0,0,0,0.24); */
  border-left: solid 1px #990000;
  border-right: solid 1px #990000;
  z-index: 10;
  position: relative;
}
main article h4 {
  color: #990000;
  left: 870px;
  position: absolute;
  font-size: 1em;
  font-family: 'EB Garamond SC 8';
  width: 120px;
  word-break: break-word;
  hyphens: auto;
}
#nav-links {
  display: flex;
  list-style: none;
  padding: 0;
  justify-content: space-around;
  font-size: 22px;
  font-variant: bold;
  width: 40%;
  margin: auto;
  font-family: 'EB Garamond SC 8';
}
#nav-links li {
  margin: 8px 12px 4px 12px;
  transition: all 0.15s;
  line-height: 1.8em;
}
#nav-links a {
  color: #222;
  text-decoration: none;
}
#nav-links li:hover {
  background-color: rgba(255,255,255,0.5);
}
#nav-links li:hover a {
}
#logo-left {
  float: left;
  position: absolute;
  margin: 8px 16px;
  left: 0;
}
#logo-left img {
  max-height: 36px;
}
#sidenav {
  float: right;
  display: flex;
  position: absolute;
  right: 0;
  margin: 12px;
  align-items: baseline;
  font-family: 'EB Garamond SC 8';
}
#sidenav a, #sidenav {
  color: #999;
}
#sidenav #toptranslations ul li {
  margin-right: 0
}
#sidenav > * {
  margin: 0 8px;
}
#alternate-language {
  float: right;
  margin-top: 16px;
}
.header-image {
  display: flex;
  margin-left: auto;
  margin-right: auto;
  flex-direction: column;
  align-items: center;
}
#post-list {
  list-style: none;
  padding: 0;
}
.entry-header {
  font-variant: bold;
}
.entry-header a {
  color: #272822;
  text-decoration: none;
}
.entry-header h2, .entry-header h1 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: baseline;
}
.entry-header a:hover {
  color: #009090;
  text-decoration: none;
}
.entry-header time {
  color: #8e927e;
  font-size: 1rem;
  font-weight: 200;
}
.post-content img {
  display: block;
  margin: 0 auto;
  max-width: 80%;
}
blockquote {
  border-left: 4px solid #ccc;
  margin: 0;
  padding: 0.5em 1em;
  border-bottom-right-radius: 0.5em;
  border-top-right-radius: 0.5em;
  background-color: #f9f9f9;
  box-shadow: 0 1px 5px rgba(0,0,0,0.12);
}
.post-content pre {
  font-size: 13px;
  background-color: #e6e6e6;
  padding: 10px;
  margin: 10px;
  overflow: auto;
  font-family: "Ubuntu Mono", "Inconsolata", monospace;
}
.post-meta a {
  font-style: italic;
  color: #009090;
}
.paginator {
  text-align: center;
  padding: 12px;
  font-size: 1.6em;
}
.paginator a {
  text-decoration: none;
}
.paginator i.arrow {
  font-weight: 900;
  padding-left: 0.5em;
  padding-right: 0.5em;
  color: #ccc;
}
.paginator a i.arrow {
  color: #222;
}
.paginator a:hover {
  color: #009090;
}
.post-video {
  margin-left: auto;
  margin-right: auto;
  width: 0;
}
.post-video iframe {
  box-shadow: 0 8px 6px -6px black;
  margin-left: -280px;
}

.header-image img, .header-image video {
  box-shadow: 0 2px 5px 0 rgba(0,0,0,.25) inset;
  border:solid 2px white;
  border-bottom-color:#ffe;
  border-left-color:#eed;
  border-right-color:#eed;
  border-top-color:#ccb;
  max-height: 550px;
  max-width:100%;
}

.header-image.bordered {
  background-color:white;
  border:solid 5vmin #eee;
  border-bottom-color:#fff;
  border-left-color:#eee;
  border-radius:2px;
  border-right-color:#eee;
  border-top-color:#ddd;
  box-shadow:0 0 5px 0 rgba(0,0,0,.25) inset, 0 5px 10px 5px rgba(0,0,0,.25);
  display:block;
  margin-left: auto;
  margin-right: auto;
  height:auto;
  padding:4vmin;
  position:relative;
  text-align:center;
}
.header-image.small {
  width: 50%;
  height: 50%;
}
.header-image.bordered:before {
  border-radius:2px;
  bottom:-2vmin;
  box-shadow:0 2px 5px 0 rgba(0,0,0,.25) inset;
  content:"";
  left:-2vmin;
  position:absolute;
  right:-2vmin;
  top:-2vmin;
}
.header-image.bordered:after {
  border-radius:2px;
  bottom:-2.5vmin;
  box-shadow: 0 2px 5px 0 rgba(0,0,0,.25);
  content:"";
  left:-2.5vmin;
  position:absolute;
  right:-2.5vmin;
  top:-2.5vmin;
}
.post-image-caption, .caption {
  margin-top: 4px;
  text-align: center;
  font-style: italic;
  position: relative;
  z-index: 100;
}

@media screen and (max-width: 800px) {
  #nav-links {
    font-size: 1em;
    padding: 0;
    justify-content: space-between;
    width: 100%;
  }
  #nav-links li, #menu ul li {
    padding: 0;
    line-height: inherit;
    margin: 8px 4px;
  }
  #nav-links li:nth-child(4), #nav-links li:nth-child(5) {
    display: none;
  }
  #sidenav {
    display: none;
  }
  .post-entry {
    padding: 0 12px;
  }
  .toc {
    position: relative !important;
    max-width: 100% !important;
    top: unset !important;
    left: unset !important;
  }
  #featured-posts .feature-block {
    width: 100% !important;
  }
  main article h4 {
    position: relative;
    left: unset;
    width: auto;
  }
  main article h3 + h4 {
    display: none;
  }
}
.toc {
  position: fixed;
  top: 120px;
  left: 20px;
  line-height: 2;
  max-width: calc((100vw - 800px)/2 - 60px);
}
.toc > ul {
  list-style: decimal
}
.toc > ul ul {
  list-style: lower-latin;
}
.toc > ul ul ul {
  list-style: lower-greek;
}
.center {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
span.spoiler, span.spoilers {
  color: transparent;
  text-shadow: 0 0 5px rgba(0,0,0,1.5);
  filter: blur(5px);
}
span.spoiler:hover, span.spoilers:hover {
  background-color: inherit;
  color: inherit;
  text-shadow: inherit;
  filter: none;
}
#post-container {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
}
#post-container > ul {
  margin: 8px;
  padding: 8px;
  border: 2px solid #bbb;
  border-left: 9px solid #bbb;
  min-width: 280px;
  background-color: #Fff;
  line-height: 2;
}
#post-container > ul li {
  list-style: none;
}
#post-container > ul > li {
  font-size: 18px;
  font-weight: bold;
  color: #222;
}
#post-container > ul > li > ul {
  display: flex;
  flex-direction: column;
  padding: 0;
}
#post-container > ul > li > ul > li {
  margin: 8px;
  display: flex;
}
#post-container > ul > li > ul > li a {
  border: 2px solid #4696ff;
  padding: 8px;
  font-weight: 500;
  color: #333;
  text-decoration: none;
  flex-grow: 1
}
#post-container > ul > li > ul > li a:hover {
  border-color: #0069cb;
  background-color: #50a1ff;
  color: white;
}
.project-list {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  padding: 0;
  margin: 0;
}
.project-list a {
  flex: 1 0 auto;
  align-self: stretch;
  background: white;
  border: 2px solid #00a7a7;
  padding: 15px 5px;
  text-decoration: none;
  width: 300px;
  margin: 8px;
  box-shadow: 0 1px 5px rgba(0,0,0,0.12),0 1px 3px rgba(0,0,0,0.24);
}
.project-list a:hover {
  box-shadow: 0 1px 7px rgba(0,0,0,0.24),0 1px 5px rgba(0,0,0,0.36);
}
main article .project h4 {
  margin: 18px;
  position: relative;
  left: 0;

}
.project .project-description {
  color: black;
  margin: 18px;
  font-weight: normal;
}
table td + td, table th + th {
  padding-left: 24px;
}
table {
  margin-left: auto;
  margin-right: auto;
}
table th {
  border-bottom: 1px solid black;
}
#featured-posts {
  display: flex;
  flex-wrap: wrap
}
#featured-posts .feature-block {
  width: calc(50% - 16px);
  margin: 8px;
}
#featured-posts h3.initial {
  font-size: 46px;
  color: #990000
}
#featured-posts h3.initial::first-letter {
  font-size: 2.15em;
  font-family: 'Kanzlei';
  padding-right: 0px;
  margin-top: -30px;
  margin-right: -1px;
}
#featured-posts .feature-block ul {
  margin-top: 0;
}
.page-break {
  display: none;
}
@media print {
  body > header,
  #content header #alternate-language, #content header .metadata {
    display: none !important;
  }
  .header-image img {
      box-shadow: none !important;
      border: none !important;
  }
  .page-break {
      display: block;
  }
  .mb-1 {
    margin-bottom: 20px !important;
  }
  body {
   background: white;
   font-size: 12pt !important;
  }
  a:link, a:visited {
   color: #520;
   background: transparent;
   font-weight: normal;
   text-decoration: none;
  }
  p a:after {
	content: " (" attr(href) ") ";
    font-size: 90%;
  }
  p a[href^="/"]:after {
    content: " (https://rixx.de" attr(href) ") ";
    font-size: 90%;
  }
  article {
    border-left: none !important;
    border-right: none !important;
    font-size: 12pt !important;
  }
  article h1 {
    font-size: 16pt;
    text-align: center;
  }
  article p {
    orphans: 3;
    widows: 3;
  }
  .hide-print {
    display: none;
  }
  .header-image.resize-80 {
    width: 80%;
    height: 80%;
  }
  .header-image.resize-60 {
    width: 65%;
    height: 65%;
  }
  .header-image.resize-40 {
    width: 40%;
    height: 40%;
  }
}
