$(function() {

				//all the menu items

				var $items 		= $('#cc_menu .cc_item');

				//number of menu items

				var cnt_items	= $items.length;

				//if menu is expanded then folded is true

				var folded		= false;

				//timeout to trigger the mouseenter event on the menu items

				var menu_time;

				/**

				bind the mouseenter, mouseleave to each item:

				- shows / hides image and submenu

				bind the click event to the list elements (submenu):

				- hides all items except the clicked one, 

				and shows the content for that item

				*/

				$items.unbind('mouseenter')

					  .bind('mouseenter',m_enter)

				      .unbind('mouseleave')

					  .bind('mouseleave',m_leave)

					  .find('.cc_submenu > ul > li')

					  .bind('click',function(){

					var $li_e = $(this);

						  //if the menu is already folded,

						  //just replace the content

					if(folded){

						hideContent();

						showContent($li_e.attr('class'));

					}	

					       else //fold and show the content

						fold($li_e);

				});

				

				/**

				mouseenter function for the items

				the timeout is used to prevent this event 

				to trigger if the user moves the mouse with 

				a considerable speed through the menu items

				*/

				function m_enter(){

					var $this 	= $(this);

					clearTimeout(menu_time);

					menu_time 	= setTimeout(function(){

					//img

					//$this.find('img').stop().animate({'top':'0px'},400);
                    //$this.find('img').addClass("activeimg");

					//cc_submenu ul

				/*	$this.find('.cc_submenu > ul').stop().animate({'height':'148px'},400);

					},200); */
                    
                    $this.find('.cc_submenu > ul').stop().animate({'height':'0px'},400);

					},200);

				}

				

				//mouseleave function for the items

				function m_leave(){

					var $this = $(this);

					clearTimeout(menu_time);

					//img

					//$this.find('img').stop().animate({'top':'-1000px'},400);
                    //$this.find('img').removeClass("activeimg");

					//cc_submenu ul

					$this.find('.cc_submenu > ul').stop().animate({'height':'0px'},400);

				}

				

				//back to menu button - unfolds the menu

				$('#cc_back').bind('click',unfold);

				

				/**

				hides all the menu items except the clicked one

				after that, the content is shown

				*/

				function fold($li_e){

					var $item		= $li_e.closest('.cc_item');
					//$item.addClass('index1');
					var $first = $('#first');
					//alert($item.attr('id'));
					
					
					//$first.addClass('invisible');				
					
					if($item.attr('id')!="first")
					{
							$first.addClass('invisible');
						}					

					var d = 100;

					var step = 0;

					$items.unbind('mouseenter mouseleave');

					$items.not($first).each(function(){
						//$items.each(function(){
						var $item = $(this);
						
						//$item.addClass('index0');
						
						
						$item.stop().animate({

							'marginLeft':'-110px'
							

						},d += 100,function(){

							++step;

							if(step == cnt_items-1){

								folded = true;
								/* Muestra el contenido. */
								showContent($li_e.attr('class'));

							}	

						});
						
						
					});

				}

				

				/**

				shows all the menu items 

				also hides any item's image / submenu 

				that might be displayed

				*/

				function unfold(){

					$('#cc_content').stop().animate({'left':'-1200px'},100,function(){

						var d = 100;

						var step = 0;
						
						$('.cc_title').attr("name", "1");
						$('.cont1').unbind('click');
						$('.cont2').unbind('click');
						$('.cont3').unbind('click');
						$('.cont4').unbind('click');
						$('.cont5').unbind('click');
						$('.cont6').unbind('click');
						$('.cont7').unbind('click');
						$('.cont8').unbind('click');
						

					$items.each(function(){

							var $item = $(this);

							/*$item.find('img')

								 .stop()

								 .animate({'top':'-600px'},100)

								 .andSelf()

								 .find('.cc_submenu > ul')

								 .stop()

								 .animate({'height':'0px'},100);*/

								 
$item.removeClass('invisible');
$item.removeClass('index0');
$item.removeClass('index1');
							$item.stop().animate({

							'marginLeft':'0px'

							},d += 100,function(){

								++step;

								if(step == cnt_items-1){

									folded = false;

									$items.unbind('mouseenter')

										  .bind('mouseenter',m_enter)

										  .unbind('mouseleave')

										  .bind('mouseleave',m_leave);

									

									hideContent();

								}		  

							});

						});

						$(this).oneTime(2000, "hide", function() {
						    	$(".cont1").click(function () {
           							var my=parseInt($(this).attr("name"));
									if(my==1){
										$(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
										$(".cc_content_1").trigger('click');
						                $(".cc_item").removeClass("home-z");
						                $("#first").addClass("home-z");
									}else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									}
	   				    		});
							   	$(".cont2").click(function () {
					   				var my=parseInt($(this).attr("name"));
									if(my==1){
								        $(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
					                 	$(".cc_content_2").trigger('click');
					                 	$(".cc_item").removeClass("home-z");
					                 	$("#sec2").addClass("home-z");
         							}else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									}
						        });
						        $(".cont3").click(function () {
					        		var my=parseInt($(this).attr("name"));
									if(my==1){
										$(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
					                 	$(".cc_content_3").trigger('click');
					                 	$(".cc_item").removeClass("home-z");
					                 	$("#sec3").addClass("home-z");
					                }else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									} 
						        });
						        $(".cont4").click(function () {
						        	var my=parseInt($(this).attr("name"));
									if(my==1){
										$(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
						                 $(".cc_content_4").trigger('click');
						                 $(".cc_item").removeClass("home-z");
						                 $("#sec4").addClass("home-z");
          							}else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									} 
						        });
						        $(".cont5").click(function () {
						        	var my=parseInt($(this).attr("name"));
									if(my==1){
										$(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
						                $(".cc_content_5").trigger('click');
						                $(".cc_item").removeClass("home-z");
						                $("#sec5").addClass("home-z");
          							}else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									} 
						        });
						        $(".cont6").click(function () {
						        	var my=parseInt($(this).attr("name"));
									if(my==1){
										$(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
						                $(".cc_content_6").trigger('click');
						                $(".cc_item").removeClass("home-z");
						                $("#sec6").addClass("home-z");
          							}else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									} 
						        });
						        $(".cont7").click(function () {
						        	var my=parseInt($(this).attr("name"));
									if(my==1){
										$(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
						                $(".cc_content_7").trigger('click');
						                $(".cc_item").removeClass("home-z");
						                $("#sec7").addClass("home-z");
          							}else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									} 
						        });
						        $(".cont8").click(function () {
						        	var my=parseInt($(this).attr("name"));
									if(my==1){
										$(this).attr("name", "0");
                                        $(".cc_item").attr("name", "0");
						                $(".cc_content_8").trigger('click');
						                $(".cc_item").removeClass("home-z");
						                $("#sec8").addClass("home-z");
          							}else{
										$(this).attr("name", "1");
                                        $(".cc_item").attr("name", "1");
										$(".cc_back").trigger('click');
									} 
						        });
						  });

					});

				}

				

				//function to show the content

				function showContent(idx){

					$('#cc_content').stop().animate({'left':'120px'},100,function(){

						$(this).find('.'+idx).fadeIn();

					});

				}

				

				//function to hide the content

				function hideContent(){

					$('#cc_content').find('div').hide();

				}

            });