@import url(http://fonts.googleapis.com/css?family=Indie+Flower);
@import url(http://fonts.googleapis.com/css?family=Permanent+Marker);
@import url(http://fonts.googleapis.com/css?family=Walter+Turncoat);


// ------------------------------------------
// Tuneando lo que está en test-generico.less
// ------------------------------------------
.tipografia_titulo_pregunta {
  font-size: 25px;
}

.pregunta_grupo button, .pregunta_grupo .respuesta_opcion {
  font-size: 17px;
}

li button, .pregunta_grupo .respuesta_opcion {
  min-height: 30px;
  width: 380px;
}


// ------------------
// Inicio -----------
// ------------------
#inicio {
  position: absolute;
  width: 480px;
  left: 80px;
  top: 130px;

  text-align: center;
}

#inicio_globo {
  position: absolute;
  left: 480px;
  top: 20px;
  z-index: 2;
}

#inicio_mensaje {
  padding: 20px;
}

#comenzar_cuestionario {
  top: 10px;
}



// ------------------
// Objetos paseadores
// ------------------

#mundo_click {
  position: absolute;
  background-image: url("../../assets-common/images/mundo.png");
  width: 82px;
  height: 91px;

  top: 100px;
  left: 40px;

}

#charlatan {
  position: absolute;
  background-image: url("images/personaje1.png");
  width: 141px;
  height: 264px;

  top: 120px;
  left: 500px;
}

#computadora {
  position: absolute;
  background: url("../../assets-common/images/computadora_ilustracion.png");
  width: 135px;
  height: 141px;

  top: 200px;
  left: 50px;
}

#slider_personaje {
  position: absolute;
  background: url("images/flecha.png") no-repeat;
  width: 42px;
  height: 28px;
  top: -20px;
  left: 0;
}

#slider_linea_progreso {
  position: absolute;
  background: url("images/slider_linea_progreso.png") no-repeat;
  width: 517px;
  height: 18px;
  top: 55px;
  left: 50px; // min: 50px y max: 400px (hay 350 de diferencia)
}

#slider_fin {
  position: absolute;
  background: url("images/mundo.png") no-repeat;
  width: 37px;
  height: 39px;
  top: 13px;
  left: 650px;
}

#bloque_slider {
  position: absolute;
  width: 550px;
  height: 100px;
  left: 120px;
  top: -15px;
  overflow: hidden;
}