@charset "utf-8";
/* CSS Document */
@import url(common.css);

#grid1{ overflow: auto;}
#gridBox1{ height: 500px; overflow: auto;}
#gridBox2{ height: 500px; padding-top: 120px; }
#gridBox3{ height: 500px; }
#gridBox4{ height: 440px;  padding-top: 50px; padding-left: 20px;}
#gridBox5{ height: 440px;  padding-top: 100px; padding-left: 20px;}

#table1 {  font-size: 36px; }
#table1 th {background-color: #61AEF9; width: 50px; height: 50px; text-align: center; border: solid 1px #fff;}
#table1 input { width: 500px;}

#il01{ padding-top: 20px; }
#btPop1 {   position: absolute; right: 80px; bottom: 20px;}

#grap2Part1 {  position: absolute; height: 84px; width: auto; left: 0; top: 120px;}
#grap2Part13{  position: absolute; width: auto; left: 759px; top: 140px;}
#grap2Part2 {  position: absolute; width: auto; left: 800px; top: 120px;}
#grap2Part3 {  position: absolute; width: auto; left: 17px; top: 200px;}
#grap2Part4 {  position: absolute; width: auto; left: 174px; top: 382px;}
#grap2Part5 {  position: absolute; width: auto; left: 613px; top: 384px; }
#grap2Part6 {  position: absolute; width: auto; left: 1018px; top: 381px;}
#grap2Part7 {  position: absolute; width: auto; left: 100px; top: 280px; }
#grap2Part8 {  position: absolute; width: auto; left: 527px; top: 286px;}
#grap2Part9 {  position: absolute; width: auto; left: 933px; top: 286px;}
#grap2Part10{  position: absolute; width: 400px; left: 4px; top: 420px;}
#grap2Part11 { position: absolute; width: 400px; left: 433px; top: 423px;}
#grap2Part12 { position: absolute; width: 370px; left: 856px; top: 423px;}


#il05 {  height: 370px; width: auto; margin-left: 70px;}
#il06 {  height: 470px; width: auto; margin-left: 40px; }

.drop { position: absolute ; height: 160px;  width: 160px; background-color: #fff; }

#drop1 { position: absolute; left: 50px;}
#drop2 { position: absolute; left: 260px; }
#drop3 { position: absolute; left: 480px;}

.drag img { height: 100%; width: auto;}
#drag1 { position: absolute;  left: 1010px; height: 150px; width: 150px; }
#drag2 { position: absolute;  left: 820px;  height: 150px; width: 150px; }
#drag3 { position: absolute;  left: 920px; top: 240px; width: 150px; height: 150px; color : red; }

.boxshadow{
    -webkit-box-shadow: 0px 1px 5px 3px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 1px 5px 3px rgba(0,0,0,0.75);
    box-shadow: 0px 1px 5px 3px rgba(0,0,0,0.75);
}

#txt1 { position: absolute; top: 240px; left: 80px;}
#txt2 { position: absolute; top: 240px; left: 300px;}
#txt3 {   position: absolute; top: 240px; left: 495px}

#btValidar1 {  top: 280px; left: 100px; }
#btReiniciar1 {  top: 280px; left: 180px; }

.grayFilterDisable{
 filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale");
    -webkit-filter: grayscale(0%);
}

.grayFilterEnabled {
    filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}


.btFalso {  position: relative; top: 100px; left: 240px; width: 260px;}
.btVerdadero {  position: relative; top: 100px; left: 60px; width: 260px;}
