body { background-size: 100%;background-repeat: no-repeat;} body, html { width: 1024px !important;height: 710px !important;margin: 0;padding: 0;} *{ box-sizing: border-box;} body { display: block;} 
.magnify { 
			width: 1024px;
			height: 710px;  
			position: absolute; 
			top: 0px; 
			left: 0px; 
			display: none;
	} /* Let's create the magnifying glass */ 
.large { 
			display: none;
			width: 157px;
			height: 127px;
			position: absolute
;			/*-webkit-border-radius: 100%;
			-moz-border-radius: 100%;
			border-radius: 100%;*/
			top:388px;
			left: 72px;
	   }
#main { 
	width: 1024px;
	height: 710px;
	overflow: hidden;
	position: absolute;
	top:0px;left: 0px;} .bg-img { position: absolute;   top: 0;    left: 0;} 
.exit 
{	position: absolute;	background-image: url('../images/goble/close.png');	width: 34px;height: 34px;cursor: pointer;top: 8px;left: 255px;background-size: 34px 34px;background-repeat: no-repeat;} .iTap { position: absolute; width: 36px; height: 36px; z-index: 10; cursor: pointer; background-image: url('../images/goble/i-icon.png'); background-repeat: no-repeat;}
	 .next { 
	 	position: absolute;
	 	width: 27px; 
	 	height: 48px; 
	 	top: 330px;
    	left: 985px;
	 	z-index: 1; 
	 	cursor: pointer;
	 } 
	 .pervious { 
	 	position: absolute;
	    width: 27px;
	    height: 47px;
	    top: 330px;
	    left: 12px;
	    z-index: 1;
    	cursor: pointer
	 } 
	.toc {   position: absolute; 
			 width:36px; 
			 height:36px;
			 /*background-color: #000000; 
			 border-radius: 5px 0px 0px 5px; */
			 top: 12px;  
			 left: 954px; 
			 z-index: 1;
		  } 
	.reload { top: 610px;left: 30px; width: 77px; overflow: hidden; position: absolute;  z-index: 10; cursor: pointer;} #pageno { position: absolute; z-index: 1; top: 656px; left: 981px;font-family: 'LucidaSans-Regular';} .video-icon { z-index: 6; background-image: url('../images/goble/video.png');background-repeat: no-repeat;background-size: 46px;width: 45px; height: 46px; position: absolute; cursor: pointer;}
	 /* audio icon */
	  .audio{ 
	  	position: absolute;	
	  	width: 36px;
	  	height: 35px;
	  	background-image: url(../images/goble/audio_icon.png);	
	  	background-repeat: no-repeat;
	  	background-size: 35px 35px;
	  	z-index: 1;	
	  	cursor: pointer;
	  	top: 19px;
    	left: 16px;
	  }
	  	.audioOn{
		  	 position: absolute;
		  	 width: 36px;
	  		 height: 35px; 
		  	 background-image: url(../images/goble/audio_icon_on.png); 
		  	 background-repeat: no-repeat;  	
		  	 background-size: 36px 35px;  	
		  	 z-index: 1001; 	
		  	 cursor: default;
	  	 } 
	  	 /* voc word */
	  	  .txtW{ cursor: pointer; font-weight: bold; color:#0098cc; -webkit-font-smoothing: antialiased;} /* body Text */ .bodyText{ height: 615px; left: 595px; top: 32px; width: 380px; overflow-y: scroll; overflow-x:hidden;color: black; font: normal normal 22px/27px 'MinionPro-Regular';text-align: left; z-index: 1; position: absolute;-webkit-font-smoothing: antialiased;} .bodyText::-webkit-scrollbar { -webkit-appearance: none;  } .bodyText::-webkit-scrollbar:vertical {  width: 13px;  } .bodyText::-webkit-scrollbar:horizontal { height: 12px; } .bodyText::-webkit-scrollbar-thumb { border-radius: 5px; background-color: rgba(0, 0, 0, .5); } .insideDiv{	width:317px;} span.title { font-family: 'DIN-RoundOT-Bold';font-size: 24px;line-height:15px;} /* heading color */ .headColor1{ color:rgb(0,111,114); } .headColor2{ color:rgb(217,104,48); } .headColor3{ color: rgb(113,92,66); } .headColor4{ color: rgb(72,78,162); } .popupDiv{ 	width: 397px; height: 167px; display: block; position: absolute; top: 184px; left: 495px; padding: 57px 50px 50px 59px; color: rgb(255, 255, 255); font-size: 16px; font-family: 'LucidaSans-Regular';background-image: url(../images/goble/box.png); background-repeat: no-repeat;z-index: 100000;} .exit-vocb-box{ width: 34px; height: 34px; display: block; position: absolute;top: 21px; left: 343px; cursor: pointer; background-image: url(../images/goble/close.png); background-size: 34px; background-repeat: no-repeat;} .audioDiv{ top: 45px; left: 21px;} /* sroll */ #scroll { top: 33px; left: 367px; position: absolute; opacity: .5; z-index: 1; width: 16px; height: 585px; background-image: url('../images/goble/scroll.png'); background-repeat: no-repeat;} #scroll_small { top: 35px; left: 367px; position: absolute; opacity: .5; z-index: 1; width: 16px; height: 288px; background-image: url('../images/goble/scroll_small.png');background-repeat: no-repeat;} p { margin: 5px 0 12px;} /* caption for images */ #caption, .caption { position: absolute;font-family: 'LucidaSans-DemiboldRoman';font-size: 16px;line-height: 1.25em; width: 334px;-webkit-font-smoothing: antialiased;}

 /* dots slider css */ 
 #slider{ width: 500px; height: 710px; position: absolute;top: 0px;left:0px;} .slider-img{ position: absolute;	top: 0;	} .show{display: block;} .noshow{display: none;} .clickarea{	position: absolute;	cursor: pointer;width: 559px;height: 710px;	top: 0px;left: 0px;} 
 #dot_1{	left: 514px;top: 39px;	z-index: 1;	position: absolute;}
 #dot_2{	left: 514px; top: 63px;	z-index: 1;	position: absolute;} 
 #dot_3{	left: 514px;	top: 93px;	z-index: 1;	position: absolute;} 
 #dot_4{    left: 514px;    top: 119px;    z-index: 1;    position: absolute;}  
 #dot_5{    left: 514px;    top: 119px;    z-index: 1;    position: absolute;} 
 /*.red { background-image:url('../images/goble/red_dot.png'); background-repeat:no-repeat; height:18px; width:18px;} 
 .orange { background-image:url('../images/goble/orange_dot.png');background-repeat:no-repeat;height:18px;width:18px;} 
 .blue { background-image:url('../images/goble/blue_dot.png'); background-repeat:no-repeat; height:21px; width:27px;} 
 .yellow { background-image:url('../images/goble/yellow_dot.png'); background-repeat:no-repeat;	height:18px;width:18px;} 
 .green { background-image:url('../images/goble/Green dot.png'); background-repeat:no-repeat; height:21px; width:27px;}
 .white { background-image:url('../images/goble/white_dot.png'); background-repeat:no-repeat; height:18px; width:18px;}*/