$(document).ready(function(){

	$('#itinerary').tablesorter({
		cssHeader: "theader",
		widgets: ['zebra']
		});
		
	/*
	-------------
		Pop up
	-------------
	*/
	$(".login-container").hide();
	  
	$(".fbox").fancybox({
				'transitionIn'	: 'elastic',
				'transitionOut'	: 'elastic',
				'easingIn'      : 'easeOutBack',
				'easingOut'     : 'easeInBack'		
	});  

	/*
	-------------
		tooltip
	-------------
	*/
	$(".clpl").qtip({
			  style: { 
			  width: { min: 330 },
			  padding: 4,
			  background: '#b9b9b9',
			  textAlign: 'center',
			  border: {
			  radius: 5,
			  color: '#b9b9b9'
			  },
			  tip: { // Now an object instead of a string
				 corner: 'bottomMiddle', // We declare our corner within the object using the corner sub-option
				 color: '#6699CC',
				 size: {
					x: 8, // Be careful that the x and y values refer to coordinates on screen, not height or width.
					y : 8 // Depending on which corner your tooltip is at, x and y could mean either height or width!
					}
			 },
			 classes: { tooltip: 'clpl' } 
			 
		   },
			position: { 
			  corner: {
				  target: 'topLeft', //   Where the balloon tip has to point to on the element 
				  tooltip: 'bottomMiddle'//Where the arrow for balloon tip has to be placed in tip-balloon 
			  }
		}
	})
	$(".pse,.cia").qtip({
			  style: { 
			  width: { min: 200 },
			  padding: 4,
			  background: '#b9b9b9',
			  textAlign: 'center',
			  border: {
			  radius: 5,
			  color: '#b9b9b9'
			  },
			  tip: { // Now an object instead of a string
				 corner: 'bottomMiddle', // We declare our corner within the object using the corner sub-option
				 color: '#6699CC',
				 size: {
					x: 8, // Be careful that the x and y values refer to coordinates on screen, not height or width.
					y : 8 // Depending on which corner your tooltip is at, x and y could mean either height or width!
					}
			 },
			 classes: { tooltip: 'myCustomStyle' } 
			 
		   },
			position: { 
			  corner: {
				  target: 'topLeft', //   Where the balloon tip has to point to on the element 
				  tooltip: 'bottomMiddle'//Where the arrow for balloon tip has to be placed in tip-balloon 
			  }
		}
	})
	$('.clpl, .pse, .cia, .event-title').click(function(){
		return false;
	})
	$('.event-title').qtip({
	content: {
	   title: {
		text: "",
		  button: '<a href="#">Close</a>'
		  }
	   },
		 show: {
			when: 'click',
			solo: true // Only show one tooltip at a time
		  },
		  hide: 'click',
		  style: { 
			  width: 405,
			  padding: 5,
			  background: '#b9b9b9',
			  textAlign: 'left',
			  border: {
			  radius: 5,
			  color: '#b9b9b9'
			  },
			  tip: { // Now an object instead of a string
			 corner: 'bottomLeft', // We declare our corner within the object using the corner sub-option
			 color: '#6699CC',
			 size: {
				x: 8, // Be careful that the x and y values refer to coordinates on screen, not height or width.
				y : 8 // Depending on which corner your tooltip is at, x and y could mean either height or width!
				}
			}
			 
		},
		position: { 
			  corner: {
				  target: 'topLeft', //   Where the balloon tip has to point to on the element 
				  tooltip: 'bottomLeft'//Where the arrow for balloon tip has to be placed in tip-balloon 
			  }
		}
	})



}); //document.ready()



