
* { margin: 0; padding: 0; font: 14px 'Verdana', 'Microsoft Yahei', 'Simsun'; }

html, body { overflow: hidden; width: 100%; height: 100%; }


#scene { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; width: 100%; height: auto; }
	#scene > div { overflow: hidden; float: left; width: 100%; height: auto; }
	#scene > div:first-child { height: 100%; }
		#scene > div > div { overflow: hidden; display: table; width: 100%; height: 100%; }
			#scene > div > div > div { overflow: hidden; display: table-cell; text-align: center; vertical-align: middle; width: 100%; height: 100%; }
	#scene .horizon { }
		#scene .horizon > div { overflow: hidden; margin: 0 auto; text-align: left; width: 450px; height: 475px; background-repeat: no-repeat; }
			#scene .horizon h1 { margin-bottom: 16px; font-size: 26px; font-family: 'Verdana', 'Simhei'; line-height: 30px; height: 30px; }
			#scene .horizon h2 { margin-bottom: 60px; font-family: 'Verdana', 'Simsun'; font-size: 16px; line-height: 24px; }
				#scene .horizon h2 em { font-size: 12px; font-family: 'Verdana', 'Simsun'; color: #ccc; }
	#scene .vertical { }
		#scene .vertical > h1 { margin: 0 auto; font-size: 30px; font-family: 'Simhei'; line-height: 36px; height: 36px; }
			#scene .vertical > h1 sup { font-size: 20px; }
		#scene .vertical > h2 { margin: 30px auto 80px auto; font-size: 18px; font-family: 'Simsun'; line-height: 26px; }


#scene1 { background: #fff /* url('../image/wheel.png') no-repeat bottom */; color: #000; }
	#scene1 h1 { overflow: hidden; display: inline-block; margin: 0 auto; padding-left: 100px; height: 80px; background: url('../image/logo.png') no-repeat left; }
		#scene1 h1 > span { display: inline-block; float: left; line-height: 80px; height: 80px; }
		#scene1 h1 > span:first-child { font-size: 50px; font-family: 'Simhei'; }
		#scene1 h1 > span:nth-child(2) { margin-left: 50px; font-size: 30px; font-family: 'Verdana', 'Simsun'; color: #555; }
	#scene1 h2 { margin: 30px auto 80px auto; }
		#scene1 h2 span, #scene1 h2 em { color: #333; line-height: 30px; height: 30px; }
		#scene1 h2 span { font-size: 16px; }
		#scene1 h2 em { margin: 0 6px; font-size: 18px; color: #f00; }
		#scene1 h2 a { display: inline-block; padding: 5px 20px; line-height: 28px; text-decoration: none; height: 28px; border-width: 1px; border-style: solid; border-radius: 5px; }
			#scene1 h2 a.start { margin-left: 100px; background: #337ab7; border-color: #2e6da4; color: #fff; }
			#scene1 h2 a.start:hover { background: #286090; border-color: #204d74; }
			#scene1 h2 a.start:active { background: #204D74; border-color: #122B18; }
			#scene1 h2 a.document { margin-left: 20px; background: #fff; border-color: #ccc; color: #aaa; }
			#scene1 h2 a.document:hover { background: #fff; border-color: #aaa; color: #888; }
			#scene1 h2 a.document:active { background: #fefefe; border-color: #888; color: #555; }

#scene2 { background: #3498db; color: #fff; }
	#scene2 > div { padding-right: 550px; background-image: url('../image/scene2.png'); background-position: right; }

#scene3 { background: #37bc9b; color: #fff; }
	#scene3 ul { margin: 15px; }
		#scene3 ul li { font-size: 18px; line-height: 30px; height: 30px; list-style: none; }
	#scene3 div { }
		#scene3 div h3 { padding: 15px; font-size: 24px; font-family: 'Arial'; background: #fff; color: #37bc9b; }
	#scene3 > div { overflow: hidden; margin: 0 auto; width: 720px; height: 280px; }
		#scene3 > div > div { text-align: left; width: 300px; height: 270px; border: 5px solid #fff; border-radius: 10px; }
		#scene3 > div > div:first-child { float: left; }
		#scene3 > div > div:nth-child(2) { float: right; }

#scene4 { background: #3bafda; color: #fff; }
	#scene4 > div { padding-left: 550px; background-image: url('../image/scene4.png'); background-position: left; }

#scene5 { background: #d9534f; color: #fff; }
	#scene5 table { margin: 0 auto; border: 5px solid #fff; border-radius: 10px; border-spacing: 0; }
		#scene5 table td { padding: 20px; line-height: 24px; }
		#scene5 table td:first-child, #scene5 table td:last-child { background: #fff; color: #d9534f; }
		#scene5 table td:first-child { padding: 15px 25px; font-size: 18px; }

#scene6 { background: #dbbf56; color: #000; }
	#scene6 h1 { color: #fff; }
	#scene6 h3 { margin: 30px; font-size: 12px; text-align: left; line-height: 20px; height: 155px; }
		#scene6 h3 * { font-size: 12px; }
		#scene6 h3 del { color: #aaa; }
	#scene6 h4 { padding: 25px 0 20px 60px; line-height: 18px; background-color: #ddd; background-repeat: no-repeat; background-position: 20px center; color: #999; }
	#scene6 > div { overflow: hidden; margin: 80px auto 0 auto; width: 1200px; }
		#scene6 > div > div:nth-child(1) h4 { background-image: url('../image/scene6-avatar-1.jpg'); }
		#scene6 > div > div:nth-child(2) h4 { background-image: url('../image/scene6-avatar-2.jpg'); }
		#scene6 > div > div:nth-child(3) h4 { background-image: url('../image/scene6-avatar-3.jpg'); }
		#scene6 > div > div:nth-child(4) h4 { background-image: url('../image/scene6-avatar-4.jpg'); }
		#scene6 > div > div { overflow: hidden; float: left; margin: 0 10px; width: 280px; height: 305px; background: #f9f9f9; border-radius: 10px; }

#scene7 { background: #fff; color: #000; }
	#scene7 h1 { font-size: 36px; font-family: 'Simhei'; line-height: 50px; }
	#scene7 h2 { margin-top: 50px; font-size: 16px; color: #777; }
		#scene7 h2 a { font-size: 16px; text-decoration: none; color: #777; }
		#scene7 h2 a:hover { color: #222; }

