@charset "utf-8";
/* CSS Document */

#gridBox1 { height: 440px; }
#gridBox2 { height: 485px; top: 20px;  }

.buttonMargin button { width: 80px; height: 60px; 
  position: relative;
}


#btValidar  {  position: absolute; right: 50px; top: 0px;  }
#btValidar2 { position: absolute; top: 320px; right: 40px;}
#btValidar3 { position: relative; top: 10px; left: 260px; }

#btPop1 { position: absolute; right: 50px; bottom: 20px; }
#btPop2 { position: absolute; right: 260px; bottom: 20px;}
#btPop3 { cursor: pointer; position: absolute; top: 320px; right: 250px;}
#btPop4 { cursor: pointer; position: absolute; top: 385px; right: 40px; background-color: rgb(43, 151, 229); } 
#btPop5 { cursor: pointer; position: absolute; top: 385px; right: 330px;}
#btPop6 { cursor: pointer; position: absolute; top: 385px; right: 40px; background-color: rgb(43, 151, 229); } 
#btPop7 { position: relative; left: 850px; bottom: 30px; background-color: rgb(43, 151, 229); }
#btPop8 {  right: 80px; position: absolute; bottom: -85px; }

.ovl { text-decoration: overline; }


input { width: 100%; font-size: 36px; text-align: center; }
.resultado{ width: 40px; height: 40px;   display:block; margin: auto; }
.bgAcierto{ background-image: url('../../../common/img/img_correcto.png'); width:40px;  height: 40px;  background-repeat: no-repeat; background-size: 100% auto;} 
.bgError{ background-image: url('../../../common/img/img_incorrecto.png'); width:40px;  height: 40px;  background-repeat: no-repeat; background-size: 100% auto;} 


.scroll{  width: 100%; height: 450px; overflow-y: scroll; }
.padRight0 { padding-right: 0px !important; }
.selected { background-color: #93b535; }

/* Fractions Display  with Jquery */
.fraction, .top, .bottom {
    padding: 0 5px;    
    position: relative;
    top: 12px;
}

.fraction {
    display: inline-block;
    text-align: center;    
}
input[type='checkbox']{
position: relative;
top: 50px;
width: 40px;
height: 40px;
}
.bottom{
    border-top: 1px solid #fff;
    display: block;
}

/******** Padding Helpers *******/
.padTop10  { padding-top: 10px;}
.padTop20  { padding-top: 20px;}
.padTop40  { padding-top: 40px;}
.padTop60  { padding-top: 60px;}
.padTop70  { padding-top: 70px;}
.padTop80  { padding-top: 80px;}
.padTop100 { padding-top: 100px;}

.padLeft10  { padding-left: 10px;}
.padLeft20  { padding-left: 20px;}
.padLeft40  { padding-left: 40px;}
.padLeft60  { padding-left: 60px;}
.padLeft80  { padding-left: 80px;}
.padLeft100 { padding-left: 100px;}

.padSide10  { padding-left: 10px;  padding-right: 10px;}
.padSide20  { padding-left: 20px;  padding-right: 20px;}
.padSide40  { padding-left: 40px;  padding-right: 40px;}
.padSide60  { padding-left: 60px;  padding-right: 60px;}
.padSide80  { padding-left: 80px;  padding-right: 80px;}
.padSide100 { padding-left: 100px; padding-right: 100px;}
