.image-container { /* main container. incl all elements */
 padding:0;
 width:250px;
 height:250px;
 float:left;
 margin:0 0 10px 0;
 position:relative;
 border:0px solid #191b1f;

 padding:10px;
}
 
#first-image { /* first image - always in bg */
 position:absolute;
 top:100px;
 left:100px;
 height:100px;
 width:100px;
 background:url(../logos/tropfen.jpg) 0 0 no-repeat;
}
 
.image-container a img { /* thumbs 1-4 */ 
 width:100px;
 height:100px;
 padding:0 10px 0 0; 
 margin:200px 0 0 0;
 border:0;
 float:left;
}
 
.image-container a img.last { /* thumb 5. I don't use last-child to support ie-users. */
 width:100px;
 height:100px;
 padding:0; /* no right padding for the last thumb */
 margin:200px 0 0 0;
 float:left;
}
 
.image-container a span { /* hide spans */
 display: none;
}
 
.image-container a:hover span { /* display span if hovered */
 display: block;
 position: absolute;
 width: 100px;
 height:100px;
 padding:0;
 margin:0;
 top:10px;
 left:10px;
}
 
/* large images */
a#image1:hover span {background:url(../logos/tropfen.jpg);}
a#image2:hover span {background:url(../logos/tropfen.jpg);}