<style>
.slides-css3 {
position:relative;  
width:520px;  
height:460px;  
margin:0 auto;
}
.slides-css3 b {position:fixed; display:none;}
.slides-css3 a {
display:block;  
outline:0;  
position: absolute;  
left:20px;  
bottom:20px;  
width: 480px;  
height: 280px;  
background:transparent;  
z-index:25;
-moz-transition:1s;
-ms-transition: 1s;
-o-transition: 1s;
-webkit-transition: 1s;
transition: 1s;
}
.slides-css3 img {
display:block;  
position:absolute;  
left:260px;  
bottom:20px;  
border:1px solid #fff;  
box-shadow:0 15px 10px -15px rgba(0,0,0,0.8);
-moz-transition:1s;
-ms-transition: 1s;
-o-transition: 1s;
-webkit-transition: 1s;
transition: 1s;
}
.slides-css3 .p1 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
.slides-css3 .p2 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
.slides-css3 .p3 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
.slides-css3 .p4 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
.slides-css3 .p5 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
.slides-css3 .p6 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
.slides-css3 .p7 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
.slides-css3 .p8 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
.slides-css3 .p9 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b9:target ~ .a8 {z-index:30;}
#b9:target ~ .p9 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b9:target ~ .p1 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b9:target ~ .p2 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b9:target ~ .p3 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b9:target ~ .p4 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b9:target ~ .p5 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b9:target ~ .p6 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b9:target ~ .p7 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b9:target ~ .p8 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b8:target ~ .a7 {z-index:30;}
#b8:target ~ .p8 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b8:target ~ .p9 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b8:target ~ .p1 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b8:target ~ .p2 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b8:target ~ .p3 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b8:target ~ .p4 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b8:target ~ .p5 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b8:target ~ .p6 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b8:target ~ .p7 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b7:target ~ .a6 {z-index:30;}
#b7:target ~ .p7 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b7:target ~ .p8 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b7:target ~ .p9 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b7:target ~ .p1 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b7:target ~ .p2 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b7:target ~ .p3 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b7:target ~ .p4 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b7:target ~ .p5 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b7:target ~ .p6 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b6:target ~ .a5 {z-index:30;}
#b6:target ~ .p6 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b6:target ~ .p7 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b6:target ~ .p8 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b6:target ~ .p9 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b6:target ~ .p1 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b6:target ~ .p2 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b6:target ~ .p3 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b6:target ~ .p4 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b6:target ~ .p5 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b5:target ~ .a4 {z-index:30;}
#b5:target ~ .p5 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b5:target ~ .p6 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b5:target ~ .p7 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b5:target ~ .p8 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b5:target ~ .p9 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b5:target ~ .p1 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b5:target ~ .p2 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b5:target ~ .p3 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b5:target ~ .p4 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b4:target ~ .a3 {z-index:30;}
#b4:target ~ .p4 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b4:target ~ .p5 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b4:target ~ .p6 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b4:target ~ .p7 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b4:target ~ .p8 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b4:target ~ .p9 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b4:target ~ .p1 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b4:target ~ .p2 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b4:target ~ .p3 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b3:target ~ .a2 {z-index:30;}
#b3:target ~ .p3 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b3:target ~ .p4 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b3:target ~ .p5 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b3:target ~ .p6 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b3:target ~ .p7 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b3:target ~ .p8 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b3:target ~ .p9 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b3:target ~ .p1 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b3:target ~ .p2 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b2:target ~ .a1 {z-index:30;}
#b2:target ~ .p2 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b2:target ~ .p3 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b2:target ~ .p4 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b2:target ~ .p5 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b2:target ~ .p6 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b2:target ~ .p7 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b2:target ~ .p8 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b2:target ~ .p9 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b2:target ~ .p1 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
#b1:target ~ .a9 {z-index:30;}
#b1:target ~ .p1 {width:600px; margin-left:-300px; margin-bottom:-100px; opacity:0; z-index:10;}
#b1:target ~ .p2 {width:100px; margin-left:-50px; margin-bottom:328px; opacity:0.1; z-index:2;}
#b1:target ~ .p3 {width:126px; margin-left:-63px; margin-bottom:304px; opacity:0.2; z-index:3;}
#b1:target ~ .p4 {width:156px; margin-left:-78px; margin-bottom:278px; opacity:0.3; z-index:4;}
#b1:target ~ .p5 {width:196px; margin-left:-98px; margin-bottom:244px; opacity:0.4; z-index:5;}
#b1:target ~ .p6 {width:246px; margin-left:-123px; margin-bottom:200px; opacity:0.5; z-index:6;}
#b1:target ~ .p7 {width:308px; margin-left:-154px; margin-bottom:145px; opacity:0.6; z-index:7;}
#b1:target ~ .p8 {width:384px; margin-left:-192px; margin-bottom:80px; opacity:0.7; z-index:8;}
#b1:target ~ .p9 {width:480px; margin-left:-240px; margin-bottom:0px; opacity:1; z-index:9;}
</style>
<div class="slides-css3">
<b id="b1"></b>
<b id="b2"></b>
<b id="b3"></b>
<b id="b4"></b>
<b id="b5"></b>
<b id="b6"></b>
<b id="b7"></b>
<b id="b8"></b>
<b id="b9"></b>
<a class="a1" href="#b1"></a>
<a class="a2" href="#b2"></a>
<a class="a3" href="#b3"></a>
<a class="a4" href="#b4"></a>
<a class="a5" href="#b5"></a>
<a class="a6" href="#b6"></a>
<a class="a7" href="#b7"></a>
<a class="a8" href="#b8"></a>
<a class="a9" href="#b9"></a>
<img class="p1" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_1.jpg" alt="Demo">
<img class="p2" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_2.jpg" alt="Demo">
<img class="p3" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_3.jpg" alt="Demo">
<img class="p4" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_4.jpg" alt="Demo">
<img class="p5" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_5.jpg" alt="Demo">
<img class="p6" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_6.jpg" alt="Demo">
<img class="p7" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_7.jpg" alt="Demo">
<img class="p8" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_8.jpg" alt="Demo">
<img class="p9" src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_9.jpg" alt="Demo">
</div>