/*  **  debris.css  **  */

/* from snowflake .css for scripting ass - slide show alley*/

html {
	height:100%;
}

body {
	height:100%;
/*	background-color:#000; */
}



.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 10s linear 0s 2 forwards, wobble .8s ease 2 alternate;

}

.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 10.5s linear .1s 2 forwards, wobble .85s ease 2 alternate;

}

.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 11s linear .2s 2 forwards, wobble .9s ease 2 alternate;
}


.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 11.5s linear .3s 2 forwards, wobble 1s ease 2 alternate;

}

.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 12s linear .4s 2 forwards, wobble 1.1s ease 2 alternate;

}
 .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 12.5s linear .5s 2 forwards, wobble 1.2s ease 2 alternate;    

}

.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 13s linear .55s 1 forwards, wobble 1.3s ease 1 alternate;

}


.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 13.5s linear .6s 1 forwards, wobble 1.4s ease 1 alternate;

}


.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 14s linear .65s 1 forwards, wobble 1.5s ease 1 alternate;

}


.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 14.5s linear .7s 1 forwards, wobble 1.6s ease 1 alternate;

}



	
@-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:-1%; 	}

100% 	{top:105%; }
	}
	
@-moz-keyframes fall { 
0%   	{top:-1%; 	}

100% 	{top:105%; }
	}	
	
@keyframes fall { 
0%   	{top:-1%; 	}

100% 	{top:105%; }
	}