.candy img {
    animation: fly 50s linear infinite;
    pointer-events: none !important;
    top: 0;
    left: 0;
    transform: translateX(0%) translateY(0%) rotateZ(0);
    position: fixed;
    animation-delay: 1s;
    z-index: 999999;
max-width: 100px;
}

@keyframes candy {

    10% {
        display: block;
        transform: translateX(10vw) translateY(10vh) rotateZ(90deg);
    }

    25% {
        transform: translateX(25vw) translateY(30vh) rotateZ(180deg);
    }



    40% {
        transform: translateX(75vw) translateY(70vh) rotateZ(90deg);
    }


    65% {
        transform: translateX(50vw) translateY(50vh) rotateZ(0deg);
    }

    80% {
        transform: translateX(30vw) translateY(30vh) rotateZ(0deg);
    }

    100% {
        transform: translateX(10vw) translateY(10vh) rotateZ(90deg);
    }
}
@keyframes fly {

	98.001%, 0% {
                display: block;
		transform: translateX(-200%) translateY(100vh) rotateZ(0deg)
	}

	15% {
		transform: translateX(100vw) translateY(-100%) rotateZ(180deg)
	}

	15.001%, 18% {
		transform: translateX(100vw) translateY(-30%) rotateZ(0deg)
	}

	40% {
		transform: translateX(-200%) translateY(3vh) rotateZ(-180deg)
	}

	40.001%, 43% {
		transform: translateX(-200%) translateY(-100%) rotateZ(-180deg)
	}

	65% {
		transform: translateX(100vw) translateY(50vh) rotateZ(0deg)
	}

	65.001%, 68% {
		transform: translateX(20vw) translateY(-200%) rotateZ(180deg)
	}

	95% {
		transform: translateX(10vw) translateY(100vh) rotateZ(0deg)
	}
}
.lollipop img {
    animation: lolli 15s linear infinite;
    pointer-events: none !important;
    top: 0;
    left: 0;
    transform: translateX(83vw) translateY(0vw) rotateZ(90deg);
    max-width: 100px;





    position: fixed;
    animation-delay: 1s;
    z-index: 999999;
}

@keyframes lolli {
    10% {
        display: block;
        transform: translateX(65vw) translateY(20vh) rotateZ(180deg);
    }

    25% {
        transform: translateX(40vw) translateY(30vh) rotateZ(90deg);
    }



    40% {
        transform: translateX(25vw) translateY(15vh) rotateZ(0deg);
    }


    65% {
        transform: translateX(2vw) translateY(0vw) rotateZ(90deg);
    }

    80% {
        transform: translateX(44vw) translateY(0vw) rotateZ(180deg);
    }

    100% {
        transform: translateX(83vw) translateY(0vw) rotateZ(180deg);
    }
}


.chocolate img {
    animation: chocolate 15s linear infinite;
    pointer-events: none !important;
    top: 0;
    left: 0;
    transform: translateX(40vw) translateY(75vh) rotateZ(180deg);
    max-width: 100px;
    position: fixed;
    animation-delay: 1s;
    z-index: 999999;
}

@keyframes chocolate {
    10% {
        display: block;
        transform: translateX(20vw) translateY(30vh) rotateZ(90deg);
    }

    25% {
        transform: translateX(0vw) translateY(-10vh) rotateZ(0);
    }



    40% {
        transform: translateX(1vw) translateY(65vh) rotateZ(90deg);
    }


    65% {
        transform: translateX(85vw) translateY(-10vh) rotateZ(180deg);
    }

    80% {
        transform: translateX(60vw) translateY(30vh) rotateZ(90deg);
    }

    100% {
        transform: translateX(40vw) translateY(75vh) rotateZ(0);
    }
}