#animation 
{
	padding: 0;
	margin: ;
	top: 0;
	left: 0;
	position: absolute;
	height: 2000px;
	width: 100%;
	overflow: hidden;
	z-index: -1;
}
#animation:after
{
    content: '.';
    visibility: hidden;
}
#animation .flocon 
{
	position: absolute;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	background-color: #FFFFFF;
}

#animation .feuille1 
{
	position: absolute;
	width: 110px;
	height: 110px;
	background: url("../images/realLeaf1.png");
	-ms-transform: scale(.25);
	-webkit-transform: scale(.25);
	transform: scale(.25);
	
	animation-name: balancement;
	animation-duration: 1.5s;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	-webkit-animation-name: balancement;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:linear;


}

#animation .feuille2 
{
	position: absolute;
	width: 110px;
	height: 110px;
	background: url("../images/realLeaf2.png");
	-ms-transform: scale(.5);
	transform: scale(.5);
	-webkit-transform: scale(.25);
	animation-name: balancement;
	animation-duration: 2s;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	-webkit-animation-name: balancement;
	-webkit-animation-duration: 2s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:linear;

}

#animation .feuille3 
{
	position: absolute;
	width: 110px;
	height: 110px;
	background: url("../images/realLeaf3.png");
	-ms-transform: scale(.25);
	transform: scale(.25);
	-webkit-transform: scale(.25);
	animation-name: balancement;
	animation-duration: 2s;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	-webkit-animation-name: balancement;
	-webkit-animation-duration: 2s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:linear;

}

#animation .feuille4 
{
	position: absolute;
	width: 110px;
	height: 110px;
	background: url("../images/realLeaf4.png");
	-ms-transform: scale(.5);
	transform: scale(.5);
	-webkit-transform: scale(.25);
	animation-name: balancement;
	animation-duration: 1s;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	-webkit-animation-name: balancement;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:linear;

}

@-webkit-keyframes balancement {
	0% 
	{
		-webkit-transform: rotate(0deg) scale(0.25);
	}
	25% 
	{
		-webkit-transform: rotate(5deg) scale(0.25);
	}
	50% 
	{
		-webkit-transform: rotate(0deg) scale(0.25);
	}
	75% 
	{
		-webkit-transform: rotate(-5deg) scale(0.25);
	}
	100% 
	{
		-webkit-transform: rotate(0deg) scale(0.25);
	}
}
@keyframes balancement {
	0% 
	{
		transform: rotate(0deg) scale(0.25);
	}
	25% 
	{
		transform: rotate(5deg) scale(0.25);
	}
	50% 
	{
		transform: rotate(0deg) scale(0.25);
	}
	75% 
	{
		transform: rotate(-5deg) scale(0.25);
	}
	100% 
	{
		transform: rotate(0deg) scale(0.25);
	}
}