/* ################################
allgemeine Styles: html, body, h1.., a..
################################ */


* { padding:0; margin:0; }

html, body {
    min-height: 100% !important;
    height: 100%;
}

html { overflow-y:scroll; }

html {
	background:linear-gradient(to right bottom, #999999, #cccccc); /*#333333, #999999);*/
	background-attachment: fixed;
}

body {
	background-color:#ffffff; 
    border: 0px ridge silver;
	box-shadow: 3px 2px 2px #999;
	color:#333333;
    font-family:"Noto Serif", Georgia, Times, serif;
	font-size:87,5%;
	margin-left:auto;
	margin-right:auto;
	padding: 0px;
    width:860px; 
}
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: url('../templates/fonts/noto-serif-v21-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-regular.svg#NotoSerif') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Serif';
  font-style: italic;
  font-weight: 400;
  src: url('../templates/fonts/noto-serif-v21-latin-ext_latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../templates/fonts/noto-serif-v21-latin-ext_latin-italic.svg#NotoSerif') format('svg'); /* Legacy iOS */
}
/* übernommen autocomplete: */
* {
  box-sizing: border-box;
}


/*the container must be positioned relative:*/
.autocomplete, .autocomplete_hd {
  position: relative;
  display: inline-block;
}

input {
  border: 1px solid transparent;
  background-color: #f1f1f1;
  padding: 10px;
  font-size: 16px;
}

input[type=text] {
  background-color: #f1f1f1;
  width: 100%;
}

input[type=submit] {
  background-color: DodgerBlue;
  color: #fff;
  cursor: pointer;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}

.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff; 
  border-bottom: 1px solid #d4d4d4; 
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #e9e9e9; 
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}
/*Linkfarben: 
1.Autoren und hervorgehoben: #800000,
2. normaler Text, Werke: #006666 
3. vor dunklem Hintergrund weiß "wh" */

a:link {
	border:0px;
	font-weight:normal;
	text-indent: 0;
	margin-bottom: 0;
	color:#006666; /*color: #003399; green #800000*/
	text-align:center;
	text-decoration:none;
}
a:visited {
	color:#006666; /*color: green;#800000*/
	text-decoration:none;
}

a:hover {
	color:red; /*color:yellow;*/
	text-decoration:underline;
}

a:active {
	color:yellow; /*color: #003399;*/
	text-decoration:underline;
}

a.aut {
	color: #800000;
    position: relative;
    text-decoration: none;
}

a.aut:hover { 
	color:#ff0000;
	text-decoration:underline;
}

a.wh:link  {
	border:0px;
	font-weight:normal;
	text-indent: 0;
	margin-bottom: 0;
	color:#ffffff;
	text-align:center;
	text-decoration:none;
}
a.wh:visited { color:#ffffff; }
a.wh:hover { color:#ff0000; }

a.tt,
a.title,
a.no  {
	color:#800000;
    position: relative;
    text-decoration: none;
 }
/* Link mit tooltip ################*/

a.tt:after {
    background:#ffffff;  /* background: #ffcb66; #F8F5E9;*/
    border-radius: 10px;
    bottom: 5%; /* bottom: 130%;*/
    color: red; /* color: black; */
    content: attr(hd);
    left: 5%;/*left: 20%; */
    padding: 1px 1px; /* padding: 5px 15px;*/
    -webkit-border-radius: 10px;
    -moz-border-radius   : 10px;
    opacity: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition   : all 0.4s ease;
    position: absolute;
    transition   : all 0.4s ease;
    white-space: nowrap;
}

a.tt:before {
    border-top: 1px solid transparent; /*border-top: 20px solid #ffcb66;*/
    border-left: 1px solid transparent; /*border-left: 20px solid transparent;*/
    border-right: 20px solid transparent;
    bottom: 10%; /*bottom: 90%;*/
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    left: 30%;
    -webkit-transition: all 0.4s ease;
    -moz-transition   : all 0.4s ease;
    transition   : all 0.4s ease;
    opacity: 0;
}
  a.tt:hover:after {
    bottom: 80%; /* bottom: 100%; 70*/
}
  a.tt:hover:before {
    bottom: 10%; /*bottom: 70%;*/
}
a.tt:hover:after, a:hover:before {
    opacity: 1;
}

/* ################################################# 
Tooltip ohne Link */ 
 
.ttip {
    display: inline-block;
	position: relative;
	color:#222222; /*#800000*/
/* 	text-decoration: underline*/
  border-bottom: 1px dotted #cccccc; 
}

.ttip .ttiptext {
  visibility: hidden;
  width: 120px;
  background-color: #cccccc;
  color: red;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 50%;
  margin-left: -60px;
/*  border-color: black transparent transparent transparent;  */
  /* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */
  opacity: 0;
  transition: opacity 1s;
}
.ttip .ttiptext::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}
.ttip:hover .ttiptext {
  visibility: visible;
  opacity: 1;
}

h1, p, ul. ol . blockquote { margin-bottom:1em; }
ul ul, ul ol, ol ol, ol ul { margin-bottom:0; }
ul, ol { margin-left:2em; }

h1 { 
	font-size:180%;
	color:#666666; 
}

h2 { 
	font-size:150%;
	color:#666666;
 }
 
h3 { 
	font-size:125%;
	color:#666666;
}

h4 { 
	font-size:110%;
	color:#666666;
}

h1.wh { 
	font-size:180%;
	color:#ffffff;
}

h2.wh { 
	font-size:150%;
	color:#ffffff;
}

h3.wh { 
	font-size:130%;
	color:#ffffff;
}

h4.wh { 
	font-size:110%;
	color:#ffffff;
}

h5.wh { 
	font-size:100%;
	color:#ffffff;
}

p {
	line-height: 1.25em;
	margin-bottom: 1.2em;
	text-align:justify;
}

p.smami {
	width:500px;
	font-size:80%;
	line-height: 1.25em;
	margin-bottom: 1.2em;
	margin: auto;
	text-align:center;
}
p.t500 {
	width:500px;
/*	font-size:80%;
	line-height: 1.25em;
	margin-bottom: 1.2em;
	margin: auto;
	*/
	text-align:justify;
}
p.t600 {
	width:600px;
/*	font-size:80%;
	line-height: 1.25em;
	margin-bottom: 1.2em;
	margin: auto;
	*/
	text-align:justify;
}
/*
input[type=text] {
    width: 100%;
    box-sizing: border-box;
    border: 2px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
    background-color: white;
    background-image: url('searchicon.png');
    background-position: 10px 10px; 
    background-repeat: no-repeat;
    padding: 12px 20px 12px 40px;
}
*/
/*
form {
  display:flex;
  flex-direction:row;
  justify-content: flex-start;
  width:400px; /*width:400px;*/
  /*
  height:32px; 
  border:1px ridge silver;
  padding:0px;
}
*/
/*
input {
  /* Tell the input to use all the available space */
/*  flex-grow:2;*/
  /* And hide the input's outline, so the form looks like the outline */
/*  border:none;
}
*/
/*
button {
  /* Just a little styling to make it pretty */
/*  border:1px solid blue;
  background:blue;
  color:white;
}
*/
/*
input[type=text] {
	width:364px; 
    border: 0px ridge silver;
	height:32px; 
	text-align:left;
	vertical-align:top;
	padding-top:0px;
	/*padding-right:35px;*/
/*
	padding-left:5px;
	margin: auto;
	/*background-image: url('../bilder/suche_30t.jpg');
	background-position: 0px 0px; 
    background-repeat: no-repeat;*/

/*
	background-color:#ffffff; 
}
*/
/*
div.input {
	width:400px;
    border: 1px ridge silver;
	height:32px; 
	text-align:left;
	vertical-align:top;
	padding-top:0px;
	padding-right:0px;
	padding-left:0px;
	margin: auto;
	background-color:#ffffff; 
}
*/

div.input_kl {
	background-color:#ffffff; 	
	border: 2px ridge silver;	
	height:24px;	
	margin-left: 115px;	
	text-align:left;
	vertical-align:top;
	padding-top:0px;
	padding-right:0px;
	padding-left:0px;	
	width:280px;
}

div.label_kl {
	background-color:#f2f2f2;	
	border: 0px ridge blue;
	box-sizing: border-box;
	float:left;
	height:24px;
	margin: 0 auto;
	text-align:left;
	padding-top:0px;
	padding-right:0px;
	padding-left:3px;	
	width:110px;
}

.link_block_aut {
	width:400px;
    border: 1px ridge white;
	font-family: "Noto Serif", Georgia, Times, serif;
	height:30px;
	color:white;
	text-align:left;
	vertical-align:middle;
	padding-top:5px;
	padding-right:15px;
	padding-left:15px;
	margin: auto;
	background-color:#cd8500; /*#cd8500!!!sienna #a0522d* ; burlywood4/ #8b7355 Groth: #ffa84c*/
}

.link_block_werk {
	width:400px;
    border: 1px ridge white;
	font-family: "Noto Serif", Georgia, Times, serif;
	height:30px;
	color:white;
	text-align:left;
	vertical-align:middle;
	padding-top:5px;
	padding-right:15px;
	padding-left:15px;
	margin: auto;
	background-color:#8b7355; /*olive #8b7355*/
}

.link_block_text {
	width:400px;
    border: 1px ridge white;
	font-family: "Noto Serif", Georgia, Times, serif;
	height:30px;
	color:white;
	text-align:left;
	vertical-align:middle;
	padding-top:5px;
	padding-right:15px;
	padding-left:15px;
	margin: auto;
	background-color:olive; /*darkgreen, darkorange, cd8500, #cd8500*/
}

.link_block_dwn {
	width:400px;
    border: 1px ridge white;
	font-family: "Noto Serif", Georgia, Times, serif;
	height:30px;
	color:white;
	text-align:left;
	vertical-align:middle;
	padding-top:5px;
	padding-right:15px;
	padding-left:15px;
	margin: auto;
	background-color:steelblue; /*#4682b4, 4f94cd*/
}

div#nav_text {
	overflow:hidden;
	margin: 0;
	padding-left: 130px;
}

div#nav_text  ul {
	padding:0;
	margin: 0;	
}

div#nav_text li {
	float: left;
	width: auto;
	list-style:none;
	line-height:1;
	padding:0;
	margin: 0;	
}

div#nav_text li.sie-sind-hier a {
	background: #ffffff url("navi-hier.jpg") repeat-x left top;
	color:black;
	font-weight: normal;
	text-decoration: none;	
}

div#nav_text li.sie-sind-hier a {
	border:3px;
	background: #dddddd;
}

div#nav_text ul a:hover, 
div#nav_text ul a:focus {
	background: #ffffff; /*background: #dddddd;*/
	border-bottom: 3px;
	color: red; /*color: black;*/
	text-decoration: none;
}

div#nav_text ul a:active {
	background: #b80000;
	color: white;
}

div.a_0 {	width: 380px;}
div.a_1 { 	width: 180px; }
div.a_2 {	width: 160px;}

.right250 {
	width:250px;
	float: right;
	font-size:80%;
	font-family: "Noto Serif", Georgia, Times, serif;
	border: 0px ridge #866666;/*border: 1px ridge silver; */
	padding-top:20px;
	padding-bottom:20px;
	margin-right: 10px;
	text-align:justify;	
 }
 
 div#seiten {
	position:relative;
	background: #ffffff;
	width: 100%;
	height: 80px;
	text-align: top;
	margin-bottom:0px;
	padding-bottom: 20 px;	
	margin:0 auto;
}

.zeile_li {
	border:1px;
	width:10px;
	float:left;
	padding-left:10px;
	padding-right:30px;
 }
/* ################################
allgemeine Styles für Layoutbereiche header, nav,  main, section 
################################ */

header, nav, section, footer,  article, img {
	display: block;
}

img.left {
	float:left;
    vertical-align: bottom;
    margin-right: 5px;
}

img.center {
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

*.head { 
	vertical-align:top;
	background-color:#ececec;
}

*.wort { 
	color:#444444;
	vertical-align:top;
	background-color:#efeedd;/*background-color:#efeedd;*/
}

*.tophead {
	background-color:#dbdbdb;
}

*.m {
background-color:#ffcc66;
         }
	 
*.n 	{
	background-color:#eeee33;
	 }
*.nalt {
	background-color:#ff9966;
	 }
*.nu {
	background-color:#ffffcc;
	 }
*.nualt {
	background-color:#ffaa99;
	 }
td.n_region {
	background-color:#ffffcc;
	 }
td.m {
	background-color:#ffcc66;
	 }
*.o {  
	background-color:#ffff66;
	 }
*.wm {
	background-color:#66cc66;
	 }
*.fw {
	background-color:#66cc66;
	 }
*.fwu {
	background-color:#aaccaa;
	 }
*.fo {
	background-color:#6699ff;
	 }
*.fou {
	background-color:#99ccff;
	 }
*.mk {
	background-color:#ff9966;
	 }
*.mku {
	background-color:#ffaa99;
	 }
*.hdsich {
	background-color:#ff9966;
	 }
*.hd {
	background-color:#cccccc;
	 }

.text600 {
	width:600px; /*450px*/
	margin:0 auto;
	text-align:justify;
}

.text550 {
	width:550px; 
	margin:0 auto;
	text-align:justify;
}

.text500 {
	width:500px;
	margin:0 auto;
	text-align:justify;
	text-justify:inter-word;
}
.text450 {
	width:450px;
	margin:0 auto;
	text-align:justify;
}

.text400 {
	width:400px;
	margin:0 auto;
	text-align:justify;
}
.text325 {
	width:325px;
	margin:0 auto;
	text-align:justify;
}
.text300 {
	width:300px;
	margin:0 auto;
	text-align:justify;
}
.text275 {
	width:275px;
	margin:0 auto;
	text-align:justify;
}
.text200 {
	width:200px;
	margin:0 auto;
	text-align:justify;
}

section.short {
	width:65%;
    font-size:87,5%;
	margin: 0 auto;
}

.biographie {
	background-color:#f6f6f6; /*snow*/
	border: 1px solid silver;
   	margin: 0 auto;
	padding: 20px;
	width:60%;
}

.werke {
	font-size:87,5%;
   	margin: 0 auto;
	width:600px;
}
 
section#werke {
	width:85%;
    font-size:87,5%;
	margin: 0 auto;
}

section#suchbox {
 	background-color:#f2f2f2; /*#ffffff  ;*/
	border: 1px ridge silver;
	border-radius: 5px;
	font-family:Verdana, Arial, sans-serif;
	font-size:86%; 
   	margin: 0 auto;
	padding-top: 5px;
	padding-right:20px;
	padding-left: 20px;
	padding-bottom:10px;
	width:430px;/*width:500px;*/
}

section#info {
	width:75%;/*width:400px;*/
	font-size: 14px;
	/*background-color:#F8F5E9; *//*#ffffff */
	font-family:Verdana,Arial,Helvetica, sans-serif;
	min-height: 100%; /* Mindesthöhe für moderne Browser */
    height:auto !important;
    height:100%; 
   	margin: 0 auto;
}
 
article {
	font-size:87,5%;
	line-height: 1.25em;
	margin:auto;
	margin-bottom: 1.2em;
	text-align:justify;
	width;250px;
}

header {
    border: 2px ridge white;
	text-align:center;
	vertical-align:middle;
	padding:20px;
	background-color:#cd3700; /*#cd2626 , darkred, red3 cd0000, #aa0000, cd3700*/
}

main[role="main"] {
	background-color:#ffffff;
    border: 0;
	font-family: "Noto Serif", Georgia, Times, serif;
    margin: 0 auto;
	margin-bottom: 2px;
    min-height:100%; 
	padding:20px;
}

.nav {
	background-color:#dddddd;
	border:0px ridge white;
	border-bottom:1px ridge silver;
	float:left;
    font-family:Verdana, Arial, sans-serif;
	margin-top:1px;
	padding-top:5px;
	padding-right:0px;
	padding-bottom:5px;
	padding-left:0px;
	text-align:center;	
	white-space:nowrap;
	margin-top:1px;
	width:20%;	
}

.box_top {
	text-align:center;
	margin: auto;
	background:#f6f6f6; /*snow*/
	width: 383px;
	padding: 0.5em;
	border: 1px solid #000000;
	border-radius: 0.5em;
}

.box_footer {
	float: left;
	text-align:left;
	color:#ffffff;
	margin-top: 1px;
	background:#cd3700; /*snow #f6f6f6*/
	width: 23%;
	padding-right: 3px;
	padding-left: 10px;
	border: 0px solid #000000;
	/*border-radius: 0.5em;*/
}
.box_text_fuss {
	float: left;
	text-align:left;
	color:#ffffff;
	margin-top: 1px;
	background:#ffffff; /*snow #f6f6f6*/
	width: 100%;
	height: 50px;
	padding-right: 10px;
	padding-left: 10px;
	border: 2px solid #000000;
	/*border-radius: 0.5em;*/
}
div#box_2 {
	background: #f6f6f6;
	width: 383px;
	margin:auto;
	padding: 0.5em;
	border: 1px solid #000000;
	border-radius: 0.5em;
	text-align: center;
}

table {
	 margin:auto;
}

th, td {
    padding: 3px;
    text-align: left;
}

table.small {
	border:1px ridge gray;
	text-align:center;
	width:385px;
    padding: 2px;
	frame:box;
	rules:rows;	
}

table.normal {
	border:1px ridge gray;
	text-align:center;
	width:500px;
    padding: 2px;
	frame:box;
	rules:rows;	
}

table.wide {
	border:1px ridge gray;
	text-align:center;
	width:600px;
    padding: 3px;
	frame:box;
	rules:rows;	
}

td.bottom {
    vertical-align: bottom;	
}

tr.trhe {
	border-top: 0px ridge silver; /*ffa84c */
	background-color: #ffddaa; /* dddd99  ffcc99 ffeecc*/
}
tr.trne {
	font-style:italic;
	background-color: #ddddcc; /* eeeecc */
}

td.tdhe {
	padding-top:2px;
	padding-bottom:2px;
	padding-left:10px;
	text-align:left;
}
td.tdne {
	padding-top:2px;
	padding-bottom:2px;
	padding-left:20px;
	text-align:left;
}

span.pld 	{
	color:#800000;
}

hr { 
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: 10%;
  margin-right: 10%;
  border-style: inset;
  border-width: 1px;
} 

footer {
	color:#ffffff;
	font-size:80%;
	position: relative;
	box-sizing: border-box;
	margin-bottom: 1px;
	padding-top:10px;
	padding-bottom:30px;
	width: 100%;
	line-height: 1.5em;
	/*text-align: center;*/
	background-color:#cd3700;
	border: 3px ridge silver;
}