@import url("M_G06_U03_L02_03.css");
.elementoRelativo {
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
}

.IL_M_G06_U03_L02_03_02_01 {
    background-image: url(../img/M_G06_U03_L02_03_02/IL_M_G06_U03_L02_03_02_01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1138px;
    height: 337px;
    margin: 1.5% auto 0 auto;
}

.lstQuestionario {
    margin: 1% 0 0 9%;
    padding: 0;
}

.lstQuestionario li {
    background-image: url(../img/M_G06_U03_L02_03_02/filaQuestionario.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1010px;
    height: 72px;
    position: relative;
    margin-bottom: 5px;
}

.lstQuestionario li:nth-child(1) {
    background-image: url(../img/M_G06_U03_L02_03_02/filaQuestionario1.png);
    height: 90px;
}

.lstQuestionario .texto {
    white-space: nowrap;
    color: #fefefe;
    font-family: 'cabinbold';
    font-size: 30px;
    line-height: 36px;
    letter-spacing: 0;
    display: inline-block;
    margin: 1.5% 0 0 4%;
}

.lstQuestionario .circulo {
    -webkit-border-radius: 63px;
    -moz-border-radius: 63px;
    border-radius: 63px;
    width: 63px;
    height: 63px;
    background-color: #F5F5F5;
    -webkit-box-shadow: inset 0px 0px 9px 4px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0px 0px 9px 4px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: inset 0px 0px 9px 4px rgba(0, 0, 0, 0.3);
    position: absolute;
    display: inline-block;
    cursor: pointer;
}

.lstQuestionario .circulo .texto {
    font-family: 'cabinbold';
    font-size: 37px;
    color: #6E6E6E;
    letter-spacing: 0;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    margin: 0;
}

.circuloF {
    top: 50%;
    left: 81.5%;
    transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -webkit-transform: translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
}

.circuloV {
    top: 50%;
    left: 90.5%;
    transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -webkit-transform: translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
}

.success .texto {
    color: #3AAA35 !important;
}

.fail .texto {
    color: #CA4F23 !important;
}
/*cuadricula*/

.tituloEnunciado {
    font-family: 'cabinregular';
    font-size: 35px;
    color: #575756;
    line-height: 42px;
    position: absolute;
    top: 14%;
    left: 3%;
}

.cuadricula {
    background-image: url(../img/M_G06_U03_L02_03_02/cuadricula.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 728px;
    height: 535px;
    position: absolute;
    top: 15%;
    left: 33.5%;
}

.IL_M_G06_U03_L02_03_02_05 {
    background-image: url(../img/M_G06_U03_L02_03_02/IL_M_G06_U03_L02_03_02_05.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 566px;
    height: 440px;
    position: absolute;
    top: -144.5%;
    z-index: 1;
    left: 114%;
}

.cntSuponga {
    width: 398px;
    height: 157px;
    background-color: #F9B233;
    -webkit-border-top-left-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    -moz-border-radius-topleft: 15px;
    -moz-border-radius-bottomleft: 15px;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    display: inline-block;
    top: 55%;
    position: absolute;
    left: 3%;
}

.clickSuponga {
    background-image: url(../img/click/clickTraslacion2.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 32px;
    height: 35px;
    position: absolute;
    left: 84%;
    top: 45%;
    z-index: 2;
}

.cntSuponga .texto {
    font-family: 'cabinregular';
    font-size: 35px;
    color: #ffffff;
    line-height: 42px;
    margin: 3.5% 0 0 12%;
    letter-spacing: 0;
}

.cntQuestionarioGrafica {
    background-image: url(../img/M_G06_U03_L02_03_02/cntQuestionarioGrafica.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1190px;
    height: 462px;
    position: absolute;
    top: 21%;
    left: 4%;
}

.cntQuestionarioGrafica .tituloPregunta {
    font-family: 'cabinregular';
    font-size: 35px;
    color: #FFFFFF;
    line-height: 42px;
    position: absolute;
    top: 1.5%;
    left: 4.5%;
    letter-spacing: 0;
}

.rotacionDrag {
    width: 239px;
    height: 71px;
    position: relative;
    background-color: #878787;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin-bottom: 34px;
}

.rotacionDrag .textoCentrado {
    font-family: 'cabinregular';
    font-size: 40px;
    color: #706F6F;
}

.rotacionDrop {
    background-image: url(../img/M_G06_U03_L02_03_02/movimientoDrop.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 239px;
    height: 71px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 51%;
    left: 35%;
}

#lstDrags {
    margin: 0;
    padding: 0;
    position: absolute;
    top: 28%;
    left: 4.5%;
}

#lstDrags li:nth-child(1) .rotacionDrag {
    background-color: #C1E7F4;
}

#lstDrags li:nth-child(2) .rotacionDrag {
    background-color: #FFFF99;
}

#lstDrags li:nth-child(3) .rotacionDrag {
    background-color: #FFCCFF;
}

.desarrollo1 {
    background-image: url(../img/M_G06_U03_L02_03_02/desarrollo1.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1056px;
    height: 450px;
    position: absolute;
    top: 32%;
    left: 8.5%;
}

.desarrollo2 {
    background-image: url(../img/M_G06_U03_L02_03_02/desarrollo2.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1056px;
    height: 450px;
    position: absolute;
    top: 32%;
    left: 8.5%;
}

.desarrollo3 {
    background-image: url(../img/M_G06_U03_L02_03_02/desarrollo3.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1212px;
    height: 446px;
    position: absolute;
    top: 19%;
    left: 1.5%;
}

.desarrollo3 .cuadricula {
    background-image: url(../img/M_G06_U03_L02_03_02/cuadricula.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 602px;
    height: 444px;
    position: absolute;
    top: 0%;
    left: 50%;
}

.desarrollo1 .cuadricula,
.desarrollo2 .cuadricula {
    width: 522px;
    height: 384px;
    position: absolute;
    top: 13.6%;
    left: 50%;
}

.clickTraslacion2 {
    background-image: url(../img/click/clickTraslacion.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 32px;
    height: 35px;
}

.estrategiaRotacion {
    background-image: url(../img/M_G06_U03_L02_03_02/estrategiaRotacion.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 994px;
    height: 568px;
    margin: 3% auto 0 auto;
    position: relative;
}

#lstEstrategiaRotacion {
    margin: 0;
    padding: 0;
    position: absolute;
    top: 11.3%;
    left: 5.6%;
}

#lstEstrategiaRotacion .estrategia {
    width: 939px;
    height: 88px;
    position: relative;
}

#lstEstrategiaRotacion .estrategia:nth-child(odd) {
    background-color: #ffffff;
}

#lstEstrategiaRotacion .estrategia:nth-child(even) {
    background-color: #FFF0DB;
}

#lstEstrategiaRotacion .estrategia:nth-child(1) {
    position: absolute;
    top: 0px;
    left: 0px;
}

#lstEstrategiaRotacion .estrategia:nth-child(2) {
    position: absolute;
    top: 89px;
    left: 0px;
    height: 113px;
}

#lstEstrategiaRotacion .estrategia:nth-child(3) {
    position: absolute;
    top: 204px;
    left: 0px;
    height: 111px;
}

#lstEstrategiaRotacion .estrategia:nth-child(4) {
    position: absolute;
    top: 316px;
    left: 0px;
    height: 87px;
}

#lstEstrategiaRotacion .estrategia:nth-child(5) {
    position: absolute;
    top: 404px;
    left: 0px;
    height: 87px;
}

.estrategia .clickTraslacion {
    background-image: url(../img/click/clickTraslacion.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 32px;
    height: 35px;
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
}