/* ================================================================ This copyright notice must be untouched at all times. The original version of this stylesheet and the associated (x)html is available at http://www.cssplay.co.uk/ Copyright (c) Stu Nicholls. All rights reserved. This stylesheet and the associated (x)html may be modified in any way to fit your requirements. =================================================================== */ /* Veränderungen gegenüber Original*/ /* 510 >>> 690 278 >>> 370 102 >>> 138 69 >>> 92 278 >>> 370 202 >>> 270 136 >>> 180 Ausgangsbild: alt: 102 x 69 neu: 138 x 92 Bild 1 alt: 200 x 134 neu: 300 x 200 Bild 2 alt: 150 x 100 neu: 210 x 140 Bild 3 alt: 126 x 84 neu: 156 x 104 */ /* Bereich des Grundbildes*/ #gridzoom { width: 690px; /*510px; */ height: 370px; /*278px; */ margin: 50px auto; position: relative; } /*#gridzoom b {display:block; width:102px; height:69px; float:left; position:relative; z-index:20;}*/ #gridzoom b {display:block; width:138px; height:92px; float:left; position:relative; z-index:20;} /*#gridzoom b i {display:block; width:102px; height:69px; background:url(trans.gif); cursor:pointer;}*/ #gridzoom b i {display:block; width:138px; height:92px; background:url(trans.gif); cursor:pointer;} #gridzoom b:hover {z-index:100;} /* ??? */ /* #gridzoom b:hover i {position:absolute; left:0; top:0; width:202px; height:136px; left:-51px; top:-34px; z-index:100;} */ #gridzoom b:hover i { position: absolute; left: 0; top: 0; width: 302px; height: 202px; left: -101px; top: -67px; z-index: 100; } /* Bem: Hintergrundfarbe verändert die Grundfarbe der Bilder */ #gridzoom #imageholder { width: 690px; /*510px; */ height: 370px; /*278px; */ position: absolute; left: 0; top: 0; z-index: 10; /*background-color: #0F9;*/ } /* Bereich um ein Einzelbild*/ /* #gridzoom #imageholder span {width:102px; height:69px; float:left; position:relative; }*/ #gridzoom #imageholder span {width:138px; height:92px; float:left; position:relative; } /* Anzeige im Grundbild*/ /* #gridzoom #imageholder span img {margin-left:0; margin-top:0; display:block; width:100px; height:67px; opacity:0.5; filter:alpha(opacity=50); border:1px solid #fff; -moz-transition: 0.7s; -ms-transition: 0.7s; -o-transition: 0.7s; -webkit-transition: 0.7s; transition: 0.7s; } */ #gridzoom #imageholder span img {margin-left:0; margin-top:0; display:block; width:136px; height:90px; opacity:0.5; filter:alpha(opacity=50); border:1px solid #fff; -moz-transition: 0.7s; -ms-transition: 0.7s; -o-transition: 0.7s; -webkit-transition: 0.7s; transition: 0.7s; } /* #gridzoom #imageholder span img {margin-left:0; margin-top:0; display:block; width:166px; height:130px; opacity:0.5; filter:alpha(opacity=50); border:1px solid #fff; -moz-transition: 0.7s; -ms-transition: 0.7s; -o-transition: 0.7s; -webkit-transition: 0.7s; transition: 0.7s; } */ #gridzoom b.p1:hover ~ #imageholder span.m1 {z-index:100;} #gridzoom b.p1:hover ~ #imageholder span.m2, #gridzoom b.p1:hover ~ #imageholder span.m6 {z-index:50;} #gridzoom b.p1:hover ~ #imageholder span.m7 {z-index:25;} /*#gridzoom b.p1:hover ~ #imageholder span.m1 img {width:200px; height:134px; margin-left:-50px; margin-top:-33px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);}*/ #gridzoom b.p1:hover ~ #imageholder span.m1 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p1:hover ~ #imageholder span.m2 img, /* #gridzoom b.p1:hover ~ #imageholder span.m6 img {width:150px; height:100px; margin-left:-25px; margin-top:-16px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);}*/ #gridzoom b.p1:hover ~ #imageholder span.m6 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} /* #gridzoom b.p1:hover ~ #imageholder span.m7 img {width:126px; height:84px; margin-left:-13px; margin-top:-8px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);}*/ #gridzoom b.p1:hover ~ #imageholder span.m7 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p2:hover ~ #imageholder span.m2 {z-index:100;} #gridzoom b.p2:hover ~ #imageholder span.m1, #gridzoom b.p2:hover ~ #imageholder span.m3, #gridzoom b.p2:hover ~ #imageholder span.m7 {z-index:50;} #gridzoom b.p2:hover ~ #imageholder span.m6, #gridzoom b.p2:hover ~ #imageholder span.m8 {z-index:25;} /* in Arbeit */ #gridzoom b.p2:hover ~ #imageholder span.m2 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p2:hover ~ #imageholder span.m1 img, #gridzoom b.p2:hover ~ #imageholder span.m3 img, #gridzoom b.p2:hover ~ #imageholder span.m7 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p2:hover ~ #imageholder span.m6 img, #gridzoom b.p2:hover ~ #imageholder span.m8 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p3:hover ~ #imageholder span.m3 {z-index:100;} #gridzoom b.p3:hover ~ #imageholder span.m2, #gridzoom b.p3:hover ~ #imageholder span.m4, #gridzoom b.p3:hover ~ #imageholder span.m8 {z-index:50;} #gridzoom b.p3:hover ~ #imageholder span.m7, #gridzoom b.p3:hover ~ #imageholder span.m9 {z-index:25;} #gridzoom b.p3:hover ~ #imageholder span.m3 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p3:hover ~ #imageholder span.m2 img, #gridzoom b.p3:hover ~ #imageholder span.m4 img, #gridzoom b.p3:hover ~ #imageholder span.m8 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p3:hover ~ #imageholder span.m7 img, #gridzoom b.p3:hover ~ #imageholder span.m9 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p4:hover ~ #imageholder span.m4 {z-index:100;} #gridzoom b.p4:hover ~ #imageholder span.m3, #gridzoom b.p4:hover ~ #imageholder span.m5, #gridzoom b.p4:hover ~ #imageholder span.m9 {z-index:50;} #gridzoom b.p4:hover ~ #imageholder span.m8, #gridzoom b.p4:hover ~ #imageholder span.m10 {z-index:25;} #gridzoom b.p4:hover ~ #imageholder span.m4 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p4:hover ~ #imageholder span.m3 img, #gridzoom b.p4:hover ~ #imageholder span.m5 img, #gridzoom b.p4:hover ~ #imageholder span.m9 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p4:hover ~ #imageholder span.m8 img, #gridzoom b.p4:hover ~ #imageholder span.m10 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p5:hover ~ #imageholder span.m5 {z-index:100;} #gridzoom b.p5:hover ~ #imageholder span.m4, #gridzoom b.p5:hover ~ #imageholder span.m10 {z-index:50;} #gridzoom b.p5:hover ~ #imageholder span.m9 {z-index:25;} #gridzoom b.p5:hover ~ #imageholder span.m5 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p5:hover ~ #imageholder span.m4 img, #gridzoom b.p5:hover ~ #imageholder span.m10 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p5:hover ~ #imageholder span.m9 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p6:hover ~ #imageholder span.m6 {z-index:100;} #gridzoom b.p6:hover ~ #imageholder span.m1, #gridzoom b.p6:hover ~ #imageholder span.m7, #gridzoom b.p6:hover ~ #imageholder span.m11 {z-index:50;} #gridzoom b.p6:hover ~ #imageholder span.m2, #gridzoom b.p6:hover ~ #imageholder span.m12 {z-index:25;} #gridzoom b.p6:hover ~ #imageholder span.m6 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p6:hover ~ #imageholder span.m1 img, #gridzoom b.p6:hover ~ #imageholder span.m7 img, #gridzoom b.p6:hover ~ #imageholder span.m11 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p6:hover ~ #imageholder span.m2 img, #gridzoom b.p6:hover ~ #imageholder span.m12 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p7:hover ~ #imageholder span.m7 {z-index:100;} #gridzoom b.p7:hover ~ #imageholder span.m2, #gridzoom b.p7:hover ~ #imageholder span.m6, #gridzoom b.p7:hover ~ #imageholder span.m8, #gridzoom b.p7:hover ~ #imageholder span.m12 {z-index:50;} #gridzoom b.p7:hover ~ #imageholder span.m1, #gridzoom b.p7:hover ~ #imageholder span.m3, #gridzoom b.p7:hover ~ #imageholder span.m11, #gridzoom b.p7:hover ~ #imageholder span.m13 {z-index:25;} #gridzoom b.p7:hover ~ #imageholder span.m7 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p7:hover ~ #imageholder span.m2 img, #gridzoom b.p7:hover ~ #imageholder span.m6 img, #gridzoom b.p7:hover ~ #imageholder span.m8 img, #gridzoom b.p7:hover ~ #imageholder span.m12 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p7:hover ~ #imageholder span.m1 img, #gridzoom b.p7:hover ~ #imageholder span.m3 img, #gridzoom b.p7:hover ~ #imageholder span.m11 img, #gridzoom b.p7:hover ~ #imageholder span.m13 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p8:hover ~ #imageholder span.m8 {z-index:100;} #gridzoom b.p8:hover ~ #imageholder span.m3, #gridzoom b.p8:hover ~ #imageholder span.m7, #gridzoom b.p8:hover ~ #imageholder span.m9, #gridzoom b.p8:hover ~ #imageholder span.m13 {z-index:50;} #gridzoom b.p8:hover ~ #imageholder span.m2, #gridzoom b.p8:hover ~ #imageholder span.m4, #gridzoom b.p8:hover ~ #imageholder span.m12, #gridzoom b.p8:hover ~ #imageholder span.m14 {z-index:25;} #gridzoom b.p8:hover ~ #imageholder span.m8 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p8:hover ~ #imageholder span.m3 img, #gridzoom b.p8:hover ~ #imageholder span.m7 img, #gridzoom b.p8:hover ~ #imageholder span.m9 img, #gridzoom b.p8:hover ~ #imageholder span.m13 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p8:hover ~ #imageholder span.m2 img, #gridzoom b.p8:hover ~ #imageholder span.m4 img, #gridzoom b.p8:hover ~ #imageholder span.m12 img, #gridzoom b.p8:hover ~ #imageholder span.m14 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p9:hover ~ #imageholder span.m9 {z-index:100;} #gridzoom b.p9:hover ~ #imageholder span.m4, #gridzoom b.p9:hover ~ #imageholder span.m8, #gridzoom b.p9:hover ~ #imageholder span.m10, #gridzoom b.p9:hover ~ #imageholder span.m14 {z-index:50;} #gridzoom b.p9:hover ~ #imageholder span.m3, #gridzoom b.p9:hover ~ #imageholder span.m5, #gridzoom b.p9:hover ~ #imageholder span.m13, #gridzoom b.p9:hover ~ #imageholder span.m15 {z-index:25;} #gridzoom b.p9:hover ~ #imageholder span.m9 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p9:hover ~ #imageholder span.m4 img, #gridzoom b.p9:hover ~ #imageholder span.m8 img, #gridzoom b.p9:hover ~ #imageholder span.m10 img, #gridzoom b.p9:hover ~ #imageholder span.m14 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p9:hover ~ #imageholder span.m3 img, #gridzoom b.p9:hover ~ #imageholder span.m5 img, #gridzoom b.p9:hover ~ #imageholder span.m13 img, #gridzoom b.p9:hover ~ #imageholder span.m15 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p10:hover ~ #imageholder span.m10 {z-index:100;} #gridzoom b.p10:hover ~ #imageholder span.m5, #gridzoom b.p10:hover ~ #imageholder span.m9, #gridzoom b.p10:hover ~ #imageholder span.m15 {z-index:50;} #gridzoom b.p10:hover ~ #imageholder span.m4, #gridzoom b.p10:hover ~ #imageholder span.m14 {z-index:25;} #gridzoom b.p10:hover ~ #imageholder span.m10 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p10:hover ~ #imageholder span.m5 img, #gridzoom b.p10:hover ~ #imageholder span.m9 img, #gridzoom b.p10:hover ~ #imageholder span.m15 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p10:hover ~ #imageholder span.m4 img, #gridzoom b.p10:hover ~ #imageholder span.m14 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p11:hover ~ #imageholder span.m11 {z-index:100;} #gridzoom b.p11:hover ~ #imageholder span.m6, #gridzoom b.p11:hover ~ #imageholder span.m12, #gridzoom b.p11:hover ~ #imageholder span.m16 {z-index:50;} #gridzoom b.p11:hover ~ #imageholder span.m7, #gridzoom b.p11:hover ~ #imageholder span.m17 {z-index:25;} #gridzoom b.p11:hover ~ #imageholder span.m11 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p11:hover ~ #imageholder span.m6 img, #gridzoom b.p11:hover ~ #imageholder span.m12 img, #gridzoom b.p11:hover ~ #imageholder span.m16 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p11:hover ~ #imageholder span.m7 img, #gridzoom b.p11:hover ~ #imageholder span.m17 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p12:hover ~ #imageholder span.m12 {z-index:100;} #gridzoom b.p12:hover ~ #imageholder span.m7, #gridzoom b.p12:hover ~ #imageholder span.m11, #gridzoom b.p12:hover ~ #imageholder span.m13, #gridzoom b.p12:hover ~ #imageholder span.m17 {z-index:50;} #gridzoom b.p12:hover ~ #imageholder span.m6, #gridzoom b.p12:hover ~ #imageholder span.m8, #gridzoom b.p12:hover ~ #imageholder span.m6, #gridzoom b.p12:hover ~ #imageholder span.m18 {z-index:25;} #gridzoom b.p12:hover ~ #imageholder span.m12 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p12:hover ~ #imageholder span.m7 img, #gridzoom b.p12:hover ~ #imageholder span.m11 img, #gridzoom b.p12:hover ~ #imageholder span.m13 img, #gridzoom b.p12:hover ~ #imageholder span.m17 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p12:hover ~ #imageholder span.m6 img, #gridzoom b.p12:hover ~ #imageholder span.m8 img, #gridzoom b.p12:hover ~ #imageholder span.m16 img, #gridzoom b.p12:hover ~ #imageholder span.m18 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p13:hover ~ #imageholder span.m13 {z-index:100;} #gridzoom b.p13:hover ~ #imageholder span.m8, #gridzoom b.p13:hover ~ #imageholder span.m12, #gridzoom b.p13:hover ~ #imageholder span.m14, #gridzoom b.p13:hover ~ #imageholder span.m18 {z-index:50;} #gridzoom b.p13:hover ~ #imageholder span.m7, #gridzoom b.p13:hover ~ #imageholder span.m9, #gridzoom b.p13:hover ~ #imageholder span.m17, #gridzoom b.p13:hover ~ #imageholder span.m19 {z-index:25;} #gridzoom b.p13:hover ~ #imageholder span.m13 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p13:hover ~ #imageholder span.m8 img, #gridzoom b.p13:hover ~ #imageholder span.m12 img, #gridzoom b.p13:hover ~ #imageholder span.m14 img, #gridzoom b.p13:hover ~ #imageholder span.m18 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p13:hover ~ #imageholder span.m7 img, #gridzoom b.p13:hover ~ #imageholder span.m9 img, #gridzoom b.p13:hover ~ #imageholder span.m17 img, #gridzoom b.p13:hover ~ #imageholder span.m19 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p14:hover ~ #imageholder span.m14 {z-index:100;} #gridzoom b.p14:hover ~ #imageholder span.m9, #gridzoom b.p14:hover ~ #imageholder span.m13, #gridzoom b.p14:hover ~ #imageholder span.m15, #gridzoom b.p14:hover ~ #imageholder span.m19 {z-index:50;} #gridzoom b.p14:hover ~ #imageholder span.m8, #gridzoom b.p14:hover ~ #imageholder span.m10, #gridzoom b.p14:hover ~ #imageholder span.m18, #gridzoom b.p14:hover ~ #imageholder span.m20 {z-index:25;} #gridzoom b.p14:hover ~ #imageholder span.m14 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p14:hover ~ #imageholder span.m9 img, #gridzoom b.p14:hover ~ #imageholder span.m13 img, #gridzoom b.p14:hover ~ #imageholder span.m15 img, #gridzoom b.p14:hover ~ #imageholder span.m19 img {width:210px; height:140px; margin-left:-55px; margin-top:-36px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p14:hover ~ #imageholder span.m8 img, #gridzoom b.p14:hover ~ #imageholder span.m10 img, #gridzoom b.p14:hover ~ #imageholder span.m18 img, #gridzoom b.p14:hover ~ #imageholder span.m20 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p15:hover ~ #imageholder span.m15 {z-index:100;} #gridzoom b.p15:hover ~ #imageholder span.m10, #gridzoom b.p15:hover ~ #imageholder span.m14, #gridzoom b.p15:hover ~ #imageholder span.m20 {z-index:50;} #gridzoom b.p15:hover ~ #imageholder span.m9, #gridzoom b.p15:hover ~ #imageholder span.m19 {z-index:25;} #gridzoom b.p15:hover ~ #imageholder span.m15 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p15:hover ~ #imageholder span.m10 img, #gridzoom b.p15:hover ~ #imageholder span.m14 img, #gridzoom b.p15:hover ~ #imageholder span.m20 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p15:hover ~ #imageholder span.m9 img, #gridzoom b.p15:hover ~ #imageholder span.m19 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p16:hover ~ #imageholder span.m16 {z-index:100;} #gridzoom b.p16:hover ~ #imageholder span.m11, #gridzoom b.p16:hover ~ #imageholder span.m17 {z-index:50;} #gridzoom b.p16:hover ~ #imageholder span.m12 {z-index:25;} #gridzoom b.p16:hover ~ #imageholder span.m16 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p16:hover ~ #imageholder span.m11 img, #gridzoom b.p16:hover ~ #imageholder span.m17 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p16:hover ~ #imageholder span.m12 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p17:hover ~ #imageholder span.m17 {z-index:100;} #gridzoom b.p17:hover ~ #imageholder span.m12, #gridzoom b.p17:hover ~ #imageholder span.m16, #gridzoom b.p17:hover ~ #imageholder span.m18 {z-index:50;} #gridzoom b.p17:hover ~ #imageholder span.m11, #gridzoom b.p17:hover ~ #imageholder span.m13 {z-index:25;} #gridzoom b.p17:hover ~ #imageholder span.m17 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p17:hover ~ #imageholder span.m12 img, #gridzoom b.p17:hover ~ #imageholder span.m16 img, #gridzoom b.p17:hover ~ #imageholder span.m18 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p17:hover ~ #imageholder span.m11 img, #gridzoom b.p17:hover ~ #imageholder span.m13 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p18:hover ~ #imageholder span.m18 {z-index:100;} #gridzoom b.p18:hover ~ #imageholder span.m13, #gridzoom b.p18:hover ~ #imageholder span.m17, #gridzoom b.p18:hover ~ #imageholder span.m19 {z-index:50;} #gridzoom b.p18:hover ~ #imageholder span.m12, #gridzoom b.p18:hover ~ #imageholder span.m14 {z-index:25;} #gridzoom b.p18:hover ~ #imageholder span.m18 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p18:hover ~ #imageholder span.m13 img, #gridzoom b.p18:hover ~ #imageholder span.m17 img, #gridzoom b.p18:hover ~ #imageholder span.m19 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p18:hover ~ #imageholder span.m12 img, #gridzoom b.p18:hover ~ #imageholder span.m14 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p19:hover ~ #imageholder span.m19 {z-index:100;} #gridzoom b.p19:hover ~ #imageholder span.m14, #gridzoom b.p19:hover ~ #imageholder span.m18, #gridzoom b.p19:hover ~ #imageholder span.m20 {z-index:50;} #gridzoom b.p19:hover ~ #imageholder span.m13, #gridzoom b.p19:hover ~ #imageholder span.m15 {z-index:25;} #gridzoom b.p19:hover ~ #imageholder span.m19 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p19:hover ~ #imageholder span.m14 img, #gridzoom b.p19:hover ~ #imageholder span.m18 img, #gridzoom b.p19:hover ~ #imageholder span.m20 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p19:hover ~ #imageholder span.m13 img, #gridzoom b.p19:hover ~ #imageholder span.m15 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);} #gridzoom b.p20:hover ~ #imageholder span.m20 {z-index:100;} #gridzoom b.p20:hover ~ #imageholder span.m15, #gridzoom b.p20:hover ~ #imageholder span.m19 {z-index:50;} #gridzoom b.p20:hover ~ #imageholder span.m14 {z-index:25;} #gridzoom b.p20:hover ~ #imageholder span.m20 img {width:300px; height:200px; margin-left:-81px; margin-top:-54px; opacity:1; filter:alpha(opacity=100); box-shadow:0px 0px 10px rgba(0,0,0,0.8);} #gridzoom b.p20:hover ~ #imageholder span.m15 img, #gridzoom b.p20:hover ~ #imageholder span.m19 img {width:210px; height:140px; margin-left:-37px; margin-top:-25px; opacity:0.8; filter:alpha(opacity=80); box-shadow:0px 0px 5px rgba(0,0,0,0.6);} #gridzoom b.p20:hover ~ #imageholder span.m14 img {width:156px; height:104px; margin-left:-10px; margin-top:-6px; opacity:0.8; filter:alpha(opacity=70); box-shadow:0px 0px 3px rgba(0,0,0,0.4);}