[Résolu] Ajouter un .png responsive au dessus d'un slide parallaxe

Salut à tous,

Je suis en train d'adapter le framework Cool Kitten mais je bloque sur un truc. Comment puis-je ajouter une image en transparence collée juste au dessus d'un slide. Comme dans cet exemple où l'on voit des nuages, montagnes et vagues juste au dessus de chaque slide (mais juste la couche du fond, pas les nuages rouges ou les vagues plus claires)

J'essaie de superposer mon image comme suit:

<div id"slide1"></div>
<div id"image_png"></div>
<div id"slide2"></div>

Avec ce CSS

#image_png {
	background: url('../images/image.png') no-repeat center scroll;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	width: 100%;
	overflow: hidden;
	position: absolute;
	z-index: 99;
}

Mais sans succès. J'ai essayé pas mal de bidouillages mais je ne trouve pas. J'avoue ne pas être un As du CSS
Le but étant que mon PNG colle constamment au slice et cela quel que soit la résolution d'affichage.
Si qq1 à une idée, je suis preneur. Merci

Bon, ben, ça a l'air de fonctionner comme ça. Apparemment, mon erreur est d'avoir utilisé l'image en background.

<div id="image_png">
	<img src="images/image.png">
</div>

#image_png {
    bottom: 0;
    position: absolute;
    width: 100%;
}