.coyote {
	background-color: #4400ff;
	position: absolute;
}

#coyote {
	position: fixed;
	width: 550px;
	height: 450px;
	transform: scale(0.75);
	bottom: 0%;
	left: 0%;
	margin: 0;
	padding: 0;
}

#head {
	position: absolute;
	top: 148px;
	left: 375px;
	transform: rotate(-45deg);
	-webkit-animation: head-ani 2s ease 0s infinite alternate;
	animation: head-ani 2s ease-in-out 0s infinite alternate;
}

@keyframes head-ani {
	0% {
		top: 148px;
		left: 375px;
		transform: rotate(-45deg);
	}

	100% {
		top: 160px;
		left: 370px;
		transform: rotate(-60deg);
	}
}

#ear1 {
	top: 20px;
	left: -5px;
	width: 60px;
	height: 40px;
	border-radius: 0% 100% 50% 50% / 0% 100% 0% 0%;
	transform: rotate(-120deg);
}

#ear2 {
	top: 25px;
	left: -25px;
	width: 60px;
	height: 40px;
	border-radius: 0% 100% 50% 50% / 0% 100% 0% 0%;
	transform: rotate(-135deg);
}

#face {
	top: 40px;
	left: 15px;
	width: 75px;
	height: 60px;
	border-radius: 30% 70% 70% 30% / 50% 50% 50% 50%;
}

#snout {
	top: 55px;
	left: 35px;
	width: 90px;
	height: 40px;
	border-radius: 46% 54% 66% 34% / 46% 0% 100% 54%;
}

#jaw {
	top: 85px;
	left: 20px;
	width: 90px;
	height: 25px;
	border-radius: 0% 100% 100% 0% / 100% 100% 0% 0%;
	transform: rotate(-5deg);
}

#neck {
	top: 200px;
	left: 315px;
	width: 210px;
	height: 80px;
	transform: rotate(-50deg);
	border-radius: 0% 100% 50% 50% / 0% 0% 100% 100%;
}

#body {
	top: 205px;
	left: 175px;
	width: 260px;
	height: 105px;
	border-radius: 100% 0% 35% 65% / 40% 40% 60% 60%;
	transform: rotate(5deg);
}

#tail {
	top: 255px;
	left: 0px;
	width: 260px;
	height: 125px;
	border-radius: 0% 100% 0% 100% / 0% 100% 0% 100%;
	transform: rotate(115deg);
	-webkit-animation: tail-ani 2s ease 0s infinite alternate;
	animation: tail-ani 2s ease-in-out 0s infinite alternate;
}

@keyframes tail-ani {
	0% {
		top: 255px;
		left: 0px;
		transform: rotate(115deg);
	}

	100% {
		top: 240px;
		left: 0px;
		transform: rotate(125deg);
	}
}

#leg1 {
	top: 285px;
	left: 385px;
	width: 23px;
	height: 150px;
	transform: rotate(-5deg);
	border-radius: 0% 0% 0% 10% / 0% 0% 0% 10%;
}

#leg2 {
	top: 285px;
	left: 345px;
	width: 23px;
	height: 150px;
	transform: rotate(-5deg);
	border-radius: 0% 0% 0% 10% / 0% 0% 0% 10%;
}

#thigh {
	top: 270px;
	left: 195px;
	width: 70px;
	height: 100px;
	border-radius: 100% 0% 100% 0% / 0% 0% 100% 100%;
	transform: rotate(15deg);
}

#leg3 {
	top: 285px;
	left: 183px;
	width: 23px;
	height: 150px;
	transform: rotate(10deg);
	border-radius: 0% 0% 0% 10% / 0% 0% 0% 10%;
}

.paw {
	width: 40px;
	height: 27px;
	border-radius: 0% 100% 61% 39% / 29% 100% 0% 71%;
}

#paw1 {
	top: 423px;
	left: 392px;
}

#paw2 {
	top: 423px;
	left: 352px;
}

#paw3 {
	top: 423px;
	left: 172px;
}

#moon {
	position: absolute;
	top: 10%;
	left: 10%;
	width: 200px;
	height: 200px;
	border-radius: 50%;
	animation: spin 20s linear infinite;
	box-shadow: 30px 30px 0 0 #a2fa00;
}

#saturn {
	width: 20%;
	/* animation: spin 10s linear infinite; */
}

#planet {
	position: absolute;
	right: 10%;
	top: 10%;
	width: 100px;
	height: 66px;
	transform: scale(1.5) rotate(-15deg);
	-webkit-animation: planet-ani 1.5s ease-in-out 0s infinite alternate;
	animation: planet-ani 1.5s ease-in-out 0s infinite alternate;
}

@keyframes planet-ani {
	0% {
		top: 10%;
	}

	100% {
		top: 11%;
	}
}

#saturn-planet {
	position: absolute;
	top: 5px;
	left: 18px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: linear-gradient(90deg, #00ffde 0%, #6e50ff 100%);
}

#saturn-planet-top {
	position: absolute;
	top: 5px;
	left: 18px;
	width: 50px;
	height: 25px;
	border-radius: 50% 50% 50% 50% / 100% 100% 0% 0%;
	background: linear-gradient(90deg, #00ffde 0%, #6e50ff 100%);
}

#saturn-rings {
	position: absolute;
	top: 15px;
	width: 75px;
	height: 20px;
	border-radius: 50%;
	border: 5px solid #ff48a4;
	border-width: 5px 10px;
	-webkit-animation: rings-ani 1.5s ease-in-out 0s infinite alternate;
	animation: rings-ani 1.5s ease-in-out 0s infinite alternate;
}

@keyframes rings-ani {
	0% {
		left: -10px;
	}

	100% {
		left: 2px;
	}
}
