/* * {
 margin: 0;
 padding: 0;
}*/

html {
 font-family:"sans-serif";
}

body {
 background-color:var(--background-color);
 margin:0;
 padding: 0;
 font-size:1em;
}

#navbar {
 background-color:var(--navbar-color);
 margin:0;
 color:var(--text-color);
 display:block;
 overflow:hidden;
}

#navbar ul {
 margin:0;
 padding:0;
 list-style:none;
}

#navbar > ul > li {
 border-bottom: 2px solid var(--navbar-color);
 display:inline-block;
 list-style-type:none;
 cursor:pointer;
 padding-right:100px;
}

#navbar > ul > #cur-navpage {
 border-bottom-color:var(--navbar-highlight-color);
}

@media (hover: hover) {
 #navbar > ul > li {
  padding-right:0;
 }
}

#navbar > ul > li > a {
 color: var(--text-color);
 display: block;
 line-height:2em;
 padding:0.5em 0.5em;
 text-decoration:none;
}

#navbar ul li a {
 color: var(--text-color);
 font-weight:bold;
 cursor:pointer;
}


#navbar li > ul {
 display:none;
 margin-top:1px;
 background-color:var(--navbar-foldout-background-color);
}

#navbar li > ul li {
 display:block;
}

#navbar li > ul li a {
 display: block;
 line-height: 2em;
 padding: 0.5em 2em;
 text-decoration:none;
}

#navbar li:hover,
#navbar li:focus {
 background-color:var(--navbar-highlight-color);
}

#navbar li:hover > ul,
#navbar li:focus > ul {
 position:absolute;
 display:block;
}

h1 {
 max-width: 30ch;
 margin-left: auto;
 margin-right: auto;
 text-align:center;
 color:var(--text-color);
 font-size:3em;
}

h2 {
 max-width: 40ch;
 margin-left: auto;
 margin-right: auto;
 /*text-align:center;*/
 color:var(--text-color);
 font-size:2em;
}

h3 {
 max-width: 50ch;
 margin-left: auto;
 margin-right: auto;
 /*text-align:center;*/
 color:var(--text-color);
 font-size:1.5em;
}

h4 {
 max-width: 50ch;
 /*margin-left: auto;*/
 margin-right: auto;
 /*text-align:center;*/
 color:var(--text-color);
 font-size:1.3em;
}

#content {
  max-width: 80ch;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2ch;
  padding-right: 2ch;
}

p {
 text-align: justify;
 color:var(--text-color);
}

.codehilite pre {
 background: var(--color-synBG);
 color: var(--color-synFG);
 padding-left: 4ch;
 max-width: 80ch;
 margin-left: auto;
 margin-right: auto;
 white-space: pre-wrap;
 word-wrap: break-word; 
/** counter-reset: line;

}

span:before {
 counter-increment: line;
 content: counter(line);**/
}

time {
 max-width: 80ch;
 margin-left:auto;
 margin-right:auto;
 text-align:left;
}

a, time {
 font-weight: bold;
 color: var(--text-link-color);
 text-decoration: none;
 transition: color 0.1s ease-out;
}

a:visited {
 color: var(--text-link-visited-color);
 transition: color 0.1s ease-out;
}

a:hover {
 color: var(--text-link-hover-color);
 transition: color 0.1s ease-in;
}

#impressum {
 margin-left:auto;
 margin-right:auto;
 text-align: center;
 display:block;
 height: 1.5em;
 padding-top:2em;
 clear: both;
}

ul {
 list-style: square;
}

li {
 color: var(--text-color);
}

.codehilite > pre > .lineno {
 position:absolute;
 float:left;
 min-width: 4ch;
 margin-left: -4ch;
}