/* Psychologische Praxis Manfred Soeder */

html
	{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
*, *:before, *:after
	{
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
	}

.menu, .menu ul, .menu ul li, .menu ul li a,
.menu ul ul, .menu ul ul li, .menu ul ul li a
	{
	margin: 0;
	padding: 0;
	border: 0;
	line-height: 1;
	}

.menu ul
	{
	list-style-type: none; 
	text-align: center;
	} 

.menu ul li
	{
	position: relative;
	display: inline; 
	text-align: center;
	}

.menu ul li a
	{
	text-decoration: none;
	display: inline-block; 
	width: 160px; 
	padding: 10px;
	color: #333;
	background: #222;
	}

.menu ul li a:hover, .menu ul li a:focus, .menu ul li a:active
	{
	color: #777;
	background: #333;
	}

.menu-arrow
	{
	font-size: 10px;
	}

.menu ul ul
	{
	position: absolute;
	left:0;
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */
	filter: alpha(opacity=0); /* IE 5-7 */
	}

.menu ul li:hover ul
	{
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */
	filter: alpha(opacity=100); /* IE 5-7 */
	}

.menu ul ul li
	{
	display: block;
	text-align: left;
	}

.menu ul ul li a
	{
	width: 100%;
	min-width:160px;
	padding: 10px;
	white-space: nowrap;
	border-bottom: 1px solid #ddd;
	color: #333;
	background: #444;
	}

.menu ul ul li a:hover, .menu ul ul li a:focus, .menu ul ul li a:active
	{
	color: #777;
	background: #555;
	}

.menu ul li a, .menu ul ul li, .menu ul li:hover, .menu ul ul
	{
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	}

@media screen and (max-width : 600px)
	{
	.menu
		{
		display: none;
		}

	.menu ul li
		{
		display: block;
		border-bottom: 1px solid #ccc;
		}

	.menu ul li, .menu ul li a
		{
		width: 100%;
		}

	.menu ul ul
		{
		position: relative;
		display: none;
		}

	.menu ul li:hover ul
		{
		display: block;
		}

	.menu ul ul li
		{
		text-align: center;
		}
	}

.hack {display: none;}

div.kopfzeile2
	{
	height: 50px;
	background-color: #00f;
	vertical-align: middle;
	padding: 10px; 
	margin: 0;
	}
div.kopfzeile2 a:link
	{
	color: silver;
	}
div.kopfzeile2 a:visited
	{
	color: gray;
	}

span.menue_ein
	{
	display: inline;
	padding: 5px;
	}
span.menue_aus
	{
	display: none;
	padding: 5px;
	}

span.menue_ein a:link
	{
	color: silver;
	}
span.menue_aus a:link
	{
	color: silver;
	}
span.menue_ein a:visited
	{
	color: silver;
	}
span.menue_aus a:visited
	{
	color: silver;
	}

@media screen and (min-width: 601px) 
	{
	div.kopfzeile2 {display: block;}
	#menue_oeffnen {display: none;}
	#menue_schliessen {display: none;}
	}
@media screen and (max-width: 600px) 
	{
	div.kopfzeile2 {display: none;}
	#menue_oeffnen {display: inline;}
	#menue_schliessen {display: inline;}
	}

td.navigation
	{
	background: #444;
	width: 200px;
	vertical-align: top;
	padding: 0;
	margin: 0;
	height: 100%;
	}

td.responsiv
	{
	background-color: #444;
	width: 20px;
	vertical-align: top;
	padding: 0;
	margin: 0;
	}

nav
	{
	font-size: 0.9em;
	color: white;
	padding: 10px;
	}

nav ul
	{
	padding-left: 30px;
	}
nav p
	{
	padding-left: 10px;
	}

td.inhalt
	{
	background: white;
	vertical-align: top;
	padding: 0;
	margin: 0;
	width: 100%;
	}

main
	{
	font-size: 1em;
	color: gray;
	padding: 25px;
	}

#navigation_rechts
	{
	position: absolute;
	top: 165px;
	right: 10%;
	font-size: 0.9em;
	}

#navigation_rechts p
	{
	color: black;
	margin-left: 20px;
	}
#navigation_rechts ul
	{
	background: #444;
	list-style: none;
	padding-top: 10px;
	padding-bottom: 10px;
	}
#navigation_rechts li
	{
	margin-right: 30px;
	}

#navigation_rechts a:link, nav a:link
	{
	color: #ddd;
	}
#navigation_rechts a:visited, nav a:visited
	{
	color: #bbb;
	} 
#navigation_rechts a:active, nav a:active
	{
	color: #fff;
	}
#navigation_rechts a:hover, nav a:hover
	{
	color: #fff;
	border: 0;
	}

body
	{
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	background: #666;
	padding-top: 0;
	padding-bottom: 20px;
	padding-left: 10%;
	padding-right: 10%;
	margin: 0;
}

header
	{
	background: #000;
	color: silver;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	}

div.kopfzeile
	{
	height: 150px;
	background: black;
	color: silver;
	vertical-align: middle;
	margin: 0;
	}

img.bild
	{
	border-style: none;
	height: 150px;
	position: absolute;
	top: 0px;
	left: 10%;
	}
img.bild2
	{
	border-style: none;
	height: 150px;
	position: absolute;
	top: 0px;
	right: 10%;
	}
p.termine
	{
	position: absolute;
	top: 200px;
	right: 12%;
	}

@media screen and (max-width: 1200px)
	{
	body
		{
		padding-left: 0;
		padding-right: 0;
		}
	img.bild { left: 0; }
	img.bild2 {	right: 0; }
	p.termine { right: 10px; }
	#navigation_rechts { right: 0; }
	}

@media screen and (max-width: 1000px)
	{
	img.bild { display: none; }
	img.bild2 { display: none; }
	p.termine { display: none; }
	}

@media screen and (max-width: 800px)
	{
	#navigation_rechts { display: none; }
	}

@media screen and (max-width: 600px)
	{
	td.navigation { display: none; }
	
	#menue_auf:target ~ * td.navigation 
		{
		display: block;
		}
	#menue_zu:target ~ * td.navigation
		{
		display: none;
		}

	#menue_auf:target ~ * span.menue_ein
		{
		display: none;
		}
	#menue_auf:target ~ * span.menue_aus
		{
		display: inline;
		}
	#menue_zu:target ~ * span.menue_ein
		{
		display: inline;
		}
	#menue_zu:target ~ * span.menue_aus
		{
		display: none;
		}
	}

@media screen and (min-width: 600px)
	{
	td.navigation { display: block; }
	}

p.titel1
	{
	font-size: 1em;
	text-align: center;
	white-space: nowrap;
	padding-top: 10px;
	}
p.titel2
	{
	font-size: 2em;
	text-align: center;
	white-space: nowrap;
	color: #00f;
	margin: 0;
	}
p.titel3
	{
	font-size: 1em;
	text-align: center;
	white-space: nowrap;
	}

footer
	{
	background: #000;
	color: gray;
	font-size: 0.8em;
	padding: 10px 10px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	}
footer a
	{
	padding: 10px;
	}

p
	{
	text-align: justify;
	}
p.center
	{
 	text-align: center;
	}
p.left
	{
 	text-align: left;
	}
p.right
	{
 	text-align: right;
	}

div.fusszeile
	{
	text-align: center;
	font-style: italic;
	}
p.linkleiste1
	{
	text-align: center;
	font-style: bold;
	}
p.linkleiste2
	{
	text-align: center;
	line-height: 200%;
	}
	
p.linkleiste2 a
	{
	background-color: #00f;
	border: none;
	padding: 5px 10px;
	text-align: center;
	text-decoration: none;
	color: black;
	display: inline;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: bold;
	}
	
p.linkleiste2 a.hover
	{
	background-color: #fff;
	}
	
a.link
	{
	text-decoration: none;
	}
a:link
	{
	color: #00d;
	}
a:visited
	{
	color: #00b;
	} 
a:active
	{
	color: #00f;
	}
a:hover
	{
	color: #00f;
	border: 0;
	}

h1
	{
	font-size: 1.5em;
	padding: 10px;
	border: 1px solid #00f;
	color: #00f;
	width: 100%;
	border-radius: 10px;
	}
h2
	{
	font-size: 1.4em;
	}
h3
	{
	font-size: 1.3em;
	}
h4
	{
	font-size: 1.2em;
	}
h5
	{
	font-size: 1.1em;
	}
h6
	{
	font-size: 1em;
	font-weight: bold;
	}
	
ul
	{
	padding-left: 20px;
	list-style-type: square;
	}
li
	{
	padding-top: 5px;
	padding-bottom: 5px;
	}

table
	{
	border-collapse: collapse;
	}

table.struktur
	{
	width: 100%;
	border: 0;
	}
table.rahmen
	{
	border: solid thin silver;
	font-size: 0.9em;
	padding: 5px;
	}

table.normal
	{
	border: solid thin silver;
	border-padding: 5px;
	border-spacing: 0px;
	font-size: 0.9em;
	padding: 5px;
	}
table.normal th
	{
	border-padding: 5px;
	padding: 5px;
	background: #00f;
	color: black;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
	}
table.normal td
	{
	border-padding: 5px;
	padding: 5px;
	color: gray;
	text-align: center;
	vertical-align: middle;
	}

table.kalender
	{
	border: solid thin silver;
	border-padding: 5px;
	border-spacing: 0px;
	font-size: 0.9em;
	padding: 5px;
	}
table.kalender th
	{
	border: solid thin silver;
	border-padding: 5px;
	padding: 5px;
	font-weight: bold;
	vertical-align: middle;
	}
table.kalender td
	{
	border: solid thin silver;
	border-padding: 5px;
	padding: 5px;
	vertical-align: middle;
	}

table.test
	{
	border: solid thin silver;
	border-padding: 5px;
	border-spacing: 0px;
	font-size: 0.9em;
	padding: 5px;
	}
table.test th
	{
	background: #00f;
	border: solid thin silver;
	border-padding: 5px;
	padding: 5px;
	font-weight: bold;
	vertical-align: middle;
	}
table.test td
	{
	border: solid thin silver;
	border-padding: 5px;
	padding: 5px;
	vertical-align: middle;
	}

table.block td
	{
	padding: 10px;
	}

@media screen and (max-width: 1200px)
	{
	table.block td
		{
		display: block;
		float: left;
		}
	}

#rot
	{
	color: red;
	}
#blau
	{
	color: blue;
	}
#gruen
	{
	color: green;
	}
#schwarz
	{
	color: black;
	}

div.feedback
	{
	text-align: center;
	border: 3px solid black;
	background-color: #eee;
	padding: 10px;
	margin: 10px;
	}
#rot
	{
	color: red;
	}
#blau
	{
	color: blue;
	}
#gruen
	{
	color: green;
	}
#schwarz
	{
	color: black;
	}

div.feedback
	{
	text-align: center;
	border: 3px solid black;
	background-color: #eee;
	padding: 10px;
	margin: 10px;
	}

input[type='text'], input[type='password'], input[type='number'], input[type='email'], input[type='url'], input[type='radio'], input[type='checkbox'], textarea, select, option
	{
	border-color: #00f;
	border-radius: 5px;
	}

div.flex-container
	{
  	display:flex;
	flex-direction: rows;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: strech;
	}
.flex-item
	{
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: auto;
	width: 250px;
	border: 1px solid #00f;
	border-radius: 20px;
	padding: 10px;
	margin-bottom: 25px;
	font-size: 0.9em;
	}