* {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    border: 0 none;
    background: none repeat scroll 0 0 transparent;
}

    *:focus, *:active {
        outline: 0;
    }

body, html {
    height: 100%;
    background:none !important;
}

::selection {
    background-color: #FCA800;
    color: #111;
    text-shadow: rgba(255,255,255,.3) 1px 1px;
}

::-moz-selection {
    background-color: #FCA800;
    color: #111;
    text-shadow: rgba(255,255,255,.3) 1px 1px;
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}

.unselectable, .cursorGrabbing {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.cursorGrab {
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

.cursorGrabbing {
    cursor: move;
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}

    .cursorGrabbing, .cursorGrabbing *, .cursorGrabbing .cursorGrab {
        cursor: move !important;
        cursor: grabbing !important;
        cursor: -moz-grabbing !important;
        cursor: -webkit-grabbing !important;
    }

img {
    vertical-align: middle;
    -ms-interpolation-mode: bicubic;
}

button, input {
    line-height: normal;
}

button, input, select, textarea {
    vertical-align: middle;
}

    button, input[type="button"], input[type="reset"], input[type="submit"] {
        cursor: pointer;
        -webkit-appearance: button;
    }

label, input, button, select, textarea, body {
    font: normal 13px/19px "Lucida Sans Unicode", "Lucida Grande",Arial,Helvetica,sans-serif;
    color: #26282a;
    overflow-x: hidden;
}

.ri {
    float: right;
}

.le {
    float: left;
}

.clear, .row:after {
    clear: both;
}

.row {
    width: 100%;
}

    .row:before, .row:after {
        display: table;
        line-height: 0;
        content: "";
    }

.btn {
    display: inline-block;
    padding: 4px 14px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    color: #333;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #bbb;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-bottom-color: #a2a2a2;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0,0,0,0.05);
    text-decoration: none;
}

    .btn:hover, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
        color: #333;
        background-color: #e6e6e6;
    }

    .btn:hover {
        color: #333;
        text-decoration: none;
        background-color: #e6e6e6;
    }

    .btn:active {
        background-color: #e6e6e6;
        background-image: none;
        -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
        -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
        box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0,0,0,0.05);
    }

.btn-large {
    padding: 9px 21px;
    font-size: 15px;
    line-height: 24px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.btn-small {
    padding: 3px 9px;
    font-size: 12px;
    line-height: 18px;
}

.btn-mini {
    padding: 2px 6px;
    font-size: 11px;
    line-height: 16px;
}

.btn {
    border-color: #c5c5c5;
    border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0,0,0,0.25);
}

.btn-primary {
    color: #111;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    background: rgb(253,178,0);
    background: -moz-linear-gradient(top, rgba(253,178,0,1) 0%, rgba(251,142,0,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(253,178,0,1)), color-stop(100%,rgba(251,142,0,1)));
    background: -webkit-linear-gradient(top, rgba(253,178,0,1) 0%,rgba(251,142,0,1) 100%);
    background: -o-linear-gradient(top, rgba(253,178,0,1) 0%,rgba(251,142,0,1) 100%);
    background: -ms-linear-gradient(top, rgba(253,178,0,1) 0%,rgba(251,142,0,1) 100%);
    background: linear-gradient(to bottom, rgba(253,178,0,1) 0%,rgba(251,142,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdb200', endColorstr='#fb8e00',GradientType=0 );
}

    .btn-primary:hover {
        background: rgba(253,178,0,1);
    }

    .btn-primary:active {
        background: rgba(251,142,0,1);
    }

.btn.disable {
    cursor: not-allowed;
    color: #999;
    background: #e6e6e6;
    box-shadow: none;
    border-color: rgba(0,0,0,.2);
    opacity: .8;
}

.descripcionActividad {
    overflow: hidden;
    height: auto;
}

.contentDescripcion {
    padding-top: 10px;
}

.collapse {
    display: none;
}

.boxInfo {
    display: inline-block;
    width: 42%;
    margin: 0 2%;
}

.contentInfo {
    background-color: #66932F;
    background-color: rgba(0,0,0,.1);
    box-shadow: inset 0 3px 9px rgba(0,0,0,.1), 0 1px rgba(255,255,255,.18);
    padding: 8px 0 7px;
    border-radius: 2px;
}

#preActividad h1 {
    font: bold 26px/30px Arial, Helvetica, sans-serif;
}

#preActividad p {
    padding: 2px 0 18px;
    font-size: 14px;
}

.toggleMostrar {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

    .toggleMostrar a {
        display: inline-block;
        position: relative;
        top: 13px;
        padding: 4px 20px;
        background-color: #7CB139;
        color: #fff;
        text-decoration: none;
    }

.infoPrimary {
    padding-top: 32px;
    padding-bottom: 14px;
}

.datoInfo {
    display: block;
    font-size: 40px;
    font-weight: bold;
    line-height: 46px;
    font-family: Arial,Helvetica,sans-serif;
}

.explicacionInfo {
    text-transform: uppercase;
    font-size: 11px;
}

.txtSensible {
    width: 26%;
    float: left;
    text-align: right;
    font-size: 15px;
    line-height: 17px;
    font-weight: bold;
}

.contentSensible {
    margin-left: 30%;
    text-align: left;
    font-size: 15px;
}

.infoSecondary {
    padding: 10px 0 0;
}

.iSensible {
    height: 17px;
    width: 19px;
    display: inline-block;
    margin-right: 6px;
    vertical-align: top;
    background-image: url(img_html5/iconsWhite.png);
    background-repeat: no-repeat;
}

.mayusSensible {
    margin-bottom: 8px;
}

.trueSensible .iSensible {
    background-position: -14px -33px;
}

.falseSensible .iSensible {
    background-position: -52px -33px;
}

.btnsExtraPreAct {
    margin-top: 2px;
}

    .btnsExtraPreAct .btn {
        border-color: rgba(255,255,255,.5);
        box-shadow: 0 1px 1px rgba(0,0,0,0.2);
    }

#footerPreAct {
    padding-top: 32px;
}

.accordionButton {
    cursor: pointer;
    background-image: url(img_html5/iconsWhite.png);
    background-repeat: no-repeat;
    padding-left: 20px;
    background-position: -58px -100px;
}

.contentInfoRespuesta {
    background-color: #fff;
    color: #333;
    box-shadow: rgba(0,0,0,.3) 0 2px 1px;
}

.contentRespuesta {
    position: relative;
    font-size: 13px;
    text-transform: uppercase;
    color: #292d33;
    font-weight: bold;
    text-shadow: 1px 1px #fff;
    background: rgb(245,245,245);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y1ZjVmNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlM2UzZTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(245,245,245,1) 0%, rgba(227,227,227,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(245,245,245,1)), color-stop(100%,rgba(227,227,227,1)));
    background: -webkit-linear-gradient(top, rgba(245,245,245,1) 0%,rgba(227,227,227,1) 100%);
    background: -o-linear-gradient(top, rgba(245,245,245,1) 0%,rgba(227,227,227,1) 100%);
    background: -ms-linear-gradient(top, rgba(245,245,245,1) 0%,rgba(227,227,227,1) 100%);
    background: linear-gradient(to bottom, rgba(245,245,245,1) 0%,rgba(227,227,227,1) 100%);
    box-shadow: inset 0 -1px rgba(0,0,0,.13), inset 0 1px #fff;
}

    .contentRespuesta:after {
        content: " ";
        clear: both;
        display: table;
        line-height: 0;
    }

.numRespuesta {
    font-family: Arial,Helvetica,sans-serif;
    width: 40px;
    display: inline-block;
    text-align: center;
    color: #fff;
    text-shadow: none;
    background-color: #393d42;
    padding: 11px 0;
    box-shadow: inset 0 -1px rgba(0,0,0,.13), 1px 0 0 rgba(255,255,255,.8), inset -1px 0 rgba(0,0,0,.2);
    float: left;
}

.txtRespuesta {
    padding: 11px 20px 11px 8px;
    margin-left: 42px;
    display: block;
    word-wrap: break-word;
}

.accordionContent {
    padding: 0 0 6px 20px;
}

.on {
    background-position: -14px -100px;
}

    .on .contentRespuesta {
        box-shadow: inset 0 -1px rgba(0,0,0,.05), inset 0 1px #fff;
    }

#resumen {
    background-color: #292d33;
    color: #fff;
}

#headerResumen {
    text-align: center;
    padding: 18px 8px 13px;
}

.actSuperada {
    background-color: #7CB139;
}

.actNoSuperada {
    background-color: #D53838;
}

.estadoActividad {
    font-size: 18px;
    line-height: 22px;
    padding-bottom: 4px;
    font-weight: bold;
    text-transform: uppercase;
}

.imgUserPlayer {
    float: left;
    padding: 2px;
    background-color: #FFF;
    border-radius: 2px;
    margin-right: 17px;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.32), 0 1px 3px rgba(0, 0, 0, 0.2);
}

    .imgUserPlayer img {
        border-radius: 1px;
    }

#resultados {
    background-color: #393d42;
    background-color: rgba(255,255,255,.09);
    padding: 24px 0 16px;
}

    #resultados ul {
        clear: both;
    }

    #resultados li {
        display: inline-block;
        width: 28%;
        text-align: center;
        text-transform: uppercase;
        font-size: 10px;
        color: rgba(255,255,255,.6);
        position: relative;
    }

        #resultados li:before {
            content: " ";
            margin-top: 12px;
            display: block;
            position: absolute;
            height: 36px;
            border-left: 1px solid rgba(255,255,255,.16);
        }

        #resultados li.rTiempo {
            width: 40%;
        }

    #resultados.col2 li, #resultados.col2 li.rTiempo {
        width: 49%;
    }

    #resultados .rDatos {
        font-size: 32px;
        font-weight: bold;
        line-height: 37px;
        display: block;
        color: #fff;
        text-shadow: rgba(0,0,0,.3) 0 1px 1px;
        font-family: Arial,Helvetica,sans-serif;
    }

#shareResultado {
    padding: 18px 0;
}

    #shareResultado .txtCompartir {
        float: left;
    }

    #shareResultado p {
        font-size: 13px;
        padding-left: 17px;
        line-height: 48px;
        padding-right: 10px;
    }

    #shareResultado ul {
        float: left;
    }

    #shareResultado li {
        display: inline;
    }

        #shareResultado li a {
            display: inline-block;
            text-indent: -9999em;
            width: 56px;
            height: 56px;
            background-image: url(img_html5/iShare.png);
            background-repeat: no-repeat;
        }

.shareTw {
    background-position: 0 0;
}

.shareFb {
    background-position: -59px 0;
}

.shareGplus {
    background-position: -118px 0;
}

#resultados li:first-child:before {
    display: none;
}

#respuestaResultados {
    padding: 8px;
}

.iExtraInfo {
    width: 21px;
    height: 21px;
    position: absolute;
    right: 14px;
    top: 12px;
    cursor: help;
    background-image: url(img_html5/iExtraInfo.png);
    background-repeat: no-repeat;
    background-position: center center;
}

.on .iExtraInfo {
    display: none;
}

.txtExtraInfo {
    border-top: 1px solid #dededf;
    font-size: 12px;
    text-align: left;
    background-image: url(img_html5/iExtraInfo.png);
    background-repeat: no-repeat;
    background-position: 12px 19px;
    padding-top: 20px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 34px;
    padding: 16px 14px 20px 38px;
}

.respuestaIncorrecta .numRespuesta {
    background-color: #d53838;
}

.playerNoRegistrado {
    padding: 15px 0 25px;
}

    .playerNoRegistrado a {
        color: #fff;
        text-decoration: none;
    }

    .playerNoRegistrado .btn {
        color: #333;
        margin-right: 16px;
    }

.tachado {
    text-decoration: line-through;
    font-weight: normal;
    margin-right: 6px;
    opacity: .65;
    min-width: 26px;
    display: inline-block;
    padding: 0 6px;
    min-height: 15px;
    border-right: 1px solid rgba(0,0,0,.25);
    border-left: 1px solid rgba(0,0,0,.25);
}

#player {
    padding-top: 19px;
    padding-left: 17px;
    padding-right: 8px;
}

.nomPlayer {
    font-size: 19px;
    line-height: 22px;
    padding-top: 18px;
    padding-bottom: 2px;
}

.rankingPlayer {
    font-weight: bold;
    font-size: 11px;
    padding-bottom: 10px;
}

.imgUserPlayer {
    width: 74px;
    height: 76px;
    overflow: hidden;
}

    .imgUserPlayer img {
        background-color: #CFCFCF;
        height: 76px;
        width: auto;
    }

@keyframes fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-o-keyframes fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes falloAct {
    from {
        color: #fff;
    }

    40% {
        color: #D53838;
    }

    to {
        color: #fff;
    }
}

@-moz-keyframes falloAct {
    from {
        color: #fff;
    }

    40% {
        color: #D53838;
    }

    to {
        color: #fff;
    }
}

@-webkit-keyframes falloAct {
    from {
        color: #fff;
    }

    40% {
        color: #D53838;
    }

    to {
        color: #fff;
    }
}

@-o-keyframes falloAct {
    from {
        color: #fff;
    }

    40% {
        color: #D53838;
    }

    to {
        color: #fff;
    }
}

#resultados .falloResultado, #resultados .falloResultado .rDatos {
    animation: falloAct 5.5s;
    -moz-animation: falloAct 5.5s;
    -webkit-animation: falloAct 5.5s;
    -o-animation: falloAct 5.5s;
}

.bgArrow {
    height: 21px;
    position: relative;
    width: 100%;
    margin-top: -2px;
    z-index: 9;
    background-image: url(img_html5/bgarrow.png);
    background-position: center 0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.boxArrow {
    padding: 4px 0 0;
    background-color: #F5F5F5;
    border-radius: 3px 3px 0 0;
    border-top: 1px solid #fff;
    position: relative;
    box-shadow: rgba(0,0,0,.3) 2px 0 6px;
}

#footAct .btn-primary {
    margin-left: 40%;
}

@media all and (min-width:460px) {
    .boxArrow:after, .boxArrow:before {
        display: block;
        content: " ";
        width: 35%;
        height: 140px;
        position: absolute;
        top: 0;
        opacity: .7;
    }

    .boxArrow:after {
        left: 0;
        background: -moz-linear-gradient(-45deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 27%, rgba(0,0,0,0) 100%);
        background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(0,0,0,0.15)), color-stop(27%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0)));
        background: -webkit-linear-gradient(-45deg, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 27%,rgba(0,0,0,0) 100%);
        background: -o-linear-gradient(-45deg, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 27%,rgba(0,0,0,0) 100%);
        background: -ms-linear-gradient(-45deg, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 27%,rgba(0,0,0,0) 100%);
        background: linear-gradient(135deg, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 27%,rgba(0,0,0,0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26000000', endColorstr='#00000000',GradientType=1 );
    }

    .boxArrow:before {
        right: 0;
        background: -moz-linear-gradient(45deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 73%, rgba(0,0,0,0.15) 100%);
        background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(73%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.15)));
        background: -webkit-linear-gradient(45deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 73%,rgba(0,0,0,0.15) 100%);
        background: -o-linear-gradient(45deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 73%,rgba(0,0,0,0.15) 100%);
        background: -ms-linear-gradient(45deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 73%,rgba(0,0,0,0.15) 100%);
        background: linear-gradient(45deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 73%,rgba(0,0,0,0.15) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#26000000',GradientType=1 );
    }

    .puntos .numIndicador:after, .puntos .numIndicador:before {
        display: block;
        content: " ";
        width: 20%;
        height: 1px;
        background-color: rgba(0,0,0,.13);
        border-bottom: 1px solid #fff;
        position: absolute;
        top: 45%;
    }

    .puntos .numIndicador:after {
        left: 5%;
    }

    .puntos .numIndicador:before {
        right: 5%;
    }

    #footAct .btn-primary {
        margin-left: 0;
    }
}

.points {
    text-align: center;
    width: 100%;
    position: absolute;
    top: -4px;
    color: #333;
}

.boxIndicadores {
    background: rgb(89,127,40);
    background: -moz-linear-gradient(top, rgba(89,127,40,1) 0%, rgba(97,138,44,1) 30%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(89,127,40,1)), color-stop(30%,rgba(97,138,44,1)));
    background: -webkit-linear-gradient(top, rgba(89,127,40,1) 0%,rgba(97,138,44,1) 30%);
    background: -o-linear-gradient(top, rgba(89,127,40,1) 0%,rgba(97,138,44,1) 30%);
    background: -ms-linear-gradient(top, rgba(89,127,40,1) 0%,rgba(97,138,44,1) 30%);
    background: linear-gradient(to bottom, rgba(89,127,40,1) 0%,rgba(97,138,44,1) 30%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#597f28', endColorstr='#618a2c',GradientType=0 );
    color: #FFF;
}

.indicadores {
    padding-left: 2%;
    max-width: 620px;
    margin: 0 auto;
}

    .indicadores li {
        display: block;
        float: left;
        width: 32%;
        text-align: center;
        position: relative;
    }

    .indicadores.column2 {
        padding-left: 20%;
        max-width: 520px;
    }

        .indicadores.column2 li {
            width: 40%;
        }

.numIndicador {
    font-weight: bold;
    font-size: 25px;
    line-height: 30px;
    text-shadow: rgba(0,0,0,.2) 0 1px 1px, rgba(255,255,255,.3) 0 0 6px;
    font-family: Arial,Helvetica,sans-serif;
}

.titIndicador {
    font-size: 9px;
    text-transform: uppercase;
    line-height: 15px;
    padding-bottom: 3px;
    opacity: .65;
}

.puntos .boxIndicador {
    width: 100%;
    min-height: 5px;
}

.boxIndicador {
    padding: 10px 0 8px;
}

.puntos .numIndicador {
    font-size: 40px;
    line-height: 34px;
    padding-top: 3px;
    letter-spacing: -1px;
}

sup {
    font-size: 13px;
    margin-left: 2px;
    opacity: .65;
    position: absolute;
}

.puntos .titIndicador {
    text-shadow: #fff 1px 1px;
}

@keyframes luzTime {
    from {
        opacity: 1;
    }

    50% {
        opacity: .3;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes luzTime {
    from {
        opacity: 1;
    }

    50% {
        opacity: .3;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes luzTime {
    from {
        opacity: 1;
    }

    50% {
        opacity: .3;
    }

    to {
        opacity: 1;
    }
}

@-o-keyframes luzTime {
    from {
        opacity: 1;
    }

    50% {
        opacity: .3;
    }

    to {
        opacity: 1;
    }
}

.alertLuz {
    background-image: url(img_html5/luzIntensa.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 33px;
}

.intentos .alertLuz {
    opacity: 0;
    -moz-animation: fade 1s;
    -webkit-animation: fade 1s;
    -o-animation: fade 1s;
    animation: fade 1s;
}

.tiempo .alertLuz {
    -moz-animation: luzTime 1s infinite;
    -webkit-animation: luzTime 1s infinite;
    -o-animation: luzTime 1s infinite;
    animation: luzTime 1s infinite;
}

.optionsAct a {
    display: block;
    float: left;
    width: 42px;
    opacity: .6;
    height: 34px;
    text-indent: -9999em;
    border-left: 1px solid rgba(255,255,255,.3);
    background-image: url(img_html5/iconsWhite.png);
    background-repeat: no-repeat;
    transition: opacity .3s linear;
}

    .optionsAct a:hover {
        opacity: 1;
    }

.optionsAct .reiniciar {
    background-position: -2px 5px;
}

.optionsAct .ayuda {
    background-position: -39px 5px;
}

.optionsAct .print {
    background-position: -77px -24px;
}

.optionsAct .full {
    background-position: -78px 4px;
}

#all {
    height: 100%;
    background-color: #292D33;
    position: relative;
}

.btnsExtraResumen {
    padding: 10px 0 16px;
    text-align: center;
}

#contentPreActividad, #contentAct, #resumen {
    display: none;
    min-height: 100%;
}

#contentAct {
    display: block;
    position: absolute;
    width: 100%;
    top: -99999em;
    min-height: 100%;
    background-color: #AAA;
}

#bodyAct {
    background-color: #fff;
}

.publi {
    max-width: 90%;
    max-height: 480px;
    background-color: #000;
    overflow: hidden;
    height: auto;
    width: auto;
    margin: 0 auto;
    box-shadow: rgba(0,0,0,.25) 0 5px 18px;
    position: relative;
}

    .publi video {
        width: 100%;
        height: 480px;
    }

#infoPreload {
    padding: 8px 2%;
    text-align: right;
    line-height: 30px;
    color: #fff;
}

    #infoPreload .btn {
        margin-left: 5px;
    }

.padPubli {
    padding: 20px 0;
}

.infoExtraPreAct .optionsAct a {
    display: inline-block;
    border-left: 0 none;
    margin-top: -3px;
}

#contentPreActividad {
    width: 100%;
    text-align: center;
    background-color: #7CB139;
}

#preActividad {
    background-color: #7CB139;
    color: #fff;
    text-align: center;
    padding: 2px 16px 124px;
    max-width: 460px;
    margin: 0 auto;
}

.iconActividad img {
    width: 146px;
    height: auto;
}

.iconActividad {
    padding: 20px 0 10px;
}

#preActividad .btn-primary {
    width: 60%;
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
    margin-bottom: 12px;
    box-shadow: rgba(0,0,0,.2)0 6px 15px;
}

.infoExtraPreAct {
    padding: 18px 10px 0;
    border-top: 1px solid rgba(255,255,255,.3);
}

.nomAutor {
    line-height: 22px;
}

#banner {
    position: fixed;
    bottom: 0;
    width: 100%;
    text-align: center;
    left: 0;
    line-height: 0;
    font-size: 0;
}

    #banner img {
        max-width: 100%;
        height: auto;
    }

#preLoad {
    width: 100%;
    height: 100%;
    position: relative;
    text-align: center;
    background-color: #7CB139;
}

    #preLoad img {
        position: relative;
        top: 50%;
        margin-top: -80px;
        width: 152px;
        height: auto;
        animation: fade 3s;
        -moz-animation: fade 3s;
        -webkit-animation: fade 3s;
        -o-animation: fade 3s;
    }

.blockBanner {
    display: inline-block;
    position: relative;
    margin: 0 auto;
    max-width: 100%;
    box-shadow: rgba(0,0,0,.15)0 0 15px;
    border-radius: 4px 4px 0 0;
    overflow: hidden;
    vertical-align: bottom;
}

#info.visible, #shadow.visible {
    display: block;
}

#info.oculto, #shadow.oculto {
    display: none;
}

.visible {
    display: block;
}

.oculto {
    display: none;
}

@media all and (min-width:500px) {
    #preActividad .btn-primary {
        font-size: 28px;
        line-height: 40px;
        font-weight: bold;
        margin-bottom: 20px;
    }

    .iconActividad img {
        width: 182px;
        height: auto;
    }

    .btnsExtraPreAct img {
        height: auto;
        width: 34px;
    }

    .nomAutor {
        line-height: 34px;
    }

    .iconActividad {
        padding: 35px 0 15px;
    }
}

@media all and (min-width:700px) {
    .iconActividad img {
        width: 240px;
        height: auto;
    }
}

@media (max-width:600px) {
    #info {
        max-height: none !important;
    }
}

#headAct {
    background-color: #7cb139;
    color: #FFF;
    position: relative;
}

.titActividad {
    overflow: hidden;
    height: 34px;
    line-height: 35px;
    margin: 0 0 0 12px;
    font-size: 15px;
    font-weight: bold;
}

#footAct {
    background-color: #292d33;
    text-align: center;
    color: #fff;
    clear: both;
    position: absolute;
    bottom: 0;
    padding: 7px 0;
    width: 100%;
}

#info, #shadow {
    display: none;
}

.modalWhite {
    position: absolute;
    top: 45px;
    width: 80%;
    left: 10%;
    border-radius: 3px;
    z-index: 99;
    color: #292D33;
    overflow: auto;
}

.shadow {
    position: fixed;
    background-color: rgba(0,0,0,.75);
    z-index: 98;
    height: 100%;
    width: 100%;
    top: 0;
}

#shadowHelp {
    z-index: 998;
}

#help {
    z-index: 9999;
    bottom: 27px;
}

.close a {
    position: absolute;
    display: block;
    top: 0px;
    right: 0px;
    height: 35px;
    width: 35px;
    color: #292D33;
    text-decoration: none;
    background-color: #dfdfdf;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    line-height: 32px;
    text-shadow: #fff 1px 1px;
    border-radius: 0 3px 0 0;
}

.contentModal {
    padding: 28px 12px;
    text-align: center;
    background-color: #fff;
}

.titModalWhite {
    font-size: 14px;
    line-height: 19px;
    font-weight: bold;
    color: #111;
    text-transform: uppercase;
    display: block;
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
    padding-bottom: 10px;
}

.infoModal {
    padding: 12px;
    font-size: 15px;
    line-height: 20px;
    padding: 0 12px;
}

#info {
    position: absolute;
    bottom: 22px;
    max-height: none !important;
}

#wrapper {
    position: absolute;
    z-index: 1;
    width: 100%;
    background: #aaa;
    overflow: hidden;
    top: 100px;
    bottom: 44px;
}

#footAct .btn-large {
    padding: 4px 14px;
    font-size: 14px;
    line-height: 20px;
}

.playerRegistrado {
    min-height: 68px;
}

    .playerRegistrado .nomUser {
        padding-top: 28px;
        display: inline-block;
    }

@media all and (min-width:600px) {
    #all {
        max-width: 796px;
        margin: 0 auto;
        box-shadow: rgba(0,0,0,.25) 0 5px 15px;
        background-color: #fff;
    }

    body, html {
        background-color: #dfdfdf;
    }

    #main {
        width: 65%;
        float: left;
    }

    #info .close, #info .btnAccionPrincipal {
        display: none;
    }

    #shadow {
        display: none !important;
    }

    #info {
        box-shadow: none;
        position: relative;
        width: 35%;
        float: right;
        top: inherit;
        left: inherit;
        bottom: inherit;
    }

        #info.oculto {
            display: block;
        }

    #contenidoCorrecto {
        width: 50%;
        left: 25%;
    }

        #contenidoCorrecto .close {
            display: block;
        }

    .headCorrecto {
        padding: 20px 5%;
    }

    .titCorrecto {
        font-size: 23px;
        line-height: 34px;
    }

    .groupInfoRespuestas {
        float: left;
        width: 48%;
        padding-top: 25px;
    }

    .groupInfoPlayer {
        float: right;
        width: 48%;
        padding-top: 14px;
    }

    #help {
        width: 64%;
        left: 18%;
    }

    .colInfoActividad {
        float: right;
        width: 62%;
    }

    .iconActividad {
        float: left;
        width: 36%;
    }

        .iconActividad img {
            max-width: 100%;
        }

    #preActividad {
        max-width: 780px !important;
        padding: 35px 16px 20px 0 !important;
    }

    .shadow {
        max-width: 796px;
    }

    #info {
        width: 35%;
        background-color: #fff;
        bottom: 60px;
        max-height: inherit !important;
        position: absolute;
        top: 100px;
        overflow: auto;
        right: 0;
        border-radius: 0;
    }

    #wrapper {
        bottom: 60px;
    }

    #footAct .btn-large {
        padding: 9px 21px;
        font-size: 15px;
        line-height: 24px;
    }

    #footAct {
        padding: 8px 0;
    }
}

@media all and (max-width:480px) {
    .boxIndicador {
        padding: 4px 0 3px;
    }

    .puntos .numIndicador {
        font-size: 36px;
        line-height: 34px;
        padding-top: 0;
    }

    .puntos .titIndicador {
        padding-bottom: 0;
    }

    .bgArrow {
        height: 18px;
    }

    #wrapper {
        top: 89px;
    }

    .titActividad {
        font-size: 14px;
    }
}

.tooltip {
    display: none\0/;
    z-index: 99999;
    font: 12px/16px Arial, Helvetica, sans-serif;
    background: #161b21;
    pointer-events: none;
    color: #fff;
    opacity: 0;
    padding: 8px 16px;
    border-radius: 2px;
    position: absolute;
    max-width: 200px;
    min-width: 80px;
    text-shadow: #000 1px 1px 3px;
    word-wrap: break-word;
    text-align: center;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
    -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    -o-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

x:-o-prefocus, #headAct .tooltip {
    display: none !important;
}

.tooltip:after, .tooltip:before {
    position: absolute;
    display: block;
    content: " ";
}

.tooltip:before {
    height: 20px;
    width: 100%;
}

.tooltip:after {
    height: 0;
    width: 0;
}

.marker:hover .tooltip {
    opacity: .85;
    display: block;
    pointer-events: auto;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}

.optionsAct a {
    position: relative;
}

.optionsAct .tooltip {
    text-indent: 0;
    margin: 0 10px 0 0;
}

.optionsAct a:hover .tooltip {
    opacity: .85;
    display: block;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}

.centro {
    left: -44px;
}

    .centro:after {
        left: 48px;
        border-left: solid transparent 8px;
        border-right: solid transparent 8px;
    }

.arriba {
    bottom: 100%;
    margin-bottom: 10px;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
}

    .arriba:after {
        border-top: solid #161b21 6px;
        bottom: -6px;
    }

    .arriba:before {
        bottom: -20px;
        left: 0;
    }

.abajo {
    top: 100%;
    margin-top: 10px;
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    transform: translateY(-10px);
}

    .abajo:after {
        border-bottom: solid #161b21 6px;
        top: -6px;
    }

    .abajo:before {
        top: -20px;
        left: 0;
    }

.derecha {
    left: 9px;
}

    .derecha:after {
        left: 0;
        border-right: solid transparent 8px;
    }

.izquierda {
    right: 9px;
}

    .izquierda:after {
        right: 0;
        border-left: solid transparent 8px;
    }

.arriba.derecha {
    border-bottom-left-radius: 0;
}

.abajo.derecha {
    border-top-left-radius: 0;
}

.arriba.izquierda {
    border-bottom-right-radius: 0;
}

.abajo.izquierda {
    border-top-right-radius: 0;
}

.btnsPistaExtra {
    background-color: #dfdfdf;
    border-radius: 0 0 3px 3px;
    padding: 14px 0;
    text-align: center;
    box-shadow: inset rgba(0,0,0,.1) 0 3px 5px;
}

    .btnsPistaExtra li {
        display: inline;
    }

.optionsAct .educaplay, .optionsAct .educaplay:hover {
    background-position: -116px 4px;
}

.titActividad a {
    text-decoration: none;
    color: #fff;
}

.superError .colInfoActividad {
    display: none;
}

#errorXML {
    font-size: 16px;
    color: #111;
    text-shadow: rgba(255,255,255,.4) 1px 1px;
}

.superError .iconActividad {
    float: none;
    width: 100%;
}

    .superError .iconActividad img {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
    }

.blockBanner {
    overflow: inherit;
}

#cerrarPubli {
    position: absolute;
    top: -26px;
    left: 24px;
    z-index: 9;
}

    #cerrarPubli.close a {
        border-radius: 50px;
        -moz-text-shadow: none;
        -webkit-text-shadow: none;
        text-shadow: none;
        line-height: 20px;
        width: 23px;
        height: 23px;
        font-size: 13px;
        box-shadow: rgba(0,0,0,0.30) 0 2px 5px;
        color: #fff;
        background-color: #292D33;
    }

@media all and (min-width:510px) {
    #cerrarPubli {
        top: -12px;
        left: 12px;
    }
}

.contentRespuesta.respuestaIncorrecta {
    background: #FFD9D9;
    box-shadow: inset 0 -1px rgba(0,0,0,.13);
    text-shadow: none;
}