body{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:22px;
	overflow: hidden;
}

#box{
	width:980px;
	height:645px;
	margin:auto;
	position: relative;
}
#big_box{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.des_cell{
	width: 133px;
	height: 27px;
	
}

#questionBox{
	width:602px;
	height:478px;
	position:absolute;
	top:112px;
	left:17px;
	background-image:url(../images/brain.png);
	z-index:0;
}

#dimBox{
	width:980px;
	height:645px;
	position:absolute;
	z-index:21;
	display: none;
}

#dimBox_1{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 17;
	top: 0;
	left: 0;
	display: none;
}

#dimBox_1 img {
	width: 100%;
}

#choose_type {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	z-index: 18;
	opacity: 0;
}

#easy,
#advanced {
	width: 32.1%;
	cursor: pointer;
	height: 120px
}

#easy {
	margin: auto;
	position: absolute;
	top: -33%;
	left: 0;
	right: 0;
	bottom: 0;
	width: 322px;
}

#advanced {
	margin: auto;
	position: absolute;
	top: 29%;
	left: 0;
	right: 0;
	bottom: 0;
	width: 322px;
}

#choose_type img {
	width: 100%;
}

#title_div{
	width: 980px;
	height: 645px;
	position: absolute;
	z-index: 999;
}

#zhishiju {
	width: 900px;
	position: absolute;
	top: 86px;
	left: 61px;
	z-index: 10;
	font-size: 23px;
}

.des_cell_a{
}
.des_cell_b{
}
.des_cell_c{
	
}
.des_cell_d{
}
.des_cell_test{
}

.pic_cell{
	width:50px;
	height:50px;
}

#box #pic_container #p0{
	position:absolute;
	left: 363px;
	top: 231px;
	
}
#box #pic_container #p1{
	position:absolute;
	left: 715px;
	top: 238px;
	
}
#box #pic_container #p2{
	position:absolute;
	left: 363px;
	top: 522px;
	
}
#box #pic_container #p3{
	position:absolute;
	left: 715px;
	top: 513px;
	
}
#box #pic_container #p4{
	position:absolute;
	left: 543px;
	top: 360px;
	
}
#box #pic_container #p5{
	position:absolute;
	left: 698px;
	top: 357px;
	
}
#box #pic_container #p6{
	position:absolute;
	left: 332px;
	top: 540px;
	
}
#box #pic_container #p7{
	position:absolute;
	left: 190px;
	top: 647px;
	
}
#box #pic_container #p8{
	position:absolute;
	left: 335px;
	top: 649px;
	
}
#box #pic_container #p9{
	position:absolute;
	left: 558px;
	top: 651px;
	
}
#box #pic_container #p10{
	position:absolute;
	left: 708px;
	top: 546px;
	
}
#box #pic_container #p11{
	position:absolute;
	left: 707px;
	top: 657px;
	
}

#des_cell_advanced {
	display: none;
}

#d0,
#d11 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}

#d1,
#d13 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d2,
#d15 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d3,
#d17 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d4,
#d19 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d5,
#d21 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d6,
#d23 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d7,
#d25 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d8,
#d27 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}
#d9,
#d29 {
	position: absolute;
	left: 416px;
	top: 392px;
	z-index: 3;
	width: 142px;
	height: 28px;
}

#d11,
#d13,
#d15,
#d17, 
#d19,
#d21,
#d23,
#d25,
#d27,
#d29 {
	left: 819px;
}

#des_container img {
	width: 100%;
}

/* for advanced */
#d10,
#d12,
#d14,
#d16,
#d18,
#d20,
#d22,
#d24,
#d26,
#d28 {
	position: absolute;
	left: 424px;
	top: 383px;
	z-index: 3;
	width: 182px;
	height: 26px;
}

#speechBox{
	
	position:absolute;
	top:135px;
	left:100px;
	z-index:1;
	
}
.sb_0{
	padding:15px 0 0 48px;
	width:360px;
	height:78px;
	
}
.sb_1{
	padding:15px 0 0 47px;
	width:378px;
	height:78px;
	
}
.sb_2{
	padding:15px 0 0 47px;
	width:388px;
	height:78px;
	
}
.sb_3{
	padding:15px 0 0 47px;
	width:367px;
	height:77px;
	
}
.sb_4{
	padding:15px 0 0 48px;
	width:428px;
	height:78px;
	
}

#xianshi_wenzi{
	
	width:200px;
	height:40px;
	text-align:center;
	position:absolute;
	left:695px;
	top:360px;
	font-size:30px;
}

#answer_cover1 {
	position: absolute;
	width: 120px;
	height: 45px;
	top: 58.5%;
	left: 43%;
	z-index: 8;
	display: none;
}

#answer_cover2 {
	position: absolute;
	width: 130px;
	height: 40px;
	top: 64%;
	left: 82%;
	z-index: 8;
	display: none;
}

.btn_1{
	width:51px;
	height:51px;
	position:absolute;
	left:890px;
	top:450px;
	cursor:pointer;
}

.btn_1_dim{
	width:51px;
	height:51px;
	position:absolute;
	left:890px;
	top:450px;
}

.play_btn{
	width: 34px;
	height: 34px;
}
/*.play_btn:hover{
	background:url(../images/btn/v_1_s2.png);
}
.play_btn:active{
	background:url(../images/btn/v_1_s3.png);
}*/

#play_biaoti{
	width: 34px;
	height: 34px;
	position: absolute;
	top: 29px;
	left: 596px;
	cursor: pointer;
}
/*#play_biaoti:hover{
	background:url(../images/btn/v_1_s2.png);
}
#play_biaoti:active{
	background:url(../images/btn/v_1_s3.png);
}*/

#play_question{
	position: absolute;
	top: 80px;
	left: 20px;
	cursor: pointer;
}

#play_tishi{
	position:absolute;
	top:145px;
	left:110px;
	z-index:1;
	cursor:pointer;
}

#play_ans_1{
	position: absolute;
	top: 397px;
	left: 624px;
	cursor: pointer;
}
#play_ans_2{
	position: absolute;
	top: 386px;
	left: 381px;
	cursor: pointer;
	display: none;
}
	
#test{
	width: 1px;
	height: 1px;
	position: absolute;
	left: -39px;
	top: 11px;
}
#cle{
	position:absolute;
	left:210px;
	top:660px;
}

#wenzi_container div{
	width:180px;
	height:35px;
	margin-top:5px;
	z-index:1;
}
.need_wenzi_0{
	position:absolute;
	top:234px;
	left:46px;
}
.need_wenzi_1{
	position:absolute;
	top:226px;
	left:417px;
}
.need_wenzi_2{
	position:absolute;
	top:429px;
	left:44px;
}
.need_wenzi_3{
	position:absolute;
	top:235px;
	left:47px;
}
.need_wenzi_4{
	position:absolute;
	top:426px;
	left:409px;
}

#startBtn {
	width:200px;
	height: 77px;
	position:absolute;
	z-index:1000;
	top: 402px;
	left: 393px;
	cursor:pointer;
}

#check_answers{
	width: 112px;
	height: 48px;
	position: absolute;
	left: 183px;
	top: 575px;
}

.check_answers {
	cursor: pointer;
}

#pic_vo_1{
	position: absolute;
	cursor: pointer;
	z-index: 10;
	left: 17px;
	top: 259px;
}
#pic_vo_2{
	position: absolute;
	cursor: pointer;
	z-index: 11;
	left: 177px;
	top: 259px;
}
#pic_vo_3{
	position: absolute;
	cursor: pointer;
	z-index: 12;
	left: 337px;
	top: 259px;
}
#pic_vo_4{
	position: absolute;
	cursor: pointer;
	z-index: 14;
	left: 497px;
	top: 259px;
}
#pic_vo_5{
	position: absolute;
	cursor: pointer;
	z-index: 15;
	left: 657px;
	top: 259px;
}
#pic_vo_6{
	position: absolute;
	cursor: pointer;
	z-index: 16;
	left: 817px;
	top: 259px;
}

#mamaduihua{
	position: absolute;
	width: 327px;
	height: 121px;
	left: 618px;
	top: 389px;
	background: url(../images/right_down_pao2.png);
	background-repeat: no-repeat;
	background-size: 100%;
}

#des_cell_1{
	position: absolute;
	width: 127px;
	height: 27px;
	left: 49px;
	top: 12px;
	
}

#nverduihua{
	position: absolute;
	width: 227px;
	height: 146px;
	left: 375px;
	top: 372px;
	background: url(../images/right_down_pao1.png);
	background-size: 100%;
	background-repeat: no-repeat;
}

#des_cell_2{
	position: absolute;
	width: 127px;
	height: 27px;
	left: 49px;
	top: 10px;
	
}

#left_btn_q {
	position: absolute;
	top: 522px;
	left: 68px;
	z-index: 4;
	width: 104px;
}

.back_2{
	width:104px;
	height:50px;
}

#right_btn_q{
	position: absolute;
	top: 522px;
	left: 183px;
	z-index: 4;
	width: 104px;
}

.next_2{
	width:104px;
	height:50px;
}

#btn_1{
	position: absolute;
	top: 573px;
	left: 118px;
	z-index: 4;
	width: 51px;
	height: 51px;
}

#box-bg,
#title_div img,
#startBtn img,
#play_biaoti img,
#play_question img,
#left_btn_q img,
#right_btn_q img,
#btn_1 img,
#check_answers img,
#s0 img,
#s1 img,
#s2 img,
#s3 img,
#s4 img {
	width: 100%;
}

#mamaduihua-text span,
#mamaduihua-text img {
	float: left;
}

#mamaduihua-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

#mamaduihua-text {
	position: relative;
	top: 13px;
	width: 85%;
	margin: 0 auto;
	margin-left: 12.7%;
	overflow: hidden;
}

#nverduihua-text {
	position: relative;
	top: 20px;
	left: 32px;
	width: 79%;
	overflow: hidden;
	margin-left: 4%;
}

#nverduihua-text span,
#nverduihua-text img {
	float: left;
}

#s0,
#s1,
#s2,
#s3,
#s4 {
	cursor: pointer;
	text-align: center;
	left: 25.4%;
	position: absolute;
}
#s3,
#s4 {
	left:29%;
}

.des_cell_a {
	display: none;
}

.right_btn_q,
.left_btn_q {
	cursor: pointer;
}

#src_container {
	width: 325px;
	height: 385px;
	position: absolute;
	top: 130px;
	left: 18px;
	background: url(../images/kuan_l.png);
	background-size: 100%;
	background-repeat: no-repeat;
}

#src_container_disabled {
	width: 325px;
	height: 385px;
	position: absolute;
	top: 130px;
	left: 18px;
	z-index: 777;
	display: none;
}

.easy1 {
	top: 29%;
}

.easy2 {
	top: 59%;
}

.hard1 {
	top: 45%;
}

.hard2 {
	top: 63%;
}

.hard3 {
	top: 81%;
}

.hard4 {
	top: 9%;
}

.hard5 {
	top: 26%;
}

#s0,
#s1,
#s2 {
	display: none;
}

.src_cell_wrap,
.src_cell_text {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

#des_cell_easy .src_cell_text {
	left: 0px;
	top: 0;
}

.src_cell_wrap {
	display: ;
}

.item div {
	display: none;
	width: 142px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	cursor: pointer;
	font-size: 20px;
}

#title_img {
	position: absolute;
	top: 32px;
	left: 22px;
}

#question_img {
	position: absolute;
	top: 130px;
	left: 359px;
}

#talk_img {
	position: absolute;
	top: 349px;
	left: 359px;	
} 

.yellow_bg {
	margin: 0;
	padding: 0;
	background-image: url(../images/bt_01.png);
	background-repeat: no-repeat;
	background-size: 100%;
	width: 162px;
	height: 35px;
	line-height: 35px;
	cursor: pointer;
}

.red_bg {
	margin: 0;
	padding: 0;
	background-image: url(../images/bt_02.png);
	background-repeat: no-repeat;
	background-size: 100%;
	width: 142px;
	height: 35px;
	line-height: 35px;
	cursor: pointer;
}

#des_cell_advanced .item div {
	width: 162px;
}

#des_cell_advanced #d11 .item div,
#des_cell_advanced #d13 .item div,
#des_cell_advanced #d15 .item div,
#des_cell_advanced #d17 .item div,
#des_cell_advanced #d19 .item div,
#des_cell_advanced #d21 .item div,
#des_cell_advanced #d23 .item div,
#des_cell_advanced #d25 .item div,
#des_cell_advanced #d27 .item div,
#des_cell_advanced #d29 .item div {
	width: 142px;
}

#des_cell_advanced .src_cell_wrap .src_cell {
	top: -2px;
}

/** debug */
#startBtn,
#title_div,
#choose_type {
	display: ;
}
/** end debug **/

@media all and (max-width:980px){
	#box{
		width: 100%;
		height: 100%;
	}
	
	#title_div {
		width: 100%;
		height: 100%;
	}
	
	#startBtn {
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}
	
	#startBtn img {
		width: 21%;
		position: absolute;
		top: 28%;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
	}
	
	#play_biaoti {
		top: 4.5%;
		left: 22.5%;
	}
	
	#play_biaoti img {
		width: 82%;
	}
	
	#play_question {
		top: 12.8%;
		left: 2%;
	}
	
	#play_question img {
		width: 82%;
	}
	
	#zhishiju {
		width: auto;
		top: 13.2%;
		left: 6.2%;
		font-size: 18px;
	}
	
	#left_btn_q {
		top: 79.7%;
		left: 8%;
		width: 9.6%;
		height: auto;
	}
	
	#right_btn_q {
		top: 79.7%;
		left: 19%;
		width: 9.6%;
		height: auto;
	}
	
	#btn_1 {
		top: 87.7%;
		left: 8%;
		width: 4.5%;
		height: auto;
	}
	
	#check_answers {
		top: 88%;
		left: 14%;
		width: 15%;
		height: auto;
	}
	
	#mamaduihua {
		top: 56.4%;
		left: 42.6%;
		width: 24.6%;
		font-size: 18px;
	}
	
	#nverduihua {
		top: 61.5%;
		left: 72.8%;
		width: 22.5%;
	}
	
	#dimBox {
		width: 100%;
		height: 100%;
	}
	
	#src_container {
		width: 33.2%;
		height: 59.7%;
		top: 20.1%;
		left: 1.8%;
	}
	
	#src_container_disabled {
		width: 33.2%;
		height: 59.7%;
		top: 20.1%;
		left: 1.8%;
	}
	
	#src_container .src_cell {
		width: 43.7%;
		left: 24%;
	}
	
	.src_cell img {
		width: 100%;
	}
		
	#play_ans_1 {
		top: 58%;
		left: 40%;
	}
	
	#play_ans_1 img,
	#play_ans_2 img {
		width: 82%;
	}
	
	#play_ans_2 {
		top: 62.7%;
		left: 69%;
	}

	#nverduihua-text {
		font-size: 18px;
		width: 93%;
		margin-left: 1%;
	}
	
	#des_cell_easy img {
		width: 65%;
		position: relative;
		left: -10%;
	}
	
	#des_cell_advanced img {
		width: 65%;
	}
	
	#nverduihua-text img {
		width: 42%;
		margin-top: 3px;
	}
	
	.src_cell_text {
		font-size: 18px;
	}
	
	#d0,
	#d1,
	#d2,
	#d3,
	#d4,
	#d5,
	#d6,
	#d7,
	#d8,
	#d9,
	#d11,
	#d13,
	#d15,
	#d17,
	#d19,
	#d21,
	#d23,
	#d25,
	#d27,
	#d29 {
		width: 15%;
		left: 83%;
		top: 62.8%;
	}
	
	#d10,
	#d12,
	#d14,
	#d16,
	#d18,
	#d20,
	#d22,
	#d24,
	#d26,
	#d28,
	#d30 {
		width: 10%;
		top: 58.6%;
		left: 43%;
	}
	
	#d10 img,
	#d12 img,
	#d14 img,
	#d16 img,
	#d18 img,
	#d20 img,
	#d22 img,
	#d24 img,
	#d26 img,
	#d28 img,
	#d30 img {
		position: relative;
		left: -9%;
	}
	
	#d11 img,
	#d12 img,
	#d15 img,
	#d17 img,
	#d19 img,
	#d21 img,
	#d23 img,
	#d25 img,
	#d27 img,
	#d29 img {
		position: relative;
		left: -7%;
	}
	
	#title_img {
		width: 18.5%;
		top: 4.7%;
		left: 3%;	
	}	
	
	#title_img img {
		width: 100%;
	}
	
	#question_img {
		top: 20.1%;
		left: 37%;
		width: 61%;
	}
	
	#question_img img {
		width: 100%;
	}
	
	#talk_img {
		top: 53%;
		left: 37%;
		width: 61%;
	}
	
	#talk_img img {
		width: 100%;
	}
	
	.red_bg,
	.yellow_bg {
		font-size: 18px;
	}
	
	.item div {
		width: 120%;
		font-size: 16px;
	}
	
	#des_cell_advanced .item div {
		width: 78px;
	}
	
	#easy, #advanced {
		width: 32.1%;
	}
	
	#mamaduihua-text {
		top: 7%;
	}
	
	#mamaduihua-text img {
		width: 44%;
	}
	
	#des_cell_advanced #d11 .item div, 
	#des_cell_advanced #d13 .item div, 
	#des_cell_advanced #d15 .item div, 
	#des_cell_advanced #d17 .item div, 
	#des_cell_advanced #d19 .item div, 
	#des_cell_advanced #d21 .item div,
	#des_cell_advanced #d23 .item div,
	#des_cell_advanced #d25 .item div,
	#des_cell_advanced #d27 .item div,
	#des_cell_advanced #d29 .item div, {
		width: 144%;
	}
	
	#des_cell_advanced .src_cell_wrap .src_cell {
		/*top: -3px !important;*/
	}
	
	#answer_cover2 {
		left: 79%;
		top: 62.5%;
	}
	
	#answer_cover1 {
		top: 57%;
	}
	
	.item div {
		height: 26px;
		line-height: 26px;
	}
	
	#des_cell_advanced #s0 .item div, 
	#des_cell_advanced #s1 .item div, 
	#des_cell_advanced #s2 .item div {
		width: 108%;
	}
	
	#des_cell_advanced #d11 .item div,
	#des_cell_advanced #d13 .item div,
	#des_cell_advanced #d15 .item div,
	#des_cell_advanced #d17 .item div,
	#des_cell_advanced #d19 .item div,
	#des_cell_advanced #d21 .item div,
	#des_cell_advanced #d23 .item div,
	#des_cell_advanced #d25 .item div,
	#des_cell_advanced #d27 .item div,
	#des_cell_advanced #d29 .item div {
		width: 166%;
	}
}

@media all and (max-width:900px){
	#des_cell_advanced #s3, #des_cell_advanced #s4 {
		top: -6px !important;
	}
}