.interactiu-301 { width: 940px; height: 550px; position: absolute; overflow: hidden; }

/*BOTONS*/
#b301-bg { position: absolute; top: 285px ; left: 635px ; z-index: 35; }
#b301 { position: absolute; top: 300px ; left: 650px ; z-index: 35; }

#b302-bg { position: absolute; top: 335px ; left: 620px ; z-index: 35; }
#b302 { position: absolute; top: 350px ; left: 635px ; z-index: 35; }

#b308-bg { position: absolute; top: 130px ; left: 255px ; z-index: 35; }
#b308 { position: absolute; top: 145px ; left: 270px ; z-index: 35; }

#b309-bg { position: absolute; top: 300px ; left: 550px ; z-index: 35; }
#b309 { position: absolute; top: 315px ; left: 565px ; z-index: 35; }

#b310-bg { position: absolute; top: 350px ; left: 785px ; z-index: 61; }
#b310 { position: absolute; top: 365px ; left: 800px ; z-index: 62; }

#b311-bg { position: absolute; top: 380px ; left: 25px ; z-index: 61; }
#b311 { position: absolute; top: 395px ; left: 40px ; z-index: 62; }

#b312-bg { position: absolute; top: 405px ; left: 785px ; z-index: 35; }
#b312 { position: absolute; top: 420px ; left: 800px ; z-index: 35; }

#b313-bg { position: absolute; top: 405px ; left: 785px ; z-index: 35; }
#b313 { position: absolute; top: 420px ; left: 800px ; z-index: 35; }

/*TEXTOS*/
#t301 { position: absolute; top: 100px; left: 275px; max-width: 500px!important; z-index: 30; }

#b303, #b303b { position: absolute; top: 35px ; left: 310px ; z-index: 8; }
#b304, #b304b { position: absolute; top: 130px ; left: 310px ; z-index: 8; }
#b305, #b305b { position: absolute; top: 230px ; left: 310px ; z-index: 8; }
#b306, #b306b { position: absolute; top: 330px ; left: 310px ; z-index: 8; }
#b307, #b307b { position: absolute; top: 430px ; left: 310px ; z-index: 8; }

#t302 { position: absolute; top: 150px; left: 200px; max-width: 500px!important; z-index: 30; }

#t303 { text-align: left; position: absolute; top: 25px; left: 500px; max-width: 300px!important; z-index: 60; }

#t304 { text-align: left; position: absolute; top: 150px; left: 60px; max-width: 300px!important; z-index: 40; }
#t305 { text-align: left; position: absolute; top: 250px; left: 75px; max-width: 300px!important; z-index: 40; }
#t306 { text-align: left; position: absolute; top: 200px; left: 50px; max-width: 300px!important; z-index: 40; }

#t307 { text-align: left; position: absolute; top: 75px; left: 35px; max-width: 375px!important; z-index: 60; }

#t308 { text-align: left; position: absolute; top: 50px; left: 525px; max-width: 300px!important; z-index: 40; }
#t309 { text-align: left; position: absolute; top: 75px; left: 575px; max-width: 300px!important; z-index: 40; }
#t310 { text-align: left; position: absolute; top: 70px; left: 490px; max-width: 300px!important; z-index: 40; }

#t311 { position: absolute; top: 405px; left: 375px; max-width: 400px!important; z-index: 5; }

#t312 { text-align: left; position: absolute; top: 90px; left: 460px; max-width: 300px!important; z-index: 30; }
#t313 { text-align: left; position: absolute; top: 90px; left: 460px; max-width: 300px!important; z-index: 30; }
#t314 { text-align: left; position: absolute; top: 60px; left: 460px; max-width: 300px!important; z-index: 30; }
#t315 { text-align: left; position: absolute; top: 90px; left: 460px; max-width: 300px!important; z-index: 30; }
#t316 { text-align: left; position: absolute; top: 90px; left: 460px; max-width: 300px!important; z-index: 30; }

#t317{ text-align: center; position: absolute; top: 135px; left: 650px; max-width: 200px!important; z-index: 30; }


#t318 { position: absolute; top: 50px ; left: 650px ; max-width: 150px!important; z-index: 55; }


#t319 { position: absolute; top: 125px ; left: 190px ; max-width: 540px!important; text-align: left; z-index: 50; }

/*ELEMENTS*/

.d_d { width: 325px; height: 45px; left: 25px; opacity: 0.3; }
.textdnd { position: absolute; font-family: 'thesans',arial; color: gray; padding-top: 3px; left: 45px; z-index: 8; }
.droppable { position: absolute; font-family: 'thesans',arial; font-size: 14px; color: #fff ; text-align: center; padding-top: 30px; display:block; width:63px; height:33px; background-color: #9f826c; border: 0px solid #333; border-radius: 50%; box-shadow: 0 0 0 gray; left: 140px; top: 70px;}
.droppable_b { left: 225px; background-color: #ffcea2; color: #888 ; }

#bdnd01 { top: 35px; z-index: 6; }
#txtdnd01 { top: 35px; z-index: 8; }
#dadnd01 { top: 19px; z-index: 7; }
#dbdnd01 { top: 19px; z-index: 7; }

#bdnd02 { top: 130px; z-index: 6; }
#txtdnd02 { top: 130px; z-index: 8; padding-top: 15px; }
#dadnd02 { top: 114px; z-index: 7; }
#dbdnd02 { top: 114px; z-index: 7; }

#bdnd03 { top: 230px; z-index: 6; }
#txtdnd03 { top: 230px; z-index: 8; padding-top: 15px; }
#dadnd03 { top: 214px; z-index: 7; }
#dbdnd03 { top: 214px; z-index: 7; }

#bdnd04 { top: 330px; z-index: 6; }
#txtdnd04 { top: 330px; z-index: 8; }
#dadnd04 { top: 314px; z-index: 7; }
#dbdnd04 { top: 314px; z-index: 7; }

#bdnd05 { top: 430px; z-index: 6; }
#txtdnd05 { top: 430px; z-index: 8; }
#dadnd05 { top: 414px; z-index: 7; }
#dbdnd05 { top: 414px; z-index: 7; }

.draggable { position: absolute; display:block; width:75px; height:75px; border: 0px solid #f5f5f5; box-shadow: 0 0 0 gray; cursor: zoom-in; z-index: 9; }

.jog01 { top: 190px; left: 405px; }
.jog05 { top: 190px; left: 665px; }
.jog07 { top: 190px; left: 535px; }
.jog08 { top: 190px; left: 795px; }

.jog02 { top: 310px; left: 595px; }
.jog04 { top: 310px; left: 735px; }
.jog09 { top: 310px; left: 457px; }

.jog03 { top: 70px; left: 735px; }
.jog06 { top: 70px; left: 457px; }
.jog10 { top: 70px; left: 595px; }

#lego01 { width: 285px; top: 50px; left: 280px; z-index: 20; }
#lego02 { width: 280px; top: 300px; left: 430px; z-index: 20; }

.cap_t { margin-left: 55px; margin-bottom: 50px; }
.cap_t2 { margin-left: 55px;}
.cap_t3 { margin-left: 5px; margin-bottom: 25px;}
.cap_t4 { margin-left: 55px; margin-bottom: 25px;}

.cap { position: absolute; margin-top: -10px; cursor: pointer; }