• Art.6C.6.21

     5 images au ratio 16/9.

    SURVOL

     

     

     

     


    <div style="width: 1000px; height: 562px; margin: 20px auto; text-align: left; border: 1px solid black; background: url('http://ekladata.com/b6TC-XNBUxMb6YcbdMjjXUnxevc.jpg'); background-size: cover;">
    <p id="ang0">SURVOL</p>
    <p id="ang1" class="ang">&nbsp;</p>
    <p id="ang2" class="ang">&nbsp;</p>
    <p id="ang3" class="ang">&nbsp;</p>
    <p id="ang4" class="ang">&nbsp;</p>
    </div>
    <style><!--
    #ang0{position:absolute; z-index:1; width:150px; font-size:30px; color:white; text-shadow:2px 2px black; transform:translate(425px,20px);}
    .ang{position:absolute; z-index:1; width:150px; height:150px; transition:all 1s;}
    #ang1{ box-sizing:border-box; border-radius:0% 50% 50% 50%; border:10px solid white; background:url('http://ekladata.com/L8p3nwekiTd6qzKI4feyc-of8Co.jpg'); background-size:1000px 562px; background-position:0px 0px; transform:translate(0px,0px);}
    #ang2{box-sizing:border-box; border-radius:50% 0 50% 50%; border:10px solid white; background:url('http://ekladata.com/gwz7osnKzAo0ff9eSkyVXE_4lVA.jpg'); background-size:1000px 562px; background-position:-850px 0px; transform:translate(850px,0px);}
    #ang3{box-sizing:border-box; border-radius:50% 50% 0 50%; border:10px solid white; background:url('http://ekladata.com/sRyP-ek3_aG46PxhTd1LrbPot9E.jpg'); background-size:1000px 562px; background-position:-850px -412px; transform:translate(850px,412px);}
    #ang4{box-sizing:border-box; border-radius:50% 50% 50% 0; border:10px solid white; background:url('http://ekladata.com/09imf3i-Wz4orqylj-l5AbVB0JU.jpg'); background-size:1000px 562px; background-position:0px -412px; transform:translate(0px,412px);}
    #ang1:hover, #ang2:hover,#ang3:hover,#ang4:hover{z-index:5; width:1000px; height:562px; border-radius:0%; border:none; background-position:0px 0px; transform:translate(0px,0px);}
    --></style>