.smoke {
	position: absolute;
	width: 500px;
	height: auto;
	
	bottom: -100%;
	opacity: 0;
	
	animation-duration: 7s;
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	animation-direction: normal;
	
	-moz-animation-duration: 7s;
	-moz-animation-timing-function: ease-out;
	-moz-animation-iteration-count: infinite;
	-moz-animation-direction: normal;
	
	/*
	-webkit-animation-duration: 7s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: normal;
	*/
}



#smoke1 {
	left: -20%;
	animation-name: smoke1;
	animation-delay: 1s;
	-moz-animation-name: smoke1;
	-moz-animation-delay: 1s;
	-webkit-animation-name: smoke1;
	-webkit-animation-delay: 1s;
}
#smoke2 {
	left: -5%;
	animation-name: smoke2;
	animation-delay: 5s;
	-moz-animation-name: smoke2;
	-moz-animation-delay: 5s;
	-webkit-animation-name: smoke2;
	-webkit-animation-delay: 5s;
}
#smoke3 {
	left: 5%;
	animation-name: smoke3;
	animation-delay: 2s;
	-moz-animation-name: smoke3;
	-moz-animation-delay: 2s;
	-webkit-animation-name: smoke3;
	-webkit-animation-delay: 2s;
}
#smoke4 {
	left: 12%;
	animation-name: smoke4;
	animation-delay: 4s;
	-moz-animation-name: smoke4;
	-moz-animation-delay: 4s;
	-webkit-animation-name: smoke4;
	-webkit-animation-delay: 4s;
}
#smoke5 {
	left: 55%;
	animation-name: smoke5;
	animation-delay: 6s;
	-moz-animation-name: smoke5;
	-moz-animation-delay: 6s;
	-webkit-animation-name: smoke5;
	-webkit-animation-delay: 6s;
}
#smoke6 {
	left: 60%;
	animation-name: smoke6;
	animation-delay: 3s;
	-moz-animation-name: smoke6;
	-moz-animation-delay: 3s;
	-webkit-animation-name: smoke6;
	-webkit-animation-delay: 3s;
}
#smoke7 {
	left: 70%;
	animation-name: smoke7;
	animation-delay: 7s;
	-moz-animation-name: smoke7;
	-moz-animation-delay: 7s;
	-webkit-animation-name: smoke7;
	-webkit-animation-delay: 7s;
}


@keyframes smoke1 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		transform: rotate(0deg);
	}
	100% {
		bottom: 300px; left: -25%;
		
		opacity: 0;
		transform: rotate(-50deg);
	}
}

@keyframes smoke2 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		transform: rotate(0deg);
	}
	100% {
		bottom: 200px; left: -15%;
		
		opacity: 0;
		transform: rotate(50deg);
	}
}

@keyframes smoke3 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		transform: rotate(0deg);
	}
	100% {
		bottom: 100px;  left: -11%;
		
		opacity: 0;
		transform: rotate(30deg);
	}
}

@keyframes smoke4 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		transform: rotate(0deg);
	}
	100% {
		bottom: 100px;  left: 10%;
		
		opacity: 0;
		transform: rotate(30deg);
		
	}
}

@keyframes smoke5 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 50%;
		
		opacity: 0;
		transform: rotate(30deg);
		
	}
}

@keyframes smoke6 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 55%;
		
		opacity: 0;
		transform: rotate(30deg);
		
	}
}

@keyframes smoke7 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 73%;
		
		opacity: 0;
		transform: rotate(30deg);
		
	}
}


@-moz-keyframes smoke1 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-moz-transform: rotate(0deg);
	}
	100% {
		bottom: 300px; left: -25%;
		
		opacity: 0;
		-moz-transform: rotate(-50deg);
	}
}

@-moz-keyframes smoke2 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-moz-transform: rotate(0deg);
	}
	100% {
		bottom: 200px; left: -15%;
		
		opacity: 0;
		-moz-transform: rotate(50deg);
	}
}

@-moz-keyframes smoke3 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-moz-transform: rotate(0deg);
	}
	100% {
		bottom: 100px;  left: -11%;
		
		opacity: 0;
		-moz-transform: rotate(30deg);
	}
}

@-moz-keyframes smoke4 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-moz-transform: rotate(0deg);
	}
	100% {
		bottom: 100px;  left: 10%;
		
		opacity: 0;
		-moz-transform: rotate(30deg);
		
	}
}

@-moz-keyframes smoke5 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-moz-transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 50%;
		
		opacity: 0;
		-moz-transform: rotate(30deg);
		
	}
}

@-moz-keyframes smoke6 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-moz-transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 55%;
		
		opacity: 0;
		-moz-transform: rotate(30deg);
		
	}
}

@-moz-keyframes smoke7 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-moz-transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 73%;
		
		opacity: 0;
		-moz-transform: rotate(30deg);
		
	}
}

/*
@-webkit-keyframes smoke1 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-webkit-transform: rotate(0deg);
	}
	100% {
		bottom: 300px; left: -25%;
		
		opacity: 0;
		-webkit-transform: rotate(-50deg);
	}
}

@-webkit-keyframes smoke2 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-webkit-transform: rotate(0deg);
	}
	100% {
		bottom: 200px; left: -15%;
		
		opacity: 0;
		-webkit-transform: rotate(50deg);
	}
}

@-webkit-keyframes smoke3 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-webkit-transform: rotate(0deg);
	}
	100% {
		bottom: 100px;  left: -11%;
		
		opacity: 0;
		-webkit-transform: rotate(30deg);
	}
}

@-webkit-keyframes smoke4 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-webkit-transform: rotate(0deg);
	}
	100% {
		bottom: 100px;  left: 10%;
		
		opacity: 0;
		-webkit-transform: rotate(30deg);
		
	}
}

@-webkit-keyframes smoke5 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-webkit-transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 50%;
		
		opacity: 0;
		-webkit-transform: rotate(30deg);
		
	}
}

@-webkit-keyframes smoke6 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-webkit-transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 55%;
		
		opacity: 0;
		-webkit-transform: rotate(30deg);
		
	}
}

@-webkit-keyframes smoke7 {
	0% {
		bottom: -500px; 
		
		opacity: 1;
		-webkit-transform: rotate(0deg);
	}
	100% {
		bottom: 100px; left: 73%;
		
		opacity: 0;
		-webkit-transform: rotate(30deg);
		
	}
}
*/