@media  screen {

/* Style sheet bildschirm */
html{
   overflow-y: scroll;
}

body{
  font-family: var(--pb-font-family-base);
  color: var(--pb-text-color);
  background-color: var(--pb-body-bg) ;
  font-size:var(--pb-font-size-base) !important;
}
a {
  color:var(--pb-link-color);    
  text-decoration:underline;
  /* background-color:var(--pb-container-bg) ;  wird mediaspecific geloest   */
  font-weight: bold;   
}
/* Alle Textelemente der Webseite werden klein geschrieben 
   Der *-Selektor wendet die Regel auf alle HTML-Elemente an.
*/
* {
    text-transform: lowercase;
}

a:hover {
  background-color:var(--pb-link-hover-color-bg);
  color:var(--pb-link-hover-color);
  text-decoration: underline;
} 
button {
    border: 1px solid var(--pb-text-color); /* Einfache graue Linie */
    border-radius: var(--bs-border-radius-xl); /* Abgerundete Ecken */
    padding: 4px 8px; /* Mehr Platz innen */
    background-color: var(--pb-container-bg); /* Leicht grauer Hintergrund */
    background-color: var(--hb-pink);
    color: var(--pb-text-color); 
    cursor: pointer; /* Zeiger-Cursor */
}

button:hover {
    background-color: var(--pb-link-hover-color-bg); /* Etwas dunkler beim Hover */
}

.colorhidden {
  display:none;    /* erlaubt die Farben im Header zur Auswahl anzuzeigen */
  } 
.table {           /* ueberschreibt bootastrap table */
 color:var(--pb-text-color);
}
/*header korrekturen */
h1 {font-size: var(--pb-font-size-h2)}  /*            floor((var(--pb-font-size-base) * 2.15)); // ~30px */
h2 {font-size: var(--pb-font-size-h4)}  /*            ceil((var(--pb-font-size-base) * 1.7)); // ~24px */
h3 {font-size: var(--pb-font-size-h4)}  /*            ceil((var(--pb-font-size-base) * 1.25)); // ~18px */
h4 {font-size: var(--pb-font-size-h5)}  /*            var(--pb-font-size-base); */
h5 {font-size: var(--pb-font-size-h6)}  /*            ceil((var(--pb-font-size-base) * 0.85)); // ~12px */
#wrapper{
  background-color:var(--pb-body-bg) ; 
  padding:0;
}
/* wrapper s. auch mediaspecific.less */


#header{
  margin-top:1em;
}


 
#container{
  min-height:310px;

  /*margin-top:10px; */
  padding-top: 25px;  
  background-color: var(--pb-container-bg);  
  padding-left: 0px;
  border-radius: var(--bs-border-radius-xl);
  /*border: 1px solid var(--pb-text-color); */
}
#main{
  /*float:left; */
  /*width:94%;         */
  /*margin-left:10px; */
  /*margin:auto; */
  /*padding-left:20px; */
  /*padding-right:10px; */
}
#left{  
  display:none;
  float:left;
  width:15%;
  margin-left: -95%;   /* Mitte + links */
  
  border:10px solid blue ;
  
}

#right {
  /*border:1px solid #89adcd;*/
  float:left;
  width:155px;
}
 
#footer{
  padding-left:18px;
  clear:both;
  height:20px;          /* muss sein, da sonst kein Background */    
  
}
.mod_navigation .invisible {
  /*display:none;*/
  width:10px;
  height:10px;
  background:blue;
}

.mitrand {
  border: 2px solid blue;
}
.euf_overlay__content {     /* overlay z.B. Newsletter */
  background:  var(--pb-container-bg) !important;
}

.ui-tooltip { 
  border: 20px solid var(--pb-body-bg);
   background-color:var(--pb-container-bg);
}
.ui-tooltip-content {
 background-color:var(--pb-container-bg);
 color:var(--pb-text-color);
 font-size: 70%;
}
}