jQuery(document).ready(function() {
	
	/* 
	
	APLICAMOS FIX PARA NAVEGADORES Webkit (Chrome y Safari)
	
	Con document.ready, las imágenes y css es posible que aun no se hayan cargado.
	Si el navegador es de tipo Webkit, procesará el javascript y los estilos de modo paralelo,
	por tanto, intentará calcular anchos y altos antes de que tener completado el CSS o la imagen cargada.
	
	Este fix es necesario para calcular el ancho del <ul> del menu-perfiles, y el ancho .bannerspie-pagina
	para poder centrar su contenido con margin: auto.
	
	Por tanto debemos emplear window.load antes de comenzar a calcular anchos y altos.
	
	*/
	

	



	jQuery(window).load(function() {

		//jQuery('p:last-child').css("margin-bottom", "0px");
		

		jQuery.noConflict();	







	
		/***
		=========================================================================
		FIX CSS Para IE8
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 02/05/2011
		@descripcion: 
		
		Internet Explorer 8 no interpreta correctamente algunos selectores CSS,
		como por ejemplo "last-child" o "first-child". Con esta función se
		pretende subsanar dicho error.
		
		=========================================================================
		***/
		jQuery('.evento:last-child').css({margin: "0px", border: "0px none"});
		/* =================================================================== */
		



		/***
		=========================================================================
		FORMULARIOS > Al hacer focus quitamos el texto por defecto
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 23/03/2011
		@descripcion: 
		
		Con esta función lo que hacemos es eliminar el texto que aparece por 
		defecto en el campo <input>, justo cuando el usuario hace focus en él.
		
		Uso: Lee el valor del atributo value, y lo compara con lo que el usuario
		rellena. Por ejemplo:
		
		<input value="Texto por defecto" />
		
		=========================================================================
		***/
		
		function quitaypon_formularios (DOM) {
			jQuery(DOM).each(function(){
				var defaultVal = jQuery(this).attr('value');
				jQuery(this).focus(function(){
					if (jQuery(this).val() == defaultVal){
						jQuery(this).addClass('activo').val('');
					}
				})
				.blur(function(){
					if (jQuery(this).val() == ''){
						jQuery(this).removeClass('activo').val(defaultVal);
					}
				})
			});
		}
		
		quitaypon_formularios('#formularioBusquedaTexto');
		quitaypon_formularios('#form-suscribete input#nombre');
		quitaypon_formularios('#form-suscribete input#localidad');
		quitaypon_formularios('#form-suscribete input#emailsuscriptor');
		quitaypon_formularios('#form-accesotop input#user_top');
		
		
		
		
		/* =================================================================== */
		







		/***
		=========================================================================
		AVISO ESTAMOS EN PRUEBAS 
		-------------------------------------------------------------------------
		Autor: Alfonso Martin.
		Fecha: 26/01/2012
		Modificaciones: -
		=========================================================================
		***/
			
 		jQuery('.wrapper_pruebas .boton a').toggle(
			function(){
				jQuery('.wrapper_pruebas').animate({/*opacity: 0.9,*/left: 0}, 1000, function() {/*Fin de animacion*/});
			},
			function(){
				jQuery('.wrapper_pruebas').animate({/*opacity: 1,*/left: -205}, 1000, function() {/*Fin de animacion*/});
		});
			
			
		jQuery('.wrapper-cabecera,.wrapper-menuppal,.wrapper-path,.wrapper-menuppal,.wrapper-contenidos,.wrapper-posicionamiento,.wrapper-pie').on({
			click: function () {
				jQuery('.wrapper_pruebas').animate({/*opacity: 1,*/left: -205}, 1000, function() {/*Fin de animacion*/});
			}
		});





		/***
		=========================================================================
		MENU PRINCIPAL > Recolocamos los items de tercer nivel flotando 
		-------------------------------------------------------------------------
		Autor: Alfonso Martin.
		Fecha: 12/12/2011
		Modificaciones: -
		
		Colocamos los menús de tercer nivel de navegación, en 
		tres columnas, unos al lado de otros. La posición se va calculando 
		automáticamente, en función del alto de cada item.
		
  
		=========================================================================
		***/


		jQuery('ul#navigation li.nivel1').each(function(i) {
			
			var siguiente_col1_y = 15;
			var siguiente_col2_y = 15;
			var siguiente_col3_y = 15;
			var ancho_columna = 200;
			var alto_item = 0;
			var separacion_vertical_item = 8;

			
			//para calcular el alto de los items de dentro, el contenedor
			// no puede estar oculto. Le ponemos un display block y visibility hidden
			jQuery('ul.n2',this).css({display:'block'}).each(function(i) {
				
				jQuery('li.nivel2',this).each(function(){
					
					// Obtenemos el alto del item, para saber a qué altura 
					// debe colocarse el que vaya debajo de él
					alto_item = jQuery('a',this).outerHeight(true);
					alto_item = alto_item + jQuery('ul.n3',this).outerHeight(true);
					alto_item = alto_item + separacion_vertical_item;
					
					
					// Vemos en qué columna lo colocamos. Siempre irá en la columna
					// que tenga el hueco má arriba posible.
					
					// Si la siguiente posición en la columa 1, es mayor que en la 2, 
					// ponemos al item en la 2.
					if(siguiente_col1_y > siguiente_col2_y) {
						
						if(siguiente_col2_y > siguiente_col3_y) {
							// Lo colocamos en la columna 3
							jQuery(this).css({left: ancho_columna*2 + "px", top:siguiente_col3_y+"px"});
							siguiente_col3_y = siguiente_col3_y + alto_item;
						} else {
							// Lo colocamos en la columna 2
							jQuery(this).css({left: ancho_columna+"px", top:siguiente_col2_y+"px"});
							siguiente_col2_y = siguiente_col2_y + alto_item;
						}
					
					} else {
						
						if(siguiente_col1_y > siguiente_col3_y) {
							// Lo colocamos en la columna 3
							jQuery(this).css({left: ancho_columna*2 + "px", top:siguiente_col3_y+"px"});
							siguiente_col3_y = siguiente_col3_y + alto_item;
						} else {
							// Lo colocamos en la columna 1
							jQuery(this).css({left: 0+"px", top:siguiente_col1_y+"px"});
							siguiente_col1_y = siguiente_col1_y + alto_item;
						}
						
					}
					
					//alert("alto_item = " + alto_item + "\nsiguiente_col1_y = " + siguiente_col1_y + "\nsiguiente_col2_y = " + siguiente_col2_y);
					
				});
				
			});
			
			// Una vez calculado y recolocado todo por dentro, le ponemos un visibility visible
			// y display none. Es decir, lo volvemos a ocultar.
			jQuery('ul.n2',this).css({display:'none'});

			
			/*** 
			Calculamos el height del desplegable
			Cada elemento tiene su propio height, en función de los menús que haya dentro.
			No sabremos cuál es el height del contenedor hasta que no sepamos cuál va a ser
			la distribución final de los menús
			***/
			if(siguiente_col1_y > siguiente_col2_y) {
				if(siguiente_col1_y > siguiente_col3_y) jQuery('ul.n2',this).css({height:siguiente_col1_y+"px"});
				else jQuery('ul.n2',this).css({height:siguiente_col3_y+"px"});
			} else {
				jQuery('ul.n2',this).css({height:siguiente_col2_y+"px"});
				if(siguiente_col2_y > siguiente_col3_y) jQuery('ul.n2',this).css({height:siguiente_col2_y+"px"});
				else jQuery('ul.n2',this).css({height:siguiente_col3_y+"px"});
			}
		
		});
		
		
		
		/***
		=========================================================================
		MENU PRINCIPAL > Evitamos que el menú emergente sobrepase el layout 
		-------------------------------------------------------------------------
		Autor: Alfonso Martin.
		Fecha: 12/12/2011
		Modificaciones: -
		
		Esta función pretende recolocar el menú emergente de 
		segundo nivel, en caso de que se prevea que pueda salir del tamaño de la 
		pantalla del usuario.
		
		El ancho del menú emergente es de 400px. Si la opción de primer nivel
		queda demasiado cerca del borde derecho de la pantalla, es posible que
		el menú emergente sobresalga del área de la pantalla y algunas opciones
		queden ocultas.
		
		Añadimos la funcionalidad de marcar con una solapa, la pestaña en la que
		estamos, para que no haya confusión de a qué pestaña pertenece el menú
		que se despliega. Esta solapa la posicionamos de modo absolutio y la 
		recolocamos con jQuery en función de los anchos.
		
		La solapa también se ve afectada por el reposicionamiento en caso de que 
		haya que reubicar el menú emergente por desbordamiento por la derecha.
		  
		=========================================================================
		***/


		jQuery('ul#navigation li.nivel1').each(function(indice) {
			jQuery(this).on({
			
				mouseenter: function(){
				
						
					var ancho_solapa = jQuery(this).outerWidth(false) - 6;
					jQuery('.wrapper_solapa',this).css({display:"block"});
					jQuery('.solapa',this).css({width:ancho_solapa+"px"});
						
					if(!jQuery(this).is('.activo')) {
						jQuery('a',this).css("background-image", "url(/fileadmin/templates/sites/camara/images/menuprincipal/solapa.png)");
						jQuery('a',this).css("color", "#C9033A");
						jQuery('a span',this).css("background-image", "url(/fileadmin/templates/sites/camara/images/menuprincipal/solapa.png)");
					}

					var ancho_layout = 940;
					var ancho_menu_emergente = 600;
					var ancho_document = jQuery(document).width();
					
					// <------------------------------- document.width ------------------------------>
					//
					//                      |<--------- ancho_layout ---------->| 
					// ---------------------|-----------------------------------|---------------------
					//                      |  Menu nivel 1                     |                     
					// ---------------------|-----------------------------------|---------------------
					//                      |***********************************|***************
					// ---- offset -------->|*                                  |··············*
					//                      |*  Menu emergente                  |··············*
					//                      |*                                  |· X_sobrante ·*
					//                      |*                                  |··············*
					//                      |*                                  |··············*
					//                      |***********************************|***************
					//                      |*PosX0                             |              *PosX1 
					//                      |                                   | 
					
					var offset_layout = jQuery(this).parent().offset().left;
					
					// a partir de este valor, el menú no debe sobresalir.
					var limite_derecho = offset_layout + ancho_layout;
					
					// posicion eje x donde empieza el menu emergente
					// (que es la misma posicion que el <ul><li> de primer nivel, porque
					// empieza justo debajo de él)
					var PosX0 = jQuery(this).offset().left; 
					
					// posicion eje x donde acaba el menú emergente
					var PosX1 = PosX0 + ancho_menu_emergente; 
					
					// Calculo lo que sobra (o lo que falta)
					// Si el valor es negativo, es que no cabe, y nos indica lo que debemos 
					// desplazar el menú emergente hacia la izquierda para que quepa justo
					var X_sobrante = limite_derecho - PosX1; 
					
					
					// Comprobamos si no cabe en los 940px del ancho de la página
					if(X_sobrante < 0){
						jQuery('ul.n2', this).css({left: X_sobrante+"px"});
						jQuery('.wrapper_solapa',this).css({left: 5 + X_sobrante+"px"});
						jQuery('.solapa',this).css({left: -5 - X_sobrante+"px"});
					}
					
				},
				mouseleave: function(){
					
					var ancho_solapa = 0;
					jQuery('.wrapper_solapa',this).css({display:"none"});
	
					if(!jQuery(this).is('.activo')) {
						jQuery('a',this).css("background-image", "none");
						jQuery('a',this).css("color", "#ffffff");
						jQuery('a span',this).css("background-image", "none");
					}
					
					jQuery('ul.n2',this).css({diplay:'none'});
					
				}

			});
		});

		



		/***
		=========================================================================
		EFECTO VISUAL EN LOGIN EN MENU SUPERIOR
		-------------------------------------------------------------------------
		Autor: Alfonso Martin.
		Fecha: 07/12/2011
		Modificaciones: -
		
		Cuando el usuario hace click en el enlace, se le muestra el formulario 
		en una capa emergente, que permanecía oculta.
		
		Se han añadido efectos visuales a dicho formulario
		  
		=========================================================================
		***/

		jQuery.fn.pon_normal = function() {
			this.animate({backgroundColor:'#e4e4e4'});
			this.switchClass(jQuery(this).attr('class'),'normal',250);
			this.clearQueue();
			return this;
		}

		jQuery.fn.pon_over = function() { 
			this.animate({backgroundColor:'#f4f4f4'});
			this.switchClass(jQuery(this).attr('class'),'over',250);
			this.clearQueue(); 
			return this;
		}

		jQuery.fn.pon_focus = function() { 
			this.animate({backgroundColor:'#ffffff'});
			this.switchClass(jQuery(this).attr('class'),'focus',250);
			this.clearQueue(); 
			return this;
		}

		jQuery('.wrapper-top div.login').on({
			mouseenter: function() {
				jQuery('#caja_emergente_login').show();
			},
			mouseleave: function(){
				jQuery('#caja_emergente_login').hide();
				if(!jQuery('#user_top').is(":focus")) jQuery('#user_top').pon_normal();
				if(!jQuery('#pass_top').is(":focus")){
					jQuery('#pass_top').pon_normal();
					if(jQuery('#pass_top').val() == '') jQuery('#holder_top').show();
				}
			},			
			click: function () {
				if(!jQuery('#user_top').is(":focus")) jQuery('#user_top').pon_normal();
				if(!jQuery('#pass_top').is(":focus")){
					jQuery('#pass_top').pon_normal();
					if(jQuery('#pass_top').val() == '') jQuery('#holder_top').show();
				}				
			}
		});
		
		jQuery('#user_top').on({
			mouseenter: function(){
				if(!jQuery(this).is(":focus")) jQuery(this).pon_over();
			},
			mouseleave: function(){
				if(!jQuery(this).is(":focus")) jQuery(this).pon_normal();
			},
			focus: function() {
				jQuery(this).pon_focus();
				jQuery('#pass_top').pon_normal();
				if(jQuery('#pass_top').val() == '') jQuery('#holder_top').show();
			}
		});

		jQuery('#pass_top').on({
			mouseenter: function(){
				if(!jQuery(this).is(":focus")) jQuery(this).pon_over();
			},
			mouseleave: function(){
				if(!jQuery(this).is(":focus")){
					jQuery(this).pon_normal();
					if(jQuery(this).val() == '') jQuery('#holder_top').show();
				}
			},
			focus: function() {
				jQuery(this).pon_focus();
				jQuery('#user_top').pon_normal();
				jQuery('#holder_top').hide();
			},
			blur: function() {
				//if(jQuery(this).val() == '') jQuery('#holder_top').show();
			}
		});

		jQuery('#holder_top').on({
			mouseenter: function(){
				if(!jQuery('#pass_top').is(":focus")) jQuery('#pass_top').pon_over();
			},
			mouseleave: function(){
				if(!jQuery('#pass_top').is(":focus")){
					jQuery('#pass_top').pon_normal();
					if(jQuery('#pass_top').val() == '') jQuery('#holder_top').show();
				}
			},
			click: function(){
				jQuery('#pass_top').focus();
				jQuery(this).blur().hide();
			}
		});

		jQuery('#submit_top').on({
			focus: function() {
				jQuery('#user_top').pon_normal();
				jQuery('#pass_top').pon_normal();
			}
		});






		/***
		=========================================================================
		CARRUSELES > El paginador avanza junto con el carrusel
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 21/02/2011
		@descripcion: 

		Redefinimos la función del pluggin Cycle que actualiza el enlace activo del paginador 
		
		=========================================================================
		***/
		jQuery.fn.cycle.updateActivePagerLink = function(pager, currSlideIndex) { 
		    jQuery(pager).find('li').removeClass('activo')
			   .filter('li:eq('+currSlideIndex+')').addClass('activo'); 
		}; 
		
		/* =================================================================== */
		

	
		
		

		/***
		=========================================================================
		CARRUSELES INTERIORES: TIPO 05
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 05/12/2011
		@descripcion: 
		
		Utilizamos el pluggin de jQuery llamado 'Cycle' para ir rotando de un 
		contenido a otro utilizando un paginador, o incluso flechas para avanzar
		o retroceder. Pluggin Cycle: http://jquery.malsup.com/cycle/
		
		Variables:
		
		item_width -> Ancho de un item, teniendo en cuenta margin y padding
		  
		=========================================================================
		***/
		jQuery('.carrusel-05').each(function(indice_carrusel) {
			
			/* Pintamos el paginador, inyectando una cadena html en la capa del paginador */
			item_width = 24+6+6;
			total_items = jQuery(".lista-items > .item", this).size();
			total_width = (total_items * item_width);
			
			
			cadena_html_menu_carrusel = '<ul>';
			for(x=0;x<total_items;x++){
				elemento = x + 1;
				cadena_html_menu_carrusel += '<li><a tabindex="0" title="Mostrar elemento '+elemento+'"><span>'+elemento+'</span></a></li>';
			}
			cadena_html_menu_carrusel += '</ul>';

			if(total_items > 1){
				jQuery('.paginador-carrusel', this).html(cadena_html_menu_carrusel);
				jQuery('.paginador-carrusel ul li:first', this).addClass("activo");
				// jQuery('.paginador-carrusel ul', this).css({width: total_width}); /* Centramos el paginador */
				
				jQuery('.lista-items', this).cycle({speed: 1000, timeout: 8000, pager: '.carrusel-05:eq('+indice_carrusel+') .paginador-carrusel ul', pagerAnchorBuilder: function(idx, slide){return '<li></li>';}, delay: 0});
				
				jQuery('.playpause .pause',this).bind('click', function(){
					jQuery(this).parent().find('.play').removeClass('activo');
					jQuery(this).addClass('activo');
					jQuery('.carrusel-05:eq('+indice_carrusel+') .lista-items').cycle('pause');
				});
	
				jQuery('.playpause .play',this).bind('click', function(){
					jQuery(this).parent().find('.pause').removeClass('activo');
					jQuery(this).addClass('activo');
					jQuery('.carrusel-05:eq('+indice_carrusel+') .lista-items').cycle('resume', true);
				});


				jQuery('.carrusel-05:eq('+indice_carrusel+') .paginador-carrusel ul li').each(function(indice_paginador) {
					jQuery(this).click(function() {
						jQuery('.carrusel-05:eq('+indice_carrusel+') .lista-items').cycle(indice_paginador);
						jQuery('.carrusel-05:eq('+indice_carrusel+') .paginador-carrusel ul li').removeClass('activo');
						jQuery('.carrusel-05:eq('+indice_carrusel+') .paginador-carrusel ul li:eq('+indice_paginador+')').addClass('activo');
					});
				});
			}
			else {}
		
		});
		
		/* =================================================================== */
		




		/***
		=========================================================================
		CARRUSELES INTERIORES: TIPO 06
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 05/12/2011
		@descripcion: 
		
		Utilizamos el pluggin de jQuery llamado 'Cycle' para ir rotando de un 
		contenido a otro utilizando un paginador, o incluso flechas para avanzar
		o retroceder. Pluggin Cycle: http://jquery.malsup.com/cycle/
		
		Variables:
		
		item_width -> Ancho de un item, teniendo en cuenta margin y padding
		  
		=========================================================================
		***/
		jQuery('.carrusel-06').each(function(indice_carrusel) {
			
			/* Pintamos el paginador, inyectando una cadena html en la capa del paginador */
			item_width = 12+6+6;
			total_items = jQuery(".lista-items > .item", this).size();
			total_width = (total_items * item_width);
			
			
			cadena_html_menu_carrusel = '<ul>';
			for(x=0;x<total_items;x++){
				elemento = x + 1;
				cadena_html_menu_carrusel += '<li><a tabindex="0" title="Mostrar elemento '+elemento+'"><span>'+elemento+'</span></a></li>';
			}
			cadena_html_menu_carrusel += '</ul>';

			if(total_items > 1){
				jQuery('.paginador-carrusel', this).html(cadena_html_menu_carrusel);
				jQuery('.paginador-carrusel ul li:first', this).addClass("activo");
				// jQuery('.paginador-carrusel ul', this).css({width: total_width}); /* Centramos el paginador */
				
				jQuery('.lista-items', this).cycle({speed: 1000, timeout: 3000, pager: '.carrusel-06:eq('+indice_carrusel+') .paginador-carrusel ul', pagerAnchorBuilder: function(idx, slide){return '<li></li>';}, delay: 0});
				
				jQuery('.playpause .pause',this).bind('click', function(){
					jQuery(this).parent().find('.play').removeClass('activo');
					jQuery(this).addClass('activo');
					jQuery('.carrusel-06:eq('+indice_carrusel+') .lista-items').cycle('pause');
				});
	
				jQuery('.playpause .play',this).bind('click', function(){
					jQuery(this).parent().find('.pause').removeClass('activo');
					jQuery(this).addClass('activo');
					jQuery('.carrusel-06:eq('+indice_carrusel+') .lista-items').cycle('resume', true);
				});


				jQuery('.carrusel-06:eq('+indice_carrusel+') .paginador-carrusel ul li').each(function(indice_paginador) {
					jQuery(this).click(function() {
						jQuery('.carrusel-06:eq('+indice_carrusel+') .lista-items').cycle(indice_paginador);
						jQuery('.carrusel-06:eq('+indice_carrusel+') .paginador-carrusel ul li').removeClass('activo');
						jQuery('.carrusel-06:eq('+indice_carrusel+') .paginador-carrusel ul li:eq('+indice_paginador+')').addClass('activo');
					});
				});
			}
			else {}
		
		});
		
		/* =================================================================== */




		/***
		=========================================================================
		CAJAS CON PESTAÑAS > Altura variable
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 21/02/2011
		@descripcion: 

		Función que permite a los contenidos de cada pestaña, tener un alto variable.
		
		=========================================================================
		***/
		function onAfter(curr, next, opts, fwd) {
			var alto_final = jQuery(this).innerHeight()-10;
			jQuery(this).parent().animate({height: alto_final});
		}
		
		/* =================================================================== */


		/***
		=========================================================================
		CAJA CON PESTAÑAS
		-------------------------------------------------------------------------
		Autor: Alfonso Martin.
		Fecha: 23/03/2011
		Modificaciones: -
		  
		=========================================================================
		***/
		jQuery('.cajapestanas01').each(function(indice_carrusel) {

			/* Oculto el titular de cada bloque */
			jQuery('.titular-accesible', this).css({display: "none", height: 0});

			jQuery('.contenido',this).cycle({fx: 'fade', speed:   1000, timeout: 0, delay: -1000, after: onAfter});
			
			/* Pausamos la animación */			
			jQuery('.contenido', this).cycle('pause'); 
			
			/* Marcamos la primera opcion del paginador como "activa" */			
			jQuery('.cabecera-cajapestanas01 ul li:first', this).addClass("activo");

			
			jQuery('.cabecera-cajapestanas01 ul',this).children().each(function(i) {
				jQuery(this).click(function() {
					
					jQuery('.cajapestanas01:eq('+indice_carrusel+') .contenido').cycle(i);
					jQuery('.cajapestanas01:eq('+indice_carrusel+') .contenido').cycle('pause');
			
					jQuery('.cajapestanas01:eq('+indice_carrusel+') .cabecera-cajapestanas01 ul li').removeClass('activo');
					jQuery('.cajapestanas01:eq('+indice_carrusel+') .cabecera-cajapestanas01 ul li:eq('+i+')').addClass('activo');
			
				});
				jQuery(this).keypress(function(e) {
					if (e.which == '13') {
						e.preventDefault();	
						jQuery('.cajapestanas01:eq('+indice_carrusel+') .contenido').cycle(i);
						jQuery('.cajapestanas01:eq('+indice_carrusel+') .contenido').cycle('pause');
						
						jQuery('.cajapestanas01:eq('+indice_carrusel+') .cabecera-cajapestanas01 ul li').removeClass('activo');
						jQuery('.cajapestanas01:eq('+indice_carrusel+') .cabecera-cajapestanas01 ul li:eq('+i+')').addClass('activo');
					}
				});
			});
		});
		
		
		

		
		
		



		/***
		=========================================================================
		ACCESIBILIDAD > Foco accesible y llamativo sólo con tabulador (no al hacer click)
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 23/03/2011
		@descripcion: 
		
		WCAG2.0: 'Pauta 2.4.7 Focus Visible'
		
		Con esta función marcamos el foco cuando navegamos por teclado, mediante el tabulador; 
		pero si el foco lo hacemos cuando navegamos con ratón,	haciendo click, no marcamos nada.
		
		En el documento CSS debemos especificar el comportamiento de
		
		  a.marcafoco:focus,
		  a.foco { 
		      background-image: none !important; 
			 background-color: #ff0 !important;
			 color:#...... !important; 
		  }
		
		Esto debe hacerse para cada menú que sea necesario.
		
		
		=========================================================================
		***/
		function focoAccesible (dom){
			/* Eliminamos la clase que tiene por defecto, que marca el foco, sin tener javascript. */
			jQuery(dom).removeClass("marcafoco");
			/* Si levantamos la tecla [TAB], añadimos la clase "foco", pero si hacemos click no ocurrirá nada */
			jQuery(dom).keyup(function(event){if(event.keyCode==9) {jQuery(dom).addClass("foco");return false;}})
			/* Eliminamos la clase "foco" si no tenemos foco en el enlace */
			jQuery(dom).focusout(function(){jQuery(dom).removeClass("foco");})
		}

		//Quitamos el foco de teclado, si usamos el raton
		jQuery('.menu-superior ul li a').mouseout(function(){this.blur();});
		jQuery('.cabecera-pagina .login a').mouseout(function(){this.blur();});
		jQuery('.cabecera-pagina .haztesocio a').mouseout(function(){this.blur();});
		jQuery('.menu-principal ul li a').mouseout(function(){this.blur();});
		jQuery('.menunivel2 ul li a').mouseout(function(){this.blur();});
		jQuery('.path-pagina ul li a').mouseout(function(){this.blur();});
		jQuery('.playpause a').mouseout(function(){this.blur();});
		jQuery('.paginador-carrusel ul li a').mouseout(function(){this.blur();});
		jQuery('.menu-posicionamiento ul li a').mouseout(function(){this.blur();});
		jQuery('.lista-iconos ul li a').mouseout(function(){this.blur();});
		jQuery('.pie-pagina ul li a').mouseout(function(){this.blur();});

		jQuery('.menu-superior ul li a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.cabecera-pagina .login a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.cabecera-pagina .haztesocio a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.menu-principal ul li a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.menunivel2 ul li a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.path-pagina ul li a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.playpause a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.paginador-carrusel ul li a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.menu-posicionamiento ul li a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.lista-iconos ul li a').each(function(){focoAccesible(jQuery(this));});
		jQuery('.pie-pagina ul li a').each(function(){focoAccesible(jQuery(this));});

		/* =================================================================== */
		
		




		/***
		=========================================================================
		ACCESIBILIDAD > Independiente del dispositivo. Manejable con teclado
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 23/08/2011
		@descripcion: 
		
		WCAG2.0: 'Pauta 2.1: Keyboard Accessible: Make all functionality available from a keyboard. '
		
		Hacemos que el paginador del carrusel, así como los controles de play y
		pausa, sean accesibles mediante teclado.
		
		=========================================================================
		***/
		jQuery('.paginador-carrusel ul li a').keydown(function(e) {
			if (e.keyCode == 13 || e.keyCode == 32) {
				jQuery(this).trigger('click');
			}
		});
		jQuery('.playpause a').keydown(function(e) {
			if (e.keyCode == 13 || e.keyCode == 32) {
				jQuery(this).trigger('click');
			}
		});

		/* Menu principal tambien accesible con teclado */
		
		jQuery('.menu-principal ul li').focusin(function(){
			jQuery('ul',this).css({'display':'block'});
		});
		jQuery('.menu-principal ul li ul li:last-child').focusout(function(){
			jQuery(this).parent().css({'display':'none'});
		});

		/* Menu login tambien accesible con teclado */
		
		jQuery('.cabecera-pagina .login').focusin(function(){
			jQuery('#caja_emergente_login',this).css({'display':'block'});
		});
		jQuery('.cabecera-pagina .haztesocio').focusin(function(){
			jQuery(this).parent().find('.login #caja_emergente_login').css({'display':'none'});
		});

		
		/* =================================================================== */
		
		
		
		

		/***
		=========================================================================
		ACCESIBILIDAD > Mostramos contenido accesible sin javascript
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 23/03/2011
		@descripcion: 
		
		WCAG2.0: -
		
		Con esta función ocultamos el contenido que ha sido marcado específicamente
		para ser mostrado en caso de que el usuario no tenga activado javascript.
		
		Si el usuario no tiene javascript, esta función no se ejecuta, y por tanto
		todos los elementos con class="sinjavascript" seguirán teniendo dicha clase.
		
		En el CSS:
		
		  .sinjavascript {
			float:none !important;

			display:block !important;
			position:relative !important;
			height:auto !important;
			min-height:100%;
			overflow:hidden !important;
		  }
		
		Si esta clase no es removida, el elemento que la lleve será mostrado.
		
		
		=========================================================================
		***/
		jQuery('.sinjavascript').removeClass("sinjavascript");
		/* =================================================================== */
		





		/***
		=========================================================================
		ACCESIBILIDAD > Inyectamos etiquetas WAI-ARIA
		-------------------------------------------------------------------------
		@autor: Alfonso Martin
		@fecha: 24/08/2011
		@descripcion: 
		
		Inyectamos etiquetas WAI-ARIA, en pro de la accesibilidad, aunque no valide
		
		WCAG2.0: http://www.w3.org/TR/wai-aria/

		=========================================================================
		***/
		if(jQuery('.wrapper-logotipo .logotipo').attr('role')==""){jQuery('.wrapper-logotipo .logotipo').attr('role', 'banner');}
		if(jQuery('.menu-principal ul').attr('role')==""){jQuery('.menu-principal ul').attr('role', 'navigation');}
		if(jQuery('#buscador').attr('role')==""){jQuery('#buscador').attr('role', 'search');}
		if(jQuery('.col-main').attr('role')==""){jQuery('.col-main').attr('role', 'content');}
		if(jQuery('.copyright').attr('role')==""){jQuery('.copyright').attr('role', 'contentinfo');}
		if(jQuery('.required').attr('role')==""){jQuery('.required').attr('aria-required', 'true');}
		/* =================================================================== */
		



	});
});