Montage 104

6 images au ratio 16/9

<div style="width: 60vw; height: 33.75vw; margin: 1vh auto;">
<p id="ex0">Clic maintenu</p>
<p id="ex1" class="ex">&nbsp;</p>
<p id="ex2" class="ex">&nbsp;</p>
<p id="ex3" class="ex">&nbsp;</p>
<p id="ex4" class="ex">&nbsp;</p>
<p id="ex5" class="ex">&nbsp;</p>
<p id="ex6" class="ex">&nbsp;</p>
</div>

<style><!--
#ex0{position:absolute; z-index:1; width:12vw; text-align:center; font-size:1.2vw; transform:translate(24vw,0vw);}
.ex{position:absolute; z-index:1; width:6vw; height:20vw; border:0.4vh ridge white; box-shadow:0.4vh 0.4vh 0.6vh black; border-radius:4vw; -webkit-filter:grayscale(1); filter:grayscale(1); transition:transform 1s linear 0s, width 1s linear 0s, height 1s linear 0s, filter 1s linear 1s, border-radius 0.3s linear 1s;}
#ex1{transform:translate(3vw,6vw) rotatey(180deg); background:url('http://ekladata.com/aZnicHRiorpZX3eu7ajX04LciA0.jpg'); background-size:cover;}
#ex2{transform:translate(11vw,6vw) rotatey(180deg); background:url('http://ekladata.com/Nw6GwqlDIs39OjXnOfd-xtzjuq4.jpg'); background-size:cover;}
#ex3{transform:translate(20vw,6vw) rotatey(180deg); background:url('http://ekladata.com/ZSTd5Vb_nslzxFY_go69uIlNkGM.jpg'); background-size:cover;}
#ex4{transform:translate(29vw,6vw) rotatey(180deg); background:url('http://ekladata.com/7XCgiZvbeensQO099Q3NZPDyOEY.jpg'); background-size:cover;}
#ex5{transform:translate(38vw,6vw) rotatey(180deg); background:url('http://ekladata.com/me4tfyRyk2g2lJ9AO1XJSkNDDI8.jpg'); background-size:cover;}
#ex6{transform:translate(47vw,6vw) rotatey(180deg); background:url('http://ekladata.com/xy5JOPyjnTusvjnOIpqf22-iBFA.jpg'); background-size:cover;}
#ex1:active,#ex2:active,#ex3:active,#ex4:active,#ex5:active,#ex6:active{z-index:5; box-sizing:border-box; width:60vw; height:33.75vw; transform:translate(0vw,0vw) rotatey(0deg); filter:grayscale(0); -webkit-filter:grayscale(0); border-radius:0%;}
--></style>