/*   ======= Bezugsrahmen für alle Elemente der Seite*/
	#Rahmen {
		position: absolute;
		/*border: 1px solid #333;*/
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 2;
	}
/*--  ====    Die Klasse table-cell-wrapper gibt die Fläche auf der Seite an, in der die Bilder eingebunden sind. Daher absolute Positionierung====   */
	.table-cell-wrapper {
	    position: absolute;
	    display: table;
	}
/*--  ====    Die Klasse table-cell in Verbindung mit dem einschließenden DIV sorgt für eine vertikale Ausrichtung des Bilds in einem genau passenden Rahmen-DIV ====   */
	.table-cell {
	    vertical-align: bottom;
	    display: table-cell;
	}

/*  ====     Die einzelnen Bildelemente werden verortet.*/
	#Bild2{
		position: absolute;
	/*	border: 2px solid blue;*/
		left: 61%;
		bottom: 28%;
		width: 35%;
	}
	#Bild3{
	position: absolute;
/*		border: 1px solid blue;*/
	visibility: visible; 
	display: table;
	text-align: right;
	bottom:  25%;
	left: 51%;
	padding-top: 1%;
	width: 10%;
	}
.Pfeile{
		margin-top: 8%;
		max-height: 12%;	
	}
/*====    begrenzt das Buld auf den gegebenen Rahmen*/
	.B1{
		max-height: 100%;
		max-width: 100%;
	}
/*========= Wie für  Bilder hier für Texte*/
	#Texte{
		position: absolute;
	/*border: 1px solid #333;*/
		left: 22% ;
		bottom: 28% ;
		width: 36%;
		height: 60%;
		margin: 0; 
	}
	#Text1{
		position: absolute;
		/*border: 1px solid red;*/
		right:0% ;
		bottom:0%;
		max-height: 85%;
		overflow: auto;
	}
	#Diatext{
			background-color: transparent; 
			text-align: right;
			clear: none;
	}
	#Diatext p{
 		font-size: 11pt; 
		font-family: "Courier New", Courier, Monaco, monospace; 
		font-weight: 500; 
		margin:   5px 0px 0px 5px; 
	}