@font-face  { font-family: Jacoby; src: url('../fonts/Jacoby_ICG_Black.eot'), url('../fonts/Jacoby_ICG_Black.ttf'),  url('../fonts/jacoby_icg_black.otf') }
@font-face  { font-family: Trebuchet MS; src: url('../fonts/TREBUC.eot'), url('../fonts/TREBUC.ttf'),  url('../fonts/TREBUC.otf') }

body,html{
    overflow: none!important;
    background-color:  rgb(204, 204, 204);
}

#page1_inst{
position: absolute;
left:75px;
top:100px;
font-size: 15px;
font-family: Verdana, Geneva, sans-serif;
color: #333333;
font-weight: normal;
font-style: normal;
}
#page2_inst{
		position: absolute;
		top: 18px;
		left: 30px;
		font-family: Trebuchet MS;
		width: 880px;
		font-size: 22px;
		text-align: left;
}
#page1{
		height: 505px;
		left: 0px;
		position: absolute;
		text-align: center;
		top: 0px;
		width: 910px;
			
}
#page2{
		height: 505px;
		left: 0px;
		position: absolute;
		text-align: center;
		top: 0px;
		width: 910px;
		display:none;
}

/*#content
{

    height: 35px;
    left: 50px;
    position: absolute;
    top: 15px;
    width: 840px;
}*/
#arrow_1{
	height: 35px;
    left: 15px;
    position: absolute;
    top: 15px;
    width: 35px;
	
}

#arrow_2{
	height:17px;
    left:32px;
    position: absolute;
    top:67px;
    width:17px;
	
}

#text
{
	font-family: Trebuchet MS;
    font-size: 20px;
    left: 60px;
    position: absolute;
    text-align: left;
    top: 107px;
}


/*images----------------------------*/


#img_1{
	height: 108px;
    left: 30px;
    position: absolute;
    top: 240px;
    width: 75px;
}
#img_2{
	height: 108px;
    left: 115px;
    position: absolute;
    top: 240px;
    width: 92px;
}
#img_3{
	 height: 108px;
    left: 216px;
    position: absolute;
    top: 240px;
    width: 99px;
}
#img_4{
	height: 108px;
    left: 325px;
    position: absolute;
    top: 240px;
    width: 111px;
}
#img_5{
	height: 122px;
    left: 445px;
    position: absolute;
    top: 226px;
    width: 126px;
}
#img_6{
	height: 111px;
    left: 580px;
    position: absolute;
    top: 238px;
    width: 141px;
}
#img_7{
	height: 111px;
    left: 731px;
    position: absolute;
    top: 237px;
    width: 161px;
}


/*forward arrow images----------------------------*/

#fwdarrow_1
{
	 height: 50px;
    left: 400px;
    position: absolute;
    top: 185px;
    width: 73px;
}

#fwdarrow_2
{
	height: 50px;
    left: 535px;
    position: absolute;
    top: 185px;
    width: 73px;
}
#fwdarrow_3
{
	 height: 50px;
    left: 690px;
    position: absolute;
    top: 185px;
    width: 73px;
}


/*backward arrow images----------------------------*/

#bwdarrow_1
{
	height: 56px;
    left: 75px;
    position: absolute;
    top: 355px;
    width: 73px;
}
#bwdarrow_2
{
	height: 56px;
    left: 180px;
    position: absolute;
    top: 355px;
    width: 73px;
}
#bwdarrow_3
{
	 height: 56px;
    left: 285px;
    position: absolute;
    top: 355px;
    width: 73px;
}

/*..............text area design----------------------------*/

#text1 {
	border: none;
    background-color: #f5f2eb;
    font: 26px trebuchet ms;
    height: 33px;
    left: 47px;
    position: absolute;
    text-align: center;
    top: 276px;
    width: 40px;
	z-index: 9999;
}

#text2 {
		border: none;
	    background-color: #f5f2eb;
	z-index: 9999;
    font: 26px trebuchet ms;
    height: 33px;
    left: 134px;
    position: absolute;
    text-align: center;
    top: 276px;
    width: 52px;
}

#text3 {
		border: none;
	z-index: 9999;
    background-color: #f5f2eb;
   font: 26px trebuchet ms;
    height: 33px;
    left: 229px;
    position: absolute;
    text-align: center;
    top: 276px;
    width: 72px;
}
#text4 {
		border: none;
	z-index: 9999;
    background-color: #f5f2eb;
    font: 26px trebuchet ms;
    height: 33px;
    left: 457px;
    position: absolute;
    text-align: center;
    top: 276px;
    width: 100px;
}
#text5 {
		border: none;
	z-index: 9999;
    background-color: #f5f2eb;
    font: 26px trebuchet ms;
    height: 33px;
    left: 590px;
    position: absolute;
    text-align: center;
    top: 275px;
    width: 120px;
}

#text6 {
		border: none;
	z-index: 9999;
    background-color: #f5f2eb;
    font: 26px trebuchet ms;
    height: 33px;
    left: 744px;
    position: absolute;
    text-align: center;
    top: 275px;
    width: 135px;
}

/*animation boxes design----------------------------*/


#box_1
{	display:none;
	background-image: url("../ob/box3.png");
    height: 0px;
    left: 10px;
    position: absolute;
    top:430px;
    width: 0px;
	z-index:10;
}
#box_2
{	display:none;
	background-image: url("../ob/box4.png");
    height: 121px;
    left: 10px;
    position: absolute;
    top:430px;
    width: 758px;
	z-index:10;
}
#close_1
{	
	cursor:pointer;
	 background-image: url("../ob/btn1.png");
    height: 24px;
    left: 690px;
    position: absolute;
    top: 77px;
    width: 56px;
	z-index:10;
}
#box_3
{	
	display:none;
	background-image: url("../ob/box1.png");
    height:415px;
    left: 10px;
    position: absolute;
    top:135px;
    width: 758px;
	z-index:10;
}
#box_4
{	display:none;
	background-image: url("../ob/box2.png");
    height:415px;
    left: 10px;
    position: absolute;
    top:135px;
    width: 758px;
	z-index:10;
}
#close_2
{	
	cursor:pointer;
	 background-image: url("../ob/btn1.png");
    height: 24px;
    left: 686px;
    position: absolute;
    top: 370px;
    width: 56px;
	z-index:10;
}

#txt_1{
	color: #000000;
    font: 30px trebuchet ms;
    left: 250px;
    position: absolute;
    top: 20px;
    font-weight: bold;
}

#txt_2{
	 color:#C00;
    font: bold 30px trebuchet ms;
    left: 345px;
    position: absolute;
    top: 20px;
}

#txt_3{
	color: #000000;
    font: bold 16px trebuchet ms;
    left: 30px;
    position: absolute;
    top: 25px;
}

#txt_4{
	 
    font: 13px trebuchet ms;
    left: 30px;
    position: absolute;
    top: 45px;
	text-align:left;
}

/*---------validate design----------------------*/

#checkbtn {
background-image: url("../ob/checkbtn.png");
height: 33px;
left: 400px;
position: absolute;
top:518px;
width: 126px;
overflow: hidden;
cursor:pointer;
}
#button_1
{
	background-image: url("../ob/2.png");
    height: 26px;
    left:10px;
    position: absolute;
    top: 555px;
    width: 117px;
	cursor:pointer;
}
#button_2
{
	 background-image: url("../ob/1.png");
    height: 26px;
    left: 100px;
    position: absolute;
    top: 555px;
    width: 162px;
	cursor:pointer;
}
#right2
{
	background-image: url("../ob/right.png");
	background-repeat:no-repeat;
    height: 77px;
    left: 345px;
    position: absolute;
    top: 270px;
    width: 225px;
	display:none;
	z-index: 99999;
}

#wrong
{
	background-image: url("../ob/wrong.png");
    height: 77px;
    left: 338px;
    position: absolute;
    top: 270px;
    width: 257px;
    background-repeat: no-repeat;
	display: none;
	z-index: 99999;
}

#input_correct_1{
    display: none;
    left: 47px;
    position: absolute;
    top: 190px;
}
#input_wrong_1{
    display: none;
    left: 47px;
    position: absolute;
    top: 190px;
}

#input_correct_2{
    display: none;
    left: 134px;
    position: absolute;
    top: 190px;
}
#input_wrong_2{
    display: none;
    left: 134px;
    position: absolute;
    top: 190px;
}

#input_correct_3{
    display: none;
    left: 229px;
    position: absolute;
    top: 190px;
}
#input_wrong_3{
    display: none;
    left: 229px;
    position: absolute;
    top: 190px;
}

#input_correct_4{
    display: none;
    left: 457px;
    position: absolute;
    top: 360px;
}
#input_wrong_4{
    display: none;
    left: 457px;
    position: absolute;
    top: 360px;
}

#input_correct_5{
    display: none;
    left: 590px;
    position: absolute;
    top: 360px;
}
#input_wrong_5{
    display: none;
    left: 590px;
    position: absolute;
    top: 360px;
}

#input_correct_6{
    display: none;
    left: 744px;
    position: absolute;
    top: 360px;
}
#input_wrong_6{
    display: none;
    left: 744px;
    position: absolute;
    top: 360px;
}