/* ------------------------------------------------------------------------------------	*/
/* Container-Definitionen - Das Standardgeruest fuer alle Seiten			*/
/* ------------------------------------------------------------------------------------	*/
/* Fuer alle Elemente standardmaessig Raender auf 0 setzen				*/
*
{
	padding			: 0;
	margin			: 0;
}

/* ------------------------------------------------------------------------------------	*/
html
{
	height			: 100%;
}
body
{
	font			: 100% Verdana, Arial, Helvetica, sans-serif;
	background-color	: #A0A0A0;	/* dunkleres Grau			*/
	height			: 100%;
}

/* ------------------------------------------------------------------------------------	*/
/* Hauptcontainer. Dieser nimmt alle anderen DIV auf und zieht sich ueber die gesamte	*/
/* Hoehe des Browserfensters.								*/
#mainframe
{
	min-height		: 100%;
	height			: auto!important;
	height			: 100%;
	width			: 1056px;
	position		: relative;
	margin			: auto;
	overflow		: hidden;
	background-color	: #0000A0;	/* dunkelblau				*/
	border-left-width	: 3px;
	border-left-style	: solid;
	border-left-color	: #C0C0C0;
	border-right-width	: 3px;
	border-right-style	: solid;
	border-right-color	: #C0C0C0;
}

/* ------------------------------------------------------------------------------------	*/
/* Kopfzeile										*/
#header
{
	height			: 83px;
	text-align		: center;
	color			: #FFFFFF;	/* Textfarbe weiss			*/
	position		: absolute;
	top			: 0;
	width			: 100%;
	background-color	: #0000A0;	/* dunkelblau				*/
	border-bottom-width	: 3px;
	border-bottom-style	: solid;
	border-bottom-color	: #C0C0C0;
	z-index			: 9;		/* Alles soll sich dahinter schieben	*/
}
#header h1					/* Ueberschrift h1			*/
{
	font-size		: 15pt;
  	padding			: 12px;
}
#header h2
{
	font-size		: 13pt;
}
#header h3				/* Information, wenn IE kleiner Version 8 ist.	*/
{
	position		: absolute;
	top			: 0px;
	left			: 0px;
	padding-left		: 2px;
	font-size		: 8pt;
	font-weight		: bold;
	text-align		: left;
	color			: #FF0000;
}
#header h4				/* Information zur Mutterseite.			*/
{
	position		: absolute;
	top			: 10px;
	right			: 35px;
	padding-right		: 2px;
	font-size		: 10pt;
	font-weight		: bold;
	text-align		: right;
	color			: #FFFFFF;
}
#header h4.srn			/* Information zur René-Seite.			*/
{
	position		: absolute;
	top				: 10px;
	right			: 770px;
	padding-left	: 2px;
	font-size		: 10pt;
	font-weight		: bold;
	text-align		: right;
	color			: #FFFFFF;
}
#header h4 a, #header h4.srn a
{
	text-decoration	: none;
	color			: #FFFFFF;
}
#header h4.srn a span
{
	display		: none;
}
#header h4.srn a:hover span
{
	position		: fixed;
	display			: block;
	background-size	: cover;	/* Alternative: contain			*/
	width			: 1000px;
	height			: 558px;
	top				: 100px;
	left			: 50%;
	margin-left		:-508px;
}
#header h5
{
	position		: absolute;
	top			: 25px;
	left			: 5px;
	padding-left		: 2px;
	font-size		: 9pt;
	font-weight		: bold;
	text-align		: left;
	color			: #FFFFFF;
}

/* ------------------------------------------------------------------------------------	*/
#header h4 a:focus, h4 a:active, h4 a:link, h4 a:visited
{
	outline			: none;
	outline			: 0;
	text-decoration		: none;
}

/* ------------------------------------------------------------------------------------	*/
/* IFrame fuer die Animation zur Ueberleitung zur Mutterseite				*/
/* ------------------------------------------------------------------------------------	*/
#header h4 iframe.uw
{
	position		: fixed;
	display			: block;
	height			: 0px;
	width			: 0px;
	overflow		: hidden;
	top			: 50%;
	bottom			: 50%;
	left			: 50%;
  	right			: 50%;
	margin-left		:-3px;
	opacity			: 0.5;
	z-index			: 1;
	transition		: 2s;
	transform-origin	: center center;
}
#header h4:hover iframe.uw
{
	border			: 3px solid #C0C0C0;
	height			: 710px;
	width			: 1058px;
	margin-left		:-532px;
	top			: 100px;
	left			: 50%;
	right			: 0;
	bottom			: 0;
	opacity			: 1;
	transform		: rotate(1800deg)scale(0.85);
	transition		: 5s;
	transform-origin	: center center;
}
#header h4 iframe.uw_:hover	/* Z.Zt. nicht aktiv. Soll fuer das Ausblenden beim	*/
{				/* hover ueber den IFrame verwendet werden.		*/
	height			: 0px;
	width			: 0px;
}

/* ------------------------------------------------------------------------------------	*/
/* Container und iFrame fuer die Darstellung der Wetterdaten				*/
/* ------------------------------------------------------------------------------------	*/
#weather
{
	display			: inline-block;
	position		: absolute;
}
#iframeweather
{
	position		: relative;
	display			: none;
	overflow		: hidden;
        justify-content		: center; /* Horizontal zentrieren */
        align-items		: center; /* Vertikal zentrieren */
        height			: 390px;  /* Nutzt die volle Höhe des Viewports */
        width			: 900px;  /* Nutzt die volle Breite des Viewports */
        margin			: 0;      /* Entfernt Standardabstände */	
	top			: 10%;
	opacity			: 1;
	z-index			: 1;
	/*transition		: all 3s ease-in-out;
	/*transition		: 2s;
	transform-origin	: center center;*/
}