*, *::before, *::after{
	box-sizing: border-box;
}

:root {
   --halec-red: #E64A19; 
   --halec-lightred: #FF6A39;
  /*
  --halec-red: #00FF00; 
  --halec-lightred: #00FFFF;
  */
}

[aria-hidden='true'] {
  display: none;
}

.color-picker-container {
  display: flex;
  align-items: center;
  gap: 10px; /* Abstand zwischen Label und Farbwahlfeld */
  margin: 10px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background-color: #f9f9f9;
  font-family: Arial, sans-serif;
  font-size: 1rem;
  max-width: 300px; /* Begrenzung der Breite für kompakte Darstellung */
}

.color-picker-container label {
  color: #333;
  white-space: nowrap; /* Verhindert Zeilenumbruch */
}

.color-picker-container input[type="color"] {
  width: 40px;
  height: 40px;
  border: none;
  cursor: pointer;
  padding: 0;
}

.flagselect, .flagnoselect, .siteLogo {
  display: inline-block;
  padding: 3px;
  margin: 2px;
  margin-left: 5px;
  margin-right: 5px;
  font-weight: bold;
  color: black;
  line-height: 1;
}
.siteLogo {
  margin: 5px;
  margin-left: 1px;
}
.flagselect {
  border: 1px solid #333333;
  margin-left: 1px;
}
.flagselect img {
  vertical-align: middle;
  margin-left: 5px;
}
.flagnoselect {
  border: 1px solid #fff;
  color: #333333;
  margin-left: 1px;
}
.flagnoselect img {
  vertical-align: middle;
  margin-left: 5px;
}
.siteLogo img {
  vertical-align: middle;
  margin-left: 0px;
}

.languageSelect {
  display: flex;
  flex-direction: column;
  font-size: 15px;
  line-height: 22px;
  /* white-space: nowrap; */
}

@media screen and (min-width: 700px) {
  .languageSelect {
    flex-direction: row;
  }  
}

.post-navigation {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
  font-size: 0.9rem;
}
.post-navigation:has(.nav-next):not(:has(.nav-previous)) {
  justify-content: flex-end;
}

.headerbox {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-around;
  /* margin-bottom: 10px; */
}
a.siteLogo, div.searchbox {
  display: inline-block;
  vertical-align: middle;
}
div.searchbox {
  margin: 5px;
  margin-left: 0px;
  margin-top: 0px;
}
.searchbox form {
  display: inline-block;
  align: bottom;
  line-height: 12px;
  margin-left: 5px;
}
.searchbox form span {
  display: inline;
  font-size: 11px;
}
.searchbox form input {
  margin: 3px;
  margin-left: 0px;
  margin-right: 3px;
  width: 75px;
}
.searchbox form button {
  display: none;
  margin: 3px;
  margin-left: 0px;
  margin-right: 6px;
}

/* Search-Button nur anzeigen, wenn das Eingabefeld nicht leer ist */
.searchbox form input:not(:placeholder-shown) + button {
  display: inline;
}
.searchbox form span {
  display: none;
}
.searchbox:focus-within form span {
  display: inline;
}
.searchbox:focus-within form input {
  display: inline;
  width: 200px;
}

figure {
  display: auto;
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
}

.floatLeft {
   float: left;  
   margin: 50px;
   margin-left: 5px;
}

html {
    margin: 0;
    padding: 0;
    /* padding-bottom: 120px; */  /* Footer darf keinen Inhalt unzugänglich machen */
    background-color: lightgray; /* Hintergrundfarbe für den gesamten Hintergrund */
}

body {
  /* padding: 1rem 0.5rem; */

/*  font-size:22px;
  line-height: 32px;*/
  font-size:17px;
  line-height: 22px;
  max-width: 60rem;
  margin: 0 auto;

  background: white;
  /* background: #00f100; */
  color: #333333;

  word-wrap:break-word !important;
  /* font-family: 'Open Sans', sans-serif;  */
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  
  /* overflow-x: hidden; */
}
body.blog {
  background: #f1f1f1;  
}

.menu {
  font-size: 15px;
  line-height: 18px;
}

table, th, td {
  border: none;
  border-collapse: collapse;
  padding: 0.2em;
  padding-left: 0.4em;
  padding-right: 0.4em;
}
table.scale_of_discount tr:nth-child(odd) {
  background-color: #eee;
}
table th {
  background-color: #fff;
}
table td {
  border: 1px solid #ccc;
  border-right: 1px solid black;
  border-left: 1px solid black;
}
table th {
  border: 1px solid black;
  border-bottom: 3px solid black;
  border-top: none;
}
table tr th:first-child {
  border-left: none;
}
table tr th:last-child {
  border-right: none;
}
table tr:last-child td {
  border-bottom: none;
}
table tr td:first-child {
  border-left: none;
}
table tr td:last-child {
  border-right: none;
}
/* Ein Table-Container, damit nur die Tabelle horizontal scrollt, und nicht die gesamte Seite. */

/*
.table-container {
    max-width: 100%; 
    overflow-x: auto;
    transform: rotateX(180deg);
}
.mytab {
  transform: rotateX(180deg);
}
*/
table {
    display: block; /* Tabellenverhalten ändern, um Scrollbalken anzuzeigen */
    overflow-x: auto; /* Horizontalen Scrollbalken anzeigen, wenn nötig */
    width: 100%; /* Die Tabelle füllt den verfügbaren Platz aus */
    
    max-width: 100%;
    table-layout: auto;
}

table img {
  height: auto;
  max-width: 90%;
  width: auto;
}

.gallery-overlay {
  position: fixed;
  left: 0px;
  top: 0px;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  display: none;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5); /* Dunkler Hintergrund */
  z-index: 4;
}
.gallery-overlay:target {
  display: flex;
}

.gallery-pop-up {
  position: relative;
  background-color: #fff; /* Hintergrundfarbe des Pop-ups */
  box-shadow: 0 0 20px rgba(0, 0, 0, 2.3); /* Schatten */
  overflow: hidden; /* Überlauf verstecken */
  z-index: 5;
  max-width: calc(100% - 40px);
  max-height: calc(100vh - 40px);
}

.gallery-image-container {
  justify-content: center;
}

.gallery-image-container img {
  display: block;  /* Sonst gibt's wg. display:inline-block +5px in der Höhe wegen line-height!!! */
  max-width: 100%;
  max-height: calc(100vh - 40px);
  padding: 20px;
  user-select: none;
}

.gallery-prev-btn,
.gallery-next-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  font-size: 24px;
  z-index: 6;
  user-select: none;
}
.gallery-close-btn {
  position: absolute;
  top: 1px;
  right: 5px;
  cursor: pointer;
  font-size: 20px;
  user-select: none;
}
.gallery-prev-btn {
  left: 2px;
}
.gallery-next-btn {
  right: 2px;
}

.imageselect-container {
  width: 100%;
  aspect-ratio: 1;
  justify-content: center;
  align-items: center;

  display: none;  

  margin: 5px 0px;  
  user-select: none;
}
.imageselect-container img {
  max-height: 100%;
  max-width: 100%;
  user-select: none;
  cursor: zoom-in;
}
.imageselect-radio.no-0:checked ~ .imageselect-container.no-0 {
  display: inline-flex;
}
.imageselect-radio.no-1:checked ~ .imageselect-container.no-1 {
  display: inline-flex;
}
.imageselect-radio.no-2:checked ~ .imageselect-container.no-2 {
  display: inline-flex;
}
.imageselect-radio.no-3:checked ~ .imageselect-container.no-3 {
  display: inline-flex;
}
.imageselect-radio.no-4:checked ~ .imageselect-container.no-4 {
  display: inline-flex;
}
.imageselect-radio.no-5:checked ~ .imageselect-container.no-5 {
  display: inline-flex;
}
.imageselect-radio.no-6:checked ~ .imageselect-container.no-6 {
  display: inline-flex;
}

.imageselect-thumb {
  width: 50px;
  height: 50px;
  display: flex;
  
  justify-content: center;
  align-items: center;    

  padding: 5px;
  cursor: pointer;
}
.imageselect-thumb img {
  max-width: 100%;
  max-height: 100%;
}

.imageselect-radio.no-0:checked ~ .imageselect-thumb.no-0 {
  border: 1px solid black;
}
.imageselect-radio.no-1:checked ~ .imageselect-thumb.no-1 {
  border: 1px solid black;
}
.imageselect-radio.no-2:checked ~ .imageselect-thumb.no-2 {
  border: 1px solid black;
}
.imageselect-radio.no-3:checked ~ .imageselect-thumb.no-3 {
  border: 1px solid black;
}
.imageselect-radio.no-4:checked ~ .imageselect-thumb.no-4 {
  border: 1px solid black;
}
.imageselect-radio.no-5:checked ~ .imageselect-thumb.no-5 {
  border: 1px solid black;
}
.imageselect-radio.no-6:checked ~ .imageselect-thumb.no-6 {
  border: 1px solid black;
}

/* Kann aus Pandoc-Dateien genutzt werden, um Text zu zentrieren. */
div.centered {
	text-align: center;
}

/* Datum vor einem Blog-Eintrag */
h2.subtitle.is-6 {
	margin-top: 5px;
	font-size: 20px;
	line-height: 5px;
	text-align: right;
}
h2.subtitle.is-6 + h1 {
	margin-top: 10px;
}

h1 {
  margin-top: 40px;
  line-height: 60px;
  text-align:center;
  font-size:50px;
/*  font-family: 'Bree Serif', 'serif'; */
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  color: #222;
}	

h2 {
	font-size: 30px;
  line-height: 35px;
}

h3 {
	font-size: 30px;
  line-height: 35px;
	text-align: center;
	color: #222;
}

h4 {
  margin-top: 10px;
  margin-bottom: 10px;
}
ul {
  margin-top: 10px;
  margin-bottom: 10px;
}

h1 a {
  margin-top: 40px;
/*	color: darkgreen; */
  color: #e64a19;
}

a {
	color: #229;
}

IntroText {
	font-size: 1.8rem;
	font-style: italic;
}

.MethodWrapper li {
	padding: 0.4rem 0;
}

.MethodWrapper li:after {
	content: "?";
	display: block;
	text-align: center;
	margin: 1rem 0 0.5rem 0;
	color: #eee;
}

.breadcrumb {
  display: inline-block;
  border: 1px solid #fff;
  padding: 10px;
  margin: 5px;
  margin-left: 0px;
  margin-right: 10px;
  color: #333333;
}

.breadcrumb ul {list-style-type: none; display:inline; margin-left: 0; padding-left: 0px;}
.breadcrumb ul li {display: inline; color:black; font-size: 0.8em; margin-left: 0px; padding-left: 0px;}

.breadcrumb li::before {
    content: "→";
}
.breadcrumb li:first-child::before {
    content: "";
}

.paginationMenu { text-align: center; }

ul.pagination {list-style-type: none; display:inline; margin: auto; width: auto; }
ul.pagination li {display: inline; color:black; font-size: 0.8em; margin-left: 0px; padding-left: 0px;}

/*
.breadcrumb-item { font-size:  1rem; }
.breadcrumb-item :before { color:  #000; content:  '>> '; }
*/

/* Das article tag wird nur in list-pages genutzt */
article { margin: 10px; background-color: white; 
  border: solid 2px black;
  padding:  20px;
  background-color: white;
  box-shadow: 5px 5px 5px  rgba(0,0,0,0.6);
  -moz-box-shadow: 5px 5px 5px  rgba(0,0,0,0.6);
  -webkit-box-shadow: 5px 5px 5px  rgba(0,0,0,0.6);
  -o-box-shadow: 5px 5px 5px  rgba(0,0,0,0.6);
  border-radius:10px;
}

.menu {
  font-family: sans-serif;
}

/* Elemente aus der alten HALEC-Seite */
.flag {width:12px;height: 12px;border:1px solid black;float:left;margin:6px 8px 0 0;}
.flag.red{background-color:#f00;}
.flag.orange{background-color:#ffb200;}
.flag.yellow{background-color:#ffff00;}
.flag.green{background-color:#00ab1f;}

.float-left50 {
  float: left;
  width: 50%;
  padding: 5px;
}
.float-left25 {
  float: left;
  display: inline-block;
  white-space: nowrap;
  padding: 5px;
  font-size: 200%;
  font-weight: bold;
}
.div25 {
  white-space: nowrap;
  display: inline-block;
}
.div25::after {
    content: "";
    display: block;
    clear: both; 
}
.rectangular-container {
    display: inline-block;
    background-color: lightgreen;
    margin-bottom: 10px; /* Abstand zwischen den rechteckigen Elementen */
}

.flex-wrap-container {
  display: flex;
  flex-wrap: wrap;
}
.flex-item-50 {
  flex: auto;
  min-width: 300px;
  max-width: 30vw;
}
.flex-item-subcontainer {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start; /* Sub-Elemente werden oben ausgerichtet */
}
.flex-item {
  /* border: 1px solid lightgray; */
}
.flex-item-nowrap {
  flex: 0 0 auto;
  white-space: nowrap;
  /* border: 1px solid lightgray; */
}

.flex-row {
  display: flex;
  flex-direction: flex-row;
  flex-wrap: wrap;
  flex-grow: 1;
}
.flex-row-centered {
  display: flex;
  flex-direction: flex-row;
  flex-wrap: wrap;
  flex-grow: 1;

  align-items: center;
  justify-content: center;
}
.flex-row-centered-spaced {
  display: flex;
  flex-direction: flex-row;
  flex-wrap: wrap;
  flex-grow: 1;

  align-items: center;
  justify-content: space-evenly;
}

.max-width-set {
  max-width: 100%;
}
.margin-left-20 {
  margin-left: 20px;
}

.flex-column {
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  /* width: 200px; */
  /* min-width:200px; */
  /* flex: 1; */
  /* border: 1px solid lightgray; */
}

.flex-column.flex-right {
  flex: 1;
  flex-grow: 1;
}

.box {
  display:flex;
  flex-shrink:1;
/*  border: 1px solid green; */
/*  height:100px;
  width:200px;
  min-width:100px; */
}

.inner-float {
    float: left; /* Innerer Float innerhalb des rechteckigen Elements */
    margin-right: 10px; /* Abstand zwischen den inneren Floats */
}

@media screen and (max-width: 800px){
  body {
    font-size:14px;
    line-height: 19px;  
  }
  .menu {
    font-size: 15px;
    line-height: 18px;
  }
  h2.subtitle.is-6 {
    margin-top: 4px;
    font-size: 16px;
    line-height: 4px;
  }
  h2.subtitle.is-6 + h1 {
    margin-top: 8px;
  }

  h1 {
    margin-top: 60px;
    line-height: 40px;
    text-align:center;
    font-size:35px;
  }	

  h2 {
    font-size: 20px;
    line-height: 20px;
  }

  h3 {
    font-size: 18px;
    line-height: 18px;
    text-align: center;
    color: #222;
  }
.floatLeft {
   float: left;  
   margin: 20px;
   margin-left: 5px;
}
}

@media screen and (min-width: 600px) {
	body {
		border-left: 4px solid #f9f9f9;
		border-right: 4px solid #f9f9f9;
		padding: 1rem 2rem;
    padding-bottom: 9rem; /* Inhalt darf nicht von Footer-Menü unzugänglich gemacht werden */
    
	}
  /* Menü */
  .horizontal, .vertical {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    border: 0px; 
    align-items: center;
    user-select: none;
  }
  
  
  .horizontal {
    display: flex;
    flex-wrap: wrap;
    background-color: var(--halec-red);
  }
  .menu.footer > .horizontal {
    justify-content: center;
  }
  
  .horizontal > .leaf, 
  .horizontal > .node { 
    display: inline-block;    
  }
  
  .vertical > .leaf, 
  .vertical > .node {
    display: flow-root;
  }
  
  .main > .horizontal > .leaf,
  .main > .horizontal > .node {
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    margin-left: -1px;
    margin-right: -1px;
  }
  
  .leaf, .node {
    color: white;
    margin: -0px;
    padding: 7px;
    
    white-space: nowrap;
    background-color: var(--halec-red);
  }
  
  .node {
    position: relative;
    cursor: pointer;
  }
  .node:hover {
    background-color: var(--halec-lightred);
  }
  .leaf {
    cursor: default;
    padding: 0px;
  }
  .leaf:hover {
    background-color: var(--halec-lightred);
  }
  .leaf a {
    display: block;
    padding: 7px; 
    text-decoration: none; /* Entfernt die Unterstreichung des Links */    
  }
  
  .node:focus-within {
  }
  .menu.switch_off {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    padding: 7px;
    margin: 0px;
    user-select: none;
  }
  .menu.switch_off {
    opacity: 0;
    pointer-events: none;
  }
  .node:focus-within > .menu.switch_off {
    opacity: 1;
    pointer-events: auto;
    background-color: var(--halec-lightred);
  }
  .node:focus-within > .menu.switch_off:focus {
    opacity: 0;
    pointer-events: none;
  }
  .sowl {
    color: var(--halec-lightred);
    white-space: nowrap;
  }  
  .node > .vertical.below.downwards {
    position: absolute;
    /* background-color: green;                  */
    top: calc(100% + 0px);
    left: calc(0% + 0px);
    display: none;
    border: 1px solid #fff;
  }
  .node > .vertical.rightof.downwards {
    position: absolute;
    /* background-color: green;                   */
    top: calc(0% + 0px);
    left: calc(100% + 0px);
    display: none;
    border: 1px solid #fff;
  }
  .node > .vertical.menu_footer {
    position: absolute;
    background-color: green;                  
    top: auto;
    bottom: 100%;
    left: calc(0% + 0px);
    display: none;
  }
  .node:focus-within > .vertical.below,
  .node:focus-within > .vertical.rightof  {
    display: block;
    /* background-color: yellow; */
  }
  .menu.switch_off:focus + .vertical.below,
  .menu.switch_off:focus + .vertical.rightof,
  a.hyper_link:focus ~ .vertical.below,
  a.hyper_link:focus ~ .vertical.rightof 
  {
    display: none;
  }

  .menu a {
    z-index: 3;
    position: relative;
    user-select: none;
  }
  .menu a:link {
    color: #fff;
  }
  .menu a:visited {
    color: #fff;
  }
  .menu a:hover {
    color: #000;
  }
  .menu a:active {
    color: #22d;
  }
  
  /* Trotz Padding des Body das Hauptmenü bis zu den Rändern gehen lassen. Es wird dann zusätzlich im body 
     ein padding-top gesetzt, damit das Menü nicht den Inhalt überdeckt. */
  /*
  .menu.main {
    position: fixed;
    background-color: yellow;  
    width: 100%;
    left: 0;
    top: 0;
  }
  */
  body {
    /* padding-top: 40px; */
  }
  .menu.root ul {
    z-index: 1;
  }
  .menu.root li {
    z-index: auto;
  }
  
}

@media screen and (min-width: 600px) and (min-height: 800px) {
  
  .footer {
    position: fixed;
    bottom: 0;
    /* height: 120px; /* Höhe des Footers */
    background-color: var(--halec-red);
    padding: 10px;
    padding-bottom: 15px;
    margin: 0;
    border-top: 3px solid var(--halec-lightred);
    left: 0;
    width: 100%;
  }

}

.hamburger_menu {
  display: none;
  font-size: 30px;
  padding: 5px;
  color: white;
  background-color: var(--halec-red);
  user-select: none;
}
.hamburger_menu:hover {
    background-color: var(--halec-lightred);
}

input.hamburger_menu {
  display: none;
}

@media screen and (max-width: 599px) {
	body {
		border-left: 4px solid #f9f9f9;
		border-right: 4px solid #f9f9f9;    
	}  
  table th {
    font-size: 90%;
  }
  table tr {
    font-size: 85%;
  }
  table ul {
    padding-left: 10px;
  }
  table ul li {
    list-style-type:none;
    position:relative;   
  }
  table ul li:before {
    content: "•"; /* Bullet-Symbol */
    position: absolute;
    left: -0.8em;
  }
  .hamburger_menu {
    display: block;
  }
  input.hamburger_menu ~ .menu {
    display: none;
  }
  input.hamburger_menu ~ .menu.footer {
    display: block;
  }
  input.hamburger_menu:checked ~ .menu {
    display: block;
  }
  .menu {
    font-size: 17px;
    line-height: 1.9rem;
  }
  .menuCaption {
    line-height: 1.9rem;
  }
  
  .horizontal, .vertical {
    list-style-type: none;
    padding-left: 5px;
    padding-right: 5px;
    margin: 0px;
    align-items: left;
    user-select: none;

    display: flex;
    flex-direction: column;
  }  
  .menu .horizontal, 
  .menu .vertical {
    position: relative;
    transition: height 2s;
  }  
  .menu.main, 
  .menu.footer {
    line-height: 1.9rem;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: var(--halec-red);
  }
  .leaf, .node {
    color: white;
    /* font-size: 1.1em;
    line-height: 1.5em; */
  }  
  .node {
    position: relative;
    cursor: pointer;
  }
  .node .menuCaption {
    margin: 1px;
  }
  .node .menuCaption:hover {
    background-color: var(--halec-lightred);
  }
  .leaf {
    position: relative;
    cursor: default;
  }
  .leaf a {
    display: block;
    width: 100%;       /* Nimmt die gesamte Breite des `<li>`-Elements ein */
    height: 100%;      /* Optional, wenn das `<li>` eine definierte Höhe hat */
    text-decoration: none; /* Entfernt die Unterstreichung des Links */    
  }
  .leaf:hover {
    background-color: var(--halec-lightred);
  }

  .menuCaption span,
  .switch_off span {
    position: absolute;
    right: 2px;
    bottom: 0px;
  }
  
  .menu.switch_off {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    padding: 0px;
    user-select: none;
  }
  .menu.switch_off {
    opacity: 0;
    pointer-events: none;
  }
  .sowl {   /* switch_off with link */
    color: var(--halec-lightred);
    white-space: nowrap;
  }
  .node:focus-within > .menu.switch_off {
    opacity: 1;
    pointer-events: auto;
    background-color: #ff0000; /* var(--halec-lightred); */
    border: 2px solid #fff;
    border-bottom: 1px;
    padding-left: 5px;
    margin-top: 1px;
  }
  .node:focus-within > .menu.switch_off:focus {
    opacity: 0;
    pointer-events: none;
  }
  
  .node > .vertical.below.downwards {
    display: none;
    border: 2px solid #fff;
    border-top: 0px;
    margin-top: -1px;
    margin-bottom: 6px;
  }
  .node > .vertical.rightof.downwards {
    display: none;
    border: 2px solid #fff;
    border-top: 0px;
    margin-top: -1px;
    margin-bottom: 6px;
  }
  .node > .vertical.menu_footer {
    display: none;
    border: 1px solid #fff;
    border-top: 0px;
  }
  .node:focus-within > .vertical.below,
  .node:focus-within > .vertical.rightof  {
    display: block;
    /* background-color: yellow; */
  }
  .menu.switch_off:focus + .vertical.below,
  .menu.switch_off:focus + .vertical.rightof,
  a.hyper_link:focus ~ .vertical.below,
  a.hyper_link:focus ~ .vertical.rightof 
  {
    display: none;
  }
  
  .menu div.menuCaption {
    /* z-index: 3; */
    position: relative;
    color: white;
    padding-left: 6px;
    top: 1px;
  }
  .menu a.hyper_link {
    /* z-index: 3; */
    position: relative;
    user-select: none;
    padding-left: 6px;
    top: 1px;
  }
  
  .menu a:link {
    color: #fff;
  }
  .menu a:visited {
    color: #fff;
  }
  .menu a:hover {
    color: #000;
  }
  .menu a:active {
    color: #22d;
  }
  
}

/* CSS für Pandoc-Codeblöcke folgt */

code {
  font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace;
  font-size: 85%;
  margin: 0;
}
pre {
  margin: 1em 0;
  overflow: auto;
  line-height: 15px;

  padding:  5px;
  border: solid 1px black;
  background-color: #efe;
  box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  -moz-box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  -webkit-box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  -o-box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  border-radius:6px;
}
pre code {
  padding: 0;
  overflow: visible;
  /* overflow-wrap: normal; */
}
.sourceCode pre {
  border: none;
  box-shadow: none;
  border-radius: 0px;
}
.sourceCode {
 /* background-color: transparent; */
  background-color: white;
  overflow: visible;
}
div.sourceCode {
  border: solid 1px black;
  background-color: #efe;
  box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  -moz-box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  -webkit-box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  -o-box-shadow: 3px 3px 3px  rgba(0,0,0,0.6);
  border-radius:6px;
}
/* code{white-space: pre-wrap;} */   /* Sorgt für Zeilenumbruch in den Pre code Blöcken */
span.smallcaps{font-variant: small-caps;}
span.underline{text-decoration: underline;}
pre > code.sourceCode { white-space: pre; position: relative; }
pre > code.sourceCode > span { display: inline-block; line-height: 1.25; }
pre > code.sourceCode > span:empty { height: 1.2em; }
.sourceCode { overflow: visible; }  /* "visible" erzeugt Scroll-Balken. "hidden" wäre ohne. */
code.sourceCode > span { color: inherit; text-decoration: inherit; }
div.sourceCode { margin: 1em 0; }
pre.sourceCode { margin: 0; }
@media screen {
div.sourceCode { overflow: auto; }
}
@media print {
pre > code.sourceCode { white-space: pre-wrap; }
pre > code.sourceCode > span { text-indent: -5em; padding-left: 5em; }
}
pre.numberSource code
  { counter-reset: source-line 0; }
pre.numberSource code > span
  { position: relative; left: -4em; counter-increment: source-line; }
pre.numberSource code > span > a:first-child::before
  { content: counter(source-line);
    position: relative; left: -1em; text-align: right; vertical-align: baseline;
    border: none; display: inline-block;
    -webkit-touch-callout: none; -webkit-user-select: none;
    -khtml-user-select: none; -moz-user-select: none;
    -ms-user-select: none; user-select: none;
    padding: 0 4px; width: 4em;
    color: #aaaaaa;
  }
pre.numberSource { margin-left: 3em; border-left: 1px solid #aaaaaa;  padding-left: 4px; }
div.sourceCode
  {   }
@media screen {
pre > code.sourceCode > span > a:first-child::before { text-decoration: underline; }
}
code span.al { color: #ff0000; font-weight: bold; } /* Alert */
code span.an { color: #60a0b0; font-weight: bold; font-style: italic; } /* Annotation */
code span.at { color: #7d9029; } /* Attribute */
code span.bn { color: #40a070; } /* BaseN */
code span.bu { } /* BuiltIn */
code span.cf { color: #007020; font-weight: bold; } /* ControlFlow */
code span.ch { color: #4070a0; } /* Char */
code span.cn { color: #880000; } /* Constant */
code span.co { color: #60a0b0; font-style: italic; } /* Comment */
code span.cv { color: #60a0b0; font-weight: bold; font-style: italic; } /* CommentVar */
code span.do { color: #ba2121; font-style: italic; } /* Documentation */
code span.dt { color: #902000; } /* DataType */
code span.dv { color: #40a070; } /* DecVal */
code span.er { color: #ff0000; font-weight: bold; } /* Error */
code span.ex { } /* Extension */
code span.fl { color: #40a070; } /* Float */
code span.fu { color: #06287e; } /* Function */
code span.im { } /* Import */
code span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Information */
code span.kw { color: #007020; font-weight: bold; } /* Keyword */
code span.op { color: #666666; } /* Operator */
code span.ot { color: #007020; } /* Other */
code span.pp { color: #bc7a00; } /* Preprocessor */
code span.sc { color: #4070a0; } /* SpecialChar */
code span.ss { color: #bb6688; } /* SpecialString */
code span.st { color: #4070a0; } /* String */
code span.va { color: #19177c; } /* Variable */
code span.vs { color: #4070a0; } /* VerbatimString */
code span.wa { color: #60a0b0; font-weight: bold; font-style: italic; } /* Warning */
.display.math{display: block; text-align: center; margin: 0.5rem auto;}