$(document).ready(function(){
        
		// Función que conmuta el panel con un slide
		//$("#panel-content").hide();	
		$('#panel-btn').click(function () {
		  if ($("#panel-content").is(":hidden")) {
			$("#panel-content").slideDown("slow");
			// Creamos los paneles de cierre
			$("#panel").prepend('<div class="panel-outter left">&nbsp;</div>');
			$("#panel").prepend('<div class="panel-outter right">&nbsp;</div>');
			$("#panel").prepend('<div class="panel-outter bottom">&nbsp;</div>');
			
				$('.panel-outter').click(function () {
				  if ($("#panel-content").is(":hidden")) {
					$("#panel-content").slideDown("slow");
				  } else {
					$("#panel-content").slideUp("slow");
					// Eliminamos los paneles de cierre
					$("div.panel-outter").remove();
				  }
				});
				
		  } else {
			$("#panel-content").slideUp("slow");
			// Eliminamos los paneles de cierre
			$("div.panel-outter").remove();
		  }
		});
		
		// Función para cerrar a traves de los paneles laterales
		$('.panel-outter').click(function () {
		  if ($("#panel-content").is(":hidden")) {
			$("#panel-content").slideDown("slow");
		  } else {
			$("#panel-content").slideUp("slow");
			// Eliminamos los paneles de cierre
			$("div.panel-outter").remove();
		  }
		});
		
		
		// Función para colapsar y expandir los submenus del LEFT
			//Colapsa el container al cargar
			$(".toggle_container").hide(); 
			//Conmuta el estado al hacer click
			$(".trigger").toggle(function(){
				$(this).addClass("active");
				}, function () {
				$(this).removeClass("active");
			});
			//Slide up y down al hacer click
			$(".trigger").click(function(){
				$(this).next(".toggle_container").slideToggle("slow");
			});	

 		// OCULTAR PANEL-CONTENT con PF-LOGIN   
        $('#pf-login').click(function () {
          if ($("#panel-content").is(":hidden")) {
            $("#panel-content").slideDown("slow");
            // Creamos los paneles de cierre
            $("#panel").prepend('<div class="panel-outter left">&nbsp;</div>');
            $("#panel").prepend('<div class="panel-outter right">&nbsp;</div>');
            $("#panel").prepend('<div class="panel-outter bottom">&nbsp;</div>');
            
                $('.panel-outter').click(function () {
                  if ($("#panel-content").is(":hidden")) {
                    $("#panel-content").slideDown("slow");
                  } else {
                    $("#panel-content").slideUp("slow");
                    // Eliminamos los paneles de cierre
                    $("div.panel-outter").remove();
                  }
                });
                
          } else {
            $("#panel-content").slideUp("slow");
            // Eliminamos los paneles de cierre
            $("div.panel-outter").remove();
          }
        });

	 });