@keyframes wave02_anim {
  0% {
    background-position: 0px 0px;
  }
  100% {
    background-position: -729000px 0px;
  }
}
.wave02 {
  animation-timing-function: steps(1500);
  width: 486px;
  height: 233px;
  background-repeat: no-repeat;
  animation-iteration-count: infinite;}

.wave02.play {
  animation-name: wave02_anim;
}


.wave02Cont{
	position: absolute;
	top: 0;
	right: 0;
	transform-origin: top right;
	-webkit-transition: all 0.3s; /* Safari */
    transition: all 0.3s;

	
}


@media (min-width: 600px) {
	
	.wave02{
  animation-duration: 40000ms;
	}
	
}
@media (max-width: 599px) {
	
	.wave02{
  animation-duration: 20000ms;
	}
	
}



@media (min-width: 1701px) {
	
	.wave02Cont{
		transform: scale(.9)
	}
	
}

@media (max-width: 1700px) and (min-width: 1051px) {
	
	.wave02Cont{
		transform: scale(.65)
	}
	
}

@media (max-width: 1250px) and (min-width: 1021px) {
	
	.wave02Cont{
		transform: scale(.55)
	}
	
}


@media (max-width: 1020px) and (min-width: 780px) {
	
	.wave02Cont{
		transform: scale(.8)
	}
	
}

@media (max-width: 779px) and (min-width: 600px) {
	
	.wave02Cont{
		transform: scale(.5)
	}
	
}

@media (max-width: 599px) and (min-width: 450px) {
	
	.wave02Cont{
		transform: scale(.35)
	}
	
}

@media (max-width: 449px) and (min-width: 350px) {
	
	.wave02Cont{
		transform: scale(.3)
	}
	
}


@media (max-width: 349px) and (min-width: 250px) {
	
	.wave02Cont{
		transform: scale(.25)
	}
	
}


@media (max-width: 249px) {
	
	.wave02Cont{
		transform: scale(.2)
	}
	
}