.area1 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area1-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area2 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area2-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area3 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area3-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area4 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area4-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area5 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area5-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area6 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area6-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area7 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area7-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area8 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area8-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area9 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area9-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.area10 {
    background-image: url(../img/S_G07_U01_L03_03_01/imgAct1-area10-01.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 1247px;
    height: 678px;
    position: absolute;
}

.flechaSiguiente {
    width: 65px;
    height: 65px;
    position: absolute;
    left: 92%;
    top: 48.8%;
}

.completa1 {
    position: absolute;
    top: 65.8%;
    left: 27.3%;
    font-size: 47px;
    z-index: 2;
    width: 65px;
    height: 62px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa1:focus {
    outline: none;
}

.completa2 {
    position: absolute;
    top: 65.8%;
    left: 44.8%;
    font-size: 47px;
    z-index: 2;
    width: 65px;
    height: 62px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa2:focus {
    outline: none;
}

.completa3 {
    position: absolute;
    top: 76.2%;
    left: 38.6%;
    font-size: 47px;
    z-index: 2;
    width: 66px;
    height: 58px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa3:focus {
    outline: none;
}

.completa4 {
    position: absolute;
    top: 71.2%;
    left: 64.6%;
    font-size: 47px;
    z-index: 2;
    width: 66px;
    height: 58px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa4:focus {
    outline: none;
}

.completa5 {
    position: absolute;
    top: 65.8%;
    left: 27.3%;
    font-size: 47px;
    z-index: 2;
    width: 65px;
    height: 62px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa5:focus {
    outline: none;
}

.completa6 {
    position: absolute;
    top: 65.8%;
    left: 44.8%;
    font-size: 47px;
    z-index: 2;
    width: 65px;
    height: 62px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa6:focus {
    outline: none;
}

.completa7 {
    position: absolute;
    top: 76.2%;
    left: 38.6%;
    font-size: 47px;
    z-index: 2;
    width: 66px;
    height: 58px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa7:focus {
    outline: none;
}

.completa8 {
    position: absolute;
    top: 71.2%;
    left: 64.6%;
    font-size: 47px;
    z-index: 2;
    width: 66px;
    height: 58px;
    border: 0;
    text-align: center;
    color: #575756;
    background-color: transparent;
    padding: 0px!important;
}

.completa8:focus {
    outline: none;
}

#uno {
    width: 320px;
    height: 170px;
    position: absolute;
    top: 37%;
    left: 9%;
}
#dos {
    width: 320px;
    height: 170px;
    position: absolute;
    top: 37%;
    left: 37%;
}
#tres {
    width: 320px;
    height: 170px;
    position: absolute;
    top: 37%;
    left: 66%;
}
.cont{
    width: 320px!important;
    height: 170px!important;
}

.q1-a{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 25%;
    left: 15%;
    font-style: italic;
}
.q1-b{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 30%;
    left: 15%;
    font-style: italic;
}
.q1-c{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 35%;
    left: 15%;
    font-style: italic;
}
.q1-d{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 40%;
    left: 15%;
    font-style: italic;
}

.q2-a{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 65%;
    left: 15%;
    font-style: italic;
}
.q2-b{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 70%;
    left: 15%;
    font-style: italic;
}
.q2-c{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 75%;
    left: 15%;
    font-style: italic;
}
.q2-d{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 80%;
    left: 15%;
    font-style: italic;
}

.q3-a{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 28%;
    left: 15%;
    font-style: italic;
}
.q3-b{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 28%;
    left: 26%;
    font-style: italic;
}
.q3-c{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 28%;
    left: 39%;
    font-style: italic;
}
.q3-d{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 28%;
    left: 51%;
    font-style: italic;
}

.q4-a{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 47%;
    left: 15%;
    font-style: italic;
}
.q4-b{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 47%;
    left: 26%;
    font-style: italic;
}
.q4-c{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 47%;
    left: 39%;
    font-style: italic;
}
.q4-d{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 47%;
    left: 51%;
    font-style: italic;
}

.q5-a{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 68%;
    left: 15%;
    font-style: italic;
}
.q5-b{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 73%;
    left: 15%;
    font-style: italic;
}
.q5-c{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 78%;
    left: 15%;
    font-style: italic;
}
.q5-d{
    font-size: 30px;
    color: #575756;
    position: absolute;
    top: 83%;
    left: 15%;
    font-style: italic;
}