.schmal, #bannerbild-schmal, #hmenue, #nach_oben, #pfeil {display: none;}

#container2 {
 position: relative;	
 display:-webkit-flex;
 display: flex;
 -webkit-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-justify-content: space-between;
 justify-content: space-between; 
 -webkit-align-items: flex-start;
 align-items: flex-start; 
 max-width: 1600px;
 margin: 5px auto 5px auto;
 background-color: #fff;
}

#ps_banner {
 position: relative;
 width: 100%;
} 

#bannerbild-breit {
 width: 100%;
 height: auto;
}

#ps_ueberschrift {
 position: absolute;
 left: 0;
 top: 20px;
 width: 100%;
 text-align: center;
 color: #fff;
 background-color: transparent;
}

h1 {
 font-size: 2.5em;
 color: #FCF103;
 margin: 0.3em 0;
 padding: 0;
 font-weight: normal;
}

#ps_logo {
 width: 20%;
 height: auto;
 margin-bottom: 5px;
} 

#navi_produkte {
 position: absolute;
 left: 0;
 bottom: 20px; 
 width: 100%; 
 color: #fff;
 font-size: 1.3em;
 font-weight: normal;
 text-align: center;
} 

#navi_produkte a:link {
 color: #fff;
 text-decoration: none;
}

#navi_produkte a:visited, #navi_produkte a:active {
 color: #fff;
}

#navi_produkte a:hover {
 color: #FCF103;
 text-decoration: underline;
}

#image1 {
  width: 28%;
  margin-top: 25px;
  box-shadow: 3px 3px 5px #000;
}  

#text1 {
  width: 70%;
  line-height: 1.5;
  color: #440800;
  text-align: left;
  padding-right: 10px;
}  

#text1 h2 {
 text-align: left;
 margin-top: 0;
}

#text1 a:link, #text1 a:visited, #text1 a:active {
 color: #440800;
 text-decoration: none;
}

#text1 a:hover {text-decoration: underline;} 

/*-------------------------------------- 1 5 5 0 px --------------------------------*/

@media only screen and (max-width: 1550px) {
 #bannerbild-schmal, #nach_oben {display: none;}
 h1 {font-size: 2.3em;}
 #navi_produkte {font-size: 1.1em;}
}

/*-------------------------------------- 1 2 7 0 px --------------------------------*/

@media only screen and (max-width: 1270px) {
 #bannerbild-schmal, #nach_oben {display: none;}
 h1 {font-size: 2.0em;}
 #navi_produkte {font-size: 1em;}
}

/*-------------------------------------- 1 1 0 0 px --------------------------------*/

@media only screen and (max-width: 1100px) {
 #bannerbild-schmal, #nach_oben {display: none;}

 h1 {
  font-size: 1.7em;
  margin: 0;
 }
 #navi_produkte {
  font-size: 0.9em;
  bottom: 10px; 
 }
}

/*-------------------------------------- 9 0 0 px --------------------------------*/

@media only screen and (max-width: 900px) {
 #navi_produkte, #image1, #bannerbild-breit, #ps_ueberschrift {display: none;}
 #text1 {
  width: 100%;
  padding: 15px;
 }

 #bannerbild-schmal {
  display: block;
  width: 100%;
  height: auto;
 }

 #pfeil {
  display: inline;
  font-family: symbole; 
  font-size: 2em;
 } 	 
 #nach_oben {
  position: fixed;
  bottom: 20px;
  right: 0;
  min-width: 84px;
  color: #fff;
  background-color: #240A02;
  opacity: 0.85;
  z-index: 99;
  line-height: 1.0;
  padding: 10px;
  text-align: center;
  border-radius: 4px 0 0 4px; 
 }
 #nach_oben a:link, #nach_oben a:visited, #nach_oben a:active {
  color: #fff;
  text-decoration: none;
 }
 #nach_oben a:hover {color: #FCF103;}


 /* Hamburger-Menue, angeregt durch www.mediaevent.de, Trick mit Checkbox-Label */
 input#hamburg {display: none;}

 #hmenue {
  display: block;	 
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 99;
 }

 label.hamburg { 
  display: block;
  float: right;
  background: #fff; 
  width: 65px; 
  height: 44px; 
  margin-bottom: 6px;
  border-radius: 4px; 
  position: relative;
  opacity: 0.8;
 }

 .line { 
  position: absolute; 
  left: 10px;
  height: 4px; 
  width: 45px; 
  background: #000; 
  border-radius: 2px;
  display: block; 
  transition: 0.5s; 
  transform-origin: center; 
 }

 .line:nth-child(1) { top: 8px; }
 .line:nth-child(2) { top: 20px; }
 .line:nth-child(3) { top: 32px; }

 #hamburg:checked + .hamburg .line:nth-child(1){
  transform: translateY(12px) rotate(-45deg);
  -webkit-transform: translateY(12px) rotate(-45deg); 
 }

 #hamburg:checked + .hamburg .line:nth-child(2) {opacity:0;}

 #hamburg:checked + .hamburg .line:nth-child(3){
  transform: translateY(-12px) rotate(45deg);
  -webkit-transform: translateY(-12px) rotate(45deg);
 }

 #hmenue ul { 
  height: auto; 
  max-height: 0; 
  overflow: hidden; 
  transition: 0.5s;
  text-align: right;
  font-size: 1.2em;
  font-weight: bold;
  background-color: #000;
  opacity: 0.86;
  padding: 0 10px;
 }

 #hamburg:checked ~ ul {max-height: 600px;}

 nav ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
 }
 
 nav ul li {padding-bottom: 12px;}

 nav ul li:nth-child(1) {padding-top: 12px;}

 nav a:link, nav a:visited, nav a:active {
  color: #fff;
  text-decoration: none;
 }

 nav a:hover {text-decoration: underline;}

}

/*-------------------------------------- 5 0 0 px --------------------------------*/

@media only screen and (max-width: 500px) {
 .breit {display: none;} 
 .schmal {display: inline;}
}

/*-------------------------------------- 3 7 0 px --------------------------------*/

@media only screen and (max-width: 370px) {
 label.hamburg { 
  width: 52px; 
  height: 36px; 
 }
 .line { 
  width: 36px; 
  left: 8px;
 }
 .line:nth-child(1) { top: 7px; }
 .line:nth-child(2) { top: 16px; }
 .line:nth-child(3) { top: 25px; } 
 #hamburg:checked + .hamburg .line:nth-child(1){
  transform: translateY(9px) rotate(-45deg);
  -webkit-transform: translateY(9px) rotate(-45deg); 
 }
 #hamburg:checked + .hamburg .line:nth-child(3){
  transform: translateY(-9px) rotate(45deg);
  -webkit-transform: translateY(-9px) rotate(45deg);
 }
 #hmenue ul { 
  font-size: 1em;
  font-weight: bold;
 }

 #pfeil {font-size: 1.8em;
 } 	 
 #nach_oben {min-width: 74px;} 
}

/*-------------------------------------- P R I N T --------------------------------*/

@media only print {
 #navi_produkte, #image1, #bannerbild-breit, #ps_ueberschrift, #hmenue, #fuss_links, #nach_oben {display: none;}

 #text1 {
  width: 100%;
  padding: 15px;
 }

 #bannerbild-schmal {
  display: block;
  width: 60%;
  height: auto;
 }
}