* { 
  box-sizing: border-box; 
  }

a:link {
  color: #FFFFFF;
}  

a:visited {
  color: #C0C0C0;
}

a:hover {
  font-weight: 800;
  color: #800000;
}

body {
  line-height: 1.6;
  font-size: 125%;
  background-color: #101030;
  color: #FFFFFF;
}

nav {
   width: 20%;
   max-width: 200px;
   float: left;
   }
   
main {
   width: 80%;
   float: left;
   clear: all;
   }

footer {
   width: 100%;
   float: left;
   vertical-align: bottom;
   text-align: right;
   font-size: 70%;
   }


.mnu_parent   { font-size: 80%; color: lightblue; }
.mnu_inactive { font-size: 80%; color: lightyellow; }
.mnu_active   { font-size: 80%; color: orangered; }
  

#normalMenu { 
  display: block;
  width: 160px; 
  text-align: center;
  position: fixed;
  background-color: #909090;
  }
  
#normalMenu ul { 
  list-style-type: none; 
  margin: 0; 
  padding: 0; 
  font-size: 90%;
  }
  
#normalMenu li { 
  padding: 8px; 
  margin-bottom: 7px; 
  background-color :#808080; 
  color: #ffffff; 
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); 
  }

#normalMenu a { 
  text-decoration: none; 
  color: #ffffff; 
  transition: color 0.3s ease;
  }
  
#normalMenu a:hover { 
  color: tomato; 
  }
  
  
/* Hamburger-Menu von https://codepen.io/erikterwan/pen/EVzeRP */
#burgerMenu { 
  display: none; 
  position: relative; 
  top: 10px; 
  left: 10px; 
  z-index: 1; 
  -webkit-user-select: none; 
  user-select: none; 
  }
 
#burgerMenu input { 
  display: block; 
  width: 40px; 
  height: 32px; 
  position: absolute; 
  top: -7px; 
  left: -5px; 
  cursor: pointer; 
  opacity: 0; /* hide this */  
  z-index: 2; /* and place it over the hamburger */ 
  -webkit-touch-callout: none; 
  }
  
#burgerMenu span { 
  display: block; 
  width: 33px; 
  height: 4px; 
  margin-bottom: 5px; 
  position: relative; 
  background: #cdcdcd; 
  border-radius: 3px; 
  z-index: 1; 
  transform-origin: 4px 0px; 
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease; 
  }
  
#burgerMenu span:first-child { 
  transform-origin: 0% 0%; 
  }
  
#burgerMenu span:nth-last-child(2) { 
  transform-origin: 0% 100%; 
  }
  
#burgerMenu input:checked ~ span { 
  opacity: 1; 
  transform: rotate(45deg) translate(-2px, -1px); 
  background: #232323; 
  }
  
#burgerMenu input:checked ~ span:nth-last-child(3) { 
  opacity: 0; 
  transform: rotate(0deg) scale(0.2, 0.2); 
  }
  
#burgerMenu input:checked ~ span:nth-last-child(2) { 
  transform: rotate(-45deg) translate(0, -1px); 
  }
  
#menu { 
  position: absolute; 
  width: 300px; 
  margin: -100px 0 0 -50px; 
  padding: 50px; 
  padding-top: 125px; 
  background: #ededed; 
  list-style-type: none; 
  -webkit-font-smoothing: antialiased; 
  transform-origin: 0% 0%; 
  transform: translate(-100%, 0); 
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0); 
  text-align: center; 
  }
  
#menu li { 
  padding: 8px; 
  margin-bottom: 7px; 
  background-color: #808080; 
  color: #ffffff; 
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); 
  }
  
#burgerMenu input:checked ~ ul { 
  transform: none; 
  }
  
@media screen and (max-width: 600px) {
   #normalMenu { display: none; }
   #burgerMenu { display: block; }
   main { margin-top: 20px; width: 100%; margin-left: 0;}
}


dt {
  font-size: 110%;
  font-weight: 650;
}

.content {
   max-width: 950px;
   margin-left: auto;
   margin-right: auto;
}

h1 { text-decoration: underline; }
p { margin-top: 0; padding-top: 0; }

.linkliste {
  width: 250px;
  background-color: #C0C0C0;
  font-size: 80%;
}

/* Rezepte */
.Zubereitung,.Zutaten { 
  padding-top: 1.5em; 
  padding-bottom: 0.2em; 
  text-decoration: underline; 
  font-size: 1.2em;
  font-weight: 600; }

.tabZutaten {
  width: 500px;
  border-collapse: collapse;
  border: none;
}

.tabZutaten tr,
.tabZutaten td {
  border: none;
  padding: 3px 5px;
}

.tabZutaten td:first-child {
  text-align: right;
}
