/*	Position der Sprungadresse verschieben	*/
.sprung {
    visibility: hidden;
    height: 0px !important;
    position: absolute;
    margin: -43px;
}





/* Formatierung von Body-Text und Hintergrund */
/* für Bildschirmauflösung 1024 x 768 */

body 
{
/*	background-color:wheat;	*/
	background-color:#9C5D98;
	color:black;
	font-family:arial, 'times new roman';
	font-size:12pt;
	font-weight:400;
}

/* Format der Links, HTML-Tag a, im Body-Text */
body a 
{
	color:blue;
	font-weight:bold;
}


body a:visited
{
	background-color:none;
/*	text-decoration:underline;*/
/*    color:lightblue;*/
/*    text-decoration:line-through;*/
}

body a:hover
{
	color:yellow;
	font-weight:bold;
}



/* Formatierung einer Standardtabelle (Grundfarbe, Randfarbe und -breite) */
table
{
	border-color:#9C5D98;
 	background-color:rgba(0,0,0,0);
	border-style:solid;
	border-width:0px;
	border-collapse: collapse;
	cellpadding:5px;
}

table.frame
{
	border-color:black;
 	background-color:rgba(0,0,0,0);
	border-style:solid;
	border-width:5px;
	border-collapse: collapse;
	cellpadding:5px;
}

table.scroll thead tr:after 
	{	content: '';	overflow-y: scroll;	visibility: hidden;}
table.scroll thead th 
	{	width=50%;}
table.scroll tbody 
	{	display: block;		overflow-y: auto;	height: auto;	max-height: 200px;}
table.scroll thead tr,table.scroll tbody tr 
	{	width=100%;}
table.scroll tbody tr td 
	{	flex: 1 auto;	word-wrap: break;}

/* Formatierung des Tabellenkopfes */ 
th, tr, td 
{
	font-family:arial, 'times new roman';
}

/* Formatierung von Text in Code-Block */
pre
{
	font-size:8pt;
}
ch
{
	color:green;
	background-color:yellow;
	font-weight:bolder;
}


/* Formatierung von Ueberschriften */

h1, h2
{
	color:red;
	text-decoration:none;
	text-align:center;
	font-family:arial;
	font-size:22pt;
	font-weight:bolder;
}

h3
{
	color:black;
	text-decoration:none;
	text-align:center;
	font-family:arial,'times new roman';
	font-size:14pt;
	font-weight:bolder;
	margin-bottom:5px;
}

h4
{
	color:black;
	text-decoration:underline;
	text-align:left;
	font-family:arial,'times new roman';
	font-size:12pt;
	font-weight:bolder;
	margin-bottom:5px;
}

h5
{
	color:black;
	text-decoration:underline;
	text-align:left;
	font-family:arial,'times new roman';
	font-size:12pt;
	font-weight:bolder;
	padding-top:60px;
}

/* Formatierung von Listen */
/* ansprechen mit mit Listentag und class="xxxx" */
OL.klein
{
	position:relative;
	left:-10%;
	top:0%;
	right:2%;
	width:110%;
  	display:block;
	text-indent:-0%;
	list-style-type:disc;
	list-style-position:inside;
	font-size:10pt;
	background-color:none;
	color:navy;
	font-weight:400;
}

OL.tonuino
{
	margin-top:0%;
	position:relative;
	left:-0%;
	top:0%;
	right:2%;
	width:90%;
  	display:block;
	text-indent:-0%;
	list-style-position:outside;
	font-size:12pt;
	background-color:none;
	color:black;
	font-weight:400;
}

UL.klein
{
	margin-top:0px;
	position:relative;
	left:-0%;
	top:0%;
	right:2%;
	
  	display:block;
	text-indent:-0%;
	list-style-type:square;
	list-style-position:outside;
	font-size:12pt;
	background-color:none;
	color:black;
	font-weight:400;
}


/* Formatierung und Positionierung von Bloecken */

/* Block Menu_V */
#Menu_V 
{
	position:relative;
	left:0%;
	top:0%;
	height: 100%;
	background-color:lightblue;
	color:black;
	width:25%;
	float:left;
	padding:0% 0% 2% 2%;
}


#HWBOX
{
	position:relative;
	top:0%;
	left:0%;
	width:50%;
	border-width:medium;
	border-style:outset;
	border-color:navy;
	float:left;
	background-color:steelblue;
	font-family:'arial black', 'times new roman';
	font-size:12pt;
	font-weight:600;
	color:lightblue;
	padding:2% 0% 2% 2%;
}

/* Bild am rechten Rand mit Fliesstext links davon */
#imageR 
{
	position:relative;
	top:0%;
	left:0%; 
	width:39%;
	margin-left: 15px;
	border-width:medium;
	border-style:outse;
	border-color:none;
	float:right;
	background-color:none;
	text-align:center;
  	font-weight:600;
	color:navy;
	height: auto;
}

/* Frame am linken Rand mit Fliesstext rechts davon */
#iframeL 
{
	position:relative;
	top:0%;
	left:0%; 
	width:560;
	height:315;
	margin-right: 20px;
	border-width:medium;
	border-style:outse;
	border-color:none;
	float:left;
	background-color:none;
	text-align:center;
  	font-weight:600;
	color:navy;
}



/* Bild am linken Rand mit Fliesstext rechts davon */
#imageL 
{
	position:relative;
	top:0%;
	left:0%; 
	width:49%;
	margin-right: 25px;
	border-width:medium;
	border-style:outse;
	border-color:none;
	float:left;
	background-color:none;
	text-align:center;
  	font-weight:600;
	color:navy;
	height: auto;
}


/* Bild (klein) am linken Rand mit Fliesstext rechts davon */
#imageKL 
{
	position:relative;
 	top:0%;			
	left:0%; 
	width:100px;
	margin-right: 25px;
	border-width:medium;
	border-style:outse;
	border-color:none;
	float:left;
	background-color:none;
	text-align:center;
  	font-weight:600;
	color:navy;
	height: auto;
}

/* Bild in der Mitte der Seite ohne Fliesstext */
#imageC 
{
	position:relative; top:0%; right:0%; 
	display: block;
	width:80%;
	margin-right: Auto;
	margin-left: Auto;
	background-color:none;
	text-align:center;
	color:red;
	height: auto;
}


/* Block Menue */
#menu 
{
	background-color:wheat;
	color:green;
	width:15%;
	float:left;
	position:absolute;
	left:0px;
	top:60px;
}
/* Block Menue */
#menue 
{
	position:relative;
	top:0%;
	left:0%; 
	width:25%;
	float:left;
	background-color:none;
}

/* Formatierung der Links im Block Menue */
#menue a
{
	width:100%;
  	display:block;
    	bgcolor:darkblue;
	color:red;
	text-decoration:none;
}

#menue a:link
{
	background-color:none;
	color:blue;
}

/* Format eines Links im Menue-Block, wenn der Mauszeiger darueber steht */
#menue a:hover
{
	paddin:0px 0px 0px 0px;
  	font-weigh:bolder;
	background-color:none;
	background-image:url('logo.gif');
	background-repeat:no-repeat;
	color:green;
}

/* Format eines Links im Menue-Block, wenn schon benutzt */
#menue a:visited
{
	background-color:none;
	text-decoration:underline;
  color:lightblue;
/*  text-decoration:line-through;*/
}

/* Format eines Links im Menue-Block, wenn ausgewaehlt */
#menue a:active
{
	background-color:#555555;
	color:#dddddd;
}

/* Formatierung eines 2. Menue-Blocks Menueh */
#menueh 
{
	background-color:steelblue;
	color:black;
	width:95%;
	float:right;
	position:absolute;
	left:0px;
	top:20px;
}

/* Formatierung der Links im Block Menueh */
#menueh a
{
	width:25%;
  	display:block;
    	bgcolor:navy;
	text-decoration:none;
}

#menueh a:link
{
	background-color:navy;
	color:white;
}

/* Format eines Links im Block, wenn der Mauszeiger darueber steht */
#menueh a:hover
{
	padding:0px 0px 0px 0px;
  	font-weight:500;
	background-color:red;
	background-image:url('logo.gif');
	background-repeat:no-repeat;
	color:navy;
}

/* Format eines Links im Block Menueh, wenn schon benutzt */
#menueh a:visited
{
	background-color:navy;
	text-decoration:underline;
 	color:lightblue;
/*  text-decoration:line-through;*/
}

/* Format eines Links im Block Menueh, wenn ausgewaehlt */
#menueh a:active
{
	background-color:#555555;
	color:#dddddd;
}


/* Format von Text als Block meininhalt */

#meininhalt
{
	position:absolute;
	top:10px;
	left:7%;
	background-color:wheat;
}

/* Style the navbar */
#navbar {
  position: sticky;
  top: 0;
  margin: 1px 1px;
  overflow: hidden;
  background-color: #9C5D98;
  z-index: 10;	/*	legt die Navbar über alle anderen Elemente	*/
}

/* Tabelle Test*/
#sticktab {
position: sticky;
  top: 22px;
  overflow: hidden;
  background-color: #9C5D98;
}

#code {
		background-color: c899c4;
		}


/* Definition von Position und Bildgroesse image */


/* Formatierung von Klassen */
/* Der Name der Site */
/* Angabe mit: <p class="sitename"> */

button {
  background-color: c899c4; /* Green */
  border: none;
  color: white;
  padding: 4px 2px;
  text-align: center;
  text-decoration: none;
/*  display: inline-block;*/
/*  font-size: 16px;*/
  margin: 1px 1px;
  cursor: pointer;
  width: 40px;
  z-index: 10;	/*	legt die Buttons über alle anderen Elemente	*/
}

.button1 {width: 250px;}
.button2 {width: 150px;}
.button3 {width: 100%;}
.button4 {width: 50px; color:black; background-color: red; padding: 0px 0px; font-weight:bolder;}
.button5 {width: 50px; color:black; background-color: yellow; padding: 0px 0px; font-weight:bolder;}
.buttonR {background-color: red;}


p.sitename 
{
	background-color:c899c4;
	text-align:center;
	color:000000;
	font-size:22pt;
	font-weight:bolder;
	padding-bottom:2px;
	margin:2px;
}

.projekttitel 
{
	background-color:darkblue;
	color:yellow;
	font-weight:bolder;
}

.menuetitel 
{
	background-color:c899c4;
	color:black;
	font-weight:bolder;
	padding-left:5px;
	margin:2px;
}

.ftop
{
   	position: fixed;
	top: 0px;
	width:100%; 
	height:110px; 
	padding: 0px;
	background: 9C5D98; 
}

.fbot
{
   	position: fixed;
	bottom: 0px;
	width:100%; 
	height:40px; 
	padding: 0px;
	background: 9C5D98; 
}

/* Positionierung von 6 Bildern auf einer Seite */


#bild5x
{
	position:relative; top:0px; left 0%; width: 20%; height:auto;
	color:black; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:wheat;
	float:left;
}

#bild4x
{
	position:relative; top:0px; left 0%; width: 25%; height:auto;
	color:black; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:wheat;
	float:left;
}
#bild3x
{
	position:relative; top:0px; left:0%; width: 33%; height:auto;
	color:black; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:red;
	float: left;
}


#bild1
{
	position:absolute; top:10px; left:2%; width:30%; height:auto;
	color:gray; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:red
}

#bild2 
{
	position:absolute; top:10px; left:35%; width:30%; height:auto;
	color:gray; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:red
}

#bild3
{
	position:absolute; top:10px; left:69%; width:30%; height:auto;
	color:gray; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:red
}

#bild4
{
	position:absolute; top:50%; left:2%; width:30%; height:auto;
	color:gray; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:red
}

#bild5
{
	position:absolute; top:50%; left:35%; width:30%; height:auto;
	color:gray; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:red
}

#bild6
{
	position:absolute; top:50%; left:69%; width:30%; height:auto;
	color:gray; text-align:center; background-color:wheat;
	border-width:2px; border-style:dashed; border-color:red
}

/* Positionierung von Textblöcken auf einer Seite */

#left 
{
	width: 20%;
	float: left;
	margin-left: -1px;
	padding: 0px;
	background: 9C5D98;
/*	background: yellow; */
}

#right 
{
	width: 80%;
	padding: 2px;
	margin-left: 20%;
	background: transparent;
}
#fixframe 
{
   	position: fixed;
	width: 20%;
	height:82%;
	scrolling: yes;
}

div.wrapper {
	padding: 20px;
	display: block;
	overflow: auto;
}

div.stick	{position:sticky}