
:root {
   --informatikHintergrund: rgba(230, 240, 255, 1.0);
   --informatikHintergrundBG: rgba(230, 240, 255, 0.4);
   --informatikText: rgba(0, 51, 102, 1.0);
   --informatikHervorhebung: rgba(0, 102, 204, 1.0);
   --informatikSanft: rgba(0, 102, 204, 0.1);
}
/* Farben für HTML-Tags 
   ===========================================================================
*/

:root		{	--schwarz:     rgb(0,0,0);						}
:root		{	--dunkelgrau:  rgb(91,91,91);					}
:root		{	--mittelgrau:  rgb(191,191,191);				}
:root		{	--hellgrau:    rgba(191,191,191,0.50);		}
:root		{	--hellgrauBG:  rgba(191,191,191,0.25);		}
:root		{	--hellgrauer:  rgba(223,223,223,1);		}
:root		{	--weissgrau:   rgba(239,239,239,1);		}

:root		{	--weiss:       rgba(255,255,255,1);			}

:root		{	--hellgrauBlau:    rgba(191,191,215,0.50);		}
:root		{	--hellgrauBGBlau:  rgba(191,191,215,0.25);		}
:root		{
									--dunkelbraun: rgba(118, 51, 34,1.0);
									--braun:       rgba(118, 51, 34,0.75);
									--mittelbraun: rgba(118, 51, 34,0.5);
									--hellbraun:   rgba(118, 51, 34,0.2);
									--hellbraunBG: rgba(118, 51, 34,0.1);
									
									--hautfarbe:   rgba(218,168,140,0.5);
									--hautfarbeBG: rgba(218,168,140,0.25);

									--holzfarbe:	rgba(245,200,140,0.75);
									
									--schwarzgruen:rgba(0, 47,0,1.0);
									--dunkelgruen: rgba(0, 63,0,0.8);
									--gruen:       rgba(0,100,0,0.4);
									--mittelgruen: rgba(0,100,0,0.25);
									--hellgruen:   rgba(0,100,0,0.15);
									--hellgruenBG: rgba(0,100,0,0.075);
	
									--schwarzblau: rgba(0,0, 91,1.0);
									--dunkelblau:  rgba(0,0,127,1.0);
									--blau:        rgba(0,0,139,0.75);
									--mittelblau:  rgba(0,0,139,0.5);
									--hellblau:    rgba(0,0,139,0.2);
									--hellblauBG:  rgba(0,0,139,0.1);
	
									--hellviolett: rgba(100,0,139,0.2);
									--dunkelviolett: rgba(100,0,139,1);
									
									--schwarzrot:  rgba( 91, 0, 0,1.0);
									--dunkelrot:   rgba(162,79,47,0.8);
									--rot:         rgba(162,79,47,0.5);
									--mittelrot:   rgba(255,79,47,0.1);
									--hellrot:     rgba(255,79,47,0.05);
									--hellrotBG:   rgba(255,79,47,0.03);
	
									--definition:  rgba(255,191,191,0.5);
	
									--gelb      :  rgba(223,223,0,0.7);
									--mittelgelb:  rgba(223,223,0,0.4);
									--hellgelb:    rgba(255, 249, 204, 1);
									--hellbeige:   rgba(255, 244, 224, 1)

									--hellgrauorange: rgba(191,175,159,0.125);
}


iframe						{ background-color: rgba(0,100,0,0.15); border: none;}

body  						{ background-color: var(--hellblau); 
								  background-image: url(ringbuch-1.jpg)}

#main,
main 							{ background-color: rgba(183,174,157,0.125); }

header p,
.weiter						{ background-color: rgba(255,255,191,0.5); }
header h2					{ color:#FFF; }

h1								{ color: var(--schwarz);}
h2								{ color: var(--schwarz);}
h3								{ color: var(--braun);}
h4								{ color: var(--schwarz);}
h5, .gross, big			{ color: var(--dunkelgruen);}
.formel						{ color: var(--dunkelblau);}
h6								{ color: var(--braun);}

a								{ color: var(--dunkelgruen);}
a:hover						{ color: var(--braun);}		

cite							{ color: darkslategray;}

samp							{ color: var(--dunkelgruen); background-color: var(--hellgruen);}

pre							{ color: var(--dunkelblau); background-color: var(--hellblau);}

.breitbild pre				{ color: var(--dunkelblau); background-color: var(--weiss);}
code							{ color: var(--dunkelblau);}


kbd							{ color: var(--schwarz);; background-color:var(--hellgrau);}

section .breitbild	{ background-color: #FFF; }

/* Farben für HTML-5-Tags 
   ===========================================================================
*/

nav							{ color: var(--dunkelgruen);}
nav li:hover				{ background-color: var(--hellgrau);}
nav li li:hover			{ background-color: var(--hellgrau);}	

header h5 a:hover			{ background-color: var(--hellgrau);}
header h6 a:hover			{ background-color: var(--hellgrau);}



/* Farben für Container-Klassen 
   ===========================================================================
*/

#main,
.mainClass					{ background-color: var(--hellgrauorange); }

.klein,
.winzig						{ color: var(--schwarzgruen);}

.darkBG,
.kastenKI					{ background-color:var(--dunkelgrau); 
								  color: var(--weiss);}
.darkBG a					{ color: var(--weiss);}
.darkBG .klein, 
.darkBG.winzig, 
.darkBG small				{ color: var(--weiss);}

section .anmerkung		{ color: var(--dunkelgruen);}
section .kastenKI			{ background-color: black, color: white;}

#Tablewrapper				{ background-color:  var(--hellblau); }
.Tabellenkopf				{ background-color:  var(--hellblau); color:black; }
.Tabellenzeile				{ background-color:  var(--hellblauBG); color: var(--schwarz);}

.quellen						{ background-color: var(--hellgrau);}

.kastenKI h6				{ color: cornsilk}

/* Farben für BIOLOGIE
   ===========================================================================
*/

.hellgruen					{ background-color: var(--hellgruen);}

.biologie					{ background-color: var(--mittelgruen);}
.biologieBG					{ background-color: var(--hellgruenBG);}

.hellrot,
.mittelrot					{ background-color: var(--mittelrot);}
.hellrotBG					{ background-color: var(--hellrot);}

.medizinBG					{ background-color:  rgba(255,191,255,0.5);}

/* Farben für CHEMIE
   ===========================================================================
*/
.chemie,organik			{ background-color : var(--mittelrot);}
.chemieBG					{ background-color : #F0F0F0;}
.chemieQuer					{ background-color : var(--rot);}


/* Farben für INFORMATIK
   ===========================================================================
*/

.informatik					   background-color :  var(--informatikHintergrund);{ background-color :  var(--hellblau);}
.informatikBG				   background-color :  var(--informatikHintergrundBG);{ background-color :  var(--hellblauBG);}
.quelltext					   color: var(--informatikText);{ color: var(--dunkelblau);}

/* Farben für ERNÄHRUNGSLEHRE
   ===========================================================================
*/

.helmichBraun				{ background-color : var(--mittelrot);}
.helmichHaut				{ background-color : var(--hautfarbe);}

.ernaehrung					{ background-color : var(--gelb);}
.ernaehrungBG				{ background-color : #FAF3E0;}


/* Farben für weitere Zwecke
   ===========================================================================
*/


.verlaufHolz				{ background-image:  linear-gradient(120deg,rgb(245,200,140) 0%, rgb(235,176,118) 85%);
}

.verlaufHaut				{ background-image:  linear-gradient(120deg,rgb(218,169,140) 0%, rgb(191,150,118) 85%);
}


.verlaufBraun				{ background-image:  linear-gradient(120deg,rgba(162,79,47,0.5) 0%, rgba(127,63,31,0.5) 85%);
}

.helmichGrau				{ background-color : rgba( 41, 44, 49,0.7);}


.hellgelb					{ background-color :  var(--hellgelb);}


/* Farben für Hervorhebungen im Haupttext 
   ===========================================================================
*/


.quelltext, var			{ color: var(--dunkelblau);}

.klasse,
.klasse a					{ color: black; }

.fachbegriff,
.fachbegriff a				{ color: var(--dunkelgruen);}

.WichtigeFrage 			{ color: var(--dunkelrot); }



/* Allgemeine Textfarben
   ===========================================================================
*/


.farbeRot					{ color: var(--dunkelrot);}
.farbeDunkelrot			{ color: var(--schwarzrot);}
.farbeBlau					{ color: var(--blau);}
.farbeDunkelblau			{ color: var(--dunkelblau);}
.farbeGruen					{ color: var(--dunkelgruen); }
.farbeGrau					{ color: var(--dunkelgrau);;}
.farbeWeiss					{ color: var(--weiss);}


/* Farben für Textmarker
   ===========================================================================
*/


.pastellGelb				{ background-color: rgba(255,255,  0,0.2);}
.textmarkerGelb			{ background-color: rgba(255,255,  0,0.7);}

.pastellGruen				{ background-color: rgba(234, 248, 228, 1);}
.textmarkerGruen			{ background-color: rgba(   0,255, 0,0.7);}

.pastellRot					{ background-color: rgba(255,159,159,0.2);;}
.textmarkerRot				{ background-color: rgba(255,159,159,0.6);;}

.pastellBlau				{ background-color: rgba(159,159,255,0.2);;}
.textmarkerBlau			{ background-color: rgba(159,159,255,0.6);;}

.pastellGrau				{ background-color: rgba(191,191,191,0.3);}
.textmarkerGrau			{ background-color: rgba(191,191,191,1);}

.pastellViolett			{ background-color: orchid;}

.textmarkerOrange			{ background-color: var(--mittelbraun); color: beige}




/* Farben für Textkästen
   ===========================================================================
*/

.anweisung,
.anweisung,
.anfaenger,
.didaktik,
.merktext				{ background-color: #EAF8E4; 
							  border-color: var(--dunkelgruen);}
.merktext .titel,
.anweisung .titel		{ color: var(--dunkelgruen); }

/*----------------------------------------------------------------------*/
/* blauer Kasten, für allgemeine Zwecke, Ergänzungen, Vertiefungen etc....*/
.kasten					{ border-color: var(--dunkelblau);}

.kastenMed				{ background-color: thistle; 
							  border-color: var(--dunkelrot);}
/*----------------------------------------------------------------------*/
/* Versuche, Aufgaben */
.versuch					{ background-color: var(--hellblau); 
							  border-color: var(--dunkelblau);}

.aufgabe					{ background-color: #D9EDFF; 
							  border-color: #2D2D2D; color: #2D2D2D}

.versuch .titel,
.kasten .titel			{ color: var(--dunkelblau); }

.aufgabe .titel		{ color: #2D2D2D; }
.aufgabe p				{ color: #2D2D2D; }

.verbindung, .verbindung a
							{ color: var(--dunkelblau);}
.enzym,
.enzym a					{ color: firebrick;}


.coenzym, .coenzym a	{ color: blueviolet;}
.stoffgruppe, .stoffgruppe a,
.klasse, .klasse a,
.taxon, .taxon a		{ color: sienna;}
.methode					{ color: blue;}
.objekt					{ color: var(--informatikHervorhebung);}
.variable				{ color: var(--informatikHervorhebung);}
.konstante				{ color: var(--informatikHervorhebung);}
.parameter				{ color: var(--informatikText);}
.datentyp				{ color: var(--informatikText);}

/*----------------------------------------------------------------------*/
/* Definitionen */
.definition				{ background-color:var(--definition); 
							  border-color:var(--dunkelrot);}
.definition .titel 	{ color: var(--dunkelrot); }

/*----------------------------------------------------------------------*/
/* Expertenwissen */
.experten				{ color: var(--schwarz); background-color: var(--mittelgelb);
												 border-color: var(--dunkelbraun);}
.experten .titel 		{ color: var(--dunkelbraun); }

.loesung					{ color: var(--schwarz); background-color: var(--hellblauBG);
												 border-color: var(--dunkelgruen);}
.loesung .titel 		{ color: var(--dunkelgruen); }



/* Farben für Footer
   ===========================================================================
*/

.footerDark				{
							 background-color:var(--dunkelgrau);
							 color: var(--weiss);
							}
							
.footerDark a			{
							color: var(--weiss);
							}
.footerDark p			{
							color: var(--mittelgrau);
							}