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

#tablero{width:100%; height:100%; overflow:hidden; position:relative;}
#fondo{background: url(../img/fondo.jpg) no-repeat; width:709px; height:400px; position:absolute; bottom:0; left:0;}
#salida{background:url(../img/salida.png) no-repeat; width:56px; height:60px; position:absolute; right:153px; bottom:100px; display:block; cursor:pointer;}
#paradero{ background:url(../img/estacion.png) no-repeat; width:101px; height:54px; position:absolute; left:368px; top:231px;}
#gotaEsperando{ background:url(../img/gota.png) no-repeat; width:47px; height:49px; position:absolute; left:393px; top:240px;}
/*#gotaCamion{ background:url(../img/bus_derecha.png) no-repeat; width:56px; height:63px; position:absolute; left:390px; top:233px; display:none; z-index:5;}*/
#gotaCamion{ background:url(../img/gota.png) no-repeat; width:47px; height:49px; position:absolute; left:393px; top:240px; display:none; z-index:5;}
#salida img, #estrella img, #nubresClaras img, #nubesObscuras img, #pico img, #rio img{ display:none;}
/*#gotaCasco{ background:url(../img/bus_burbuja.png) no-repeat; width:58px; height:66px; position:absolute; right:100px; bottom:45px; display:none;}*/
#gotaCasco{ background:url(../img/gota.png) no-repeat; width:47px; height:49px; position:absolute; right:75px; bottom:36px; display:none;}
#panelPregunta{ background:#00586f; border:3px solid #003f53; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; width:370px; min-height:105px; position:absolute; left:24px; top:20px; padding:5px; display:none; font-family:museo; font-size:16px; color:#FFF; z-index:10;}

#panelAyuda{ background:#00586f; border:3px solid #003f53; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; width:280px; min-height:105px; position:absolute; left:24px; top:175px; padding:5px; display:none; font-family:museo; font-size:12px; color:#FFF; z-index:10;}

input{background:none; border:0; border-bottom:1px solid #FFF; font-family:museo; font-size:16px; color:#FFF; font-weight:300 !important;}
#comprobar{ display:none; cursor:pointer;}
#panelAyuda span{ position:absolute; font-size:18px; color:#FFF; top:3px; right:5px; display:block; cursor:pointer;}
#panelPregunta h2, #panelAyuda h2{ margin-bottom:10px; border-bottom:1px solid #FFF; margin-top:0; font-size:16px; font-weight:300; text-align:center;}
#panelAyuda h2{ padding:0 5px;}

#retroalimentacion{ background:#00586f; border:3px solid #003f53; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; width:350px; position:absolute; right:165px; top:150px; padding:30px 5px 30px 5px; display:none; font-family:museo; font-size:17px; color:#FFF; text-align:center; z-index:50;}
#cerrar{ background:url(../img/close.png) no-repeat; width:19px; height:18px; display:block; cursor:pointer; display:block; position:absolute; right:10px; top:10px;}

#nubesClaras{ background:url(../img/nubes_claras.png) no-repeat; width:118px; height:74px; position:absolute; left:487px; top:94px;}
#nubesObscuras{ background:url(../img/nubes_obscuras.png) no-repeat; width:118px; height:75px; position:absolute; left:295px; top:5px;}
#estrella { background:url(../img/estrella.png) no-repeat; width:54px; height:21px; position:absolute; bottom:18px; right:72px;}
#pico{ background:url(../img/cima_montana.png) no-repeat; width:60px; height:48px; position:absolute; top:56px; left:141px;}
#rio{ background:url(../img/rio.png) no-repeat; width:183px; height:109px; position:absolute; left:114px; top:208px;}
#reiniciar{ cursor:pointer;}
#ayuda{ cursor:pointer; display:none;}
#panelAyuda ul{ margin:0; padding:0;}
#panelAyuda ul li{ float:left; display:block; min-width:85px; margin-bottom:3px; margin-left:5px; font-size:16px;}