/* CSS Document */

/* Definition einer zentrierten Box */

/* Zuerst wird html und body auf 100% Höhe gesetzt 
und eventuell vorhandene störende Abstände eliminiert. */
html, body{
  height:100%;
  margin:0;
  padding:0;
  background-color: #FFFFFF;
  font-size:12px;
}

/* Weil folgende Eigenschaften für beide Elemente identisch sind, 
werden diese gleich gemeinsam definiert. */ 
#spacer, #center{
  position:absolute;
  margin:0;
  padding:0;
  

}

#spacer{
  					/* sorgt dafür, dass wenn nötig Scrolleisten erscheinen */
  width:100%;       /* ganauso breit, wie der Anzeigebereich */
  height:100%;      /* ganauso hoch, wie der Anzeigebereich */

  					 /* jetzt werden die notwendigen oder gewünschten Mindestmaße definiert. */
  min-width:871px;   /* Breite von #center (+ ein paar Pixel Rand) */ 
  min-height:650px;  /* Höhe von #center (+ ein paar Pixel Rand) */
}

* html #IEspacer {
  						/* sorgt dafür, dass es im IE auch bei deaktiviertem Javascript funktioniert */ 
  width:871px;          /* Breite von #center (+ ein paar Pixel Rand) */ 
  height:650px;         /* Höhe von #center (+ ein paar Pixel Rand) */
}

#center {					/* ist das Element, welches zentriert werden soll */
  background:  url(../pics/background1.jpg) no-repeat center top;
  padding:0;        		/* es sind auch andere Angaben möglich, die dann 
  							allerdings bei der Breite und Höhe mit berücksichtigt werden müssen. */ 
  /*border:1px solid #000000;*/  /* für die Zentrierung selbst nicht nötig */ 

  							/* Angaben zu Breite und Höhe, diese können auch in em angegeben werden. */
  width:871px;      		/* Breite insgesamt 722px (720px + 2 x 1px Border) */
  min-height:650px; 		/* Mindesthöhe insgesamt 512px (510px + 2 x 1px Border),
 						 	bei genau dieser Höhe funktioniert die vertikale Zentrierung */
  
  							/* jetzt wird die linke obere Ecke vertikal und horizontal zentriert */
  position:absolute;
  top:50%;                  
  left:50%;
  
  							/* durch negative margins wird es jetzt um die Hälfte von Höhe und 
  								Breite nach oben und links verschoben */
  margin:-325px 0 0 -435px; /* jeweils die Hälfte der Gesamthöhe und -breite */
}

							/* min-height für den IE */
* html #center {
  height:650px;             /* das selbe Maß wie oben bei min-height */
}