/*** HOME: Blue Peacock ***/

#blue-peacock {
	animation: bluepeacock 5s linear 3s infinite;
	-webkit-animation: bluepeacock 5s linear 3s infinite;
	transform: translateZ(0);
}

@-webkit-keyframes bluepeacock {
	0%, 3%, 78% {
		left: 34%;
		top: 53%;
	}

	5%, 76% {
		left: 34.25%;
		top: 52.65%;
	}

	7%, 74% {
		left: 34.5%;
		top: 53%;
	}

	9%, 72% {
		left: 34.75%;
		top: 52.65%;
	}

	11%, 70% {
		left: 35%;
		top: 53%;
	}
}

@keyframes bluepeacock {
	0%, 3%, 78% {
		left: 34%;
		top: 53%;
	}

	5%, 76% {
		left: 34.25%;
		top: 52.65%;
	}

	7%, 74% {
		left: 34.5%;
		top: 53%;
	}

	9%, 72% {
		left: 34.75%;
		top: 52.65%;
	}

	11%, 70% {
		left: 35%;
		top: 53%;
	}
}

/** GUEST ROOMS: Kayak | SPA & HEALTH CLUB: Flower **/

#kayak,
#spa-flower {
	animation: kayak 7s ease-in-out infinite;
	-webkit-animation: kayak 7s ease-in-out 3s infinite;

}

#kayak:after,
#spa-flower:after {
	animation: kayak-updown 3.5s ease-in-out infinite;
	-webkit-animation: kayak-updown 3.5s linear 3s infinite;
}

@-webkit-keyframes kayak {
	0%, 100% {
		-webkit-transform: translateX(-10%);
		transform: translateX(-10%);
	}

	50% {
		-webkit-transform: translateX(10%);
		transform: translateX(10%);
	}
}

@keyframes kayak {
	0%, 100% {
		transform: translateX(-10%);
	}

	50% {
		transform: translateX(10%);
	}
}

@-webkit-keyframes kayak-updown {
	0%, 50%, 100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}

	25% {
		-webkit-transform: translateY(2.5%);
		transform: translateY(2.5%);
	}

	75% {
		-webkit-transform: translateY(-2.5%);
		transform: translateY(-2.5%);
	}
}

@keyframes kayak-updown {
	0%, 50%, 100% {
		transform: translateY(0);
	}

	25% {
		transform: translateY(2.5%);
	}

	75% {
		transform: translateY(-2.5%);
	}
}

/** EXPERIENCES: surfer **/

#surfer {
	animation: hobie-cat 7s ease-in-out infinite;
	-webkit-animation: hobie-cat 7s ease-in-out infinite;
}

#surfer:after {
	animation: hobie-cat-updown 3.5s linear infinite;
	-webkit-animation: hobie-cat-updown 3.5s linear infinite;
}

@-webkit-keyframes surfer {
	0%, 100% {
		-webkit-transform: translateX(-5%);
		transform: translateX(-5%);
	}

	50% {
		-webkit-transform: translateX(5%);
		transform: translateX(5%);
	}
}

@keyframes surfer {
	0%, 100% {
		transform: translateX(-5%);
	}

	50% {
		transform: translateX(5%);
	}
}

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

	25% {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg);
	}

	75% {
		-webkit-transform: rotate(-1deg);
		transform: rotate(-1deg);
	}
}


@keyframes surfer-updown {
	0%, 50%, 100% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(1deg);
	}

	75% {
		transform: rotate(-1deg);
	}
}


/** RESTAURANT: Boat **/

#hobie-cat {
	animation: hobie-cat 7s ease-in-out infinite;
	-webkit-animation: hobie-cat 7s ease-in-out infinite;
}

#hobie-cat:after {
	animation: hobie-cat-updown 3.5s linear infinite;
	-webkit-animation: hobie-cat-updown 3.5s linear infinite;
}

@-webkit-keyframes hobie-cat {
	0%, 100% {
		-webkit-transform: translateX(-5%);
		transform: translateX(-5%);
	}

	50% {
		-webkit-transform: translateX(5%);
		transform: translateX(5%);
	}
}

@keyframes hobie-cat {
	0%, 100% {
		transform: translateX(-5%);
	}

	50% {
		transform: translateX(5%);
	}
}

@-webkit-keyframes hobie-cat-updown {
	0%, 50%, 100% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	25% {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg);
	}

	75% {
		-webkit-transform: rotate(-1deg);
		transform: rotate(-1deg);
	}
}


@keyframes hobie-cat-updown {
	0%, 50%, 100% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(1deg);
	}

	75% {
		transform: rotate(-1deg);
	}
}
