/* css Vereinbarungen "Nostalgie" * /


/* Grundformatierung */
body {
 font-family:                "Comic Sans MS", "Book Antiqua", Arial, Helvetica, sans-serif;
 font-size:                  14px;
 text-align:                 center;
 background-color:           rgb(250, 238, 140);      /* gelblich */
 background-image:           url(../logo_bild/grundbild_2.jpg);
}


/* Kopfleiste */
header {
 background-color:           rgb(208, 238, 106);      /* grünlich */
 margin-top:		     5px;
 margin-right:		     5px;
 margin-bottom:		     0px;	
 margin-left : 		     5px;
 width:			     100%;
}


/* Tabellen Container */
#tabellen_container {
 display:                    table;
 border-spacing:             5px;
}


/* Tabellen Zeilen */
#tabellen_zeile {
 display:                    table-row;
}


/* Spalte in der die Links sitzen */
#navi_spalte {
 display:                    table-cell;
 background-color:           rgb(208, 238, 106);      /* grünlich */
 width:                      180px;
 margin: 			     0px 10px 10px 580px;
 padding:                    15px;
 vertical-align:             top;
}


/* Navigation Normal*/
.navig {
 font-size:                  140%; 
 text-align:                 left;
 display:                    block; 
 font-weight:                bold;
 width:                      180px;				
 background-color:           #F0F0F0;                 /* helles grau */
 margin-right:               15px;                    /* Rechter Rand: schafft Abstand zum Inhalt */
 margin-left:                15px;                    /* Linker Rand: schafft Abstand zum Inhalt */
}


/* Navigation Nostalgie*/
.navignost {
 font-family:                "Script MT Bold","Comic Sans MS", "Book Antiqua", Arial, Helvetica, sans-serif;
 font-size:                  180%; 
 text-align:                 left;
 display:                    block; 
 font-weight:                bold;
 width:                      102px;				
 background-color:           rgb(255,211,155);        /* bräunlich */
 margin-right:               15px;                    /* Rechter Rand: schafft Abstand zum Inhalt */
 margin-left:                15px;                    /* Linker Rand: schafft Abstand zum Inhalt */
}


/* h1-Schrift */
.h1 {
 color:                      rgb(139,69,19);          /* bräunlich */
 font-size:                  190%;
 font-weight:                bold;
}


/* h2-Schrift */
.h2 {
 line-height:                1.5em;
 color:                      rgb(139,69,19);          /* bräunlich */
 font-size:                  140%;
}


#collage-container{
  width:1200px;
  height:1000px;
  margin: 5px auto;
  xxxborder: 2px solid #777;
  position:relative;
}


#collage-container_nost_3{
  width:1100px;
  height:900px;
  margin: 5px auto;
  position:absolute;
  top: 600px;
  left:50px;
}




#collage_eins{
 width:360px;
 height:230px;
 padding:10px;
 position:absolute;
 z-index:1;
 top:20px;
 left:8px;
 margin:40px;
 transform:rotate(-3deg);
 -o-transform:rotate(-3deg);
 -moz-transform:rotate(-3deg);
 -webkit-transform:rotate(-3deg);
}  


#collage_zwei{
 width:360px;
 height:230px;
 padding:10px;
 position:absolute;
 z-index:3;
 top:25px;
 left:630px;
 margin:40px;
 transform:rotate(1deg);
 -o-transform:rotate(1deg);
 -moz-transform:rotate(1deg);
 -webkit-transform:rotate(1deg);
}  


#collage_drei{
 width:220px;
 height:340px;
 padding:10px;
 position:absolute;
 z-index:7;
 top:20px;
 left:380px;
 margin:40px;
 transform:rotate(0deg);
 -o-transform:rotate(0deg);
 -moz-transform:rotate(0deg);
 -webkit-transform:rotate(0deg);
}  


#collage_vier{
 width:420px;
 height:440px;
 padding:10px;
 position:absolute;
 z-index:4;
 top:295px;
 left:980px;
 margin:40px;
 transform:rotate(0deg);
 -o-transform:rotate(0deg);
 -moz-transform:rotate(0deg);
 -webkit-transform:rotate(0deg);
}  


#collage_fuenf{
 width:220px;
 height:350px;
 padding:10px;
 position:absolute;
 z-index:6;
 top:310px;
 left:1270px;
 margin:40px;
 transform:rotate(3deg);
 -o-transform:rotate(3deg);
 -moz-transform:rotate(3deg);
 -webkit-transform:rotate(3deg);
}  


#collage_sechs{
 width:280px;
 height:350px;
 padding:10px;
 position:absolute;
 z-index:3;
 top:580px;
 left:700px;
 margin:40px;
 transform:rotate(-8deg);
 -o-transform:rotate(-8deg);
 -moz-transform:rotate(-8deg);
 -webkit-transform:rotate(-8deg);
}  

#collage_sieben{
 width:220px;
 height:320px;
 padding:10px;
 position:absolute;
 z-index:5;
 top:280px;
 left:65px;
 margin:40px;
 transform:rotate(0deg);
 -o-transform:rotate(0deg);
 -moz-transform:rotate(0deg);
 -webkit-transform:rotate(0deg);
}  


#collage_acht{
 width:350px;
 height:240px;
 padding:10px;
 position:absolute;
 z-index:5;
 top:25px;
 left:1080px;
 margin:40px;
 transform:rotate(0deg);
 -o-transform:rotate(0deg);
 -moz-transform:rotate(0deg);
 -webkit-transform:rotate(0deg);
} 

 
#collage_neun{
 width:360px;
 height:240px;
 padding:10px;
 position:absolute;
 z-index:5;
 top:295px;
 left:695px;
 margin:40px;
 transform:rotate(-2deg);
 -o-transform:rotate(-2deg);
 -moz-transform:rotate(-2deg);
 -webkit-transform:rotate(-2deg);
}  


#collage_zehn{
 width:255px;
 height:330px;
 padding:10px;
 position:absolute;
 z-index:5;
 top:605px;
 left:30px;
 margin:40px;
 transform:rotate(-1deg);
 -o-transform:rotate(1deg);
 -moz-transform:rotate(1deg);
 -webkit-transform:rotate(1deg);
} 

 
#collage_elf{
 width:350px;
 height:240px;
 padding:10px;
 position:absolute;
 z-index:5;
 top:710px;
 left:1080px;
 margin:40px;
 transform:rotate(-7deg);
 -o-transform:rotate(-7deg);
 -moz-transform:rotate(-7deg);
 -webkit-transform:rotate(-7deg);
}  


#collage_zwoelf{
 width:350px;
 height:240px;
 padding:10px;
 position:absolute;
 z-index:5;
 top:680px;
 left:310px;
 margin:40px;
 transform:rotate(0deg);
 -o-transform:rotate(0deg);
 -moz-transform:rotate(0deg);
 -webkit-transform:rotate(0deg);
}  
 

#collage_dreizehn{
 width:270px;
 height:330px;
 padding:10px;
 position:absolute;
 z-index:7;
 top:310px;
 left:330px;
 margin:40px;
 transform:rotate(9deg);
 -o-transform:rotate(9deg);
 -moz-transform:rotate(9deg);
 -webkit-transform:rotate(9deg);
}  
 

#collage_vierzehn{
 width:250px;
 height:390px;
 padding:10px;
 position:absolute;
 z-index:5;
 top:940px;
 left:250px;
 margin:40px;
 transform:rotate(-20deg);
 -o-transform:rotate(-20deg);
 -moz-transform:rotate(-20deg);
 -webkit-transform:rotate(-20deg);
}  
 
 


#collage_eins.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_eins.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_zwei.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_zwei.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_drei.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_drei.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_vier.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_vier.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_fuenf.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_fuenf.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_sechs.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_sechs.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_sieben.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_sieben.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_acht.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_acht.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_neun.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_neun.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_zehn.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_zehn.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_elf.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_elf.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_zwoelf.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_zwoelf.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}


#collage_dreizehn.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
#collage_dreizehn.zoom:hover {
 z-index:9;
 cursor: zoom-in; 
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(2.0, 2.0);
 -moz-transform: scale(2.0, 2.0);
 -webkit-transform: scale(2.0, 2.0);
 -o-transform: scale(2.0, 2.0);
 -ms-transform: scale(2.0, 2.0);
}