﻿/*
  Dieses CSS wird benutzt seit: 01.10.2019
*/
 

/*  
   ***************************************************************************************
   0. Dokumentenweite Einstellungen
   ***************************************************************************************
*/   

   body {
	    font-family: Tahoma, Verdana, Arial, Geneva, Helvetica, sans-serif;
	    font-size:90%; 
	    line-height:130%; 
	    margin:0px 15px 0px 15px;
	    background-repeat:no-repeat;
   }

   body.withbackground {background-image:url(../i/bg.png);}
   
   img { border:none;} /* Bilder haben nie einen Rahmen */     
   
   im.loc,
   im.sec,
   im.ext {width: 11px, height:11px}


/*  
   *************************************************************************************************************************
   1. Vorhandene Elemente, die aber nicht angezeigt werden sollen
   *************************************************************************************************************************
*/   

   img.sec{display:none}         /* sec-Icon bei Volltexten */
   .en {display:none}            /* Englische Texte sind per default nicht sichtbar */

   /* Beim Ausdruck sollen folgende Elemente nicht gedruckt werden: */
   @media print {	
    	img.p, 
	    div.notfound, 
	    a.amazon, 
	    form.google, 
	    button {display:none;}
   }

/*  
   *************************************************************************************************************************
   2. Titelmenu und Menubalken
   *************************************************************************************************************************
*/   

   #titelmenu {
      margin-top:10px;
	    margin-bottom:0px;
	    padding-left:10px;
      white-space:nowrap;     /* notwendig, damit die Menublöcke einzeilig bleiben */
   }
	
   #titelmenu li {
	    list-style-type:none;
	    display: inline-block;
	    min-width:60px;
	    max-width:60px;
	    width:60px;
	    margin: 0px 3px 0px 3px;
	    padding:9px 8px 8px 8px;
	    text-align:center;
	    z-index:1;
   }

   #titelmenu li a {
	    text-align:center;
   }

   #titelmenu li a img{
    	display:block;
	    margin-left:6px;
	    width:  48px;
	    height: 48px;
	    margin-bottom:0px;
   }

   #titelmenu li.search{color:silver;}

   #mobilnavigation {display:none}
   #mobilnavigation {font-style:italic;}
   #mobilnavigation li {border-style:solid;border-color:silver;border-width:1px;width:58px;min-width:55px}

   #searchbox input {width:50px;}

   #menubalken {
	    margin-left:-15px;
	    margin-right:-15px;
	    margin-bottom:0px;
	    padding-left:40px;
	    padding-top:5px;
	    padding-bottom:5px;
	    font-size:80%;
      border-style:solid;
	    border-width:0px 0px 0px 0px;
	    border-color:silver;
	    box-shadow: -1px 5px 5px #888;
	 }

   img.titelbild {max-height:400px}

   .titelbild  {
      border-style: none; 
	    border-width: 1px;
	    border-color:grey;
	    margin-left:15px;
	    filter: drop-shadow(10px 5px 5px #888);
	 }

   @media (max-width:900px) { 
      #titelmenu li.g     {display:none}
   } 
 
   @media (max-width:820px) { 

 		  #titelmenu          {white-space:normal;}               /* Jetzt dÃ¼rfen die einzelnen MenublÃ¶cke sich auf mehreren Zeilen verteilen */
	    #titelmenu li       {margin: 3px}
	    #titelmenu li.g     {display:inline-block}
	    #titelmenu li a img {display:none;}                    /* Verberge die Icons im Menu */
      #menubalken         {display:none}                     /* Verberge den Menubalken, da eh nicht antippbar */
   }    

   #obenrechts {
	    position: fixed;
      top: 28px;
      right: 1%;
      z-index:1000
   }

/*  
   ***************************************************************************************
   3. Dynamischer Kopfbereich (wird kleiner beim nach unten scrollen)
   ***************************************************************************************
*/ 

#outerheader  {
	background-color:rgba(196,196,196,0.5);
	margin:-15px;padding:15px 15px 0px 15px
  }

header {
		width: 100%;
		padding-left:-15px;
	}	

	.header-fix {
		position:fixed;
		top:-69px;
		filter: grayscale(1);
		-webkit-filter: grayscale(1);
/*		transition: 0.5s; */
		z-index:500;
		background-color:#f0f0f0;}


/*  
   *************************************************************************************************************************
   4. Überschriften h1, h2
   *************************************************************************************************************************
*/   

    h1 {
	    margin-left:15px;
	    margin-top:40px;
	    line-height:150%
    }
    
  
/*  
    h1.haupttitel {
       display: flex; 
       align-items: center;
       margin-top:15px;
    }
*/      
    h1.haupttitel img {margin-left:5px}

		body.o04 main h1:before {content: "Frage: ";   display:block;color:#AAAAAA}
    body.o05 main h1:before {content: "Aussage: "; display:block;color:#AAAAAA}

    h2 {
	    display: flex;
	    align-items: center;
    }

    @media (max-width:820px) { 
    	h1 {font-size:150%}
	    h2 {font-size:120%}
    }


/*  
   ***************************************************************************************
   5. Links
   ***************************************************************************************
*/   

    a {text-decoration:none;} 
    ul.b a.b {font-weight:bold}
    a.amazon {font-size:75%;} 

		a.p img.icon, span.p img.icon {border-radius: 50%;}    



/*  
   ***************************************************************************************
   6. Originaltexte (Breite und Anordnung)
   ***************************************************************************************
*/  
  
  /* 
     Originaltextsammlungen sind in einem div.grid eingepackt. 

     Jede Originaltextbox (z_mz) enthÃ¤lt dann wieder zwei divs:
     - Das Zitat (.z00 oder .z00plus)
     - Die Quellenangabe (.qua2)

     Zitate gibt es schmal (.z00) oder breit (.z00plus)
     
  */
  
   .z_mz, .z {
      margin:2ex;
   } 	
   
   div.grid div.o_mz, 
   div.grid div.z_mz, 
   div.grid div.z {
      float:left; 
      width:38ex;
   } 
   
   .z12plus_mz, 
   .z15plus_mz, 
   div.blahfasel {
      max-width:79ex;
   } 
  
   .z, 
   .z12plus, 
   .z14plus, 
   .z15plus {
      min-width:80ex; 
      width:80ex;
   }

   .qa2 {font-size: 70%;}	


   @media (max-width:820px) { 

       div.grid div.o_mz, 
       div.grid div.z_mz, 
       div.grid div.z {
          float:left; 
          width:36ex;
          max-width:36ex;
      }
      
	    .z12plus_mz, 
	    .z15plus_mz, 
	    div.blahfasel {
		      min-width:35ex ; 
		      max-width:35ex
		  } 
	
	    .z, 
	    .z12plus, 
	    .z15plus , 
	    .z14plus {
	    	  min-width:35ex; 
	    	  width:35ex; 
	    	  max-width:35ex}    	
   }

/*  
   ***************************************************************************************
   7. Originaltext-Boxen (Aussehen)
   ***************************************************************************************
*/

   /* Eigenschaften aller Sprachboxen */

.z7plus, .z7plus_mz, .z12, .z12plus, .z12plus_mz, 
     .z14, .z14plus, .z14plus_mz, 
     .z15, .z15plus, .z15plus_mz,  
     .z16, .z16plus, .z16plus_mz, 
     .z22, .z22plus, .z22plus_mz,
     div.blahfasel, span.z     
       {
	   font-family:  Verdana, Arial, Helvetica, sans-serif; 
	   color:#000000; 
	   padding:1ex;
	   background-color:#EEEEEE;
	   min-height:6ex;
	   box-shadow: 10px 10px 5px #888;
	   margin-bottom:10px;
	   margin-top:10px;
	   line-height:150%;
	   display:table;
	   }

/* Zusaetzliche Eigenschaften von Definitionen (o12) */
.z12, .z12plus, .z12plus_mz {
	   border-style: solid;  
	   border-width: 0px 0px 0px 5px;
	   border-color:#444;
	  }

/* Zusaetzliche Eigenschaften von Zusammenfassungen, Bemerkungen und Biographien */
.z7,  .z7plus,  .z7plus_mz,
.z14, .z14plus, .z14plus_mz,
.z15, .z15plus, .z15plus_mz, 
.z16, .z16plus, .z16plus_mz, 
.z22, .z22plus, .z22plus_mz,
div.blahfasel 
       {
	   border-style: dotted; 
	   border-width: 0px 0px 0px 5px;
	   border-color:#444;  
       }
 

/*  
   ***************************************************************************************
   8. Icons bei Aufzählungen
   ***************************************************************************************
*/  
   ul.b { list-style-image:url(../i/folder_icon.gif) }
   ul.b ul { list-style-image:url(../i/topic_icon.gif) }

   li.b { margin-top:5px;  }
   ul.t { list-style-image:url(../i/topic_icon.gif) }

   ul.k { list-style-image:url(../i/b2.gif); 
          font-family: Tahoma, Arial, Helvetica, sans-serif;
          font-size:9pt;
   }

/*  
   ***************************************************************************************
   9. SVG-Objekte
   ***************************************************************************************
*/  

   svg object {margin:auto; }

   div.svg {
	    background:white;width:90%;margin-left:5%;
	 }

   div.svg:hover {
      box-shadow:10px 10px 20px 10px grey inset;
	    background: -moz-linear-gradient(100% 100% 90deg, silver, #FFFFFF); 
	    background: -webkit-linear-gradient(#FFFFFF, silver); 
	    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(silver));
	 }


/*  
   ***************************************************************************************
   20. Sparklines
   ***************************************************************************************
*/   

	.a-sparkline, 
	.b-sparkline,
	.f-sparkline, 
	.p-sparkline, 
	.t-sparkline {width:40px; float:left;text-align:right}

/*  
   ***************************************************************************************
   21. Warnbox (zu neu / zu alt)
   ***************************************************************************************
*/ 

   div.archive-warning {
	    border-style: dashed; 
	    border-width: 1px;
	    background:#EEEEEE;
	    margin:15px;
	    width:80ex;
	    min-width:150px;
	    max-width:90%;
	    min-height:45px;
	    padding:4px;
	    vertical-align:middle;
   }

   div.archive-warning img {
      float:left;
   }

/*  
   ***************************************************************************************
   22. Preview-Bildern beim Hoovern
   ***************************************************************************************
*/ 

   #preview{
	    position:absolute;
	    display:none;
	    max-height:90px;
	    box-shadow: 10px 10px 5px 5px rgba(128,128,128, 1);
	    -webkit-box-shadow: 10px 10px 5px #888;
	}

	#preview img {
		max-height:80px;
		border:solid;border-width:1px;
}

/*  
   ***************************************************************************************
   23. visJs (Die Farben sind im js-File definiert)
   ***************************************************************************************
*/  	

   #visZitationsGraph,
   #visTagCloud,
   #visBegriffsNetzwerk
    {
      height: 50vh;
      resize: vertical;
      overflow:auto;
   }

   #visStatistikDiagramm {
	    margin-top:20px
   }

   #visZeitleiste div.vis-item-content img {
   	  height:80px;
   	  float: left;
   	  padding-right:10px;
   }

/*  
   ***************************************************************************************
   24. Vortragsfolien
   ***************************************************************************************
*/  

	img.folie {width:200px; box-shadow: 10px 10px 5px #888;margin:10px}
	img.folie:hover {width:500px}

/*  
   ***************************************************************************************
   25. Zebratabellen
   ***************************************************************************************
*/ 
  #mitglieder td, #mitgliedschaften td {padding:15px}

  #mitgliedschaften tr:nth-child(odd),
  #mitglieder tr:nth-child(odd) {background: #ffeffe}



/*  
   ***************************************************************************************
   26. Filter-UI bei ErwÃ¤hnungen
   ***************************************************************************************
*/  

   div.typfilter {margin:10px;padding:10px;background-color:#EEEEEE;}
   div.typfilter div {display:flex}
   div.typfilter div div {display:inline}
   div.typtitel {font-weight:bold; }


/*  
   ***************************************************************************************
   30. Responsive / Mobile
   ***************************************************************************************
*/

   /* Wenn das Fenster <820px, dann ....: */
   @media (max-width:820px) { 

		  #buchverweise > thead > tr > th:nth-of-type(n+6),    
      #textverweise > thead > tr > th:nth-of-type(n+6),
      #buchverweise > tbody > tr > td:nth-of-type(n+6),
      #textverweise > tbody > tr > td:nth-of-type(n+6) {display:none}
    
      tr.bibtitel > td:nth-of-type(3),
      tr.bibtitel > td:nth-of-type(4),
      tr.bibtitel > td:nth-of-type(5),
      tr.bibtitel > td:nth-of-type(7),
      tr.bibtitel > td:nth-of-type(11),
      tr.bibtitel > td:nth-of-type(12),
      tr.bibtitel > td:nth-of-type(13)     {display:none}
    
      tr.bibbody > td:nth-of-type(3),
      tr.bibbody > td:nth-of-type(4),
      tr.bibbody > td:nth-of-type(5),
      tr.bibbody > td:nth-of-type(7),
      tr.bibbody > td:nth-of-type(11),
      tr.bibbody > td:nth-of-type(12),
      tr.bibbody > td:nth-of-type(13) {display:none}
    
      #objektmenus, 
      #statistikmenus, 
      #mobilnavigation {display:inline;}
    
      #obenrechts {
         position: static; 
    	   display:none;
    	   top: unset;
         right: unset;
         z-index:unset}
      
		  img.titelbild {max-width: 100px;  }  
		  
		  img.helptext {display:none}  

      div.vis-configuration-wrapper {display:none !important} /* Konfigrationsmenu fÃ¼r vis-Grafiken ausblenden */

   }
 
  
   @media (max-width:600px) {

    h2 img {height:1em}
    td.vleft1,td.vleft2,td.vleft3,td.vleft4,td.vleft5,td.vleft8 {display:none}
    #buchverweise > thead > tr > th:nth-of-type(2),
    #buchverweise > tbody > tr > td:nth-of-type(2),
    #buchverweise > thead > tr > th:nth-of-type(5),
    #buchverweise > tbody > tr > td:nth-of-type(5) {display:none}

    #textverweise > thead > tr > th:nth-of-type(2),
    #textverweise > tbody > tr > td:nth-of-type(2),
    #textverweise > thead > tr > th:nth-of-type(5),
    #textverweise > tbody > tr > td:nth-of-type(5) {display:none}
}

#buchverweise img,
#textverweise img {max-width: 100px;} 

/*  
   ***************************************************************************************
   X. .o21 Einstellungen
   ***************************************************************************************
*/


		body.o21 ol a, body.o21 div.h2c ol span
			{
				overflow:hidden;
				text-overflow: ellipsis;
				max-width:325px;
				display:inline-block;
				line-height:110%;
				vertical-align:-40%;
				white-space: normal;
				
			}

		.o21 a.w img, .o21 .b img, .o21 .t img {
			display:block;
			margin-bottom:10px;
			margin-right:0px;
			max-width:80px;
			margin-left: auto;
		  margin-right: auto;
		  }
		
		body.o21 a.w {
			text-align:center;
				min-width:100px;
				width:100px;
				white-space: normal;
				}
			
		.o21 .b, .o21 .t {
			text-align:center;
				width:200px;
				white-space: normal;
				}
		
		.o21 .b,
		.o21 .t,
		.o21 .p 
		 {min-width:200px;}		
		 
		.o21 .a,
		.o21 .f
		 {min-width:325px;}		
		
		.o21 ol a.b,
		.o21 ol a.t,
		.o21 ol a.f,
		.o21 ol a.a
		 {white-space: normal;}

/*  
   ***************************************************************************************
   50. Suchformulare
   ***************************************************************************************
*/ 


		div.notfound {clear: left} 

		/* Alle Suchformulare gleich hoch und grau hinterlegt */
		.notfound form {
			height:140px;
			margin-top:10px;
			padding:10px;
			padding-top:15px;
			background-color:#EEE}

		/* Alle Suchfelder und Knöpfe gleich breit */
		.notfound input[type=text],
		.notfound input[type=submit] {
			margin:10px;
			width:175px
			}
		
		/* Das Suchicon von Amazon auf einer neuen Zeile */
			.notfound input[type=image] {display:block !important}
		
		form.google, { float:right !important;}
		form.google input {	font-size:8pt;}
		
		span.amazon {font-family:verdana,arial,helvetica; font-size:50%;}

/*  
   ***************************************************************************************
   51. Sortierbare Tabellen
   ***************************************************************************************
*/ 

		table.sortable {width:95%}

		table.sortable a.sortheader {
		    background-color:#eee;
		    color:blue;
		    font-weight: bold;
		    text-decoration: none;
		    display: block;
		}

		table.sortable span.sortarrow {
		    color: black;
		    text-decoration: none;
		}

		table.sortable th {text-align:left}

/*  
   ***************************************************************************************
   X. UNSORTED
   ***************************************************************************************
*/   

img.p {max-height:350px}

img.lesestatus {
	width:64px;
	float:left;
	margin:5px;
}

div.toplist {
	float:left;
	padding:1ex;
	margin:1ex;
	border-width:1px;
	border-color:silver;
	border-style:solid;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color:white;}
	
	

main {margin-top:25px}
.main-fix {margin-top:135px}

.bibtitel {background-color: #DDDDDD; font-weight:bold; font-size:90%;}
.bibbody, .box  {background-color: #EEEEEE; font-size:90%;}

.webtechnisches {
    font-family:"Courier New", courier, monospace;
    font-size:x-small;  
    margin:10px; margin-bottom:1px;line-height:50%;
   }
   

/* Begriffslisten */

div.sort {margin-left: 20px;}

div.grid  {margin-left: 15px;margin-bottom: 1em}
div.grid div.w_mz {float:left;width: 40ex;}  



img.w, img.b {float:left;margin:40px;}
img.w {max-height:256px;background-color:white}

div.bib, div.au, div.au2, div.ut, div.ut2, div.linkform, p, div.grafikhelp, div.svghelp {margin-left: 15px;}

div.au2, div.ut2 {margin-bottom:15px}



/* Kleines Icon (22.1.04 - ) */

   img.icon {height:10ex; float:left; margin-right:10px;margin-bottom:5px;} 

/* Icon bei Personenboxen sind kleiner */
   .p_box img.icon {height:6ex}


  
/* Buecher einer Person (04.02.04 - ) */

    img.bicon {float:left;margin-right:5px;}

		
div.p_box:hover {box-shadow: 3px 3px 1px #888;}

span.kuerzel {font-size: 200%; font-weight:bold; position: relative;top:10px}

p.titel {font-weight:bold; margin:1px;}
p.untertitel, p.originaltitel, p.originaluntertitel {margin:1px;}
      
/* not found */

.nf1, .nf2,.nf4, .nf5, .nf8 { 
	border-right-style:dotted;
	border-right-width:1px;
	vertical-align:bottom;
       }





table.gehtsum {border:0; margin:10px;}
table.gehtsum td {padding:5px}

#tp { width:100%}

#tp td {padding:4px;vertical-align:top}

#showall {
	margin-top:25px;
	padding:15px;
	margin-left:75px;
	font-weight: bold;}
	
#showall:hover {
	background-color:#BBB;
}



td.vleft1, td.vleft2, td.vleft3, td.vleft4, td.vleft5, td.vleft7, td.vleft8 {
	border-style: none;
	border-right-style:solid;
	border-width:5px;
	vertical-align:top;
	padding-top:10px;
	padding-bottom:10px;
	text-align:center}
	
td.st {color: gray;text-align:right} /* Statistik */	


#mitglieder, #mitgliedschaften {width:auto;margin-left:15px;}	

span.untert2 {font-style:italic;}


div.grafikhelp, div.grafikhelplink {font-size:70%;text-align:center; font-style:italic;margin-top:5px;vertical-align:text-bottom}



div.invisible, div.applet-invisible {display:none}
div.visible, div.applet-visible {display:block}



div.datenquellen {margin-left:20px}

div.social {margin-left: 10px}

.social ul {
	display: inline;
	padding: 0;
	margin: 0;}

.social li {
	background: none;
	display: inline;
	list-style-type: none;
	margin: 0;
	padding: 2px;}

.social ul li:before { content: ""; }
.social img { border: 0; }

.j00, .j0, .j1, .j2, .j3, .j4, .j5, .j6, .j7, .j8, .j9 {border-width:0px 0px 0px 5px;border-style:solid;padding:4px;zoom:1;}
.j0 {border-color:#ff0000}
.j1 {border-color:#ffaa00}
.j2 {border-color:#ffff00}
.j3 {border-color:#aaffaa}
.j4 {border-color:#aaffff}
.j5 {border-color:#00ffff}
.j6 {border-color:#0000ff}
.j7 {border-color:#aaaaaa}
.j8 {border-color:#aaaaaa}
.j00 {border-color:#dddddd}
ul.t .j00 {border-width:0px}

#my-timeline {margin-left:15px;margin-right:15px;}


	  


div.begriffsnavigation {
	float:right;
	width:300px;;
	margin:5px;
}

ul.jahreszahlen li,
ul.iconboxen li,
ul.buchstaben li	{float:left;
                   list-style-type:none;
                   display: inline-block;	
                   font-size:130%;
                 }


ul.iconboxen li		{     width:22ex;
                        max-width:50ex; 
                        min-height:50px;
                        margin:1ex;
                        }
                        
ul.buchstaben li	{     width:2ex;
                        margin:0.5ex;
                        text-align:center;}

ul.jahreszahlen li {width:6ex; margin:0.5ex;text-align:center;}
                        
ul.iconboxen li img { vertical-align:middle}
ul.buchstaben li a {  text-align:center;}

#my-timeline {
	height:500px;
	}


	
p.erklaerungen {width:80ex;}	

div.standorte {margin-left:15px}




/*
   x. Fusszeilen
   -------------
*/   

#qrcode {margin:15px;}



span.z {font-style: italic;margin-left:0px;margin-bottom:20px;display:block}

span.z::before, span.z::after {content: '"';}
	

td a.w, td span.w {vertical-align: middle;padding:15px;line-height:4;}

td a.w img, td span.w img  {height:40px; vertical-align: middle;margin-right:15px}
.w img {margin-right:10px}


div.fuenfzig {
	float:left;
	width:44%;
	min-width:250px;
	padding:10px;
	background:#eee;
	margin:10px;
	
}

h2 span.i18n {margin-right:0.5ex}


@media screen {

	ol a.p, ol span.p, table.gehtsum a.p, table.gehtsum span.p, .au2 .p,
	ol a.b, ol span.b, table.gehtsum table tr td:nth-child(4) a.b, table.gehtsum table tr td:nth-child(4) span.b, .bib .b,
	ol a.t, ol span.t, table.gehtsum table tr td:nth-child(4) a.t, table.gehtsum table tr td:nth-child(4) span.t, 
	table.bem a.b, table.bem span.b,
	table.bem a.t, table.bem span.t,
	a.w, span.w,
	a.a, span.a,
	a.f, span.f,
div.au a.j {

    line-height:240%;
    padding:5px;
    border-style:solid;
    border-width:thin;
    border-color:grey;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    margin-left:3px;
    margin-right:3px;
    margin-top:10px;
	}
}

/* ***************************************************************************************
   60. Autocomplete-Suchfelder (Begriffe, Personen, Fragen, Aussagen)
   ****************************************************************************************/

/* Gemeinsame Basis */
.bn-suchwrapper   { text-align: center; padding: 1em 0 1em 0; }
.bn-suchcontainer { position: relative; display: inline-block; margin: 0.5em auto .5em auto; }
.bn-suchinput {
    width: 420px; padding: 10px 16px; font-size: 1.5em;
    border-radius: 6px; box-sizing: border-box; border: 1px solid #aaa;
}
.bn-dropdown {
    display: none; position: absolute; top: 100%; left: 0;
    width: 100%; max-height: 380px; overflow-y: auto;
    background: #fff; border: 1px solid #aaa;
    border-radius: 0 0 6px 6px; list-style: none;
    margin: 0; padding: 0; z-index: 1000;
    box-shadow: 0 3px 8px rgba(0,0,0,0.18);
}
.bn-dropdown li { padding: 6px 14px; cursor: pointer; font-size: 1.2em; }

/* Begriffssuche - hellblau */
#bn-suche              { background: #deeeff; border-color: #aaa; }
#bn-suche::placeholder { color: #7aaacc; }
#bn-dropdown li:hover,
#bn-dropdown li.active { background: #deeeff; }

/* Personensuche - hellviolett */
#pn-suche              { background: #ede3f8; border-color: #bbaad0; }
#pn-suche::placeholder { color: #aa88cc; }
#pn-dropdown           { border-color: #bbaad0; }
#pn-dropdown li:hover,
#pn-dropdown li.active { background: #ede3f8; }

/* Fragensuche - hellgelbgrün (passend zur Fragefarbe #cddc39) */
#fq-suche              { background: #f5f8d0; border-color: #a8b820; }
#fq-suche::placeholder { color: #8a9a10; }
#fq-dropdown           { border-color: #a8b820; }
#fq-dropdown li:hover,
#fq-dropdown li.active { background: #f5f8d0; }

/* Aussagensuche - hellgrün (passend zur Aussagenfarbe #8bc34a) */
#aq-suche              { background: #E8F3DB; border-color: #6F9C3B; }
#aq-suche::placeholder { color: #53752C; }
#aq-dropdown           { border-color: #6F9C3B; }
#aq-dropdown li:hover,
#aq-dropdown li.active { background: #E8F3DB; }

body.withbackground #showall { display: none; }

/* ------------------------------------------------------------------
   Fluent-Icons (seit 27.10.2026, neu in screen12.css)
   Icons in i/fluent/*.svg (Fluent UI System Icons, MIT, eingefaerbt),
   Dateiname = Name des ersetzten Icons in i/ (i02.svg ersetzt i02.png).
   ------------------------------------------------------------------ */

/* Menue: weisse Linien-Icons auf den farbigen Kacheln */
#titelmenu li a img[src^="i/fluent/"] {filter: brightness(0) invert(1);}

/* kleine Icons im Text (lokal, Web, PDF, Link ok, News-Markierung ...) in Textgroesse */
img[src^="i/fluent/"]:not(.icn), img.icn[src$="m.svg"] {height: 1.05em; width: auto; vertical-align: -0.15em;}
img.helptext[src^="i/fluent/"] {height: 0.9em;}

/* Typ-Spalte links in den Verweislisten */
td[class^="vleft"] img[src^="i/fluent/"] {height: 24px; vertical-align: middle;}

/* Ueberschriften: Platz wie die alten 48-px-PNGs (Balkenhoehe bleibt), Icon selbst 36 px.
   Icon steht unter dem Home-Icon, der Titeltext beginnt buendig mit dem Wort "Themen" im Menue
   (Menue-Kacheln 76 px breit, ab x=28 px). */
h2 img.icn, h2 img[src^="i/fluent/"]:not(.helptext) {height: 36px; width: auto; padding-top: 6px; padding-bottom: 6px; vertical-align: middle;}
@media (min-width: 821px) {
  h2 img.icn, h2 img[src^="i/fluent/"]:not(.helptext) {padding-left: 33px; padding-right: 42.6px;}
  /* Knopf "Alle Abschnitte anzeigen" ebenfalls buendig mit "Themen" (Textbeginn bei 126.6 px) */
  #showall {margin-left: 111.6px;}
}

/* QR-Code unten auf der Seite buendig mit dem Text seines Titels "QR-Code dieser Seite" */
#qrcode {margin-left: 54px;}
@media (min-width: 821px) {#qrcode {margin-left: 111.6px;}}
@media (max-width: 600px) {#qrcode {margin-left: 35px;}}
@media (max-width: 600px) {
  h2 img.icn, h2 img[src^="i/fluent/"]:not(.helptext) {height: 1em; padding-top: 0; padding-bottom: 0;}
}

/* zugeklappte Ueberschrift: Icon in der Textfarbe (schwarz, auf dunklen Typfarben weiss) */
h2.inactive img[src^="i/fluent/"] {filter: brightness(0);}
h2.inactive:is(.o1, .o2, .o26, .o3, .o29, .o17) img[src^="i/fluent/"] {filter: brightness(0) invert(1);}
/* i79 (Beat-Zeichnung, kein Fluent-Icon) bei weisser Titelschrift ebenfalls weiss */
h2.inactive:is(.o1, .o2, .o26, .o3, .o29, .o17) img[src$="i79.png"] {filter: invert(1);}

/* Aufzaehlungszeichen der Kapitel-/Textlisten */
ul.b { list-style-image: url(../i/fluent/folder_icon.svg) }
ul.b ul, ul.t { list-style-image: url(../i/fluent/topic_icon.svg) }

/* Headerzeile (#menubalken): Die Wort-Links (Abkürzungen, Alle, Lateinische, Meistvernetzte ...) stehen im HTML
   ohne Leerzeichen hintereinander - Abstand per CSS (27.10.2026). Die Buchstaben A-Z sind durch Zeilenumbrüche getrennt. */
#menubalken a:has(> span.i18n), #menubalken small a {margin: 0 0.35em;}

/* Hitlisten (t_visited.html usw.): Vorschaubilder der Texte 125 px breit (Dateien sind 250 px) (27.10.2026) */
td.box a img[src^="thumbs/"] {width: 125px; height: auto;}

/* Schmale Bildschirme (28.10.2026): Titeltext als ein Fliesstext statt einzelner Flex-Elemente pro <span>
   (sonst bricht z.B. "Diese Zeitschrift" fuer sich zweizeilig um), haengender Einzug neben dem Icon
   (Icon 1em + 12 px + 6 px Abstand aus theme-material8.css; :has erhoeht die Spezifitaet ueber theme-material8 h2, Titel ohne Icon bleiben unberuehrt) */
@media (max-width: 600px) {
  h2:has(> img) {display: block; padding-left: calc(15px + 1em + 18px); text-indent: calc(-1em - 18px);}
  h2 img {vertical-align: -0.1em;}
}


/* ===========================================================================================
   changes.html (VBA aktuelles_2026, 28.10.2026): H1, Typ-Kacheln als Filter, Zeitleiste 30 Tage.
   Alles unter .cv bzw. .tech, Typfarben über .ty-p/.ty-b/... (nicht .p/.b..., die sind belegt)
   =========================================================================================== */

.cv, .tech { --rand:#e0e0e0; --grau:#616161; }
.cv .ty-p {--c:#9c27b0} .cv .ty-b{--c:#ff5722} .cv .ty-t{--c:#ff9800} .cv .ty-w{--c:#0288d1} .cv .ty-f{--c:#9e9d24} .cv .ty-a{--c:#689f38}
.cv *, .cv *::before { box-sizing:border-box; }
.cv { max-width: 1180px; }
.cv-intro { background:#fff; border:1px solid var(--rand); border-radius:6px; padding:14px 16px; margin:14px 0 18px; }
.cv-intro p { margin:0 0 10px; color:var(--grau); }
.cv .kacheln { display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); gap:10px; }
.cv .kachel { display:grid; grid-template-columns:36px 1fr; grid-template-rows:auto auto auto; column-gap:10px;
          text-decoration:none; color:#212121; background:#fff; border:1px solid var(--rand);
          border-top:5px solid var(--c); border-radius:6px; padding:10px; cursor:pointer; }
.cv .kachel > img { grid-row:1 / 4; width:32px; height:32px; max-width:none; margin:0; align-self:center; }
.cv .kachel .kz { font-size:1.6em; font-weight:bold; color:var(--c); line-height:1.1; }
.cv .kachel .kl { font-weight:bold; }
.cv .kachel .kd { font-size:.8em; color:var(--grau); }
.cv .kachel.aus { opacity:.35; }
.cv .kachel:hover { box-shadow:0 2px 6px rgba(0,0,0,.15); }

.cv .zeitleiste { background:#fff; border:1px solid var(--rand); border-radius:6px; padding:12px 16px 12px; margin-bottom:18px; }
.cv h1.cv-titel { display:flex; align-items:center; gap:12px; margin:48px 0 0; padding:0; font-size:1.8em; line-height:1.2; }
.cv h1.cv-titel img { width:36px; height:36px; margin:0; flex:none; }
.cv h1.cv-titel::before { content:none; }
.cv .tag { border-left:3px solid var(--rand); margin:0 0 0 6px; padding:2px 0 8px 16px; position:relative; }
.cv .tag::before { content:""; position:absolute; left:-8px; top:12px; width:13px; height:13px; border-radius:50%; background:#fff; border:3px solid #9e9e9e; }
.cv h3.datum { margin:6px 0 8px; font-size:1.05em; }
.cv .gruppe { margin:0 0 10px; }
.cv .gruppe.aus { display:none; }
.cv .gk { display:inline-flex; align-items:center; gap:6px; font-size:.85em; font-weight:bold; color:var(--c); margin-bottom:5px; }
.cv .gk img { width:18px; height:18px; margin:0; }
.cv .chips { display:flex; flex-wrap:wrap; gap:6px; }
.cv .chip { display:inline-block; padding:3px 10px; border-radius:14px; background:color-mix(in srgb, var(--c) 12%, #fff);
        border:1px solid color-mix(in srgb, var(--c) 45%, #fff); color:#212121; text-decoration:none; font-size:.92em; }
.cv a.chip:hover { background:var(--c); color:#fff; }
.cv .karten { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:8px; }
.cv .karte { display:flex; align-items:flex-start; gap:10px; padding:6px 8px; border:1px solid var(--rand); border-left:4px solid var(--c);
         border-radius:4px; text-decoration:none; color:#212121; background:#fff; }
.cv a.karte:hover { background:color-mix(in srgb, var(--c) 8%, #fff); }
.cv .karte .th { width:44px; height:58px; object-fit:cover; object-position:top; border:1px solid var(--rand); flex:none; }
.cv .karte .ti { flex:1; line-height:1.3; }
.cv .vfs { flex:none; white-space:nowrap; }
.cv .vfs img { width:16px; height:16px; margin-left:2px; vertical-align:-3px; }
.cv .ohne { cursor:default; }
.cv .chip.ohne { background:#fff; border-style:dashed; }

.tech { list-style:none; padding:0; margin:6px 0 10px; }
.tech li { padding:5px 0; border-bottom:1px solid #f0f0f0; }
.tech time { display:inline-block; min-width:5.5em; color:var(--grau); font-variant-numeric:tabular-nums; }
.cv .filterhinweis { font-size:.85em; color:var(--grau); margin-top:8px; }
.cv .filterhinweis button { font:inherit; border:1px solid var(--rand); background:#fff; border-radius:12px; padding:1px 10px; cursor:pointer; }

@media (max-width: 900px) {
  .cv .kacheln { grid-template-columns:repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .cv { padding:0 8px; }
  .cv .kacheln { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
  .cv .kachel { padding:8px; grid-template-columns:28px 1fr; }
  .cv .kachel > img { width:24px; height:24px; }
  .cv .kachel .kz { font-size:1.3em; }
  .cv-intro p .lang { display:none; }
  .cv .zeitleiste { padding:4px 10px 10px; }
  .cv h1.cv-titel { font-size:1.4em; margin-top:32px; gap:10px; }
  .cv h1.cv-titel img { width:28px; height:28px; }
  .cv .tag { padding-left:12px; margin-left:4px; }
  .cv .karten { grid-template-columns:1fr; }
}
/* ===========================================================================================
   begriffe.html (VBA file_begriffe_2026, 28.10.2026): Suche, Buchstaben-Kacheln, Sammlungen, Zufall.
   Blocktitel sind h2.fest (myjs-018 klappt sie nicht ein). Nutzt .cv/.cv-titel aus dem changes-Block.
   =========================================================================================== */

.bn-suchinput { max-width: 100%; }   /* Suchfelder nie breiter als der Bildschirm (alle Übersichtsseiten) */

.cv-begriffe { --c:#0288d1; }
.cv .untertitel { margin:4px 0 18px 48px; color:var(--grau); }
.cv .block { background:#fff; border:1px solid var(--rand); border-radius:6px; padding:14px 16px; margin:0 0 18px; }
.cv .block > h2.fest { display:block; margin:0 0 10px; padding:0; min-height:0; font-size:1.05em; line-height:1.3;
                       background:none; color:#212121; border:0; box-shadow:none; text-indent:0; cursor:default; }
.cv .block > h2.fest::before, .cv .block > h2.fest::after { content:none; }

.cv .suchblock { border-top:5px solid var(--c); }
.cv .bn-suchwrapper { text-align:left; padding:0; }
.cv .bn-suchcontainer { display:block; margin:0; position:relative; }
.cv .bn-suchinput, .cv #bn-suche { width:100%; max-width:640px; font-size:1.3em; padding:12px 16px 12px 46px;
                    background:#fff url(../i/fluent/i08.svg) no-repeat 14px center / 22px; border:2px solid var(--c); border-radius:24px; }
.cv .bn-suchinput:focus { outline:none; box-shadow:0 0 0 4px color-mix(in srgb, var(--c) 20%, transparent); }
.cv .bn-dropdown { max-width:640px; border-radius:8px; margin-top:4px; }
.cv .suchhinweis { margin:8px 0 0; font-size:.85em; color:var(--grau); }

.cv .alphabet { display:grid; grid-template-columns:repeat(auto-fill, minmax(54px, 1fr)); gap:6px; }
.cv .bst { display:flex; flex-direction:column; align-items:center; padding:6px 0 4px; border:1px solid color-mix(in srgb, var(--c) 35%, #fff);
           border-radius:6px; text-decoration:none; color:var(--c-dunkel, #01579b); background:color-mix(in srgb, var(--c) 7%, #fff); }
.cv .bst b { font-size:1.2em; line-height:1.1; }
.cv .bst small { font-size:.7em; color:var(--grau); }
.cv .bst:hover { background:var(--c); color:#fff; }
.cv .bst:hover small { color:#e1f5fe; }
.cv .bst.leer { opacity:.4; }
.cv .bst.alle { grid-column:span 2; }

.cv .sammlungen { display:grid; grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)); gap:10px; }
.cv .sammlung { display:grid; grid-template-columns:32px 1fr auto; grid-template-rows:auto auto; column-gap:10px; align-items:center;
                padding:10px 12px; border:1px solid var(--rand); border-left:4px solid var(--c); border-radius:6px;
                text-decoration:none; color:#212121; background:#fff; }
.cv .sammlung img { grid-row:1 / 3; width:28px; height:28px; margin:0; }
.cv .sammlung .st { font-weight:bold; color:var(--c-dunkel, #01579b); }
.cv .sammlung .sb { grid-column:2 / 4; font-size:.8em; color:var(--grau); }
.cv .sammlung .sz { grid-row:1; grid-column:3; font-size:.8em; color:var(--grau); font-variant-numeric:tabular-nums; }
.cv .sammlung:hover { background:color-mix(in srgb, var(--c) 7%, #fff); }

.cv .zufall { display:flex; flex-wrap:wrap; gap:6px; }
.cv .zufall a { padding:3px 10px; border-radius:14px; border:1px solid color-mix(in srgb, var(--c) 45%, #fff);
                background:color-mix(in srgb, var(--c) 10%, #fff); color:#212121; text-decoration:none; font-size:.92em; }
.cv .zufall a:hover { background:var(--c); color:#fff; }
.cv .neu-mischen { margin-top:8px; font:inherit; font-size:.85em; border:1px solid var(--rand); background:#fff; border-radius:12px; padding:2px 12px; cursor:pointer; }

@media (max-width: 600px) {
  .cv .untertitel { margin-left:38px; }
  .cv .block { padding:12px 10px; }
  .cv .bn-suchinput, .cv #bn-suche { font-size:1.1em; }
  .cv .alphabet { grid-template-columns:repeat(6, minmax(0, 1fr)); }
  .cv .sammlungen { grid-template-columns:1fr; }
}

/* ===========================================================================================
   top5.html (VBA top5_2026, 28.10.2026): Reiter pro Typ, Ranglisten-Karten mit Balken und Sparkline.
   Panel-Titel sind h2.fest. Ohne JS (Klasse .js fehlt) stehen alle Typen untereinander.
   =========================================================================================== */

.cv-top5 .reiterleiste { display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); gap:10px; }
.cv-top5 .reiter { display:grid; grid-template-columns:32px 1fr; column-gap:10px; align-items:center; text-decoration:none; color:#212121;
                   background:#fff; border:1px solid var(--rand); border-top:5px solid var(--c); border-radius:6px; padding:10px; }
.cv-top5 .reiter > img { width:28px; height:28px; margin:0; }
.cv-top5 .reiter .rl { font-weight:bold; color:var(--c); }
.cv-top5 .reiter.aktiv { background:color-mix(in srgb, var(--c) 10%, #fff); border-color:var(--c); box-shadow:0 2px 6px rgba(0,0,0,.12); }
.cv-top5 .reiter:hover { box-shadow:0 2px 6px rgba(0,0,0,.15); }

.cv-top5 .panel { margin-bottom:24px; }
.js .cv-top5 .panel { display:none; }
.js .cv-top5 .panel.aktiv { display:block; }
.cv-top5 .panel > h2.fest { display:flex; align-items:center; gap:10px; margin:0 0 10px; padding:0 0 6px; min-height:0; font-size:1.3em;
                            text-indent:0; background:none; color:var(--c); border:0; border-bottom:3px solid var(--c); box-shadow:none; cursor:default; }
.cv-top5 .panel > h2.fest img { width:26px; height:26px; margin:0; padding:0; }
.cv-top5 .topkarten { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px, 1fr)); gap:14px; }
.cv-top5 .topkarte { background:#fff; border:1px solid var(--rand); border-top:4px solid var(--c); border-radius:6px; padding:10px 14px 8px; }
.cv-top5 .topkarte h4 { margin:2px 0 0; font-size:1.05em; }
/* Gruppen (29.10.2026): Meistgesucht / Meistvernetzt / Meistzitiert als Band mit Titel, jedes zweite leicht getoent,
   damit letzter / vorletzter Monat / total auch bei schmalerem Fenster zusammen bleiben */
.cv-top5 .topgruppe { margin:0 0 16px; padding:10px 12px 12px; border-radius:8px; border:1px solid color-mix(in srgb, var(--c) 18%, #fff); }
.cv-top5 .topgruppe:nth-of-type(odd) { background:color-mix(in srgb, var(--c) 7%, #fff); }
.cv-top5 .topgruppe > h3.gruppentitel { margin:0 0 8px; padding:0; font-size:1.1em; color:var(--c); background:none; border:0; text-indent:0; }
.cv-top5 .topgruppe > h3.gruppentitel .zus { font-weight:normal; font-size:.82em; color:var(--grau); }
.cv-top5 .topkarte .erkl { margin:2px 0 8px; font-size:.8em; color:var(--grau); }
.cv-top5 ul.rangliste { list-style:none; margin:0; padding:0; }
.cv-top5 ul.rangliste li { display:flex; align-items:center; gap:10px; padding:5px 0; border-bottom:1px solid #f2f2f2; }
.cv-top5 ul.rangliste li:last-child { border-bottom:0; }
.cv-top5 .rang { flex:none; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-size:.8em; font-weight:bold;
                 color:var(--c); border:1.5px solid color-mix(in srgb, var(--c) 50%, #fff); }
.cv-top5 ul.rangliste:not(.rest) li:nth-child(-n+3) .rang { background:var(--c); color:#fff; border-color:var(--c); }
.cv-top5 .name { flex:1; min-width:0; line-height:1.25; }
.cv-top5 .name a { color:#212121; text-decoration:none; }
.cv-top5 .name a:hover { color:var(--c); text-decoration:underline; }
.cv-top5 .name .ohne { color:var(--grau); }
.cv-top5 .vfs img { width:14px; height:14px; margin-left:4px; vertical-align:-2px; }
.cv-top5 .balken { display:block; height:3px; margin-top:3px; background:#f2f2f2; border-radius:2px; }
.cv-top5 .balken span { display:block; height:100%; background:color-mix(in srgb, var(--c) 55%, #fff); border-radius:2px; }
.cv-top5 .spark { flex:none; }
.cv-top5 .spark polyline { fill:none; stroke:var(--c); stroke-width:1.4; vector-effect:non-scaling-stroke; stroke-linejoin:round; }
.cv-top5 .spark circle { fill:var(--c); }
.cv-top5 .zahl { flex:none; min-width:4.2em; text-align:right; font-variant-numeric:tabular-nums; line-height:1.15; }
.cv-top5 .zahl .z2 { display:block; font-size:.72em; color:var(--grau); white-space:nowrap; }
.cv-top5 details { margin-top:4px; }
.cv-top5 details summary { cursor:pointer; font-size:.85em; color:var(--grau); padding:4px 0; }

@media (max-width: 900px) { .cv-top5 .reiterleiste { grid-template-columns:repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .cv-top5 .cv-intro p { display:none; }
  .cv-top5 .reiterleiste { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
  .cv-top5 .reiter { padding:8px; grid-template-columns:24px 1fr; }
  .cv-top5 .reiter > img { width:22px; height:22px; }
  .cv-top5 .topkarten { grid-template-columns:1fr; }
  .cv-top5 .topkarte { padding:8px 10px 6px; }
  .cv-top5 .topgruppe { padding:8px 8px 10px; }
  .cv-top5 .spark { width:44px; }
}

/* personen.html (VBA file_personen_2026, 29.10.2026): wie begriffe.html, in Personen-Violett */
.cv-personen { --c:#9c27b0; --c-dunkel:#6a1b9a; }
.cv-personen .bn-suchinput, .cv-personen #pn-suche { width:100%; max-width:640px; font-size:1.3em; padding:12px 16px 12px 46px;
                    background:#fff url(../i/fluent/i01.svg) no-repeat 14px center / 22px; border:2px solid var(--c); border-radius:24px; }
.cv-personen .bn-dropdown { border-color:color-mix(in srgb, var(--c) 40%, #fff); }
.cv-personen .bst:hover small { color:#f3e5f5; }
@media (max-width: 600px) { .cv-personen .bn-suchinput, .cv-personen #pn-suche { font-size:1.1em; } }

/* buecher.html (VBA file_buecher_2026, 29.10.2026): wie begriffe.html/personen.html, in Bücher-Orange; Entdecken mit Buchcovern */
.cv-buecher { --c:#ff5722; --c-dunkel:#bf360c; }
.cv-buecher .bn-suchinput, .cv-buecher #bu-suche { width:100%; max-width:640px; font-size:1.3em; padding:12px 16px 12px 46px;
                    background:#fff url(../i/fluent/i02.svg) no-repeat 14px center / 22px; border:2px solid var(--c); border-radius:24px; }
.cv-buecher .bn-dropdown { border-color:color-mix(in srgb, var(--c) 40%, #fff); }
.cv-buecher .bst:hover small { color:#fbe9e7; }
.cv-buecher .zitbox { margin:0 0 10px; }
.cv .cover-zufall { display:grid; grid-template-columns:repeat(auto-fill, minmax(110px, 1fr)); gap:12px; }
.cv .cover-zufall a { display:flex; flex-direction:column; gap:4px; text-decoration:none; color:#212121; font-size:.8em; line-height:1.25; }
.cv .cover-zufall img { width:100%; aspect-ratio:2 / 3; object-fit:contain; object-position:bottom; margin:0;
                        background:color-mix(in srgb, var(--c) 6%, #fff); border-radius:3px; }
.cv .cover-zufall span { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.cv .cover-zufall a:hover span { color:var(--c-dunkel); text-decoration:underline; }
@media (max-width: 600px) {
  .cv-buecher .bn-suchinput, .cv-buecher #bu-suche { font-size:1.1em; }
  .cv .cover-zufall { grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; }
}

/* texte.html (VBA file_texte_2026, 29.10.2026): wie buecher.html, in Texte-Orange */
.cv-texte { --c:#ff9800; --c-dunkel:#e65100; }
.cv-texte .bn-suchinput, .cv-texte #te-suche { width:100%; max-width:640px; font-size:1.3em; padding:12px 16px 12px 46px;
                    background:#fff url(../i/fluent/i03.svg) no-repeat 14px center / 22px; border:2px solid var(--c); border-radius:24px; }
.cv-texte .bn-dropdown { border-color:color-mix(in srgb, var(--c) 40%, #fff); }
.cv-texte .zitbox { margin:0 0 10px; }
@media (max-width: 600px) { .cv-texte .bn-suchinput, .cv-texte #te-suche { font-size:1.1em; } }

/* themen.html (VBA Themengebiete_Overview_2026, 29.10.2026): Themen-Braun, Hinweis "nicht mehr gepflegt", Themen als Karten */
.cv-themen { --c:#795548; --c-dunkel:#4e342e; }
.cv-themen .hinweis { border-left:5px solid #f9a825; background:#fffde7; }
.cv-themen .hinweis p, .cv-themen .block > p { margin:0; line-height:1.5; }
.cv-themen .themen { grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); }
.cv-themen .themen .sammlung { align-items:start; grid-template-rows:auto 1fr; }
.cv-themen .themen .sammlung img { grid-row:1 / 2; }
.cv-themen .themen .sb { line-height:1.35; margin-top:3px; }
.cv-themen .themen .sb i { font-size:.95em; }
.cv-themen .themen .sz { white-space:nowrap; }
@media (max-width: 600px) { .cv-themen .themen { grid-template-columns:1fr; } }
