/* Iphone 6+ portrait */

@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) {
    
    
body {font-size:74%;} /* definiert die Größe immer wenn das Display im Querformat ausgegeben wird */


    
.masterwrapper {overflow: visible;}     
.footer {display: none;}  
    
    
/*Eröffnungsseite */

#mobilflag {display: block;}
    
.fixwrappermobil { /* beinhaltet die startschriftcontainer */
  background: rgba(201,22,22,0.99); 
  display: block;   
  position: fixed;
  top: 0;
  left: 0;
  
  width: 100%;
  height: 100%;
}

.startlinkbox {position: absolute; top: 4.000em; left: 0; width: 100%; height: 100%;}
.startlinkbox a {position: absolute; width: 100%; height: 100%;}        
    
    
.startslogancontainer {
  margin-top: 2.000em;
  padding: 2%;
  text-align: center;
  width: 90%;
}

/*Anfang Startseite*/
.start, .kategorie, .buch, .theater, .oper, .film, .journalismus, .aktuelles, .biographie, .galerie, .kontakt, .links, .impressum  {
  background-color: rgb(41,41,41);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: cover;  
  -webkit-background-size: cover;  
  -moz-background-size: cover;    
}
    
.start 		{background-image: url("/images/backgrounds/treppemotivmobil.jpg");}
.kategorie 	{background-image: url("/images/backgrounds/startbildpolaroidmobil.jpg");}
.buch 		{background-image: url("/images/backgrounds/buchportrait.jpg");}
.theater 	{background-image: url("/images/backgrounds/theaterportrait.jpg");}
.oper 		{background-image: url("/images/backgrounds/operportrait.jpg");}
.film 		{background-image: url("/images/backgrounds/filmportrait.jpg");}
.journalismus {background-image: url("/images/backgrounds/journalismusportrait.jpg");}
.aktuelles 	{background-image: url("/images/backgrounds/startbildpolaroidmobil.jpg");}
.biographie {background-image: url("/images/backgrounds/biographieportrait.jpg");}
.galerie 	{background-image: url("/images/backgrounds/startbildpolaroidmobil.jpg");}
.links 		{background-image: url("/images/backgrounds/startbildpolaroidmobil.jpg");}
.presse 	{background-image: url("/images/backgrounds/startbildpolaroidmobil.jpg");}
.impressum 	{background-image: url("/images/backgrounds/startbildpolaroidmobil.jpg");}
.kontakt    {background-image: url("/images/backgrounds/startbildpolaroidmobil.jpg");}       

.topheader {position: fixed;}
.headermenu, .startslogancontainer {display: none;}

.starttitle {
  background: rgba(201,22,22,0.99); 
  display: table-cell; 
  text-align: center; 
  vertical-align: middle;
  top: 15.000em;
  width: 70.000em;
  height: 9.000em;
}

.headertitle {
  font-family: 'Roboto Condensed', sans-serif;  
  color: rgba(255,255,255,0.7);  
  
  background: rgba(277,50,23,0.8); 
  
  display: table-cell;
  border-radius: 50%;  
  
  text-align: center; 
  vertical-align: middle;  
  
  width: 15.000em;
  height: 15.000em;
}

.topheader h  {color: rgb(255,255,255); font-size: 3.000em;}
.topheader h1 {color: rgb(255,255,255); font-size: 1.000em;}

.sprachcontainer img {background: (41,41,41); width: 2.5em; }
.sprachcontainer {background: rgb(41,41,41); z-index: 2;}

/* Textkorpus */

.bodycontent {top: 30.000em;}

.inhaltecontainer {display: none;}

.readercontent {visibility: visible;}

.textkorpus {background: rgb(41,41,41);}

.inhaltecontainerrechts h3, .inhaltecontainerrechts h2, .inhaltecontainerrechts h1, .inhaltecontainerrechts p, .inhaltecontainerrechts a, .textkorpus p, .textkorpus h1, .textkorpus h2, .textkorpus h3, .textkorpus h4 {color: rgb(255,255,255); margin-left: 1.000em;}  

.impressumcontainer p, .impressumcontainer h1, .impressumcontainer h2, .impressumcontainer h3 {color: rgb(255,255,255); margin-left: 1.000em; text-align: center;}  

.textkorpus p {font-size: 1.300em; line-height: 150%;}
.textkorpus h4 {font-size: 3.250em; line-height: 300%; text-align: center;}
.textkorpus h1 {font-size: 2.000em; line-height: 400%; text-align: center;}

.textkorpus a {color: rgb(255,255,255);} 

/* Kontaktformularbasis wie Textkorpus */

.contactmobil {
  background: rgb(41,41,41);
  
  position: fixed;
  top: 4.000em;
  z-index: 0;
  
  overflow-x: hidden;
  overflow-y: scroll;
  
  width: 100%;
  height: 100%;
}

#contact-form {margin-left: -3.500em;}

#jform_contact_name, #jform_contact_email, #jform_contact_emailmsg, .hasTooltip {color: rgb(128,128,128);}

#jform_contact_message {height: 2.188em;}

button {background: rgb(255,255,255);}

.control-label {margin:0;}

/* Definiert die input und symbolbox */

.mobilmenucontainer {
  background: rgba(41,41,41,0.9);
  display: inline-block;
  float: left;
  
  margin-top: 1.000em;
  margin-left: 1.000em;
  
  width: 2.500em;
  height: 2.500em;
}

.mobilmenucontainer:before {content: '\002630'; color: rgba(255,255,255,0.99); font-size: 2.500em;}

.fullsizelabel {  
  position: absolute;
  left:0;
  top: 0;
  width: 3.000em;
  height: 3.000em;
}

/* schließt das mobilmenu */

.closemobilmenu {    
  top: 1.000em;
  left: 1.000em;
  
  width: 2.500em;
  height: 2.500em;
}

.closemobilmenu:before {content: '\000058'; color: rgba(255,255,255,0.99); font-size: 2.000em;}

/* overlay für das Menü */

input[type=checkbox]:not(:checked)~ .mobilmenu {
  display: none;
  visibility: hidden;
  opacity: 0;  
           
  -webkit-transition: all 1s ease-in-out 0s;
  -moz-transition: all 1s ease-in-out 0s;
  transition: all 1s ease-in-out 0s;    
}

input[type=checkbox]:checked ~ .mobilmenu {
  background: rgb(41,41,41);
  
  display: block;
  visibility: visible;
  opacity: 1;
  cursor: auto;
  
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
    
  width: 15.000em;
  height: auto; 
  
  -webkit-transition: all 1s ease-in-out 0s;
  -moz-transition: all 1s ease-in-out 0s;
  transition: all 1s ease-in-out 0s;  
}

.mobilmenu  ul  {
  margin-top: 4.000em;
  width: 100%;
  height: 100%;
}
.mobilmenu  ul li {display: block; position: relative;}

.mobilmenu  ul li a {
  color: rgba(255,255,255,0.99);
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1.200em;
  text-decoration: none;
  letter-spacing: 0.2em;
  line-height: 2.500em;
  margin-bottom: 1.000em;  
  margin-left: 1.000em; 
}

/* Mobil Menü für Kategorieauswahl */
.mobilmenukategorie {
  display: block;
  cursor: auto;
  overflow: hidden;
    
  width: 100%;
  height: auto;   
}

.mobilmenukategorie ul  {}

.mobilmenukategorie ul li {
  display: block; 
  position: relative;
  
  width: 100%;
  height: 20.000em;  
}

.mobilmenukategorie ul li a {
  color: rgba(255,255,255,0.99);
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 3.500em;
  text-decoration: none;
  text-align: center;
  letter-spacing: 0.2em;
  line-height: 5.500em;
  
  display: table;
  width: 100%;
}

#mobilbuch, #mobiltheater, #mobiloper, #mobilfilm, #mobiljournalismus, #mobilbiographie, #mobilaktuelles, #mobilkontakt {
  background-position: center center;
  background-repeat: no-repeat;
 /* background-attachment: fixed; */
  background-size: cover;
  background-color: rgb(255,255,255);
}

#mobilbuch {background-image: url("/images/backgrounds/mobilbuch.jpg");}
#mobiltheater {background-image: url("/images/backgrounds/mobilteather.jpg");}
#mobiloper {background-image: url("/images/backgrounds/mobiloper.jpg");}
#mobilfilm {background-image: url("/images/backgrounds/mobilfilm.jpg");}
#mobiljournalismus {background-image: url("/images/backgrounds/mobiljournalismus.jpg");}
#mobilbiographie {background-image: url("/images/backgrounds/mobilbiographie.jpg");}
#mobilaktuelles {background-image: url("/images/backgrounds/mobilaktuelles.jpg");}
#mobilkontakt {background-image: url("/images/backgrounds/mobilkontakt.jpg");}

/* Ende Mobil Menü Kategorieauswahl */

.kategoriegalerie {display: none;}

.schwarzerbalken {display: none;}

.leftcontent, .rightcontent  {width: 1.5%;}

.middlecontent {width: 100%;}

.inhaltecontainer {
  border: none;
  height: 20em;
  margin-bottom: 2.25em;
  padding: 1em;
  width: 100%;
}

.inhaltecontainerlinks {display: none;}

.inhaltecontainerrechts {
  float: none;
  height: 20em;
  margin-left: 0;
  width: 100%;
}

.inhaltecontainerrechts h1, .textkorpus h1 {text-align: left;}

input[type="checkbox"]:checked ~ .inhaltoverlay {overflow: scroll;}

/*Bilder keine Darstellung: */
.gallery ul {display: none;}

/* Bilder - eigentlich nicht, aber wenn */
.inhaltoverlay img {margin-top: 18em; max-height: 18em;}
/* Ende Bilder */

/* Footer */

.footer {background: rgb(255,255,255); top: 30.000em; height: 7.000em;}

.wunschmaschine, .linkleiste {top: 2.000em;}

.wunschmaschine {
  position: relative;
  float: none;
  top: 5.000em;
  width: 100%;
}

.wunschmaschine p {
  text-align: center;
}
 
}