Trees with Youtube Video Background

HTML

<div class="fg">
     <a href="http://www.davey.com/elements/skin/home_tree.png" target="_blank">
<img src="http://www.davey.com/elements/skin/home_tree.png">
         </a>
</div>
    
<div class="mg">
<img src="http://www.davey.com/elements/skin/home_tree.png">
</div>
    
    
<div class="bg">
    <img src="http://www.davey.com/elements/skin/home_tree.png">
</div>
    
<iframe width="420" height="315" src="//www.youtube.com/embed/H7nezRHosB0?autoplay=1" frameborder="0" allowfullscreen></iframe>

CSS

body {
    background: lightblue;
}

iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index:0;
}

.fg img {
    position: absolute;
    bottom: 0;
    width: 300px;
    z-index: 3;
}

.mg img {
    position: absolute;
    bottom: 0;
    width: 300px;
    z-index: 2;
}

.bg img {
    position: absolute;
    bottom: 0;
    width: 400px;
    z-index: 1;
}