/* ------------------------------------------------------------------------------------	*/
/* Definition fuer den Beschreibungsteil, inklusive der Bereiche fuer die Bilder-	*/
/* galerien, ohne die Definition der dazugehoerigen Tabellen (table.css)		*/
/* ------------------------------------------------------------------------------------	*/
/* Der Beschreibungsteil setzt sich aus drei Haupt-Containern und einem Hilfs-		*/
/* Container zusammen:									*/
/* - Container fuer das Haupttextfeld							*/
/* - Container fuer die Bilder zur Beschreibung						*/
/* - Container fuer das Textfeld, wenn keine Bilder angezeigt werden			*/
/* - Hilfscontainer, um das Logo korrekt plazieren zu koennen				*/
/* - Zwei Hilfscontainer fuer ueberlange Beschreibungen (siehe weiter unten).		*/
#beschreibung, #beschreibung_header, #beschreibungsbilder, #beschreibungstext
{
	width			: 867px;
	position		: absolute;
	overflow		: auto;
	text-align		: left;
}
#beschreibung, #beschreibung_header
{
	height			: auto!important;
	height			: 100%;
	top			: 135px;
	right			: 0px;
	bottom			: 181px;
	padding			: 0px 5px 0px 10px;
	z-index			: 10;
}
#beschreibung_header
{
	top			: 86px;
	padding			: 20px 5px 0px 10px;
	overflow-y		: hidden;
	z-index			: 4;
}
#beschreibung_header h1
{
	color			: #FFFFFF;
  	font-size		: 13pt;
  	margin			: 0;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 	*/
/* Diese beiden Hilfscontainer ersetzen die Doppeltabelle im Beschreibungs-Container,	*/
/* wenn es sich um ueberlange Beschreibungen handelt. Damit wird ein umfliessen der	*/
/* inline-Bildergalerie fuer die hover-Bilder ermoeglicht, so dass der Text dann auch	*/
/* unterhalb dieser Galerie weiterlaeuft.						*/
/* -----------------------------------------------------------------------------------	*/
/* Nimmt die Inline-Bildergalerie auf (als Tabelle) und ist ein Kind-Container des 	*/
/* nachfolgenden Containers.								*/
#beschreibung_hover, .beschreibung_hover
{
	float			: right;
	width			: 110px;
	height			: 100%;
	height			: auto;
	margin-right		:-2px;
	margin-top		: 0px;
	margin-left		: 5px;
}
/* Inline-Bildergalerie mit vertikalem Rollbalken fuer Seiten mit sehr vielen Bildern.	*/
/* Der Rollbalken nimmt in der Breite 15 Pixel in Anspruch.
/* Ein Bild im CSS2.1-Modus ist 82px hoch (inklusive Rahmen und Abstand).		*/
/* Ein Bild im CSS3.0-Modus ist 85px hoch (inklusive Rahmen und Abstand).		*/
.beschreibung_hover_scroll
{
	float			: right;
	width			: 125px;
	height			: 410px;	/* Das entspricht 5 Bildern a 82px hoch	*/
	overflow-y		: scroll;
	margin-right		:-1px;
	margin-top		: 2px;
	margin-left		: 5px;
}
/* Ersetzt die Tabelle zur Beschreibung und nimmt die Inline-Bildergalerie als Kind-	*/
/* Container auf (dieser besitzt ein 'float' zur Textumfliessung.			*/
#beschreibung_text
{
	position		: absolute;
	height			: auto!important;
	height			: 100%;
	width			: 98%;
	border			: 4px double #000000;
	background-color	: #C0C0C0;
	font-size		: 11pt;
}
#beschreibung_text p				/* Anpassung des Absatzes		*/
{
	margin			: 4px;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 	*/
#beschreibungsbilder, #beschreibungstext
{
	bottom			: 0px;
	right			: 0px;
	height			: 181px;
	padding			: 0px 5px 0px 0px;
	z-index			: 5;
}
#beschreibungstext
{
	bottom			: 5px;
	right			: 5px;
	width			: 837px;
	height			: 160px;
	font-size		: 9pt;
	background-color	: #C0C0C0;
	border			: 4px double #000000;
	padding			: 2px 2px 2px 20px;
	overflow		: hidden;
}
#beschreibungstextbilder, #beschreibungstextanimation
{
	position		: absolute;
	bottom			: 57px;
	right			: 5px;
	overflow		: hidden;
	z-index			: 6;
}
#beschreibungstextanimation
{
	bottom			: 13px;
	right			: 200px;
}

#beschreibung h1
{
	color			: #FFFFFF;
  	font-size		: 13pt;
  	margin-bottom		: 5px;
}
#beschreibung h2, h5, h6
{
	color			: #000000;
  	font-size		: 11pt;
  	font-weight		: bold;
  	margin-left		: 4px;
  	margin-bottom		: 5px;
}
#beschreibung h5, h6
{
  	font-size		: 10pt;
}
#beschreibung h6
{
  	font-weight		: normal;
}
#beschreibungsbilder h2, #beschreibungsbilder a.foot	/* "Fusszeile" in index.html	*/
{
	color			: #FFFFFF;
  	font-size		: 9pt;
  	font-weight		: bold;
  	text-align		: center;
  	margin-top		: 0px;
  	border-top		: 1px solid #C0C0C0;
  	padding-top		: 3px;
}
#beschreibungstext strong, ul, li
{
	color			: #0000A0;
}
#beschreibungstext p
{
	font-size		: 8pt;
	font-weight		: normal;
	color			: #000000;
}
#beschreibungstextbilder img, #beschreibungstextbilder img.logo, #beschreibungstextanimation img
{
	border			: 0;
	float			: right;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 	*/
/* Container fuer die Ueberblendung des SRN-Logos mit dem Virgo-Logo.			*/
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 	*/
#beschreibungstextbilder #logofading
{
	position		: absolute;
	top			: 26px;
	left			: 92px;
	width			: 0px;
	height			: 0px;
	border			: none;
	opacity			: 0;
	overflow		: hidden;
	transition		: all 1s ease-in-out;
}
#beschreibungstextbilder #logofading_image
{
	position		: absolute;
	top			: 0px;
	left			: 0px;
	width			: 52px;
	height			: 48px;
	background-image	: url(/css/img/virgo.gif);
}
#beschreibungstext:hover ~ #beschreibungstextbilder #logofading
{
	visibility		: visible;
	top			: 2px;
	left			: 66px;
 	width			: 52px;
	height			: 48px;
	opacity			: 1;
}
#beschreibungstext:hover ~ #beschreibungstextbilder img.logo_
{
	visibility		: hidden;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 	*/
/* Container fuer die OpenGL-Animation auf der Astronomie-Hauptseite.			*/
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 	*/
#beschreibung_opengl
{
	position		: relative;
	width			: 219px;
	height			: 173px;
	float			: right;
	background-color	: #C0C0C0;
	border			: 1px solid black;
	margin:3px;
}
#beschreibung_opengl img.opengl
{
	position		: absolute;
	width			: 215px;
	height			: 169px;
	top			: 2px;
	left			: 2px;
}