main > section {
	width: 5000px;
}

#truck {
    bottom: 40px;
    width: 600px;
    height: 314px;
}

#truck > img#bubble01 {
	left: 81%;
    width: 300px;
    top: -138px;
}

#truck > img#bubble02 {
	width: 280px;
    left: 81%;
    top: -126px;
}

div.title {
    width: 15%;
    left: 30px;
    bottom: 527px;
    max-width: 500px;
}

#building {
    left: 24.26%;
    bottom: 180px;
	width: 1864px;
}

#people01 {
    left: 12.9%;
    bottom: 160px;
    width: 405px
}

#people02 {
    left: 22%;
    bottom: 156px;
    width: 207px;
}

#people03 {
    left: 66.34%;
    bottom: 175px;
	width: 566px;
}

#people04 {
    left: 79%;
    width: 270px;
    bottom: 130px;
}

#people05 {
    left: 86%;
    width: 203px;
    bottom: 130px;
}

#people06 {
    left: 30.2%;
    bottom: 124px;
    width: 338px;
}

#twinkle {
	width: 48px;
    left: 23%;
    bottom: 275px;
}

img.image01 {
	left: 14%;
    bottom: 590px;
	width: 325px;
}

img.image01.showText {
	bottom: 540px;
}

img.image02 {
	bottom: 10px;
    left: 17%;
    width: 125px;
}

img.bin {
	bottom: -20px;
    left: 26.5%;
    width: 346px;
}

img.image03 {
	bottom: 14px;
    left: 26.7%;
    width: 326px;
}

img.image04, div.image04 {
	left: 40%;
    width: 300px;
	height: 50px;
	bottom: 475px;
}

img.image04.showText, div.image04.showText {
	bottom: 425px;
}

img.image05, div.image05 {
	bottom: -5px;
    left: 39.5%;
    width: 300px;
	height: 222px;
}

div.image05 > img:nth-of-type(2) {
	width: 88%;
	left: 6%;
	top: 57px;
}

div.image05 > img.dot {
	left: 7%;
    top: 66px;
}

img.image06 {
	left: 52%;
    width: 250px;
	bottom: 0;
}

img.image07, div.image07 {
	left: 64%;
    width: 7%;
	bottom: 650px;
}

img.image07.showText, div.image07.showText {
    bottom: 600px;
}

img.image08 {
	left: 65.6%;
    bottom: 415px;
	width: 250px;
}

img.image08.showText {
	bottom: 365px;
}

img.image10 {
	bottom: -100%;
    left: 69%;
    width: 300px;
}

img.image10.showText {
	bottom: -90px;
}

img.image11 {
	left: 82.6%;
    width: 5%;
	bottom: 252px;
}

#trigger14 {
	left: 70%;
    bottom: 303px;
    width: 250px;
    height: 118px;
}

#trigger15 {
	left: 93%;
    height: 402px;
    bottom: 120px;
    width: 275px;
}

#trigger16 {
	left: 81.7%;
    height: 421px;
    bottom: 179px;
    width: 350px;
}

@media screen and (max-width: 800px) {
	#truck > img#bubble02 {
		width: 280px;
		left: 63%;
		top: -171px;
	}
}

@media screen and (max-width: 480px) {
	#truck {
		width: 600px;
    	height: 314px;
		-webkit-transform: translateX(-70%);
		        transform: translateX(-70%);
	}
	
	#truck.alternate {
		display: block;
	}
	
	#truck.original {
		display: none;
	}
	
	#truck.enter {
    	-webkit-transform: translateX(-86%);
    	        transform: translateX(-86%);
	}
	
	#truck > img#wheel, #truck > img.wheel {
		bottom: 5.6%;
	}
	
	#truck > img#wheel2, #truck > img.wheel2 {
		bottom: 5.6%;
	}
	
	#truck > img#bubble01 {
		left: 81%;
		width: 200px;
		top: -96px;
	}
	
	#truck > img#bubble02 {
		width: 197px;
		left: 79%;
		top: -100px;
	}
	
	div.title {
		left: 20px;
		top: 20px;
		width: 340px;
	}
	
	img.image07.showText {
		bottom: 620px;
	}
	
	div#trigger15.showText > a img {
		-webkit-transform: scale(1.9) translate(17%,0%);
		transform: scale(1.9) translate(17%,0%);
	}
}

@media screen and (max-height: 800px) {
	img.image04.showText {
    	bottom: 440px;
	}
	
	div#trigger15.showText > a img {
		-webkit-transform: scale(2) translate(17%,-8%);
		transform: scale(2) translate(17%,-8%);
	}
}

@media screen and (max-width: 480px) and (max-height: 800px) {
	div.text:nth-of-type(2) {
		left: 92%;
	}
}

@media screen and (max-height: 480px) {
	main > section {
		width: 2300px;
	}
	
	#truck {
		width: 340px;
		height: 178px;
		bottom: 20px;
	}
	
	#truck > img#bubble01 {
		left: 81%;
		width: 181px;
    	top: -83px;
	}
	
	#truck > img#bubble02 {
		width: 197px;
		left: 79%;
		top: -100px;
	}
	
	div.title {
		left: 10px;
		bottom: 280px;
		max-width: 250px;
	}
	
	#building {
		bottom: 80px;
		width: 864px;
	}
	
	#people01 {
		bottom: 82px;
		width: 180px;
	}
	
	#people02 {
		bottom: 70px;
		width: 92px;
	}
	
	#people03 {
		bottom: 82px;
		width: 260px;
	}
	
	#people04 {
		bottom: 60px;
		width: 120px;
	}
	
	#people05 {
		bottom: 58px;
		width: 90px;
	}
	
	#people06 {
		bottom: 58px;
		width: 150px;
	}
	
	img.bin {
		width: 175px;
	}
	
	#twinkle {
    	left: 22.2%;
		bottom: 107px;
	}
	
	img.image01 {
		bottom: 310px;
    	width: 180px;
	}
	
	img.image01.showText {
		bottom: 260px;
	}
	
	img.image02 {
    	bottom: 4px;
		width: 60px;
	}
	
	img.image03 {
    	bottom: 8px;
		width: 165px;
	}
	
	img.image04, div.image04 {
		width: 140px;
		height: 23px;
		bottom: 237px;
	}
	
	img.image04.showText, div.image04.showText {
		bottom: 197px;
	}
	
	img.image05, div.image05 {
		width: 160px;
		height: 119px;
	}
	
	div.image05 > img:nth-of-type(2) {
		top: 31px;
	}
	
	div.image05 > img.dot {
		top: 37px;
	}
	
	img.image06 {
    	width: 140px;
	}
	
	img.image07.showText, div.image07.showText {
		bottom: 270px;
	}
	
	img.image08 {
		left: 65.2%;
		width: 138px;
		bottom: 220px;
	}
	
	img.image08.showText {
		bottom: 170px;
	}
	
	img.image10 {
		width: 160px;
	}
	
	img.image10.showText {
		bottom: -70px;
	}
	
	img.image11 {
		bottom: 112px;
	}
	
	#trigger14 {
		bottom: 136px;
		width: 114px;
		height: 58px;
	}
	
	#trigger14 > img:nth-of-type(2) {
    	bottom: 23px;
	}
	
	#trigger15 {
    	height: 204px;
		width: 140px;
		left: 92.2%;
		bottom: 50px;
	}
	
	div#trigger15::after {
    	bottom: 60px;
	}
	
	#trigger16 {
		height: 193px;
		bottom: 78px;
		width: 160px;
	}
}

@media screen and (max-height: 380px) {
	div.title {
		bottom: 227px;
		max-width: 220px;
	}
	
	#truck > img#bubble01 {
		left: 88%;
		width: 140px;
		top: -26px;
	}
	
	#truck > img#bubble02 {
		width: 180px;
		left: 78%;
		top: -100px;
	}
	
	img.image01.showText {
		bottom: 250px;
	}
	
	div#trigger15.showText > a img {
		-webkit-transform: scale(2) translate(17%,0%);
		transform: scale(2) translate(17%,0%);
	}
	/*main > section {
		width: 2300px;
	}
	
	#truck {
		width: 300px;
    	height: 157px;
	}
	
	div.title {
		left: 10px;
		top: 10px;
		max-width: 250px;
	}
	
	#building {
		bottom: 80px;
	}
	
	#people01 {
		bottom: 82px;
	}
	
	#people02 {
		bottom: 70px;
	}
	
	#people03 {
		bottom: 82px;
	}
	
	#people04 {
		bottom: 60px;
	}
	
	#people05 {
		bottom: 58px;
	}
	
	#people06 {
		bottom: 58px;
	}
	
	img.image01.showText {
		bottom: 77%;
    	left: 14%;
	}
	
	img.image02 {
    	bottom: 4px;
	}
	
	img.image04.showText {
		bottom: 200px;
	}
	
	img.image07.showText {
		bottom: 270px;
	}
	
	img.image08.showText {
		bottom: 173px;
	}
	
	img.image11 {
		bottom: 112px;
	}
	
	div#trigger15.showText > a img {
    	-webkit-transform: scale(2) translate(17%,-10%);
    	        transform: scale(2) translate(17%,-10%);
	}*/
}

@media screen and (max-width: 395px) {
	img.image01.showText {
		bottom: 530px;
	}
	
	div.image07.showText {
		bottom: 580px;
	}
	
	#trigger15 {
		left: 93.5%;
	}
	
	div#trigger15.showText > a img {
		-webkit-transform: scale(1.9) translate(17%,10%);
		transform: scale(1.9) translate(17%,10%);
	}
}

@media screen and (max-width: 320px) {
	main > section {
		width: 3500px;
	}
	
	#truck {
		width: 500px;
   		height: 262px;
		-webkit-transform: translateX(-70%);
		        transform: translateX(-70%);
	}
	
	#truck.enter {
		-webkit-transform: translateX(-90%);
		        transform: translateX(-90%);
	}
	
	div.title {
		width: 280px;
	}
	
	#building {
		bottom: 130px;
		width: 1296px;
	}
	
	#people01 {
		bottom: 132px;
		width: 270px;
	}
	
	#people02 {
		bottom: 120px;
		width: 138px;
	}
	
	#people03 {
		bottom: 132px;
		width: 390px;
	}
	
	#people04 {
		bottom: 110px;
		width: 180px;
	}
	
	#people05 {
		bottom: 108px;
		width: 135px;
	}
	
	#people06 {
		bottom: 108px;
		width: 225px;
	}
	
	#twinkle {
		left: 22.6%;
		bottom: 191px;
	}
	
	img.bin {
		width: 231px;
	}
	
	img.image01 {
		width: 225px;
		bottom: 450px;
	}
	
	img.image01.showText {
		bottom: 400px;
	}
	
	img.image02 {
    	bottom: 4px;
		width: 82px;
	}
	
	img.image03 {
		bottom: 7px;
		width: 215px;
	}
	
	img.image04, div.image04 {
		width: 200px;
		height: 33px;
		bottom: 356px;
	}
	
	img.image04.showText, div.image04.showText {
		bottom: 306px;
	}
	
	img.image05, div.image05 {
		width: 220px;
		height: 163px;
	}
	
	div.image05 > img:nth-of-type(2) {
		top: 45px;
	}
	
	div.image05 > img.dot {
		top: 53px;
	}
	
	img.image06 {
		width: 180px;
	}
	
	div.image07.showText {
		bottom: 440px;
	}
	
	img.image08 {
		bottom: 320px;
		width: 170px;
	}
	
	img.image08.showText {
		bottom: 270px;
	}
	
	img.image10 {
    	width: 200px;
	}
	
	img.image11 {
		bottom: 168px;
	}
	
	#trigger14 {
		height: 87px;
		bottom: 218px;
		width: 166px;
	}
	
	#trigger14 > img:nth-of-type(2) {
    	bottom: 28px;
	}
	
	#trigger15 {
    	height: 292px;
		width: 200px;
		left: 93%;
	}
	
	div#trigger15::after {
    	bottom: 86px;
	}
	
	#trigger16 {
		height: 278px;
		bottom: 147px;
		width: 230px;
	}
}

@media screen and (min-height: 860px) and (min-width: 1440px) {
	div.title {
		left: 40px;
		bottom: 627px;
	}
}