/*
<style type="text/css">
<!--
*/

html {
  font-size: 100%;
}

body {
    margin: 0;
    padding: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif;
	font-size: 1.08rem;
	line-height: 1.5;
    background-color: #515B62;
}

.inhalt {
  padding: 1px 10rem 0px 10.0625rem; /* 1px 160px 0px 161px */
  max-width: 40.5rem;  /* 648px */
  margin: 0 auto;
  background-color: #FFFFF5;  /* #FFFFEE; */
  text-align:justify;
}

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

a:hover {
color:#FF0000;
}

 .banner {
  	display:flex;
	background:url(topschrift1.gif) center center no-repeat;
	background-color:#95001F;
	align-items: center; /* Vertikale Zentrierung */
    justify-content: center; /* Horizontale Zentrierung (optional) */
    height: 100vh; /* Bsp: volle Viewport-Höhe */
	height:6.25rem; /* 100px */
	max-width:60.5625rem; /* 969px */
	margin-top:1px;
	border:1px solid #FFFFEE;
    box-sizing: border-box;
  }

  .topmenue, .topmenue-2, .endmenue {
    background-color: #FFFFF5;
    font-size: 0.85rem;
    word-spacing:0.47rem;
    max-width: 60.5625rem; /* 969px */
    padding:0.625rem 0.625rem 0px 0.625rem;
    box-sizing: border-box;
  }
 
   .endmenue {
    text-align:center;
    height:2.0rem;
    padding-top:0px;
	word-spacing:1.875rem;
  /* justify-content: center; */
  }
 
/* A ab hier f. 2. Linkreihe, wie z. B. in literatur.htm    */
 .topmenue-2 {
   text-align:left;
   word-spacing: normal;
   max-width: 60.5625rem; /* 969px */
   padding:0.625rem 0.625rem 2px 4.18rem;
   line-height:1.6;
  } 
   
.ziele-block {
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: 1rem;
    align-items: start;
}

.label {
	max-width: 3.875rem;
}

.ziele {
    line-height: 1.6;
}

.ziele a {
    white-space: nowrap;
}
/* E ab hier f. 2. Linkreihe, z. B. in literatur.htm    */

  .langelinie {
  max-width:60.5625rem; /* 969px */ 
  background-color:#FFFFF5; 
  height:0.625rem;
  border-bottom: 1px solid #C4C4C4;  /* cccccc */
  }
  
 
  /* Zum Zurücksetzen veränderter Textpassagen auf Normalwerte*/
  .normalfont {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif;
	font-size: 1.08rem;
	line-height: 1.5;
	font-weight: normal;
	font-style: normal;
  }
  
  .normalklein-1 {  
    font-size: 0.95rem;
    line-height: 1.4;
  }
 /* weg m. kursiv und Roman */
  .normalklein-1-clean {  
    font-size: 0.95rem;
    line-height: 1.4;	
	font-style: normal;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif;
  }
  
  .normalklein-2 {
    font-size: 0.92rem;
    line-height: 1.36;
  }

  .normalklein-3 {
    font-size: 0.85rem;
	line-height: 1.36;
 }

   .rechtsbuendig {
      display: flex; 
	  justify-content: flex-end;
	  margin: 0.3125rem 3px 0px 0px;
   }


    h1, h2, h3 {
      color:#000000; /* 2B3846 */
      font-weight: 600;
    }

    h1 {
      font-size: 1.65rem;
      margin: 2.4rem 0rem 4.3rem 0rem; /* 50px */
      padding: 0rem;
      line-height:1.45;
      text-align:center;
    }

    h2 {
      font-size: 1.35rem;
      line-height:1.3;
      margin-top:3.75rem;  /* 60px */
      margin-bottom:2.1875rem; /* 35px */
      /* text-align:center; */
    }

    h3  {
      font-size: 1.25rem;
      line-height:1.3;
      margin-top:3.125rem;  /* 50px */
    }

    h4 {
      margin: 0;
      color:#1D1D1D;
    }
	
	h4.bilderkl {
	  margin-bottom: 0.625rem; /* 10px */
	}

    h4.h4abstd {   /* Überschr. f. Bücher-Bild-Erklärungen */
      margin:0.6875rem 0rem;
    }

    /* halbfett */
    .betont {
      font-weight:600;
      color:#000000;
    }	
	
    /* Verweis auf literatur.htm */
    .verweis {
      display: flex; 
      justify-content: flex-end;
      font-size:0.95rem;
      margin-top:0.3rem;
    }
	
/*  A  Anfang  Listengestaltung; in urteile.htm	*/
/* Definiert den Platzhalter für die gesamte Liste */
ul.spezial-liste {
  list-style: none;        /* Entfernt den Standard-Punkt */
  padding-left: 1.4rem;    /* Schafft links Platz für das Sonderzeichen */
}

/* Gestaltet das Listenelement als Bezugspunkt */
ul.spezial-liste li {
  position: relative;      /* Wichtig für die Positionierung des Zeichens */
  margin-bottom: 0.05rem;  /* Abstand zwischen den Zeilen */
}

/* Fügt das Sonderzeichen exakt am Zeilenbeginn ein */
ul.spezial-liste li::before {
  content: "\2022";      /* Hier Sonderzeichen einfügen */
  position: absolute;    /* Löst das Zeichen vom Textfluss */
  left: -1.1rem;         /* Platziert das Zeichen links im geschaffenen Leerraum */
  color: #555;            /* Optionale Farbe für das Zeichen */
  /* font-weight: 600; */ 
  font-size:0.7rem;
  padding-top:0.313rem;
}
/*  E  Ende  Listengestaltung	*/


/*  A  Anfang  Gestaltung index.htm	*/
.inhverz {
    display: grid;
    grid-template-columns: 23.125rem 12.5rem; /*  370px 200px; oder: auto 192px; // 1fr 192px */
    grid-template-areas: "themen hgbild";
    align-items: center;
}

.themen {
    grid-area: themen;
}

.themen ul {
    margin: 0;
    padding: 0;
    list-style: none;
	width: 20rem; /* =320px; */
}

.themen li {
	line-height: 1.5;
}

.inh-bild {
    grid-area: hgbild;
    width: 192px;
    height: 297px;
    background-image: url(eckermann-foerster-uschr_02.png);
    background-repeat: no-repeat;
    background-position: center;
    /* background-size: cover; */
	margin-top:2.5rem;
}
/*  E  Gestaltung index.htm	*/






	
.zitat-liste, .zitat-fl, .zitat {
	font-family: Georgia, 'Palatino Linotype', 'Times New Roman', serif;
    font-style: italic;
    font-size: 1.073rem;
    color: #222;
	margin:0 1.06rem;
}

 .zitat-fl::first-letter {
    font-weight: bold;
 } 
 
 .zitat {
    margin:0;
 }


  .gotop {     /* nach Text */
     display: flex; 
	 justify-content: flex-end;
	 background: url(oben3.gif)top right no-repeat;
	 font-size:0.5625rem;
     margin: 1rem 3px 2px 0px;
   }
   
   .gotop-2 {   /* nach Bildern */
     display: flex; 
	 justify-content: flex-end;
	 background: url(oben3.gif)top right no-repeat;
	 font-size:0.5625rem;
     margin: -1.875rem 3px -0.937rem 0px;
   }
 
  /* zentriert Container */
   .center-01 {
     width: fit-content; 
	 margin: 0 auto;
   }

 /* zentriert nicht eingebundenen Container m. Text */
   .center-02 {
     text-align:center;
   }

  /* zentriert / funktioniert ohne umschließenden Container! */
   .center-03 {
     display:block;
	 max-width: max-content; /* eine width ist erforderlich */
	 margin: 0 auto;
   }
   
  /* zentriert ohne umschließenden Container, schafft aber einen Absatz/neue Zeile */
   .center-04 {
      display:flex;   /*  schafft aber einen Absatz/neue Zeile! */
	  align-items:center;
	  max-width: max-content; /*  geht wohl auch  width: fit-content;*/
	  margin: 0 auto;
   }
    
  
  /* nur auf Smph zeigen, nicht auf PC */
  .pc-hide {
     display:none;
  }


/* >>>>>>>>>>>>>>   Anfg. Desktop  BILDER plus Begleittext  Anfg. NEUE VERSION        >>>>>>>>>>>>>>>>>>>>>>>>>              */

/* ZEILE FÜR EINZELBILDER */
.bild-reihe {
	width:fit-content;   /* 94%; */
    text-align: center;
	margin-top: 2rem;
	margin-bottom: 2rem;
}


/* STANDARD-BLOCK  */
:is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) {
    display: inline-flex;
    align-items: flex-start;
	column-gap: 0.9rem;
    width: fit-content;
    max-width: 100%; 
}

 .bild-block-htitel-1, .bild-block-htitel-2  {
     column-gap: 1.1rem;
 }
 
/* BILD -  im Hoch- und Querformat */
:is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) img {
   display: block;
   width: auto;
   height: auto;
   max-width: 100%;
}

/* BEGLEIT-TEXT allg. Bilder */
:is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .text {
   text-align: center;
   max-width: 22rem;
   margin-top:0.5rem;
}

/*
:is(.bild-block-02a, .bild-block-03) .text {
  font-size:1.055rem;
  margin-top: -0.5rem;
 } */

 
	.bild-block-02a .text {
       font-size:1.055rem;
       margin-top: -0.5rem;
	  /* margin-left:-6px; */
     }
	 
	.bild-block-03 .text {
       font-size:1.055rem;
       margin-top: 0.625rem;
     }
	 
 :is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .text p {
    margin: 0;
}

.paarbild-links {
margin-left:-0.3rem;
margin-right:0.625rem; /* vertik. Abstand zw. beiden Bildern  */
}

.paarbild-rechts {
margin-right:-0.3rem;
margin-left:0.625rem;
}


/* Umfluss-Bilder und Text  */

.umflusstext {   /* umflusstext = textblock */
	margin-top:1.5rem;
    max-width: 900px;  /* bleibt in px */
    line-height: 1.3;
    font-size: 1.06rem;
}

.umflussbild {   /* umflussbild = floatbild */
    float: left;
	height: 152px;  /* bleibt in px */
	width: auto;
    margin: 0 1rem 0.625rem 0;
    object-fit: cover;
}

.umflusstext::after {
    content: "";
    display: table;
    clear: both;
}



/*     BEGLEIT-TEXT Buchbilder    */ 
:is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .buchtext {
   text-align: left;
   line-height:1.2; /* HIER NEUE KLASSEN FÜR VERSCHIED. LINE-HEIGHT BILDEN wg. line-height u. width */
   max-width: 22rem; /* besser wohl in Prozent */
}

.buchtext-01 {
line-height:1.2;
}

.buchtext-02 {
line-height:1.375;
}

:is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .buchtext p {
    margin: 0;
}

/*  Paarbilder-Bücher Text */
:is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .buchtext-klein {
   text-align: center;
   line-height:1.2;
   max-width: 22rem; /* = 352px; besser wohl in Prozent */
}

 /*  Paarbilder-Bücher: Überschriften/Titel */
.buchtext-klein-kopf {
   text-align: center;
   font-size:0.85rem; 
   font-weight:bold;
   margin: 0px 0px 0.25 0px; /* 4px */
}

:is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .buchtext-klein p {
    margin: 0;
	font-size:0.9rem; 
	font-weight:normal;
	text-align:left;
}

/*  BILDPAARE   */
.bild-paar {
    display: flex;
    justify-content: center;
    align-items: flex-start;
       /* gap: 1rem; */
       /* margin: 1rem auto; */
    width: fit-content;
	font-size: 0.85rem; /* muss hier stehen  */
    max-width: 100%;
	padding:1rem 0.5rem;
	border:1px solid #777777; /* muss aus opt. Gründen sein! */
}

.bild-block-01.klein img { /* das pure Bücherbild */
    max-width: 7.5rem;
}


/*   A  f. literatur.html - Bildchenreihe   */

/*   aufwenigere Lösung mit grid  
.bilder-grid {
    display: grid;
    gap: 15px;
    justify-content: center;
    grid-template-columns: repeat(5, 85px);
}

.bild-item {
    text-align: center;
}

.bild-item img {
    width: 85px;
    height: 120px;
    display: block;
}

.bild-item p {
    margin: 6px 0 0;
    font-size: 0.9rem;
    line-height: 1.2;
}  */




/*  Bildchen-Reihe in literatur.htm, einfachere Lösung m. flexbox  */
.bilder-grid {
    display: flex;
    flex-wrap: wrap;
    gap:1.5rem;   /* 24px */
    justify-content: center;
	font-size:0.815rem;
	line-height:1.30;
	margin-top:1.51rem;
}

.bild-item {
    height: 120px; /* bleibt in px */
	width:auto; /* 83px; */
    text-align: center;
}

.bild-item img {
    height: 120px; /* bleibt in px! 83px; */
	width:auto;
	margin-bottom:-0.5rem; /* -0.437rem , -8px */
}
/*   E  f. literatur.html - Bildchenreihe   */
/*     Ende Bilder + Text f. PC-Teil         */




/*    Anfang  @media                                                                                                                                                         */
/* >>>>>>>>>>>>>>  AB HIER  @MEDIA  RESPONSIVES DESIGN für kleine Bildschirme (Tablets:768px, Smartphones: übl. 320px hoch) <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */

@media (max-width: 40rem) { /* 640px = 40rem */

  body {
    font-size: 1.045rem; /* 1.04rem  PC 1.08rem;*/
	line-height: 1.6;
  }

  .inhalt {
    padding:0.8rem; /* 16px; */
	text-align:left; 
  }

 .banner {
	max-height:5rem;
	max-width:100%;
	background-size: 92% auto;
	box-sizing: border-box;
 }
	
 .topmenue {
	padding-left:1.25rem; /* 20px; */
	font-size:0.86rem;
	text-align: justify;
	line-height: 1.65;
  }

  /* f. 2. Menue unter Topmenue, z.B. in literatur  */
  .topmenue-2 {
    padding: 0.625rem 0.25rem 2px 1.31rem;
  } 
    
    .ziele-block {
      grid-template-columns: 1fr;
      row-gap: 0.3rem;
    }
	
	.ziele {
	  line-height: 1.8;
	}
   
   .label {
	max-width: 100%;
}

/*  nur auf PC zeigen, nicht auf Smph  */
.mob-hide {
      display: none;
   }
   
 /*  nur auf Smartphone zeigen, nicht auf PC  */
 .pc-hide {
     display:inline;
  }  
   
  h1 {
   padding: 0rem;
   font-size: 1.45rem;      /*  1.45 ;;  1.38 */
   margin: 1.5rem 0rem 3.3rem 0rem;   /*  0.75rem 0rem 3.8rem 0rem;   ;; 1.3 / 0 / 4.3 / 0rem */
   line-height:1.3;
   text-align:center;
 }

 /* f. lange Ü.schr. a. kl. Smph. */
 /* h1.h1klein {
   font-size: 1.38rem;
   margin: 1.3rem 0rem 3.8rem 0rem;
 } */
 
 h2 {
   font-size: 1.225rem; /* 1.225 */
   margin-top:2.5rem;
   margin-bottom:1.5rem;
   font-weight:600;
 }
 
  /* f. lange Ü.schr. a. kl. Smph. */
 h2.h2klein {
   font-size: 1.155rem;  /* 1.17 */
   margin-top:2.5rem;
   margin-bottom:1.5rem;
 }

 /*  h2.h2semi {
    font-weight:600;
 }  */
 
  h2.h2semi-margin {
    font-weight:600;
	margin-left:0.6rem;
 }
  
  h3 {
  	font-size: 1.1rem;
	margin: 1.95rem 0 1.25rem 0;
  }
  
  h2, h3, h4 {		/* .betont */
    color:#324152;  /* 2B3846 */
  }

/* Verweis auf literatur.htm */
  .verweis {
    display: flex; 
    justify-content: flex-end;
    font-size:0.92rem;
    margin-top:0.4rem;
  }
  
   .zitat {
	font-size: 1rem;
    line-height: 1.5;
	margin: 0;
}


/*  A  Anfang  Gestaltung index.htm	*/
@media (max-width: 680px) {
/*  h1 u. h2 gilt nur f. index.htm ! */
 h1 {
   margin-top:0.1rem; 
   font-size:2.8rem;
   line-height: 1.15;
   color:#333;
 }
 
 h2 {
   margin-top: -2rem;
   font-size: 1.65rem;
 }

 .themen li {
   line-height:1.8rem;
  } 

  .inhverz {
     grid-template-columns: 1fr;
     grid-template-areas:
       "hgbild"
       "themen";
  }

  .inh-bild {
     margin: 0 auto;
	 width: 129px;
     height: 200px;
	 background-image: url(eckermann-foerster-uschr_03-129.jpg);
	 margin-top:1.25rem;
  }
}

/*  E   Gestaltung index.htm	*/



  
 /* >>>>>>>>>>  BILDER f. SMARTPHONE - @media Anfg.: BLOCK  @MEDIA   >>>>>>>>>>>>>>>>>>                         */
    /* für alle Einzelbilder */
    :is(.bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) { /* Zahl kann erweitert werden */
        flex-direction: row;
        column-gap: 0.6rem; /* f. Titelbild */
        max-width: 100%;
    }

   /* f. (Buch-)Einzel-Bilder m. breitem linksbündigem Text, z.B. Top-Bild; ggf auch .bild-block-01a, .bild-block-01b,  */
	.bild-block-htitel-1 {
	  column-gap: 0.7rem;
	}
	
	.bild-block-htitel-2 {
	  column-gap: 0.4rem;
	}
	
    /* Bilder dynamisch verkleinern */
	/* für Hochformat Einzelbild/Topbild */
    :is(.bild-block-01, .bild-block-htitel-1) img {
	  width: clamp(8rem, 30vw, 10rem);
    }
	
	/* für Hochformat Einzelbild mittelgroß */
    :is(.bild-block-01a) img {
	  width: clamp(6rem, 26.8vw, 7rem);
    }
	
	/* für Querformat u. schmaler Text */
	:is(.bild-block-02) img {
 	  width: clamp(8rem, 52vw, 12.5rem);
    }
	
	/* für Querformat u. breiter/viel Text */
	:is(.bild-block-02a) img {
 	  width: clamp(8rem, 40vw, 12.5rem);
	}
	
	/* für eher quadratisches Format */
	:is(.bild-block-03) img {
 	  width: clamp(8rem, 32vw, 10.5rem);
    }
	
	.bild-block-03c {
	  margin-left:1.87rem;
	  margin-right:-1.87rem;
	}
	
	

	/* für Paarbilder-Bücher */
   .bild-paar img {
	  width: clamp(5rem, 28vw, 6.5rem);
    }

    /* Text */
    :is(.bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .text {
        flex: 1;
        max-width: 60%; /* bricht lange Zeilen um */
		line-height:1.3;
		font-size:0.93rem;
    }
	
	.bild-block-02a .text {
       font-size:0.91rem;
       margin-top: -0.3rem;
	   margin-left:-0.375rem;
     }
	 
	.bild-block-03 .text {
       font-size:0.91rem;
       margin-top: 0.625rem;
     }
	 
	 
	
	/* Schriftgröße und Abstände bei viel Text verkleinern  */
	:is(.bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .text-kl {
        flex: 1;
        /* max-width: 60%; */ /* bricht lange Zeilen um */
		line-height:1.3;
		font-size:0.9rem;
		margin-left:-0.8rem; /* f. Text Hannch. Grab einzeilig in bild-block-2a */
		margin-top:-0.33rem;
		max-width: 100%;
    }


  /* :is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .buchtext {
       text-align: left;
       line-height:1.2;
       max-width: 22rem;
}

    :is(.bild-block, .bild-block-01, .bild-block-01a, .bild-block-01b, .bild-block-htitel-1, .bild-block-htitel-2, .bild-block-02, .bild-block-02a, .bild-block-03, .bild-block-04, .bild-block-05) .buchtext p {
    margin: 0;
    }  */
	
	.buchtext-klein {
	   padding-left:2px;
	}
	
	.zlhoehe-break {
	line-height:1.26;
	}
	
		
    /* Bildpaare */
    .bild-paar {
        flex-direction: column;
        align-items: center;
        gap: 2rem;    /* horiz. Abst. zw. den beiden Paaren */
        margin: 0.5rem auto;
		width:98%;
		padding-left:0;
		padding-right:0;
    }	
	
	.paarbild-links {
	   margin-left:0.3rem;
	   margin-bottom:0.6rem; /* horiz. Abstand zw. beiden Bildern  */
	 }
	
	.paarbild-rechts {
	   margin-right:0.2rem;
	}
	
	
/* A  f. mehrere Bilder nebeneinander, s. literatur.html */
     /* Tablet m. 550px Bildschirm */
    /* @media (max-width: 550px) {
	 
         .bilder-grid {
         grid-template-columns: repeat(3, 83px);
		 gap: 4rem 1rem;
        }
      } */

/* Smartphone m. 360px Bildschirm */
   .bilder-grid {
        grid-template-columns: repeat(2, 5.1875rem);
		/* row-gap:4rem; */
		gap: 4rem 1rem;
    }

    /* 5. Element mittig unter den anderen */
    .bilder-grid .bild-item:last-child {
        grid-column: 1 / span 2;
        justify-self: center;
    }
/* E  f. mehrere Bilder nebeneinander, s. literatur.html */

  
  
  /* Umfluss-Bilder und Text  */

    .umflusstext {   /* umflusstext = textblock */
       max-width: 900px; /* soll wohl in px sein */
       line-height: 1.3;
       font-size: 1.04rem;
    }

    .umflussbild {   /* umflussbild = floatbild */
       float: left;
	   height: 152px;  /* bleibt in px */
	   width: auto;  /* hkf*/
       margin: 0 0.75rem 0.625rem 0;  /* 0.625rem */
       object-fit: cover;
    }


} /* E BLOCK  @MEDIA - BILDER f. SMARTPHONE  */


  /* }   Klammer gehört wohl zu ob. @media only screen and (max-width: 768px)*/



}  /* E @media (max-width: 40rem) {  640px = 40rem */  



/*
-->
</style>
*/