#lienzo { position:relative; width:100%;  }
#control{ position:absolute;font-size:16px;opacity:0;-webkit-user-modify: read-write-plaintext-only;}
#control:focus{-webkit-user-modify: read-write-plaintext-only;}
.casilla { position:absolute; background-color:transparent; cursor: pointer; text-shadow:rgba(0,0,0,.14)0 0 2px; text-align:center;
   -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
       -o-transition: all 0.3s;
          transition: all 0.3s;
}
label, input, button, select, textarea, body {
font: 14px/19px "Segoe UI", Segoe, Optima, Candara, "DejaVu Sans", Calibri, Arial, sans-serif;
}
@media all and (min-width:600px) {
	#wrapper {width:65%!important; border-right:1px solid #fff; bottom:60px;}
}
.contentPista {	padding: 24px 12px;}

#info{
	display:block;
}

#info, .contentPista { background-color:#f1f1f1;}
#scroller, #wrapper, #lienzo { background:#fff;}

@media all and (max-width:600px) {
	#info, .contentPista { background-color:#fff;}
}

@media all and (max-width:460px) {
	#footAct .btn-large, #footAct .btn { padding:4px;}
}


#imagenDescubrir{
	width:100%;
	height:auto;
}

.cuadros {
	position:absolute;
background: #fdb100;
background: -moz-linear-gradient(top,  #fdb100 0%, #fb8f00 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdb100), color-stop(100%,#fb8f00));
background: -webkit-linear-gradient(top,  #fdb100 0%,#fb8f00 100%);
background: -o-linear-gradient(top,  #fdb100 0%,#fb8f00 100%);
background: -ms-linear-gradient(top,  #fdb100 0%,#fb8f00 100%);
background: linear-gradient(to bottom,  #fdb100 0%,#fb8f00 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdb100', endColorstr='#fb8f00',GradientType=0 );

	box-shadow:inset #ffc338 1px 1px, rgba(0,0,0,.25) 0 0 3px;
}

/* sound player */

.soundPlayer { z-index:999; }
.iPlayerReducido { display:block; width:15px; height:18px; background-image:url(../img/iPlayerReducido.png); background-repeat:no-repeat;}
.iPlay { background-position: center -34px;}
.iPause { background-position: center -7px;}

.errorSound { width:45px; height:28px; background: url(../img/errorSoundBlack.png) no-repeat center center; cursor:help;}
.errorSound { background: url(../img/errorSoundWhite.png) no-repeat center center;}

.errorSound {display:none;}

/* input */

.cajaInput { padding:8px 0; background-color:#F4F4F4;}
.cajaInput input { font:14px/19px "Segoe UI", Segoe, Optima, Candara, "DejaVu Sans", Calibri, Arial, sans-serif;
border:1px solid #d1d1d1; padding:6px; border-radius:1px; width:90%; margin:0 auto; display:block; background-color:#fff;
border-top-color:#bababa; color:#111;
	transition:  all .5s;
	-moz-transition:  all .5s;
}
.cajaInput input:focus, .cajaInput input:active { border-color:rgb(253,178,0);}
.errorInput input{
	border-color:#cc3b2d;
	box-shadow:#fb9b8c 0 0 4px;
}

/* mostrar pistas */
.pistasPrincipal { padding:4px 0 8px;}
.pistasPrincipalTexto { background-color:#fff; border-top:1px solid #ddd; 
min-height: 49px;
box-sizing: border-box;
 margin:14px 6% 0; position:relative; padding:14px 20px; text-align:center;}
.pistasPrincipalImagen .numeritos {
	height:46px;
	background-image: url(../img/pistaRe.png);
	background-repeat: no-repeat;
	text-align:center;
	line-height:44px;
	background-position: center center;
	color:#fff;
	font-weight:bold;
	font-size:15px;
	text-shadow:rgba(0,0,0,.1) -1px -1px;
}
.txtPista { overflow:auto; max-height:240px; font-size:14px; text-align:center;}

@media all and (min-width:460px) {
.pistasPrincipal { min-height:66px;}
.pistasPrincipalTexto { border:1px solid #ddd; margin:7px 6% 0 120px; position:relative; border-radius:8px; text-align:left; }
.pistasPrincipalTexto:before, .pistasPrincipalTexto:after {
    top: 14px;
    content: "";
    left: -10px;
    position: absolute;
    z-index: 9;
    border: solid;
    border-color: transparent #cdcdcd;
    border-width:10px 10px 10px 0;
}
.pistasPrincipalTexto:after { border-color: transparent #fff; left: -9px;}
.pistasPrincipalImagen .numeritos {	
	height:70px;
	background-image: url(../img/pista.png);
	font-size:17px;
		line-height:68px;
width:118px; float:left;}
.txtPista { max-height:130px; font-size:15px; font-weight:bold; text-align:left;}
.cajaInput { width:92%; margin:0 auto;}
}

.imagenPrincipal { width:68%; margin:11px auto 1px; position:relative;}
.cajaInput { margin-bottom:10px;}
/* pista */

.contentPista { text-align:center;}
.contentPista ol { padding:20px 10px; margin:0;}
.contentPista li { display:inline; font-size:0; list-style-type:none;}
.cajaPista {
	overflow:hidden;
	display:inline-block;
	color:#fff;
	margin:3px;
	width:58px;
	height:58px;
	background-color:rgba(0,0,0,.04);
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #b9b9b9;
	border-right-color: #eeeeee;
	border-bottom-color: #f3f3f3;
	border-left-color: #cbcbcb;
	box-shadow:#fff 1px 1px;
	border-radius:1px;
	position:relative;
	-moz-transition:1s all;
	transition:1s all;
}

.activo { border:1px solid #fdb700; border-radius:2px; box-shadow:#fdb700 0 0 3px; background-color:#fff9e8;}
@keyframes caerNum
{
	from {top:-100%;}
	40% {top:30%;}
	65% { top:-25%;}
	80% { top:12%;}
	90% { top:-8%;}
	to {top:0;}
}

@-moz-keyframes caerNum
{
	from {top:-100%;}
	40% {top:30%;}
	65% { top:-25%;}
	80% { top:12%;}
	90% { top:-8%;}
	to {top:0;}
}
@-webkit-keyframes caerNum
{
	from {top:-100%;}
	40% {top:30%;}
	65% { top:-25%;}
	80% { top:12%;}
	90% { top:-8%;}
	to {top:0;}
}
@-o-keyframes caerNum
{
	from {top:-100%;}
	40% {top:30%;}
	65% { top:-25%;}
	80% { top:12%;}
	90% { top:-8%;}
	to {top:0;}
}

.cajaPista .numeritos {
	height:100%;
	width:100%;
	background-image: url(../img/pistaRe.png);
	background-repeat: no-repeat;
	background-position: center center;
	font-size:14px; font-weight:bold; line-height:54px;
	text-shadow:rgba(0,0,0,.1) -1px -1px;
	cursor:pointer;
	position:absolute; top:0;

}

/* imagen */
#divImagen img { max-width:100%; height:auto;}
#lienzo { overflow:auto;}

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

@media all and (max-width:460px) {
	.imagenPrincipal { width:90%;}
}
@media all and (min-width:600px) {
	.cajaPista .numeritos {
	animation: caerNum 1.2s;
	-moz-animation: caerNum 1.2s;
	-webkit-animation: caerNum 1.2s; 
	-o-animation: caerNum 1.2s; 
}
}
/* scroll */
#scroller, #lienzo { height:100%;}
#lienzo { overflow:auto;}

/* correcion */
#correccion  { 
	padding:14px 0;
}
#divRespuestaF { padding:0 5%;}
@media (min-width: 600px){
	#correccion  { 
		float: left;
		width: 48%;
		padding:30px 0 0;
	}
	#divRespuestaF { padding:0 0 0 8%;}
}

#divRespuestaImagenF img { width:100%; height:auto;}
.respuestaUser {
	background-color:#111;
	padding:10px 6px;
	text-align:center;
	font-weight:bold;
	font-size:15px;
	margin-bottom:12px;
	border-bottom:2px solid #7cb139;
	box-shadow:rgba(0,0,0,.2) 0 2px 7px;
	word-wrap: break-word;
}
.respuestaIncorrecta {
	text-decoration:line-through;	
	border-bottom-color:#d53838;
}
.titRespuestas {
	border-bottom:1px dotted rgba(255,255,255,.2);
	margin-bottom:12px;
	line-height:18px;
	padding:9px 2px;	
}
.respuestasAutor ul {
	margin:0 0 18px 13px;
}
.respuestasAutor li {
	padding-left:24px;
	margin-bottom:4px;
	background-image: url(../img/iCheckRe.png);
	background-repeat: no-repeat;
	background-position: 0 7px;
	list-style-type:none;
}
.feedback { padding:20px 18px 26px; background-color:#fff; border-radius:3px; color:#26282a; box-shadow:rgba(0,0,0,.3) 0 4px 7px;}
.titFeedBack { border-bottom:1px solid #ddd; padding:0 2px 10px; margin-bottom:10px; font-weight:bold; }

.txtFeedBack { font-size:13px; padding:2px;}
.txtFeedBack p { padding:0; margin:0 0 14px;}

.txtFeedBack p:last-child { margin:0;}
.errorImagen { border:2px dashed #ddd;  border-radius:3px; margin-bottom:14px; text-align:center; padding:8px; color:#555; font-weight:bold;}
#errorAudio{
	margin-top:5px;
	border:2px dashed #ddd;
	background-color:#fff;
	padding:3px;
	vertical-align:middle;
	background-image:url(../img/errorSoundBlack.png);
	border-radius:3px;
}
/* android 2.0*/
.android #wrapper {overflow:inherit; position:relative; bottom:0; top:0; padding-bottom:45px;}
.android #footAct { position:relative; position:fixed; bottom:0; z-index:9999;}
.android #contentPreActividad, .android #preLoad { z-index:99999; position:relative;}

/* marca de agua */
.mEduca { 
	height:30px; width:113px;
	bottom:8px; right:0px;
	z-index:9999;
	opacity:0;
	transition:all .6s;
	pointer-events: none;
    background-image:url(../img/mEducaWhite.png); background-repeat:no-repeat; position:absolute;
}
#bodyAct:hover .mEduca { opacity:1;}
@media all and (min-width:600px) {
	.mEduca {  	bottom:14px;}
}