/* -------------------------------------- */
/* Welcome to the kingdom of the parrots! */ 
/* -------------------------------------- */
/* You can change this height. */
.parrot_kingdom {
	height:8em;
}
/* -------------------------------------------- */
/* Classes inside :not() are immune to toggles! */
.parrot_kingdom:not(.nonstop,.peekaboo) .parrot_frozen + .parrot_cage,
.parrot_kingdom:not(.nonstop,.peekaboo) .parrot_frozen + .parrot_cage .parrot {
	animation-play-state:paused;
}
/* ------------------------------- */
/* You can change toggle position. */
.parrot_toggle {
	position:absolute;z-index:1;top:0;right:0;overflow:hidden;visibility:hidden;
}
.parrot_kingdom[class*="_alt"] .parrot_toggle {
	right:auto;left:0;
}
/* ------------------------------ */
/* You can change toggle styling. */
.parrot_show {
	visibility:visible;height:1.5rem;padding:0 1rem;font-size:1rem;font-weight:700;
	line-height:1.25rem;border:1px solid;border-radius:4px;opacity:.25;
}
.parrot_frozen,.parrot_show:hover {
	opacity:1;
}
.parrot_show::before {
	content:'X';
}
.parrot_frozen::before {
	font-size:1.5rem;line-height:1rem;
	content:'+';
}
/* -------------------------- */
/* Default bounce animations. */
/* -------------------------- */
.parrot_cage {
	animation:parrot_cage alternate 5s;
}
/* Next 3 times = parrot_cage. */
.parrot {
	animation:parrot_base alternate 5s;
}
.flip .parrot {
	animation:parrot_flip alternate 5s;
}
.spin .parrot {
	animation:parrot_spin alternate 5s;
}
/* ------------------------ */
.zomg .parrot_cage,.zomg_alt .parrot_cage {
	animation:parrot_cage_zomg 5s;
}
/* Time = parrot_cage_zomg. */
.zomg .parrot,.zomg_alt .parrot {
	animation:parrot_zomg 5s;
}
/* -------------------- */
/* Horizontal marquees. */
/* -------------------- */
.both_move .parrot_cage,.both_move_alt .parrot_cage {
	animation:parrot_cage_both_move 10s;
}
/* Time = parrot_cage_both_move. */
.both_move .parrot,.both_move_alt .parrot {
	animation:parrot_both_move 10s;
}
/* ------------------------ */
.move_both .parrot_cage,.move_both_alt .parrot_cage {
	animation:parrot_cage_both 10s;
}
/* Time = parrot_cage_both. */
.move_both .parrot,.move_both_alt .parrot {
	animation:parrot_move_both 10s;
}
/* ------------------------ */
.move_left .parrot_cage, .move_left_alt .parrot_cage {
	animation:parrot_cage_left 5s;
}
/* Time = parrot_cage_left. */
.move_left .parrot, .move_left_alt .parrot {
	animation:parrot_move_left 5s;
}
/* ------------------------ */
.move_right .parrot_cage, .move_right_alt .parrot_cage {
	animation:parrot_cage_right 5s;
}
/* Time = parrot_cage_right. */
.move_right .parrot, .move_right_alt .parrot {
	animation:parrot_move_right 5s;
}
/* ------------------ */
/* Vertical marquees. */
/* ------------------ */
.vert_both .parrot_cage {
	animation:parrot_cage_vert 6s;
}
/* Time = parrot_cage_vert. */
.vert_both .parrot {
	animation:parrot_vert_both 6s;
}
/* ------------------------ */
.vert_rise .parrot_cage {
	animation:parrot_cage_rise 3s;
}
/* Time = parrot_cage_rise. */
.vert_rise .parrot {
	animation:parrot_vert_rise 3s;
}
/* ------------------------ */
.vert_fall .parrot_cage {
	animation:parrot_cage_fall 3s;
}
/* Time = parrot_cage_fall. */
.vert_fall .parrot {
	animation:parrot_vert_fall 3s;
}
/* ------------------------------------------------------------- */
/* For custom iterations or easing functions, edit this to suit. */
/* Probably easiest to use :not() to exempt your custom classes. */
/* ------------------------------------------------------------- */
.parrot_kingdom .parrot_cage,.parrot_kingdom .parrot {
	animation-iteration-count:infinite;animation-timing-function:linear;
}
/* ----------------- */
/* Hover parameters. */
/* ----------------- */
/* For God's sake, stop those bounces! :D */
.parrot_kingdom:hover .parrot_cage,.parrot_kingdom:hover .parrot {
	animation-play-state:paused;
}
/* Oh noes! Chase those bounces! :D */
.nonstop:hover .parrot_cage,.nonstop:hover .parrot,
.chase:hover .parrot_cage,.chase:hover .parrot {
	animation-play-state:running;
}
.chase .parrot_cage:hover,.chase .parrot_cage:hover .parrot {
	animation-play-state:paused;
}
/* Mwahahaha! Sneaky bounces forever! :D */
.peekaboo:hover .parrot_cage,.peekaboo:hover .parrot {
	animation-play-state:running;
	opacity:1;transition: opacity .2s linear .2s;
}
.peekaboo .parrot_cage:hover,.peekaboo .parrot_cage:hover .parrot {
	opacity:0;transition: opacity .1s step-start;
}
/* -------------------------------------- */
/* Only change these if your CSS is good! */
/* -------------------------------------- */
.parrot_kingdom {
	position:relative;overflow:hidden;box-sizing:content-box;
}
.parrot_kingdom[class*="move"] {
	height:auto;
}
.parrot_kingdom[class*="_alt"] {
	transform:scaleX(-1);
}
.parrot_cage {
	position:relative;float:left;
}
.parrot_kingdom[class*="vert"] .parrot_cage {
	float:none;
}
.parrot {
	position:relative;overflow:hidden;white-space:pre;font-size:1rem;text-align:center;
}
@media (prefers-reduced-motion:reduce) {
	.parrot_cage,.parrot {
		animation-name: none!important;
	}
}
/* -------------------- */
/* Animation keyframes. */
/* -------------------- */
/* Four bounces across. */
@keyframes parrot_cage{
	0%  {left: 0;  top:100%}
	12% {left: 12%;top:0}
	25% {left: 25%;top:100%}
	37% {left: 37%;top:0}
	50% {left: 50%;top:100%}
	62% {left: 62%;top:0}
	75% {left: 75%;top:100%}
	87% {left: 87%;top:0}
	100%{left:100%;top:100%}
}
/* Basic bounces. */
@keyframes parrot_base{
	0%  {right: 0;  bottom:100%}
	12% {right: 12%;bottom:0}
	25% {right: 25%;bottom:100%}
	37% {right: 37%;bottom:0}
	50% {right: 50%;bottom:100%}
	62% {right: 62%;bottom:0}
	75% {right: 75%;bottom:100%}
	87% {right: 87%;bottom:0}
	100%{right:100%;bottom:100%}
}
/* Bounces + flips each end. */
@keyframes parrot_flip{
	0%  {right: 0;  bottom:100%}
	12% {right: 12%;bottom:0}
	25% {right: 25%;bottom:100%;transform:rotate(360deg)}
	37% {right: 37%;bottom:0}
	50% {right: 50%;bottom:100%}
	62% {right: 62%;bottom:0}
	75% {right: 75%;bottom:100%;transform:rotate(360deg)}
	87% {right: 87%;bottom:0}
	100%{right:100%;bottom:100%}
}
/* Bounces + continuous spin. */
@keyframes parrot_spin{
	0%  {right: 0;  bottom:100%}
	12% {right: 12%;bottom:0}
	25% {right: 25%;bottom:100%}
	37% {right: 37%;bottom:0}
	50% {right: 50%;bottom:100%}
	62% {right: 62%;bottom:0}
	75% {right: 75%;bottom:100%}
	87% {right: 87%;bottom:0}
	100%{right:100%;bottom:100%;transform:rotate(720deg)}
}
/* Ricochet + spin. */
@keyframes parrot_cage_zomg{
	0%  {left: 0;  top:50%}
	25% {left: 50%;top:100%}
	50% {left:100%;top:50%}
	75% {left: 50%;top:0}
	100%{left: 0;  top:50%}
}
@keyframes parrot_zomg{
	0%  {right: 0;  bottom:50%}
	25% {right: 50%;bottom:100%}
	50% {right:100%;bottom:50%;transform:rotate(720deg)}
	75% {right: 50%;bottom:0}
	100%{right: 0;  bottom:50%}
}
/* -------------------- */
/* Horizontal marquees. */
/* -------------------- */
/* Alternating - L-R-L. */
@keyframes parrot_cage_both_move{
	0%  {left:110%}
	50% {left:0}
	100%{left:110%}
}
@keyframes parrot_both_move{
	0%  {right:0}
	49% {right:110%;transform:scaleX(1)}
	50% {right:110%;transform:scaleX(-1)}
	100%{right:0;transform:scaleX(-1)}
}
@keyframes parrot_cage_both{
	0%  {left:0}
	50% {left:110%}
	100%{left:0}
}
@keyframes parrot_move_both{
	0%  {right:110%}
	49% {right:0%;transform:scaleX(1)}
	50% {right:0%;transform:scaleX(-1)}
	100%{right:110%;transform:scaleX(-1)}
}
/* Slide left. */
@keyframes parrot_cage_left{
	0%  {left:110%}
	100%{left: 0%}
}
@keyframes parrot_move_left{
	0%  {right:0}
	100%{right:110%}
}
/* Slide right. */
@keyframes parrot_cage_right{
	0%  {left:0}
	100%{left:110%}
}
@keyframes parrot_move_right{
	0%  {right:110%}
	100%{right:0}
}
/* ------------------ */
/* Vertical marquees. */
/* ------------------ */
/* Alternate up/down. */
@keyframes parrot_cage_vert{
	0%  {top:120%}
	50% {top:0}
	100%{top:120%}
}
@keyframes parrot_vert_both{
	0%  {bottom:0}
	50% {bottom:120%}
	100%{bottom:0}
}
/* Slide up. */
@keyframes parrot_cage_rise{
	0%  {top:120%}
	100%{top:0}
}
@keyframes parrot_vert_rise{
	0%  {bottom:0}
	100%{bottom:120%}
}
/* Slide down. */
@keyframes parrot_cage_fall{
	0%  {top:0}
	100%{top:120%}
}
@keyframes parrot_vert_fall{
	0%  {bottom:120%}
	100%{bottom:0}
}
/* ------------ */
/* End of file. */
/* ------------ */