body {
	font-family:"Veracruz Serial";
	font-size: 1.3em; /*Schriftgröße*/
	background-color:  #A7C1C7; /*#C2D4D8  #f1f0dc; /* Farbe des Hintergrundes*/
}

#wrapper {
	background-color: #c2d4d8; /*red;*/
	margin-top: -5px; /*der wrapper soll ganz oben abschließen*/
	margin-left: auto;
	margin-right: auto;
	height: 100%;
	border-radius: 40px; /*sorgt für abgerundete Ecken*/
	width: 75%; /*1024px;*/
}

header {
  background-color: #dbe9d8; /*yellow;*/
  border-radius: 40px; /*sorgt für abgerundete Ecken*/
  top:0px;
  position:fixed !important;
  position:absolute;
  height: 5%; /*bezieht sich auf die gesamte Website*/
  width: 75%; /*1024px;*/
}

nav {
		display: flex;
		align-items: center;
		justify-content: center;
	background-color: #dbe9d8; /*orange;*/
	top:0px;
	border-radius: 20px; /*sorgt für abgerundete Ecken*/
	height:95%; /*bezieht sich auf den Bereich, im dem es sich befindet: header*/
	left:0px;
	position:absolute;
	width:100%;
	text-align: center;
	/*vertical-align: middle; soll den Text in der Mitte von oben-unten halten*/
	word-spacing: 0.7em; /*leicht erhöhter Abstand der Worte*/
	border-color: #FFA6A6; /*Farbe des Rahmens*/
	border-width: 0.5px; /*Rahmenstärke*/
	border-style: solid; /*Rahmenart, hier durchgezogen*/
}

a.nav { /*Die Links ändern nicht Farbe und sind auch nicht unterstrichen*/
	color: black;
	text-decoration:none;
}

h2.titel {
	text-align: center;
	font-size:2em;
}

h2.kleintitel {
	text-align: center;
	font-size:1.85em;
	word-spacing: 0.2em;
	letter-spacing: 0.15em;
}

h2.tabtitel {
	text-align: center;
	font-size:1.5em;
	word-spacing: 0.2em;
	letter-spacing: 0.15em;
}

h2.rottitel {
	text-align: center;
	font-size:2em;
	color: red; /*#FFA6A6;*/
}

h20r {  /*dasselbe wie h2.rottitel, für php-Abschnitte oder -Dateien, wie h40*/
	text-align: center;
	font-size:2em;
	color: red; /*#FFA6A6;*/
}

h3.utitel {
	text-align: center;
	word-spacing: 0.2em; /*leicht erhöhter Abstand der Worte*/
}

h4 { /*findet nur Verwendung in Rückmeldung von php-Datei. Ähnlich wie p.vare*/
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 1.05em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 115%;
	letter-spacing: 0.15em;
	hyphens: auto;
	text-align: justify;
	text-align-last: left;
	color: black;
	text-indent: 0.5em;
	padding-left: 5%;
	padding-right: 5%;
}

h40 { /*findet nur Verwendung in Rückmeldung von php-Datei. Ohne Einrückung. Ähnlich wie p.vare*/
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 1.05em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 115%;
	letter-spacing: 0.15em;
	hyphens: auto;
	text-align: justify;
	text-align-last: center;
	color: black;
	text-indent: 0.0em;
	padding-left: 5%;
	padding-right: 5%;
}

#Content {
  top:5%;
  height:85%;
  position:relative;
  overflow:auto;
  width:100%;
}

footer {
  background-color: silver;
  bottom:-10px;
  position:absolute !important;
  height:5%;
  width: 75%; /*1024px;*/
}

.position::before { <!--wird gebraucht für Sprungmarken,
						Quelle: https://www.myspartester.de/2016/03/20/html-anker-als-sprungmarke-setzen/-->
        display: block;
        content: "";
        height:15%;
        margin-top: -5%;
        visibility: hidden;
    }

  

#datum {
	font-size: 1.1em;
	letter-spacing: 0.2em;
	word-spacing: 0.2em;
	text-align: right;
	padding-right: 0.4em;
	padding-bottom: 0.5em;
}

.date {
	font-size: 1.1em;
	letter-spacing: 0.2em;
	word-spacing: 0.2em;
	text-align: right;
	padding-right: 0.4em;
	padding-bottom: 0.5em;
}

p.vara {
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 1.05em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 120%;
	letter-spacing: 0.15em;
	hyphens: auto;
	text-align: justify;
	text-align-last: left;
	color: black;
	text-indent: 1em;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

p.vard { /*geeignet für  ... gelauscht*/
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 1.05em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 115%;
	letter-spacing: 0.15em;
	hyphens: auto;
	text-align: justify;
	text-align-last: left;
	color: black;
	text-indent: 0em;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

p.vare {
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 1.05em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 115%;
	letter-spacing: 0.15em;
	hyphens: auto;
	text-align: justify;
	text-align-last: left;
	color: black;
	text-indent: 5em;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

p.varec { <!--fast wie vare, jedoch zentriert und ohne Einrückung-->
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 1.05em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 115%;
	letter-spacing: 0.15em;
	hyphens: auto;
	text-align: center;
	color: black;
	padding-left: 0.5em;
	padding-right: 0.5em;
}


p.varf { /*geeignet für Stichwortliste im Archiv*/
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 0.95em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 100%;
	letter-spacing: 0.15em;
	hyphens: auto;
	text-align: justify;
	text-align-last: left;
	color: black;
	text-indent: 0em;
	padding-left: 0.5em;
	padding-right: 0.5em;
}



/*Beginn der Formatierung des Trialogfeldes##########
 * ##################################
 *######## Beginn der Formatierung des Trialogfeldes*/
.dreiergespraech { /*das ist der normale Hintergrund*/
	background-color: #dbe9d8; /*yellow;*/
	max-width: 92.5%;
	margin-left: auto;
	margin-right:auto;
	border-radius: 40px; /*sorgt für abgerundete Ecken*/
	border-color: #FFA6A6; /*Farbe des Rahmens*/
	border-width: 0.5px; /*Rahmenstärke*/
	border-style: solid; /*Rahmenart, hier durchgezogen*/
}

.typa {
	text-align: left;
	margin-left: 1.0em;
	margin-right: 26%;
	padding-left: 1em;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	line-height: 120%;
	border-left:  #A7C1C7 /*#FFA6A6*/ 0.125em solid;
}

.typb {
	text-align: left;
	margin-right: 13%;
	margin-left: 13%;
	padding-left: 1em;
	line-height: 120%;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-left: red 0.125em solid;
}

.typc {
	text-align: left;
	margin-left: 26%;
	padding-right: 1.5em;
	padding-left: 1em;
	line-height: 120%;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-left: darkblue 0.125em solid;
}
/*Ende der Formatierung des Trialogfeldes##########
 * ##################################
 *######## Ende der Formatierung des Trialogfeldes*/

/*Beginn der Formatierung des Kommentarfeldes######
 * ##################################
 *##### Beginn der Formatierung des Kommentarfeldes*/
.kommentar { /*formatiert einen div*/
	background-color: #dbe9d8; /*yellow;*/
	max-width: 92.5%;
	margin-left: auto;
	margin-right:auto;
	border-radius: 40px; /*sorgt für abgerundete Ecken*/
	border-color: #FFA6A6; /*Farbe des Rahmens*/
	border-width: 0.5px; /*Rahmenstärke*/
	border-style: solid; /*Rahmenart, hier durchgezogen*/
}

p.comment { /*Normaler Text im div kommentar*/
	margin-top: 0.75em;
	margin-left: 1em;
	margin-right: 1em;
	line-height: 1.2em;
}

.eingaben {
	margin-top: 0px;
	margin-left: 1em;
	margin-right: 1em;
}

.textfeld {		/*regelt die Formatierung von textarea und input*/
	resize: vertical; /*verhindert die horizontale Ausweitung des Textfeldes*/
	font-size: 1.1em;
	background-color: #FBFBEF;
	border-radius: 0.5em;
	border-color: #FFA6A6;
	border-style: solid;
	border-width: 0.08em;
	width: 100%;
	height: auto;
}

.textfeldsicherung {
	text-align: center;
	font-size: 0.9em;
	background-color: #FBFBEF;
	border-radius: 0.5em;
	border-color: #FFA6A6;
	border-style: solid;
	border-width: 0.08em;
	width: 92.5%;
	height: auto;
	margin-right: auto;
	margin-left: auto;
}

.ausgabedermeldungen {
	
}

/*Ende der Formatierung des Kommentarfeldes#######
 * ##################################
 *###### Ende der Formatierung des Kommentarfeldes*/

/*Beginn der Formatierung der Motivseite##########
 ###################################
 Beginn der Formatierung der Motivseite##########*/

p.motiv {
	text-align: center;
	letter-spacing: 0.15em;
	word-spacing: 0.2em; /*leicht erhöhter Abstand der Worte*/
	font-family: "Veracruz Serial"; /*"Roundest Serial Light";*/
	font-size: 1.2em; /*Schriftgröße*/
	font-weight: normal;
    font-style: normal;
	line-height: 115%;
	text-align: center;
}

div.spalten {
	columns: 2 10em;  
	column-rule: 0.2em #FFA6A6 solid;
	margin-left: 0.3em;
	margin-right: 0.3em;
	margin-bottom:0.5em;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

/*Ende der Formatierung der Motivseite############
 ###################################
 ###########Ende der Formatierung der Motivseite*/

/*Beginn der Formatierung der verschiedener Bereiche###
 ###################################
 Beginn der Formatierung der verschiedener Bereiche###*/

.hr-norm { color: #FFA6A6;}
.hr-klein {border: 0px; background-color: #FFA6A6; height: 0.075em; max-width: 92.5%; margin-left: auto; margin-right: auto;}
.hr-web {
  background-color:#FFA6A6;
  color:#FFA6A6;
  border:#FFA6A6;
  height:0.5em;
  max-width: 92.5%;
	margin-left: auto;
	margin-right:auto;
}

.normLink {
	color: #000070; text-decoration:none;
	border-bottom: 1px solid #FFA6A6;
}

/*######mehr zu lesendes anzeigen*/
.verstecktes {
  overflow: hidden;
  height: 0em;
  line-height: 1.2em;
  width: 100%; /*200px;*/
}

.mehr:checked + div {
  height: auto;
}