html, body {
    height: 100%; 
	overflow: hidden;
	background-color: black;
	color: silver;
}

@keyframes slide-arm-left-upper {
    0% { transform: translate(96px, 64px) rotateZ(70deg); }
    12.5% { transform: translate(96px, 64px) rotateZ(55deg); }
    25% { transform: translate(96px, 64px) rotateZ(15deg); }
    37.5% { transform: translate(96px, 64px) rotateZ(-15deg); }
    50% { transform: translate(96px, 64px) rotateZ(-25deg); }
    62.5% { transform: translate(96px, 64px) rotateZ(-15deg); }
    75% { transform: translate(96px, 64px) rotateZ(-5deg); }
    87.5% { transform: translate(96px, 64px) rotateZ(30deg); }
    100% { transform: translate(96px, 64px) rotateZ(70deg); }
}
@keyframes slide-arm-left-lower {
    0% { transform: rotateZ(-30deg); }
    12.5% { transform: rotateZ(-55deg); }
    25% { transform: rotateZ(-65deg); }
    37.5% { transform: rotateZ(-70deg); }
    50% { transform: rotateZ(-90deg); }
    62.5% { transform: rotateZ(-85deg); }
    75% { transform: rotateZ(-60deg); }
    87.5% { transform: rotateZ(-45deg); }
    100% { transform: rotateZ(-30deg); }
}
@keyframes slide-arm-right-upper {
    0% { transform: translate(96px, 64px) rotateZ(-30deg); }
    12.5% { transform: translate(96px, 64px) rotateZ(-15deg); }
    25% { transform: translate(96px, 64px) rotateZ(0deg); }
    37.5% { transform: translate(96px, 64px) rotateZ(25deg); }
    50% { transform: translate(96px, 64px) rotateZ(65deg); }
    62.5% { transform: translate(96px, 64px) rotateZ(50deg); }
    75% { transform: translate(96px, 64px) rotateZ(20deg); }
    87.5% { transform: translate(96px, 64px) rotateZ(5deg); }
    100% { transform: translate(96px, 64px) rotateZ(-30deg); }
}
@keyframes slide-arm-right-lower {
    0% { transform: rotateZ(-90deg); }
    12.5% { transform: rotateZ(-75deg); }
    25% { transform: rotateZ(-65deg); }
    37.5% { transform: rotateZ(-60deg); }
    50% { transform: rotateZ(-45deg); }
    62.5% { transform: rotateZ(-40deg); }
    75% { transform: rotateZ(-50deg); }
    87.5% { transform: rotateZ(-80deg); }
    100% { transform: rotateZ(-90deg); }
}
@keyframes slide-bush {
	0% { left: 100%; }
    25% { left: 65%; }
    50% { left: 30%; }
    75% { left: -5%; }
    100% { left: -40%; }
}
@keyframes slide-head {
	0% { transform: translate(8px, 2px); }
	25% { transform: translate(8px, 6px); }
	50% { transform: translate(8px, 2px); }
	75% { transform: translate(8px, 6px); }
	100% { transform: translate(8px, 2px); }
}
@keyframes slide-leg-left-upper {
    0% { transform: translate(78px, 192px) rotateZ(35deg); }
    12.5% { transform: translate(78px, 192px) rotateZ(15deg); }
    25% { transform: translate(78px, 192px) rotateZ(-25deg); }
    37.5% { transform: translate(78px, 192px) rotateZ(-40deg); }
    50% { transform: translate(78px, 192px) rotateZ(-45deg); }
    62.5% { transform: translate(78px, 192px) rotateZ(-35deg); }
    75% { transform: translate(78px, 192px) rotateZ(-10deg); }
    87.5% { transform: translate(78px, 192px) rotateZ(5deg); }
    100% { transform: translate(78px, 192px) rotateZ(35deg); }
}
@keyframes slide-leg-left-lower {
    0% { transform: rotateZ(50deg) }
    12.5% { transform: rotateZ(75deg); }
    25% { transform: rotateZ(100deg); }
    37.5% { transform: rotateZ(60deg); }
    50% { transform: rotateZ(15deg); }
    62.5% { transform: rotateZ(50deg); }
    75% { transform: rotateZ(25deg); }
    87.5% { transform: rotateZ(35deg); }
    100% { transform: rotateZ(50deg) }
}
@keyframes slide-leg-right-upper {
    0% { transform: translate(78px, 192px) rotateZ(-40deg); }
    12.5% { transform: translate(78px, 192px) rotateZ(-25deg); }
    25% { transform: translate(78px, 192px) rotateZ(-10deg); }
    37.5% { transform: translate(78px, 192px) rotateZ(5deg); }
    50% { transform: translate(78px, 192px) rotateZ(20deg); }
    62.5% { transform: translate(78px, 192px) rotateZ(-5deg); }
    75% { transform: translate(78px, 192px) rotateZ(-30deg); }
    87.5% { transform: translate(78px, 192px) rotateZ(-35deg); }
    100% { transform: translate(78px, 192px) rotateZ(-40deg); }
}
@keyframes slide-leg-right-lower {
    0% { transform: rotateZ(5deg); }
    12.5% { transform: rotateZ(40deg); }
    25% { transform: rotateZ(40deg); }
    37.5% { transform: rotateZ(25deg); }
    50% { transform: rotateZ(60deg); }
    62.5% { transform: rotateZ(100deg); }
    75% { transform: rotateZ(90deg); }
    87.5% { transform: rotateZ(45deg); }
    100% { transform: rotateZ(5deg); }
}

h1 {
	text-align: center;
	margin-bottom: 16px;
}
p {
	text-align: center;
}

.bush-path {
	width: 100%;
	height: 0;
}
.bush {
	position: relative;
	top: 96px;
	left: 0;
	animation: slide-bush 2s linear 0s infinite;
	z-index: 3;
}
.limb {
    position: absolute;
    display: inline-block;
    transform-origin: 0 0;
	z-index: 5;
}
    .limb.arm-left-upper {
		top: 16px;
        animation: slide-arm-left-upper 2s linear 0s infinite;
    }
    .limb.arm-left-lower {
        position: relative;
        top: 64px;
        animation: slide-arm-left-lower 2s linear 0s infinite;
    }

    .limb.arm-right-upper {
		top: 16px;
        animation: slide-arm-right-upper 2s linear 0s infinite;
    }
    .limb.arm-right-lower {
        position: relative;
        top: 64px;
        animation: slide-arm-right-lower 2s linear 0s infinite;
    }

    .limb.back {
        transform: translate(96px, 64px) rotateZ(8deg) scaleY(2);
    }
	
	.limb.head {
		position: relative;
		left: 124px;
		animation: slide-head 2s linear 0s infinite;
		z-index: 10;
	}

    .limb.leg-left-upper {
        animation: slide-leg-left-upper 2s linear 0s infinite;
    }
    .limb.leg-left-lower {
        position: relative;
        top: 64px;
		transform-origin: 8px 0px;
        animation: slide-leg-left-lower 2s linear 0s infinite;
    }

    .limb.leg-right-upper {
        animation: slide-leg-right-upper 2s linear 0s infinite;
    }
    .limb.leg-right-lower {
        position: relative;
        top: 64px;
		transform-origin: 8px 0px;
        animation: slide-leg-right-lower 2s linear 0s infinite;
    }

#sky {
	position: relative;
	top: -68px;
	width: 100%;
    height: 226px;
	background-color: skyblue;
	z-index: 2;
}
#world {
    width: 100%;
    height: 100%;
	max-width: 640px;
	max-height: 480px;
    background-color: #526e2a;
	margin: 0 auto;
	overflow: hidden;
}

