#interatividade .abs{width:800px; height:600px; background-color:none; z-index:10;}

#interface {z-index:100;}

#tela1 , #tela2 {background-image:url('img/bg.jpg');}

#tela1 .tabela {display:block; width:563px; height:338px; background-image:url('img/tabela1.png'); position:absolute; top:100px; left:120px;}
#tela1 .btDrag {position:absolute; display:block; cursor:pointer; z-index:10;}
#tela1 .btDrag.bt1 {left:83px;  top:480px; width:145px; height:71px; background-image:url('img/drag1.png');}
#tela1 .btDrag.bt2 {left:250px; top:485px; width:163px; height:71px; background-image:url('img/drag2.png');}
#tela1 .btDrag.bt3 {left:503px; top:470px; width:92px; height:91px; background-image:url('img/drag3.png');}
#tela1 .btDrag.bt4 {left:623px; top:470px; width:92px; height:90px; background-image:url('img/drag4.png');}
#tela1 .drop 	{position:absolute; width:180px; height:105px; }
#tela1 .drop.drop1	{top:117px; left:189px; }
#tela1 .drop.drop2	{top:117px; left:373px; }
#tela1 .drop.drop3	{top:228px; left:189px; }
#tela1 .drop.drop4	{top:228px; left:373px; }
#tela1 .drop div {position:absolute; width:180px; height:105px; background:center center no-repeat;}
#tela1 .drop div.obj1 {background-image:url('img/drag1.png');}
#tela1 .drop div.obj2 {background-image:url('img/drag2.png');}
#tela1 .drop div.obj3 {background-image:url('img/cor1.png');}
#tela1 .drop div.obj4 {background-image:url('img/cor2.png');}
#tela1 .drop.drop3 div.obj3 {background-image:url('img/cor1_2.png');}
#tela1 .drop.drop4 div.obj4 {background-image:url('img/cor2_2.png');}
#tela1 .drop.drop4	img{position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; }

.apagando {position:absolute; top:0; left:0; z-index:50; display:none;}
.desenhando {position:absolute; top:0; left:0; z-index:50; display:none;}
.reiniciar {position:absolute; top:0; left:-1px; z-index:50; display:none; cursor:pointer;}

#tela2 .tabela {display:block; width:752px; height:398px; background-image:url('img/tabela2.png'); position:absolute; top:51px; left:24px;}
#tela2 .btDrag {position:absolute; display:block; cursor:pointer; z-index:10;}
#tela2 .btDrag.bt1 {left:45px;  top:490px; width:81px;  height:71px; background-image:url('img/drag5.png');}
#tela2 .btDrag.bt2 {left:162px; top:504px; width:86px;  height:56px; background-image:url('img/drag6.png');}
#tela2 .btDrag.bt3 {left:281px; top:472px; width:126px; height:107px; background-image:url('img/drag7.png');}
#tela2 .btDrag.bt4 {left:437px; top:472px; width:127px; height:104px; background-image:url('img/drag8.png');}
#tela2 .btDrag.bt5 {left:597px; top:488px; width:166px; height:88px; background-image:url('img/drag9.png');}
#tela2 .drop1 , #tela2 .drop4 { position:absolute; width:185px; height:126px; }
#tela2 .drop2 , #tela2 .drop5 { position:absolute; width:205px; height:126px; }
#tela2 .drop3 , #tela2 .drop6 { position:absolute; width:197px; height:126px; }
#tela2 .drop.drop1 {top:132px; left:146px; }
#tela2 .drop.drop2 {top:132px; left:337px; }
#tela2 .drop.drop3 {top:132px; left:550px; }
#tela2 .drop.drop4 {top:266px; left:146px; }
#tela2 .drop.drop5 {top:266px; left:337px; }
#tela2 .drop.drop6 {top:266px; left:550px; }
#tela2 .drop .corpo1  {position:absolute; top:34px; left:15px; background:url('img/drag8.png') no-repeat ; width:110px; height:90px; display:none; background-size:100%; }
#tela2 .drop .corpo2  {position:absolute; top:48px; left:10px; background:url('img/drag9.png') no-repeat ; width:145px; height:77px; display:none; background-size:100%; }
#tela2 .drop .corpo3  {position:absolute; top:33px; left:25px; background:url('img/drag7.png') no-repeat ; width:110px; height:93px; display:none; background-size:100%; }
#tela2 .drop1 .cabeca1 {position:absolute; top:1px;  left:87px;  background:url('img/drag5.png') no-repeat; width:71px;  height:62px; display:none; background-size:100%; }
#tela2 .drop2 .cabeca1 {position:absolute; top:7px;  left:102px; background:url('img/drag5.png') no-repeat; width:71px;  height:62px; display:none; background-size:100%; }
#tela2 .drop3 .cabeca1 {position:absolute; top:11px; left:83px;  background:url('img/drag5.png') no-repeat; width:71px;  height:62px; display:none; background-size:100%; }
#tela2 .drop4 .cabeca2 {position:absolute; top:16px; left:98px;  background:url('img/drag6.png') no-repeat; width:76px;  height:49px; display:none; background-size:100%; }
#tela2 .drop5 .cabeca2 {position:absolute; top:25px; left:114px; background:url('img/drag6.png') no-repeat; width:76px;  height:49px; display:none; background-size:100%; }
#tela2 .drop6 .cabeca2 {position:absolute; top:30px; left:97px;  background:url('img/drag6.png') no-repeat; width:76px;  height:49px; display:none; background-size:100%; }

#contVideo .fechar {z-index:20;}