/* CSS-Datei für 
 * Galerie-Funktionsmodell 4
 * Einblenden gestapelter Präsentationsseiten
 * per Hover-Effekt
 *
 * @author Matthias Baran
 * @link http://matthiasbaran.de/
 * @copyright Copyright 2010, Matthias Baran
 * @license CC-BY-SA 3.0
 * @lastmodified 2010-10-15
 * */

* {
  margin:                 0px;
  padding:                0px;
  vertical-align:         top;
  border-width:           0px;
}

html {
}

body {
  margin:                 0px;
  padding:                0px;
  font:                   12px Helvetica, Geneva, sans-serif;
  letter-spacing:         0.14em;
  word-spacing:           0.10em;
  line-height:            3ex;
  background:             #ffffff url(../images/hintergrund_global.gif) top left repeat-x;
}

h1 {
  padding:                5px 2px 10px 2px;
}

h2 {
  padding:                2px 2px 4px 2px;
  border-bottom:             1px solid #777767;
}

p {
  padding:                5px;
}

/* Text-Formatierungen */
.titelschrift {
  font-style:             bold;
  font-size:              100px;
}

/* Inhalts-Container*/
#alles {
  margin:                 0px;
  padding:                0px;
  width:                  2000px;
}

.kontext {
  margin:                 0px;
  padding:                0px;
}
#kontext_stabwerk {
  position:               relative;
  margin-left:            70px;
}

#kontext_signets {
  position:               relative;
  margin-left:            1000px;
}

div.seite {
  position:               absolute;
  width:                  92px;
  height:                 95px;
  background:             #ffffff url(../images/hintergrund_global.gif) top left repeat-x;
  border-left:            1px solid #444434;
  overflow:               hidden;
}

div.seite:hover {
  position:               absolute;
  width:                  800px;
  min-height:             700px;
  margin:                 0px;
  overflow:               visible;
  z-index:                2;
}

div.seiteninhalt {
}

div.seiteninhalt img {
  width:                  500px;
}

div.seiteninhalt * {
  border-style:           none;
}

/* Visitenkarte */
div.visitenkarte {
  position:               absolute;
  width:                  800px;
  min-height:             500px;
  margin:                 0px;
  z-index:                1;
}

p.visitenkartentext {
  font-size:              90%;
  line-height:            180%;
  color:                  #111101;
  border-left:            1px solid #444434;
  margin:                 220px 0px 0px 50px;
  padding:                30px 0px 10px 20px;
  float:                  left;
}

/* Seite01 */
div.seite01 {
  margin:                 10px 0px 0px 30px;
  z-index:                3;
}

/* Seite02 */
div.seite02 {
  margin:                 10px 0px 0px 150px;
  z-index:                4;
}

/* Seite03 */
div.seite03 {
  margin:                 10px 0px 0px 270px;
  z-index:                5;
}

/* Seite04 */
div.seite04 {
  margin:                 10px 0px 0px 390px;
  z-index:                6;
}

/* Seite05 */
div.seite05 {
  margin:                 10px 0px 0px 510px;
  z-index:                7;
}

/* Seite06 */
div.seite06 {
  margin:                 10px 0px 0px 630px;
  z-index:                8;
}

/* Stabwerk */
div.seite:hover div.seiteninhalt#stabwerk01, div.seite:hover div.seiteninhalt#stabwerk02, div.seite:hover div.seiteninhalt#stabwerk03, div.seite:hover div.seiteninhalt#stabwerk04, div.seite:hover div.seiteninhalt#stabwerk05, div.seite:hover div.seiteninhalt#stabwerk06  {
  position:               absolute;
  margin-left:            150px;
  margin-top:             150px;
}

div.seiteninhalt#stabwerk01 {
  position:               absolute;
  margin-left:            -293px;
  margin-top:             -125px;
}

div.seiteninhalt#stabwerk02 {
  position:               absolute;
  margin-left:            -293px;
  margin-top:             -125px;
}

div.seiteninhalt#stabwerk03 {
  position:               absolute;
  margin-left:            -293px;
  margin-top:             -125px;
}

div.seiteninhalt#stabwerk04 {
  position:               absolute;
  margin-left:            -293px;
  margin-top:             -125px;
}

div.seiteninhalt#stabwerk05 {
  position:               absolute;
  margin-left:            -293px;
  margin-top:             -125px;
}

div.seiteninhalt#stabwerk06 {
  position:               absolute;
  margin-left:            -293px;
  margin-top:             -125px;
}


/* Signets */
div.seite:hover div.seiteninhalt#barman {
  position:               absolute;
  margin-left:            150px;
  margin-top:             250px;
}

div.seiteninhalt#barman {
  position:               absolute;
  margin-left:            -250px;
  margin-top:             -40px;
}

div.seite:hover div.seiteninhalt#singekreis {
  position:               absolute;
  margin-left:            150px;
  margin-top:             250px;
}

div.seiteninhalt#singekreis {
  position:               absolute;
  margin-left:            -250px;
  margin-top:             0px;
}

div.seite:hover div.seiteninhalt#kunstmesse {
  position:               absolute;
  margin-left:            150px;
  margin-top:             130px;
}

div.seiteninhalt#kunstmesse {
  position:               absolute;
  margin-left:            -250px;
  margin-top:             -50px;
}

div.seite:hover div.seiteninhalt#innovationszentrum {
  position:               absolute;
  margin-left:            150px;
  margin-top:             130px;
}

div.seiteninhalt#innovationszentrum img {
  width:                  600px;
}

div.seiteninhalt#innovationszentrum {
  position:               absolute;
  margin-left:            -50px;
  margin-top:             -50px;
}

div.seiteninhalt#faivre {
  position:               absolute;
  margin-left:            -50px;
  margin-top:             -50px;
}

div.seiteninhalt#faivre img {
  width:                  200px;
}

div.seite:hover div.seiteninhalt#faivre {
  position:               absolute;
  margin-left:            290px;
  margin-top:             190px;
}

div.seite:hover div.seiteninhalt#djhirsch {
  position:               absolute;
  margin-left:            190px;
  margin-top:             180px;
}

div.seiteninhalt#djhirsch img {
  width:                  400px;
}

div.seiteninhalt#djhirsch {
  position:               absolute;
  margin-left:            -115px;
  margin-top:             -3px;
}

/* Bilder */