@font-face {
    font-family: "carolinalt";
    src: url("../fonts/carolinaltstdroman_9350.eot"), url("../fonts/carolinaltstdroman_9350.ttf"), url("../fonts/carolinaltstdroman_9350.otf");
}
@font-face {
    font-family: "jacoby";
    src: url("../fonts/jacoby_icg_black.eot"), url("../fonts/jacoby_icg_black.ttf"), url("../fonts/jacoby_icg_black.otf");
}

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

#page1 {
        height: 505px;
        left: 0px;
        position: relative;
        text-align: center;
        top: 0px;
        width: 910px;
}

#all{
    position:absolute;
    top:0px;
    left:0px;
    width:920px;
    height:635px;
    background-image: url("../img/bg.png");
    background-size:920px 585px;
    background-repeat:no-repeat;
    border-radius: 10px;
    background-color: white;
    z-index: -1;
}

#t0 {
position: absolute;
left: 75px;
top: 20px;
width: 600px;
font-size: 24px;
color: #333333;
font-family: Verdana, Geneva, sans-serif;
font-weight: normal;
font-style: normal;
}
#t1 {
position: absolute;
left:75px;
top:100px;
font-size: 15px;
font-family: Verdana, Geneva, sans-serif;
color: #333333;
font-weight: normal;
font-style: normal;
}


.greenBox{
	position: absolute;
	background-color: #D7E6D7;
	border: 1px solid #006600;
	border-radius: 5px;
	width: 117px;
	height: 27px;
}
#gr1{
	top: 190px;
	left: 212px;
}
#gr2{
	top: 222px;
	left: 212px;
}
#gr3{
	top: 254px;
	left: 212px;
}
#gr4{
	top: 286px;
	left: 212px;
}
#gr5{
	top: 319px;
	left: 212px;
}
.greenBox1{
	position: absolute;
	background-color: #D7E6D7;
	border: 1px solid #006600;
	border-radius: 5px;
}
#bgr1{
	width: 116px;
	height: 46px;
	top: 138px;
	left: 212px;
}
#bgr2{
	width: 156px;
	height: 46px;
	top: 138px;
	left: 346px;
}
#bgr3{
	width: 156px;
	height: 46px;
	top: 138px;
	left: 520px;
}
#text1_1{
	position: absolute;
	width: 116px;
	text-align: center;
	top: 12px;
}
#text1_2{
	position: absolute;
	width: 156px;
	text-align: center;
	top: 10px;
}
#text1_3{
	position: absolute;
	width: 156px;
	text-align: center;
	top: 10px;
}

.text{
	position: absolute;
	font-family: jacoby;
	font-size: 18px;
	text-align: center;
	width: 115px;
	top: 2px;
}
.text1{
	position: absolute;
	font-family: jacoby;
	font-size: 18px;
	text-align: center;
}
.text2{
	font-family: jacoby;
	font-size: 18px;
	text-align: center;
	color: #666;
	width: 156px;
}

#img_1 {
    left: 50px;
    position: absolute;
    top: 140px;
}
#img_2 {
    left: 340px;
    position: absolute;
    top: 140px;
}
#img_3 {
    left: 630px;
    position: absolute;
    top: 140px;
}
#img1 {
    height: 118px;
    left: -4px;
    position: absolute;
    top: -6px;
    width: 250px;
}
#img2 {
    height: 118px;
    left: -4px;
    position: absolute;
    top: -6px;
    width: 269px;
}
#img3 {
    height: 118px;
    left: -4px;
    position: absolute;
    top: -6px;
    width: 275px;
}
#img4 {
    height: 118px;
    left: -4px;
    position: absolute;
    top: -6px;
    width: 283px;
}
#img5 {
    height: 118px;
    left: -13px;
    position: absolute;
    top: -6px;
    width: 294px;
}

.droppable{
	position: absolute;
	background-color: #FFFFCC;
	border: 1px solid #FF9900;
	border-radius: 7px;
	width: 156px;
	height: 26px;

    font-family: jacoby;
    font-size: 18px;
    text-align: center;
    color: #666;
    top: 2px;
    color: green;
}
.draggable{
	position: absolute;
	background-color: #FFFFCC;
	border: 1px solid #FF9900;
	border-radius: 7px;
	width: 156px;
	height: 26px;
	cursor: pointer;

}


#drop1 {
    position: absolute;
    left: 346px;
    top: 190px;
 
}
#drop2 {
    position: absolute;
	top: 222px;
	left: 346px;
   
}
#drop3 {
    position: absolute;
	top: 254px;
	left: 346px;
   
}
#drop4 {
    position: absolute;
	top: 286px;
	left: 346px;
    
}
#drop5 {
    position: absolute;
	top: 319px;
	left: 346px;
  
}
#drop6 {
    position: absolute;
	top: 190px;
	left: 519px;
   
}
#drop7 {
    position: absolute;
	top: 222px;
	left: 519px;
  
}
#drop8 {
    position: absolute;
	top: 254px;
	left: 519px;
   
}
#drop9 {
    position: absolute;
	top: 286px;
	left: 519px;
   
}
#drop10 {
    position: absolute;
	top: 319px;
	left: 520px;

}

#txt1 {
    font-size: 28px;
    left: 210px;
    position: absolute;
    top: 92px;
    width: 149px;
}
#txt2 {
    font-size: 28px;
    left: 612px;
    position: absolute;
    top: 92px;
}

#box1 {
    left: 300px;
    top: 370px;

}
#box2 {
    left: 480px;
    top: 370px;
}
#box3 {
    left: 200px;
    top: 415px;
}
#box4 {
    left: 380px;
    top: 415px;
}
#box5 {
    left: 560px;
    top: 415px;
}
#box6 {
    left: 200px;
    top: 460px;
}
#box7 {
    left: 380px;
    top: 460px;
}
#box8 {
    left: 560px;
    top: 460px;
}
#box9 {
    left: 300px;
    top: 505px;
    
}
#box10 {
    left: 480px;
    top: 505px;
}



#reiniciar {
    left: 271px;
    position: absolute;
    top: -234px;
}
#reiniciar_img {
    height: 161px;
    left: 0;
    position: absolute;
    top: 0;
    width: 273px;
}
#reiniciar_click {
    cursor: pointer;
    height: 37px;
    left: 82px;
    position: absolute;
    top: 101px;
    width: 113px;
}
#siguiente {
    left: 271px;
    position: absolute;
    top: -234px;
}
#siguiente_img {
    height: 161px;
    left: 0;
    position: absolute;
    top: 0;
    width: 273px;
}
#siguiente_click {
    cursor: pointer;
    height: 37px;
    left: 65px;
    position: absolute;
    top: 82px;
    width: 135px;
}
#page2 {
    display: none;
    position: absolute;
}
#img_page2 {
    height: 450px;
    left: 77px;
    position: absolute;
    top: 88px;
    width: 753px;
}
#text_1 {
    background-color: transparent;
    border: medium none;
    font-size: 24px;
    height: 30px;
    left: 354px;
    position: absolute;
    text-align: left;
    text-decoration: none;
    top: 266px;
    width: 341px;
}
#text_2 {
    background-color: transparent;
    border: 0 none;
    font-size: 24px;
    height: 30px;
    left: 439px;
    position: absolute;
    text-align: left;
    top: 372px;
    width: 278px;
}
#t3 {
    height: 45px;
    left: 700px;
    position: absolute;
    top: 0;
    width: 204px;
}
#print {
    left: 86px;
    opacity: 1;
    position: absolute;
    top: 9px;
}
#reset {
    left: 134px;
    opacity: 1;
    position: absolute;
    top: 9px;
}
#close {
    left: 183px;
    opacity: 1;
    position: absolute;
    top: 9px;
}
#print_over {
    left: 50px;
    position: absolute;
    top: 37px;
}
#reset_over {
    display: none;
    left: 102px;
    position: absolute;
    top: 37px;
}
#close_over {
    display: none;
    left: 119px;
    position: absolute;
    top: 37px;
}
#bg_img {
    height: 416px;
    left: 203px;
    position: absolute;
    top: 111px;
    width: 698px;
}
#main_div {
    height: 315px;
    left: 489px;
    position: absolute;
    top: 100px;
    width: 408px;
}
#img1_div {
    height: 75px;
    left: 50px;
    position: absolute;
    top: 50px;
    width: 75px;
}
#page2IMG {
    height: 290px;
    left: 51px;
    opacity: 0.3;
    position: absolute;
    top: 120px;
    width: 393px;
}
#timer_IMG {
    left: 58px;
    position: absolute;
    top: 30px;
}
#timer_txt1 {
    font-size: 30px;
    height: 29px;
    left: 72px;
    position: absolute;
    text-align: center;
    top: 71px;
    width: 38px;
}
#timer_txt2 {
    font-size: 30px;
    height: 29px;
    left: 121px;
    position: absolute;
    text-align: center;
    top: 71px;
    width: 38px;
}
#timer {
    height: 118px;
    left: 26px;
    position: absolute;
    top: 404px;
    width: 217px;
}
#reiniciar_pg2 {
    left: 271px;
    position: absolute;
    top: -274px;
}
#reiniciar_img_pg2 {
    height: 241px;
    left: 0;
    position: absolute;
    top: 0;
    width: 381px;
}
#reiniciar_click_pg2 {
    cursor: pointer;
    height: 48px;
    left: 110px;
    position: absolute;
    top: 158px;
    width: 164px;
}
#siguiente_pg2 {
    left: 250px;
    position: absolute;
    top: -274px;
}
#siguiente_img_pg2 {
    height: 241px;
    left: 0;
    position: absolute;
    top: 0;
    width: 381px;
}
#siguiente_click_pg2 {
    cursor: pointer;
    height: 48px;
    left: 110px;
    position: absolute;
    top: 158px;
    width: 164px;
}

#clock {
    left: 36px;
    position: absolute;
    top: 27px;
}
#clock_gif {
    display: none;
    left: 23px;
    position: absolute;
    top: 19px;
}
#img11{
	cursor: pointer;
}
#img12 {
    width: 184px;
    cursor: pointer;
}
#img13 {
    height: 101px;
    width: 136px;
    cursor: pointer;
}
#img14{
	cursor: pointer;
}
#img15 {
    height: 150px;
    width: 138px;
    cursor: pointer;
}
#img16 {
    height: 146px;
    width: 162px;
    cursor: pointer;
}
#img17{
	cursor: pointer;
}
#img18 {
    height: 102px;
    width: 171px;
    cursor: pointer;
}
#img19 {
    height: 104px;
    width: 144px;
    cursor: pointer;
}
#drop1_correct {
    position: absolute;
    left: 475px;
    top: 180px;
	display: none;
}
#drop1_wrong {
    position: absolute;
    left: 475px;
    top: 182px;
	display: none;
}
#drop2_correct {
    position: absolute;
    left: 475px;
    top: 211px;
	display: none;
}
#drop2_wrong {
    position: absolute;
    left: 475px;
    top: 213px;
    display: none;
}
#drop3_correct {
    position: absolute;
    left: 475px;
    top: 243px;
	display: none;
}
#drop3_wrong {
    position: absolute;
    left: 475px;
    top: 245px;
	display: none;
}
#drop4_correct {
    position: absolute;
    left: 475px;
    top: 275px;
   	display: none;
}
#drop4_wrong {
    position: absolute;
    left: 475px;
    top: 277px;
    display: none;
}
#drop5_correct {
    position: absolute;
    left: 475px;
    top: 308px;
   	display: none;
}
#drop5_wrong {
    position: absolute;
    left: 475px;
    top: 310px;
    display: none;
}
#drop6_correct {
    position: absolute;
    left: 652px;
    top: 180px;
   	display: none;
}
#drop6_wrong {
    position: absolute;
    left: 652px;
    top: 182px;
    display: none;
}
#drop7_correct {
    position: absolute;
    left: 652px;
    top: 211px;
   	display: none;
}
#drop7_wrong {
    position: absolute;
    left: 652px;
    top: 213px;
    display: none;
}
#drop8_correct {
    position: absolute;
    left: 652px;
    top: 243px;
   	display: none;
}
#drop8_wrong {
    position: absolute;
    left: 652px;
    top: 245px;
    display: none;
}
#drop9_correct {
    position: absolute;
    left: 652px;
    top: 275px;
   	display: none;
}
#drop9_wrong {
    position: absolute;
    left: 652px;
    top: 277px;
    display: none;
}
#drop10_correct {
    position: absolute;
    left: 652px;
    top: 308px;
   	display: none;
}
#drop10_wrong {
    position: absolute;
    left: 652px;
    top: 310px;
    display: none;

}

#check_over {
    height:62px;
    left: 762px;
    position: absolute;
    top: 470px;
    width: 146px;
}
#drop_over {
    display: none;
    height: 437px;
    left: 47px;
    opacity: 0.3;
    position: absolute;
    top: 105px;
    width: 862px;
}