
.animated {
	 -webkit-animation-duration: 1.5s;
	 animation-duration: 1.5s;
	 -webkit-animation-fill-mode: both;
	 animation-fill-mode: both;
	 -webkit-animation-timing-function: linear;
	 animation-timing-function: linear;
	 animation-iteration-count: infinite;
	 -webkit-animation-iteration-cout: infinite;
}
.animatedMelo {
	 -webkit-animation-duration: 2s;
	 animation-duration: 2s;
	 -webkit-animation-fill-mode: both;
	 animation-fill-mode: both;
	 -webkit-animation-timing-function: linear;
	 animation-timing-function: linear;
	 animation-iteration-count: infinite;
	 -webkit-animation-iteration-cout: infinite;
}
.animatedCitrus {
	 -webkit-animation-duration: 3s;
	 animation-duration: 3s;
	 -webkit-animation-fill-mode: both;
	 animation-fill-mode: both;
	 -webkit-animation-timing-function: ease-in-out;
	 animation-timing-function: ease-in-out;
	 animation-iteration-count: infinite;
	 -webkit-animation-iteration-cout: infinite;
   animation-delay: .5s
   -webkit-animation-delay: .5s
}
.animatedStrawberry {
	 -webkit-animation-duration: 2s;
	 animation-duration: 2s;
	 -webkit-animation-fill-mode: both;
	 animation-fill-mode: both;
	 -webkit-animation-timing-function: linear;
	 animation-timing-function: linear;
	 animation-iteration-count: infinite;
	 -webkit-animation-iteration-cout: infinite;
}

@-webkit-keyframes bounce {
	0%, 100% {
		-webkit-transform: translateY(0);
	}
	50% {
		-webkit-transform: translateY(-8px);
	}
}
@keyframes bounce{
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-8px);
	}
}
@-webkit-keyframes bounceMelo {
	0%, 100% {
		-webkit-transform: translateY(0);
	}
	50% {
		-webkit-transform: translateY(13px);
	}
}
@keyframes bounceMelo {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(13px);
	}
}
@-webkit-keyframes bounceCitrus {
	0%, 100% {
		-webkit-transform: translateY(0px);
	}
	50% {
		-webkit-transform: translateY(-13px);
	}
}
@keyframes bounceCitrus {
	0%, 100% {
		transform: translateY(0px);
	}
	50% {
		transform: translateY(-13px);
	}
}
@-webkit-keyframes bounceStrawberry {
	0%, 100% {
		-webkit-transform: translateY(0);
	}
	50% {
		-webkit-transform: translateY(14px);
	}
}
@keyframes bounceStrawberry {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(14px);
	}
}
.bounce {
	-webkit-animation-name: bounce;
	animation-name: bounce;
}
.bounceMelo {
  -webkit-animation-name: bounceMelo;
	animation-name: bounceMelo;
}

.bounceCitrus {
  -webkit-animation-name: bounceCitrus;
	animation-name: bounceCitrus;
}
.bounceStrawberry {
  -webkit-animation-name: bounceStrawberry;
	animation-name: bounceStrawberry;
}

#s3_a1_anim:hover{
	-webkit-animation-name: rotateDonut;
	animation-name: rotateDonut;
}
.animatedDonut {
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-cout: infinite;
}
@-webkit-keyframes rotateDonut {
	0%, 100% {
		-webkit-transform: rotate(0deg);
	}
	50% {
		-webkit-transform: rotate(50deg);
	}
}
@keyframes rotateDonut {
	0%, 100% {
		transform: rotate(0deg);
	}
	50% {
		transform: rotate(50deg);
	}
}

#s3_a2_anim:hover{
	-webkit-animation-name: rotateLol;
	animation-name: rotateLol;
}
.animatedLol {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-cout: infinite;
}

@-webkit-keyframes rotateLol {
	0%, 100% {
		-webkit-transform: rotate(0deg);
	}
	50% {
		-webkit-transform: rotate(70deg);
	}
}
@keyframes rotateLol {
	0%, 100% {
		transform: rotate(0deg);
	}
	50% {
		transform: rotate(70deg);
	}
}



.animatedIcecream {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-cout: infinite;
}

#s3_a3:hover #s3_a3_anim2{

	-webkit-animation-name: transistHeight1;
	animation-name: transistHeight1;
}
#s3_a3:hover #s3_a3_anim1{

	-webkit-animation-name: transistHeight1;
	animation-name: transistHeight1;
	animation-delay: .2s;
}
#s3_a3:hover #s3_a3_anim3{

	-webkit-animation-name: transistWidth1;
	animation-name: transistWidth1;
	animation-delay: .28s;
}
#s3_a3:hover #s3_a3_anim4{

	-webkit-animation-name: transistHeight2;
	animation-name: transistHeight2;
;
}
#s3_a3:hover #s3_a3_anim5{

	-webkit-animation-name: transistHeight2;
	animation-name: transistHeight2;
	animation-delay: .2s;
}


/*Listek górny #s3_a3_anim2 i #s3_a3_anim1 */
@-webkit-keyframes transistHeight1 {
	0%, 100% {
		-webkit-transform: translateY(0);
	}
	50% {
		-webkit-transform: translateY(-25%);
	}
}
@keyframes transistHeight1 {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-25%);
	}
}


/* Listek dolny #s3_a3_anim5 i #s3_a3_anim4 */
@-webkit-keyframes transistHeight2 {
	0%, 100% {
		-webkit-transform: translateY(0);
	}
	50% {
		-webkit-transform: translateY(25%);
	}
}
@keyframes transistHeight2 {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(25%);
	}
}

/* Listek poprzeczny #s3_a3_anim3 *//*
@-webkit-keyframes transistWidth1 {
	0%, 100% {
		-webkit-transform: translateX(0);
	}
	50% {
		-webkit-transform: translateX(25%);
	}
}
@keyframes transistWidth1 {
	0%, 100% {
		transform: translateX(0);
	}
	50% {
		transform: translateX(25%);
	}
}
*/

/* Listek poprzeczny #s3_a3_anim3 */
@-webkit-keyframes transistWidth1 {
	0%, 100% {
		width:4px;
	}
	50% {
		width:5px;
	}
}
@keyframes transistWidth1 {
	0%, 100% {
		width:4px;
	}
	50% {
		width:5px;
	}
}
