:root {
   --b-seitenheader-height: 60px;   /* wird per JavaScript aus einem der nachfolgenden Werte gesetzt */ 
   --b-seitenheader-height-mit-knöpfen: 106px;
   --b-seitenheader-height-ohne-knöpfe: 60px;
   
   --b-header-font-size: 18px;
   --b-seitenheader-font-size: 16px;
   --b-page-h1-font-size: 16px;  
   
   --b-flashmeldung-height: 20px; 
}



#header {
   grid-template-columns: 70% auto;  
}

.zeilenabstandSeitenheader {
   padding-top: 6px;
}


.b-popupFenster {
   font-size: 10px;
   white-space: nowrap;   
}

.listenelement {
   /* 2 Spalten  im Landscape und Portrait unterschiedlich breit*/ 
   grid-template-columns: 26% auto;
}
.listenBild, .listenBildLeer {   
   width: 80%;
}



.artBild {
   /* Bildgrössen in der Artanzeige: so gross wie möglich - je nach Bildschirmgrösse anders */
   /* max-width: 767px; */
   max-width: 98%;
   height: auto;   
}


/* Anpassungen für sehr kleine Bildschirme (zwischen 240 und 320px schmal */
/* bis 320px Darstellung ok, 320-240px Schadensbegrenzung, kleiner keine Garantie */
@media screen and (max-width: 320px) {
   :root {
   --b-header-font-size: 16px;
   --b-seitenheader-font-size: 13px;
   --b-formularbox-width: 220px;
   }
   
   #header #headerNaviIcons .hamburgerSymbol, #header #headerNaviIcons .lupenSymbol {
      padding-left: 5px;
   }
   #headerTitel {
      margin-top: 4px;
   }
   #seitenHeaderTitel {
      word-break: break-all; 
   }
   
   .listenelement_text {
      word-break: break-all; 
   }
   .nrAbstand {
      word-spacing: 5px;
   }   
}