/* --          BOX CSS          -- */

.balloon {
font-family: verdana, sans-serif; 
width:685px;		/* Grösse für das DIV festlegen! */
height:200px;		/* Grösse für das DIV festlegen! */
margin:0px 0px 0px 0px;	/* Abstände für das DIV festlegen! (oben-unten : links-rechts) */
}

.balloon ul {
padding:0; 			/* Entfernen der Abstände des UL */
margin:0; 			/* Entfernen der Abstände des UL */
border:0;			/* Entfernen der Ränder des UL */
list-style-type: none;	/* Entfernen der Listenpunkte des UL */
}

.balloon ul li {
float:left;			/* Element wird in ein Block-Element gewandelt und links von den Elementen plaziert, die es umfließen. */
margin:12px;			/* Abstans vom Rand des DIVs */
width:200px;		/* Grösse des "Vorschaubildes" */
height:191px;		/* Grösse des "Vorschaubildes" */
/* border:1px solid #cccccc;	/* Rand um das "Vorschaubild" */
}

.reftitel {
font-family:tahoma;
font-size:12px;
font-weight:bold;
color:#ac2c2d;
line-height:18px;
}

.balloon ul li a, .balloon ul li a:visited {
display:block;
text-decoration:none; 		/* Keine Merkmale für die Liste */
width:200px; 				/* Grösse für die "Verlinkte Fläche" */
height:150px; 				/* Grösse für die "Verlinkte Fläche" */
color:#000; 
background:#fff;			/* Farbe für hintergrund des Links... damit man die "Verlinkte Fläche sieht!" */
}
.balloon ul li a img, .balloon ul li a:visited img {
border:0;					/* Rand um das Bild entfernen */
}


.balloon ul li dl {
visibility:hidden;			/* Verstecken der "Infotext Box" */
display:none;
position:absolute;			/* Positionieren der "Infotext Box" */
}


.table {
margin:-2px;
border:0;
padding:0;
border-collapse:collapse;
font-size:12px;
}

.balloon dl {
width:200px;			/* Weiter der "Infotext Box" */
height:auto;
padding:0;		/* Padding für das bottom Bild*/
/*	background:transparent url(../images/referenzen/box/bottom1.gif) no-repeat bottom left;	/* Hintergrundbild unten */
}

/* -- Titel der Infobox -- */
.balloon dt {
margin:0;				/* Abstände um den Titel der Infobox entfernen */
padding:0;			/* Padding um dem Titel der Infobox */
background:transparent;	/* Hintergrundbild oben */
}
/* -- Infobox -- */
.balloon dd {
margin:0;		
padding:0px 0px 20px 0px;		/* Padding des Infotextes - oben/unten - links*/
color:#000;				/* Schriftfarbe des Infotextes */
font-size:12px;;		/* Schriftgröse des Infotextes */
border:1px solid #cccccc;	/* Rand um die Infobox */
border-width:0 1px 1px 1px;		/* Entfernen des oberen und untern Randes der Infobox */
background:#fff url(referenzen_FILES/info.gif) no-repeat bottom right;	/* Hintergrundbild der Infobox */
text-decoration:none;
}
/* -- Text der Infobox -- */
.balloon dd p {
padding:5px 15px 0px 15px;			/* Abstand des Textes */
margin:0px;		/* Margin um den Text - oben & unten*/
line-height:17px;	/* Zeilenhöhe im Text */
}

/* Andere Hintergünde pro Bild...
.balloon dl#web2 {background:transparent url(../images/referenzen/box/bottom2.gif) no-repeat bottom left; height:auto;}
.balloon dl#web3 {background:transparent url(../images/referenzen/box/bottom3.gif) no-repeat bottom left; height:auto;}
.balloon dl#web4 {background:transparent url(../images/referenzen/box/bottom4.gif) no-repeat bottom left; height:auto;}
.balloon dl#web5 {background:transparent url(../images/referenzen/box/bottom5.gif) no-repeat bottom left; height:auto;}
.balloon dl#web6 {background:transparent url(../images/referenzen/box/bottom6.gif) no-repeat bottom left; height:auto;}
.balloon dl#web2 dt {background:transparent url(../images/referenzen/box/top2.gif) no-repeat top left;}
.balloon dl#web3 dt {background:transparent url(../images/referenzen/box/top3.gif) no-repeat top left;}
.balloon dl#web4 dt {background:transparent url(../images/referenzen/box/top4.gif) no-repeat top left;}
.balloon dl#web5 dt {background:transparent url(../images/referenzen/box/top5.gif) no-repeat top left;}

.balloon dl#web6 dt {background:transparent url(../images/referenzen/box/top6.gif) no-repeat top left;}
*/

/* specific to non IE browsers and IE7 first with IE5.5 and IE6 second */

.balloon ul li:hover,
.balloon ul li a:hover {
color:#000; 
position:relative;
cursor: pointer;
cursor:hand;
text-decoration:none;
}

.balloon ul li:hover dl,
.balloon ul li a:hover dl {
visibility:visible;
display:block;
color:#000;
top:-75px;
left:120px;
cursor:default;
}

.balloon ul li:hover dl em,
.balloon ul li a:hover dl em {
display:block;
position:absolute;
left:-35px;
top:100px;
width:36px; 
height:36px;
background:transparent url(referenzen_FILES/pointer.gif);
}

.balloon ul li:hover dl a,
.balloon ul li a:hover dl a {
height:0.8em;
color:#606;
background:transparent;
text-decoration:underline;
display:inline;
}

.balloon ul li:hover dl a:hover,
.balloon ul li a:hover dl a:hover {
text-decoration:none;
background:transparent;
}