html{background-color:white/*#E36A1F*/;text-align:center;padding:0;margin:0;font-size:95%;line-height:1.5;}

body{width:95%;padding:0;margin:0 auto 0 auto;}


/* noto-sans-regular - latin */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-v27-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-v27-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-v27-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-v27-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-v27-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-v27-latin-regular.svg#NotoSans') format('svg'); /* Legacy iOS */
}
/* noto-sans-italic - latin */
@font-face {
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/noto-sans-v27-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-v27-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-v27-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-v27-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-v27-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-v27-latin-italic.svg#NotoSans') format('svg'); /* Legacy iOS */
}
/* noto-sans-700 - latin */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-sans-v27-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-v27-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-v27-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-v27-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-v27-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-v27-latin-700.svg#NotoSans') format('svg'); /* Legacy iOS */
}
/* noto-sans-700italic - latin */
@font-face {
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/noto-sans-v27-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-v27-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-v27-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-v27-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-v27-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-v27-latin-700italic.svg#NotoSans') format('svg'); /* Legacy iOS */
}

/* noto-serif-regular - latin */
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-serif-v21-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-serif-v21-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-serif-v21-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-serif-v21-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-serif-v21-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-serif-v21-latin-regular.svg#NotoSerif') format('svg'); /* Legacy iOS */
}
/* noto-serif-italic - latin */
@font-face {
  font-family: 'Noto Serif';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/noto-serif-v21-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-serif-v21-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-serif-v21-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-serif-v21-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-serif-v21-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-serif-v21-latin-italic.svg#NotoSerif') format('svg'); /* Legacy iOS */
}
/* noto-serif-700 - latin */
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-serif-v21-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-serif-v21-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-serif-v21-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-serif-v21-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-serif-v21-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-serif-v21-latin-700.svg#NotoSerif') format('svg'); /* Legacy iOS */
}
/* noto-serif-700italic - latin */
@font-face {
  font-family: 'Noto Serif';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/noto-serif-v21-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-serif-v21-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-serif-v21-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-serif-v21-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-serif-v21-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-serif-v21-latin-700italic.svg#NotoSerif') format('svg'); /* Legacy iOS */
}




#wrapper{
  width: 95%;
  min-width: 550px;
  max-width: 900px;
  margin: 20px auto 10px auto;
  padding: 20px;
  background-color:white;
  color:#3C3C3C;
  font-family: 'Noto Sans', 'Open Sans', sans-serif;
  text-align:left;
}

a:link{color:#E36A1F;text-decoration:none;}
a:visited{color:#E36A1F;text-decoration:none;}
a:hover{text-decoration:underline;color:#DE471C;}
a:active{color:#DE471C;}
a:focus{color:#DE471C;}

nav a:link{color:white;text-decoration:none;font-weight:normal;}
nav a:visited{color:white;text-decoration:none;font-weight:normal;}
nav a:hover{text-decoration:underline;color:white;font-weight:normal;}
nav a:active{color:yellow;font-weight:normal;}
nav a:focus{color:yellow;font-weight:normal;}

nav{float:left;width:150px;margin:0;background-color:Gray;}
nav img{margin:0 0 0px 0px;}
nav a{display: block;}
nav li{color:#ffa66f;font-weight:bold;}
nav ul{list-style:none;margin-left:-40px;}
nav ul li{/*background-color:#E3691E;*/width:137px;margin:0 3px 10px 0;padding:7px;}
nav ul li:hover{background-color:#DC4818;}

.am-z1 {color:#606060;}
.am-z2 {margin-left: 10%;}
.betonen{font-style:italic;font-weight:bold;}
header{font-family: 'Noto Serif', 'Droid Serif', serif;font-weight: 700; font-style: italic;font-size:95%;padding:0px 0px 0 8%;margin:0px 4% 0 150px;color:#E3691E; min-height:140px;}
header h1 {height:100%; padding: 0;margin:0;}
header img {display: none;}
article{padding:3px 0px 15px 8%;margin:0 4% 0 150px;}
article h1, article h2, article h3{color:#E3691E}
article dt{font-weight:bold;}
article li p{margin:5px 0 0 0;}
article dd{padding:0 0 15px 30px;}
article ul {margin-bottom:2em;}
article li {margin-bottom: 0.4em;}
aside{float:right;width:100px;margin:0 0px 0 20px;}
.bildrechts{float:right;margin:28px 0px 0.5em 0.5em;border:5px solid #E36A1F;width:30%;height:auto;min-width:120px;max-width:200px;}
aside img{margin:-1px 0 -2px 0;}
footer{clear:both;text-align:center;font-size:75%;padding:5px 0 0px 0;}
td{white-space:nowrap;}
textarea, input {font-family: 'Open Sans', sans-serif;font-size:90%;}

/* ==================================================
   Responsive Off-Canvas-Menü
   ================================================== */
/* Advanced Checkbox Hack */
body {
  -webkit-animation: bugfix infinite 1s;
}

@-webkit-keyframes bugfix {
  from {
    padding: 0;
  }
  to {
    padding: 0;
  }
}
input[type=checkbox] {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

label {
  position: absolute;
  left: 0;
  display: none;
  text-align: left;
  width: 2em;
  height: 1.6em;
  padding: .45em .45em .45em .15em;
  font-size: 1.1em;
  color: #fff;
  transition: color .3s ease-in-out;
  cursor: pointer;
  user-select: none;
  margin: 0;
  background: #E1681E;
}

td {
	padding: 0.3em;
}

.eingabe textarea, .eingabe input {
	width: 20em !important;
}




/* small screens */
@media screen and (max-width: 40em) {
  html,
  body {
    margin: 0;
	width: 100%;
    overflow-x: hidden;
  }

  nav img {
  display: none;}
  
  nav {
    position: absolute;
    top: 1.5em;
    left: -160px;
    width: 160px;
    opacity: 0;
  }
  nav ul > li {
    height: 100%;
    width: 100%;
    text-align: left;
    margin: 0;
  }

  label {
    display: block;
  }

  label:after {
    position: absolute;
    right: .4em;
    top: .1em;
    content: "\2261";
    font-size: 1.8em;
  }

  label:hover,
  input:checked ~ label {
    color: #FFF;
  }

  input:checked ~ nav {
    opacity: 1;
    left: 0;
  }
  input:checked ~ nav ul > li {
    padding: .8em 0em .8em 1em;
  }

  input:checked ~ section, input:checked ~ footer {
    margin-left: 180px;
    margin-right: -180px;
  }
  input:checked ~ header {
    margin-left: 190px;
    margin-right: -190px;
  }

/* Small Screen Overrides */
  body {overflow-y:visible;}
  #wrapper {margin: 0; padding: 0;width: 100%; min-width: 100px;}
  section, footer {padding: 0; transition: margin .5s ease-in-out;}
  header {padding: 0; margin: 0 0 0 55px; text-align: center; transition: margin .5s ease-in-out;min-height:80px;}
  header h1 {font-size: 160%; padding: 10px 0 0 0; margin: 0;}
  header #logo {margin-left: 30px; width: 190px;}
	section {display: flex;flex-direction: column;}
	aside {float: none; width: 100%; order: 2;}
	article {border: none; padding: 0; margin: 2%; order: 1;}
	#content {margin-top: 0.5em;}
	aside , aside p  {text-align: center;}
	article p img {width: 100%; height: auto;}
	aside img {padding: 0 2px 4px 2px;}
	header img {display: block;padding: 0;float: right;-moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH";}

}




/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 144dpi) {
    /* Style adjustments for high resolution devices */
}
