div#bgGradient { pointer-events: none; animation: fadeIn 0.5s; -webkit-animation: fadeIn 0.5s; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; }
div.bgStars { pointer-events: none; opacity: 0; z-index: -2; }
div.bgStars_t { pointer-events: none; animation: fadeIn 0.5s; -webkit-animation: fadeIn 0.5s; mask: url(#stars); -webkit-mask-image: -webkit-gradient(linear,left top,left 75%,from(rgba(0,0,0,1)),to(rgba(0,0,0,0))); position: fixed; top: 0; left: -100%; width: 300%; height: 50%; z-index: -1; }
div.bgStars_u { pointer-events: none; animation: fadeInHalf 0.5s; -webkit-animation: fadeInHalf 0.5s; mask: url(#stars_u); -webkit-mask-image: -webkit-gradient(linear,left bottom,left 40%,from(rgba(0,0,0,1)),to(rgba(0,0,0,0))); position: fixed; bottom: 0; left: -100%; width: 300%; height: 75%; opacity: 0.5; transform: scale(1,0.5); transform-origin: bottom center; z-index: -1; }
div#bgScroll { pointer-events: none; animation: fadeIn 0.5s; -webkit-animation: fadeIn 0.5s; width: 100%; height: 50%; position: fixed; left: 0; top: 0; }
div#bgScroll_u { pointer-events: none; animation: fadeInHalf 0.5s; -webkit-animation: fadeInHalf 0.5s; width: 100%; height: 50%; position: fixed; left: 0; bottom: 0; opacity: 0.5; }

div#bgLogo { pointer-events: none; background: url('../img/logo.png') 0 0 no-repeat transparent; z-index: 0; animation: fadeInHalf 0.5s; -webkit-animation: fadeInHalf 0.5s; width: 200; height: 72px; position: fixed; left: 0; top: 18px; opacity: 0.5; }
div#bgFloor { pointer-events: none; background: url('../img/floor.png') 0 bottom repeat-x transparent; z-index: 0; animation: fadeIn 0.5s; -webkit-animation: fadeIn 0.5s; width: 300%; height: 48px; position: fixed; left: -100%; bottom: 0; }
div#bgScenery1 { pointer-events: none; background: url('../img/scenery.png') 0 bottom repeat-x transparent; z-index: 0; animation: fadeIn 0.5s; -webkit-animation: fadeIn 0.5s; width: 300%; height: 64px; position: fixed; left: -100%; bottom: 48px; }
div#bgScenery2 { pointer-events: none; background: url('../img/scenery.png') 0 bottom repeat-x transparent; z-index: 0; animation: fadeInHalf 0.5s; -webkit-animation: fadeInHalf 0.5s; width: 300%; height: 64px; position: fixed; left: -100%; bottom: 48px; opacity: 0.5; }
div#bgCharacter { pointer-events: none; z-index: 1; animation: fadeIn 0.5s; -webkit-animation: fadeIn 0.5s; width: 36px; height: 36px; position: fixed; left: 16px; bottom: 48px; }
div#bgCharacter > div { pointer-events: none; position: absolute; top: 5px; left: 0; }
div#bgCharacterEyes { pointer-events: none; background: url('../img/hapisan_eyes.png') 0 0 no-repeat transparent; width: 100%; height: 100%; }
div#bgCharacterEyesBlink { pointer-events: none; background: url('../img/hapisan_eyes_blink.png') 0 0 no-repeat transparent; width: 100%; height: 100%; display: none; }
div#bgCharacterBody { pointer-events: none; background: url('../img/hapisan_ball.png') 0 0 no-repeat transparent; width: 100%; height: 100%; }

div#bgStars1 > div { background: url('../img/stars1.png'); }
div#bgStars2 > div { background: url('../img/stars2.png'); }
div#bgStars3 > div { background: url('../img/stars3.png'); }
div#bgStars4 > div { background: url('../img/stars4.png'); }
div#bgStars5 > div { background: url('../img/stars5.png'); }

div.bgScroll { position: fixed; top: 0; left: -100%; width: 300%; height: 50%; }
div.bgScroll_u { position: fixed; bottom: 0; left: -100%; width: 300%; height: 50%; }
div.bgHills1 { background: url('../img/hills1.png') 0 bottom repeat-x transparent; }
div.bgHills1_u { background: url('../img/hills1u.png') 0 top repeat-x transparent; }
div.bgHills2 { background: url('../img/hills2.png') 0 bottom repeat-x transparent; }
div.bgHills2_u { background: url('../img/hills2u.png') 0 top repeat-x transparent; }
div.bgHills3 { background: url('../img/hills3.png') 0 bottom repeat-x transparent; }
div.bgHills3_u { background: url('../img/hills3u.png') 0 top repeat-x transparent; }
div.bgHills4 { background: url('../img/hills4.png') 0 bottom repeat-x transparent; }
div.bgHills4_u { background: url('../img/hills4u.png') 0 top repeat-x transparent; }
div.bgHills5 { background: url('../img/hills5.png') 0 bottom repeat-x transparent; }
div.bgHills5_u { background: url('../img/hills5u.png') 0 top repeat-x transparent; }
div.bgHills6 { background: url('../img/hills6.png') 0 bottom repeat-x transparent; }
div.bgHills6_u { background: url('../img/hills6u.png') 0 top repeat-x transparent; }
div.bgHills7 { background: url('../img/hills7.png') 0 bottom repeat-x transparent; }
div.bgHills7_u { background: url('../img/hills7u.png') 0 top repeat-x transparent; }
div.bgHills8 { background: url('../img/hills8.png') 0 bottom repeat-x transparent; }
div.bgHills8_u { background: url('../img/hills8u.png') 0 top repeat-x transparent; }
div.bgClouds1 { background: url('../img/clouds1.png') 0 bottom repeat-x transparent; }
div.bgClouds1_u { background: url('../img/clouds1u.png') 0 top repeat-x transparent; }
div.bgClouds2 { background: url('../img/clouds2.png') 0 bottom repeat-x transparent; }
div.bgClouds2_u { background: url('../img/clouds2u.png') 0 top repeat-x transparent; }
div.bgClouds3 { background: url('../img/clouds3.png') 0 bottom repeat-x transparent; }
div.bgClouds3_u { background: url('../img/clouds3u.png') 0 top repeat-x transparent; }
div.bgClouds4 { background: url('../img/clouds4.png') 0 bottom repeat-x transparent; }
div.bgClouds4_u { background: url('../img/clouds4u.png') 0 top repeat-x transparent; }
div.bgClouds5 { background: url('../img/clouds5.png') 0 bottom repeat-x transparent; }
div.bgClouds5_u { background: url('../img/clouds5u.png') 0 top repeat-x transparent; }
div.bgClouds6 { background: url('../img/clouds6.png') 0 bottom repeat-x transparent; }
div.bgClouds6_u { background: url('../img/clouds6u.png') 0 top repeat-x transparent; }
div.bgClouds7 { background: url('../img/clouds7.png') 0 bottom repeat-x transparent; }
div.bgClouds7_u { background: url('../img/clouds7u.png') 0 top repeat-x transparent; }
div.bgClouds8 { background: url('../img/clouds8.png') 0 bottom repeat-x transparent; }
div.bgClouds8_u { background: url('../img/clouds8u.png') 0 top repeat-x transparent; }