/* snowflake test .css */


#ground {
	position:absolute;
	bottom:0px;
	width:100%;
	height:.5%;
	background-color:#eeeeee;
	z-index:1;
 -webkit-animation: grow 30s linear 15s 1 forwards;
  -moz-animation: grow 30s linear 15s 1 forwards;
          animation: grow 60s linear 0s 1 forwards; 
}

.front{
	position:absolute;
	top:-5px;
	height:5px;
	width:15px;
	border-radius:50%;
	background-color:#fff;
	box-shadow: inset 0px 0px 3px #000, 1px 1px 5px #fff;
	  -webkit-animation: fall 10s linear 0s infinite forwards, wobble .8s ease infinite alternate;
	  	  -moz-animation: fall 10s linear 0s infinite forwards, wobble .8s ease infinite alternate;
			animation: fall 7s linear 0s infinite forwards; 

}

.front-1 {
	position:absolute;
	top:-5px;
	height:5px;
	width:14px;
	border-radius:50%;
	background-color:#fff;
	box-shadow: inset 0px 0px 3px #999, 1px 1px 5px #fff;
	  -webkit-animation: fall 10.5s linear .1s infinite forwards, wobble .85s ease infinite alternate;
	  	  -moz-animation: fall 10.5s linear .1s infinite forwards, wobble .85s ease infinite alternate;
			animation: fall 7s linear 0s infinite forwards; 

}

.front-2 {
	position:absolute;
	top:-5px;
	height:4px;
	width:13px;
	border-radius:50%;
	background-color:#fff;
	box-shadow: inset 0px 0px 3px #000, 1px 1px 5px #fff;
	  -webkit-animation: fall 11s linear .2s infinite forwards, wobble .9s ease infinite alternate;
	  	  -moz-animation: fall 11s linear .2s infinite forwards, wobble .9s ease infinite alternate;
			animation: fall 7s linear 0s infinite forwards; 

}


.middle{
	position:absolute;
	top:-5px;
	height:3px;
	width:12px;
	opacity:.8;
	border-radius:50%;
	background-color:#fff;
	box-shadow: 0px 0px 5px #fff;	
	  -webkit-animation: fall 11.5s linear .3s infinite forwards, wobble 1s ease infinite alternate;
	  	  -moz-animation: fall 11.5s linear .3s infinite forwards, wobble 1s ease infinite alternate;
			animation: fall 6s linear 0s infinite forwards; 

}

.middle-1 {
	position:absolute;
	top:-5px;
	height:3px;
	width:11px;
	opacity:.8;
	border-radius:50%;
	background-color:#fff;
	box-shadow: 0px 0px 5px #fff;	
	  -webkit-animation: fall 12s linear .4s infinite forwards, wobble 1.1s ease infinite alternate;
	  	  -moz-animation: fall 12s linear .4s infinite forwards, wobble 1.1s ease infinite alternate;
			animation: fall 6s linear 0s infinite forwards; 

}
 .middle-2 {
	position:absolute;
	top:-5px;
	height:3px;
	width:10px;
	opacity:.8;
	border-radius:50%;
	background-color:#fff;
	box-shadow: 0px 0px 5px #fff;	
	  -webkit-animation: fall 12.5s linear .5s infinite forwards, wobble 1.2s ease infinite alternate;
		  -moz-animation: fall 12.5s linear .5s infinite forwards, wobble 1.2s ease infinite alternate;
			animation: fall 6s linear 0s infinite forwards; 

}

.middle-3 {
	position:absolute;
	top:-5px;
	height:2px;
	width:9px;
	opacity:.8;
	border-radius:50%;
	background-color:#fff;
	box-shadow: 0px 0px 5px #fff;	
	  -webkit-animation: fall 13s linear .55s infinite forwards, wobble 1.3s ease infinite alternate;
	  	  -moz-animation: fall 13s linear .55s infinite forwards, wobble 1.3s ease infinite alternate;
			animation: fall 6s linear 0s infinite forwards; 

}


.back{
	position:absolute;
	top:-5px;
	height:2px;
	width:8px;
	opacity:.5;
	border-radius:50%;
	background-color:#fff;
	box-shadow: 0px 0px 5px #fff;	
	  -webkit-animation: fall 13.5s linear .6s infinite forwards, wobble 1.4s ease infinite alternate;
		  -moz-animation: fall 13.5s linear .6s infinite forwards, wobble 1.4s ease infinite alternate;
			animation: fall 6s linear 0s infinite forwards; 

}


.back-1 {
	position:absolute;
	top:-5px;
	height:2px;
	width:7px;
	opacity:.5;
	border-radius:50%;
	background-color:#fff;
	box-shadow: 0px 0px 5px #fff;	
	  -webkit-animation: fall 14s linear .65s infinite forwards, wobble 1.5s ease infinite alternate;
	  	  -moz-animation: fall 14s linear .65s infinite forwards, wobble 1.5s ease infinite alternate;
			animation: fall 6s linear 0s infinite forwards; 

}


.back-2 {
	position:absolute;
	top:-5px;
	height:2px;
	width:6px;
	opacity:.5;
	border-radius:50%;
	background-color:#fff;
	box-shadow: 0px 0px 5px #fff;	
	  -webkit-animation: fall 14.5s linear .7s infinite forwards, wobble 1.6s ease infinite alternate;
	  	  -moz-animation: fall 14.5s linear .7s infinite forwards, wobble 1.6s ease infinite alternate;
			animation: fall 6s linear 0s infinite forwards; 

}



	
@-webkit-keyframes wobble {
0%		{-webkit-transform: rotate(0deg);}
50%		{-webkit-transform:rotate(15deg);}
100%	{webkit-transform:rotate(0deg);}
}

@-moz-keyframes wobble {
0%		{-webkit-transform: rotate(0deg);}
50%		{-webkit-transform:rotate(15deg);}
100%	{webkit-transform:rotate(0deg);}
}

@keyframes wobble {
0%		{-webkit-transform: rotate(0deg);}
50%		{-webkit-transform:rotate(15deg);}
100%	{webkit-transform:rotate(0deg);}
}

@-webkit-keyframes fall { 
0%   	{top:-5%; 	}

100% 	{top:97%; }
	}
	
@-moz-keyframes fall { 
0%   	{top:-5%; 	}

100% 	{top:97%; }
	}

@keyframes fall { 
0%   	{top:-5%; 	}

100% 	{top:97%; }
	}
	
	

@-webkit-keyframes grow { 
0%   	{height:.5%;}

100% 	{height:5%;}
	}
	
@-moz-keyframes grow { 
0%   	{height:.5%;}

100% 	{height:5%;}
	}
	
@keyframes grow { 
0%   	{height:.5%;}

100% 	{height:5%;}
	}