@charset "utf-8";
/* CSS Document */

.sylvaeimg {
	animation: fly 50s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(-120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}

@keyframes fly {

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

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

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

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

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

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

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

	95% {
		transform: translateX(10vw) translateY(100vh)
	}
}

.sylvaeimg2 {
	animation: fly2 18s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}

@keyframes fly2 {

	98.001%, 0% {
                display: block;
		transform: translateX(120vw) translateY(60vh)
	}

	15% {
		transform: translateX(-20vw) translateY(80vh)
	}
	
	15.001%, 18% {
		transform: translateX(-20vw) translateY(80vh)
	}
	
	40% {
		transform: translateX(120vw) translateY(3vh)
	}

	40.001%, 43% {
		transform: translateX(120vw) translateY(3vh)
	}
	
	65% {
		transform: translateX(-120vw) translateY(50vh)
	}

	65.001%, 68% {
		transform: translateX(80vw) translateY(120vh)
	}
	
	95% {
		transform: translateX(50vw) translateY(-120vh)
	}
}

.sylvaeimg3 {
	animation: fly3 24s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}

@keyframes fly3 {

	98.001%, 0% {
                display: block;
		transform: translateX(70vw) translateY(120vh)
	}

	15% {
		transform: translateX(30vw) translateY(-120vh)
	}
	
	15.001%, 18% {
		transform: translateX(-60vw) translateY(15vh)
	}
	
	40% {
		transform: translateX(220vw) translateY(60vh)
	}

	40.001%, 43% {
		transform: translateX(50vw) translateY(120vh)
	}
	
	65% {
		transform: translateX(50vw) translateY(-50vh)
	}

	65.001%, 68% {
		transform: translateX(-60vw) translateY(80vh)
	}
	
	95% {
		transform: translateX(240vw) translateY(40vh)
	}
	
}

.sylvaeimg4 {
	animation: fly4 30s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}

@keyframes fly4 {

	98.001%, 0% {
                display: block;
		transform: translateX(80vw) translateY(-20vh)
	}

	15% {
		transform: translateX(20vw) translateY(120vh)
	}
	
	15.001%, 18% {
		transform: translateX(120vw) translateY(60vh)
	}
	
	40% {
		transform: translateX(-20vw) translateY(30vh)
	}

	40.001%, 43% {
		transform: translateX(-20vw) translateY(90vh)
	}
	
	65% {
		transform: translateX(120vw) translateY(20vh)
	}

	65.001%, 68% {
		transform: translateX(60vw) translateY(-20vh)
	}
	
	95% {
		transform: translateX(40vw) translateY(110vh)
	}
	
}

.sylvaeimg5 {
	animation: fly 18s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}

.sylvaeimg6 {
	animation: fly2 60s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}

.sylvaeimg7 {
	animation: fly3 58s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}

.sylvaeimg8 {
	animation: fly4 50s linear infinite;
	pointer-events: none !important;
	top:0;
	left:0;
	transform: translateX(120%) translateY(-120%) rotateZ(0);
	position: fixed;
	animation-delay: 1s;
	z-index: 999;
}