/* 
	Farbe Kopf & Fuß
	--------------------------------
	Hintergrund   		#8B1212 #bfbfbf
	Text 					Gainsboro	
	
	
	
*/

html {
	color: black;
	background-color: #bfbfbf;
	box-sizing: border-box; 
	background: #fff;	
}
	
* {
	padding: 0;
	text-decoration: none ; 	
/*	
	font-family: 'Open Sans', sans-serif;, sans-serif;  
	font-family: 'Roboto Condensed', sans-serif;
*/	
	font-family: sans-serif;, sans-serif;
}

body {
	background-color: #bfbfbf;
	text-decoration: none ; 	
	max-width: 75em; 
	margin:0 auto;
}	

a {
	text-decoration: none ; 	
	color: darkblue;
}		
/* ====================================================  HEADER ==================================================== */	
	 
header {
	background-size: cover ;
	background-color: #8B1212 ;
	margin:  0em;
	border:  0em;
	padding: 0em;
	width: 100%;
	float: left;
	border-bottom: 3px solid black;
}

header img {
	text-decoration: none ; 	
	margin: .1em;
  }

/* ====================================================  HEADER ==================================================== */	

section {
/* alle Sections */
/*	margin:  0.5em; */
/*	padding: 1.0em; */
	padding: 1.em ;
	margin:  0.5em; 
	border: 2x dotted white;
}

section.Kopf {
/*	background-color: #bfbfbf; */
/*	background: url('../img/Praxis02.jpg') ; */
	background-repeat: no-repeat ;
	background-position: center ;
	background-size: contain ;
   background-attachment:top; 
	font-size: 1.4em;
	margin: 0em;
	border: 0em;
	padding: 1.5em;
	text-align: center;
	
/*
 	background-color: #1fbfbf;
	background: url('../img/Praxis02.jpg') ;
 	background-repeat: no-repeat;
	background-size: cover;
	background-attachment:fixed;
	background-position: top ;
	text-align: left;
	color: white;
	font-size: 1.5em;
	margin: 0em;
	border: 0em;
	padding: 0.5em;

/* 
	background-origin: padding-box;
	border-box
	content-box
*/

}	

section.Start {
/*	background-color: #bfbfbf; */
	background-repeat: no-repeat ;
	background-position: center ;
	background-size: contain ;
	font-size: 1.1em;
	margin: 0em;
	border: 0em;
	padding: 0.5em;
}

section.Praxis {
	display:     block;
/*	background-color: #bfbfbf; */
/* 	background: url('../img/Praxis01.jpg') ;  */
	background-repeat: no-repeat ;
	background-position: top ;
	background-size: cover ;
	font-size: 1.1em;
	margin: 0em;
	border: 0em;
	padding: 1.5em;
}

section.Spezial {
/*	background-color: #bfbfbf; */
/*	background: url('../img/Praxis02.jpg') ;  */
	background-repeat: no-repeat ;
	background-position: contain ;
	background-size: cover ;
	background-attachment:fixed;
	font-size: 1.1em;
	margin: 0em;
	border: 0em;
	padding: 1.5em;
}

section.Wir {
/*	background: url('../img/Hintergrund-5.jpg') ;  */
/*	background-color: #bfbfbf; */
	background-repeat: no-repeat ;
	background-position: top ;
	background-size: contain ;
	background-attachment:fixed;
	font-size: 1.1em;
	margin: 0em;
	border: 0em;
	padding: 1.5em;
}

section.Info {
/*
	background: url('../img/Hintergrund-3.jpg') ;
	background-repeat: no-repeat ;
   background-position: top;
   background-attachment:fixed;
	background-size: 95%;
*/
	text-decoration: none ; 	
	color: Steel;
	display: block;
	background-color: #bfbfbf; 
	font-size: 1.1em;
	margin: 0em;
	border: 0em;
	padding: 1.5em;
}

section.Kontakt {
/*	background: url('../img/Hintergrund-3.jpg') ; */
/*	background-color: #bfbfbf; */
	color: #202020;
	font-size: 1.1em;
	margin: 0em;
	border: 0em;
	padding: 0.5em;
}

section.Impressum {
/*	background-color: #bfbfbf; */
	color: #202020;
	/* background: url('../img/Hintergrund-1.jpg') ;  */
	font-size: 1.1em;
	margin: 0em;
	border: 0em;
	padding: 1.5em;
}

/* ====================================================  FOOTER  ==================================================== */

footer {
	font-size: 1.2em;
	margin: 0;
	margin: 0;
	border: 0;
	display: flex;
	background-color: #8B1212;
	color: Gainsboro;
	border-bottom: 3px solid silver;
	border-top: 3px solid black;
}

footer p {
	font-weight: bold;
	background-color: #8B1212;
	color: Gainsboro;
	flex: 1 1 50%;
}

footer a {
	text-decoration: none ; 	
	text-align: center;
	color: Gainsboro;
}
footer a:hover, footer a:focus {
  color: #fff;
}

/* ====================================================  FOOTER ENDE  =============================================== */

#bereichlogo {
	color: white;
	background-color: transparent;		
/* 	background: url(../img/LogoBernd.png) #ffffff left; */
	display: block;
	margin:  0em;
	border:  0em;
	padding: 0em;
	text-decoration: none;
	float: left;	
	font-family: cursive, sans-serif;
	width: auto;
}

/* Tasten der Navigation*/

#steuerung {
	float: left;
	padding: 0;
	margin: 0;
	border: 0;
}
#steuerung ul {
	list-style: none;
	float: left;
	padding: 0;
	margin: 0;
	border: 0;
}
#steuerung li {
	list-style: none;
	float: left;
}	
#steuerung a {
	text-decoration: none ; 	
	display: block;
	width: 100%;
	padding-left: 0.5em;
	padding-right: 0.5em;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	text-decoration: none;
	color: white;
	background-color: #454545;
	border-left: 1px solid lightgray;
	border-top: 1px solid lightgray;
	border-bottom: 1px solid gray;
	border-right: 1px solid gray;
}	
#steuerung a:hover {
	background: darkgeay;
	color: yellow;
}	

.menue-button {
	display: none;
}		
	
/* die Magie, um die Steuerung einzublenden (auch auf mobile Devices) */
#nav-menue:target #steuerung {
	display: block;
	text-decoration: none;
}
	
/* ausblenden des Menü-Buttons zum öffnen - somit wird der zum Schließen sichtbar */
#nav-menue:target .menue-button-beschr-open {
	color: green;
	display: none ; 
	text-decoration: none;
}	

#nav-menue a[aria-current=page] {
	color: darkred;
/*	font-weight:bold; */
   background: lightsteelblue;
	/* LightBlue ; */
	 /* linear-gradient(rgba(195,214,106,0.95), #fff); */
}

/* Allgemein Anweisungen */

p {
	text-decoration: none ; 	
	margin: 0.0em;
	display:block ;
	color: black ;
}	

img {
	text-decoration: none ; 	
	margin-top: .5em;
	margin-bottom: .5em;
	margin-left: .5em;
	margin-right: .5em;
  }

h1 { 	
	font-size: 1.3em;
	margin: 0.5em 0 0 0;
	color: darkred;
	text-decoration: none ; 	
}

h2 { 	
	font-size: 1.2em;
	margin: 0.1em 0 0 0;
	color: DarkGreen;
	text-decoration: none ; 	
}
h3 { 	
	margin: 0.5em 0 0 0;
	color: LightGreen;
	display: block;
	text-decoration: none ; 	
}

hr { 
    width: 95%; 
    height: 3px; 
    margin: 0 auto;
    color: silver;
    background: #dfdfdf;
}
.akzentfarbe0 {
	font-size: 1.6em;
	font-weight: bold;
	color: white;
	margin-top: .5em;
}

.akzentfarbe1 {
	font-size: 1.2em;
	color: white;
	padding: 0.em;
	margin: 0.em;
}

.akzentfarbe2 {
	color: darkred;
	font-size: 0.8em;
	padding: 0.em;
	margin: 0.em;
}

.akzentfarbe3 {
	color: black;
	font-weight:bold;
	font-size: 0.6em;
	padding: 0.em;
	margin: 0.em;
}
.akzentfarbe4 {
	color: #363636;
	font-weight:normal;
	font-size: 0.9em;
	padding: 0.em;
	margin: 0.em;
}

.RoterText {
	color: #c01010;
}
.HinweisTop {
	font-size:    1em;
	font-weight:  normal;
	display:      block;
	line-height:  .5em;
	background-color: lightgray;
	color:        darkred;
	text-align:   center;
	margin-top:   0em;
	margin-left:  2em;
	margin-right: 2em;
	border:       0em;
	padding:      0em;
	padding-top:  .3em;
	border-top:   2px solid #505254;
	border-left:  2px solid #505254;
	border-right: 2px solid #505254;
	border-bottom:none;
}
.HinweisHead {
	font-size:    1em;
	font-weight:  bold;
	display:      block;
	background-color: lightgray;
	color:        darkred;
	text-align:   center;
	margin-top:   0em;
	margin-left:  2em;
	margin-right: 2em;
	border:       0em;
	padding:      0em;
	padding-top:  .3em;
	border-top:   none;
	border-left:  2px solid #505254;
	border-right: 2px solid #505254;
	border-bottom:none;
}
.HinweisBody {
	font-size:    1em;
	font-weight:  normal;
	display:      block;
	background-color: lightgray;
	color:        black;
	text-align:   center;
	margin-top:   0em;
	margin-left:  2em;
	margin-right: 2em;
	border:       0em;
	padding:      0em;
	padding-top:  .3em;
	border-left:  2px solid #505254;
	border-right: 2px solid #505254;
	border-bottom:none;
}
.HinweisEnde {
	font-size:    1em;
	font-weight:  normal;
	line-height:  .5em;
	display:      block;
	background-color: lightgray;
	color:        black;
	margin-top:   0em;
	margin-left:  2em;
	margin-right: 2em;
	border:       0em;
	padding:      0em;
	padding-top:  .3em;
	border-left:  2px solid #505254;
	border-right: 2px solid #505254;
	border-bottom:2px solid #505254;
}

dl {
  display: grid;
  grid-template-columns: 25% 70% ;
  grid-gap: 1em 0.5em;
  margin-bottom: 3em;
}
dl > * {
  margin: 0 1em 0 ;
  padding: 0;
}
dt {
	font-size:   0.8em;
	color:black ;
   font-weight: bold;
}
dt::after {
  content: ":";
}

/* ------------------------------------------------------- */

.flex-container {
	display: flex;
   font-size: 1em;
	/*max-width: 75em;  */
	border: 2px dotted;
}
.flex-item {
	flex: auto;
	border: 1px solid;
	margin: .5em;
	padding: .5em;
	background: #ffebe6;
	color: black;
}
.flex-item:nth-of-type(2) {
	background: #fdfcf3;
	color: darkred;
}
.flex-item:nth-of-type(3) {
	background: #ebf5d7;
	color: darkgreen;
}
.flex-item:nth-of-type(4) {
	color: darkblue;
}
.flex-item:nth-of-type(5) {
	background: hsla(50, 53%, 73%, 0.4);
	color: white;
}

.no {
	flex-wrap: nowrap;
	background: url('../img/Hintergrund-6.jpg') ;  
	background-repeat: repeat ;
	background-size: cover ; 
	background-color: gray;
}

.wrap {
	flex-wrap: wrap;
}

p.flex-item {
	font-weight: bold;
	text-align: left;
	width: 14em;
}


/* ---- 2 Spalten ------------------------------ */

.flex-container2Sp {
	display: flex;
	/*max-width: 75em;  */
	border: 2px dotted;
	font-size: 1em;
	color: blue;
}

.flex-item2Sp {
	flex: auto;
	border: 1px solid;
	margin: .5em;
	padding: .5em;
	background: #ffebe6;
}
.flex-item2Sp:nth-of-type(2) {
	background: hsla(100, 53%, 73%, 0.5);
}
.flex-item2Sp:nth-of-type(3) {
	background: hsla(200, 53%, 73%, 0.5);
}
.flex-item2Sp:nth-of-type(4) {
	background: hsla(300, 53%, 73%, 0.5);
}
.flex-item2Sp:nth-of-type(5) {
	background: hsla(500, 53%, 73%, 0.5);
}
.no2Sp {
	flex-wrap: nowrap;
	background: url('../img/Hintergrund-6.jpg') ;  
	background-repeat: repeat ;
	background-size: cover ; 
	background-color: gray;
}
.wrap2Sp {
	background: url('../img/Hintergrund-3.jpg') ;  
	flex-wrap: wrap;
}
p.flex-item2Sp {
	font-weight: bold;
	text-align: left;
	width: 25em;
	background: hsla( 10, 53%, 73%, 0.5);
}
/* --- 2 Spalten ------------------------------------ */


/* --- Kopf / Header -- Anfang ---------------------------------- */
.flex-container-nav {
	display: flex;
	/* max-width: 75em;  */
	flex-wrap: nowrap;
/*
	background-repeat: repeat ;
	background-size: cover ; 
	background-color: transparent;
	border: 2px dotted;
*/
	align-items: flex-end ;
	text-align: left;
	font-size: 0.7em;
}
p.flex-item-nav {
	padding: .5em;
	font-weight: bold;
	text-align: left;
/*	border: 1px solid; */
	flex-shrink: 3;
	background-color: transparent;
}
.flex-item-nav:nth-of-type(2) {
}
.flex-item-nav:nth-of-type(3) {
}
.flex-item-nav:nth-of-type(4) {
}
.flex-item-nav:nth-of-type(5) {
}
/* --- Kopf / Header -- Ende ---------------------------------- */


/* --- Fuss / Footer -- Anfang ---------------------------------- */
.flex-container-bot {
	display: flex;
	width: 100%; 
	flex-wrap: nowrap;
	align-items: flex-top ;
/*	border: 2px dotted; */
	font-size: 0.7em;
}
.flex-item-bot {
	flex: auto;
/*	border: 1px solid; */
	margin: .5em;
	padding: .5em;
	text-align: left;
}
.flex-item-bot:nth-of-type(2) {
	text-align: center;
	flex-shrink: 3;
}
.flex-item-bot:nth-of-type(3) {
	text-align: right;
}
p.flex-item-bot {
	padding: 1.em;
	font-weight: bold;
/*	border: 1px solid; */
	background-color: transparent;
}
/* --- Fuss / Footer -- Ende ---------------------------------- */



/* CSS erweitern um MENÜ-Button und entsprechende Steuerung */
/*	Menü-Button oben rechts einblenden bei kleiner als 600px */
@media only screen and (max-width:600px) 
{
	.menue-button {
		display: block;
	}

	.menue-button {
		display: block;
		position: fixed;
		right: 0;
		top: 0;
		padding: 0.2em;
		color: white;
		background-color: gray;
		cursor: pointer;
		text-decoration: none;
		font-weight: bold;
		font-size: 1.5em;
	}	

	.menue-button:hover {
		color:  black;
		background: orange;
	}

	#bereichlogo {
		width: 100%;
	}

	#steuerung {
		font-size: 1.0em;
		float: left;
		width: 100%;
		display: none;
	}	

	#steuerung li {
		width: 100%;
		border-bottom: 2px solid silver;
	}	

	footer {
		font-size: 0.8em;
		display: flex;
		background-color: #8B1212;
		color: Gainsboro;
	}

	.flex-container-nav {
		display: flex;
		/* max-width: 75em;  */
		flex-wrap: nowrap;
		background-repeat: repeat ;
		background-size: cover ; 
		background-color: transparent;
		align-items: flex-end ;
/*		border: 2px dotted;  */
		text-align: left;
	}

	.flex-container {
		display: flex;
		font-size: 0.8em;
		color:darkred;
		/*max-width: 75em;  */
		border: 2px dotted;
		color: gray;
	}

	.flex-container2Sp {
		display: flex;
		/*max-width: 75em;  */
		border: 2px dotted;
		font-size: 0.6em;
		color: green;
	}

	.akzentfarbe0 {
		font-size: 1.2em;
/*		font-weight:bold; */
		color: white;
	}

	.akzentfarbe1 {
		font-size: 0.8em;		
		color: white ;
		padding: 0.em;
		margin: 0.em;
	}

	.akzentfarbe2 {
		color: darkred;
		font-weight:bold;
		font-size: 0.6em;
		padding: 0.em;
		margin: 0.em;
	}
	.akzentfarbe3 {
		color: black;
		font-weight:bold;
		font-size: 0.6em;
		padding: 0.em;
		margin: 0.em;
	}

p {
	text-decoration: none ; 	
	margin: 0.0em;
	display:block ;
	color: black;
	font-size: 0.9em;
}	

}

}

/* -------------------------------------------------------------- */