// JavaScript Document
$(document).ready(function(){
						   
//Use jQuery to hide divs

	$('#about').hide();
	$('#projects').hide();
	$('#blogs').hide();
	$('#portfolios').hide();
	$('#hire').hide();
	$('#contact').hide();
	
//End 'hide divs
						   
	$.fn.qtip.styles.buttonsClick = { // Last part is the name of the style
	   width: 450,
	   background: '#a2a2a2',
	   color: '#555555',
	   //fontWeight: 'bold',
	   fontFamily: 'Lucida Sans Unicode',
	   fontSize: '13px',
	   textAlign: 'left',
	   border: {
		  width: 2,
		  radius: 10,
		  color: '#666666'
	   },
	   tip: 'bottomMiddle',
	   name: 'dark' // Inherit the rest of the attributes from the preset 'dark' style
	}
	
	$.fn.qtip.styles.right = { // Last part is the name of the style
	   width: 330,
	   background: '#a2a2a2',
	   color: '#555555',
	   //fontWeight: 'bold',
	   fontFamily: 'Lucida Sans Unicode',
	   fontSize: '13px',
	   textAlign: 'left',
	   border: {
		  width: 2,
		  radius: 10,
		  color: '#666666'
	   },
	   tip: 'bottomRight',
	   name: 'dark' // Inherit the rest of the attributes from the preset 'dark' style
	}
	
	$.fn.qtip.styles.leftLarge = { // Last part is the name of the style
	   width: 460,
	   background: '#a2a2a2',
	   color: '#555555',
	   //fontWeight: 'bold',
	   fontFamily: 'Lucida Sans Unicode',
	   fontSize: '13px',
	   textAlign: 'left',
	   border: {
		  width: 2,
		  radius: 10,
		  color: '#666666'
	   },
	   tip: 'bottomLeft',
	   name: 'dark' // Inherit the rest of the attributes from the preset 'dark' style
	}
	
	$("li.about").qtip({
	   content: $("#about"),
	   show: 'click',
	   hide:  { 
			effect: { 
			type: 'fade',
			length: 500
			},
			when: { 
			event: 'unfocus' 
			}
	   },
	   style: 'leftLarge', // The name of the newly created custom style above
	   position: {
		  adjust: { 
		  	 //screen: true
			 x: 75, y: 0
		  },
		  corner: {
			 target: 'topLeft',
			 tooltip: 'bottomLeft'
		  }
	   }
	});
	
	$("li.projects").qtip({
	   content: $("#projects"),
	   show: 'click',
	   hide:  { 
			effect: { 
			type: 'fade',
			length: 500
			},
			when: { 
			event: 'unfocus' 
			}
	   },
	   style: 'buttonsClick', // The name of the newly created custom style above
	   position: {
		  corner: {
			 target: 'topMiddle',
			 tooltip: 'bottomMiddle'
		  }
	   }
	});
	
	$("li.blogs").qtip({
	   content: $("#blogs"),
	   show: 'click',
	   hide:  { 
			effect: { 
			type: 'fade',
			length: 500
			},
			when: { 
			event: 'unfocus' 
			}
	   },
	   style: 'buttonsClick', // The name of the newly created custom style above
	   position: {
		  corner: {
			 target: 'topMiddle',
			 tooltip: 'bottomMiddle'
		  }
	   }
	});
	
	$("li.portfolios").qtip({
	   content: $("#portfolios"),
	   show: 'click',
	   hide:  { 
			effect: { 
			type: 'fade',
			length: 500
			},
			when: { 
			event: 'unfocus' 
			}
	   },
	   style: 'buttonsClick', // The name of the newly created custom style above
	   position: {
		  corner: {
			 target: 'topMiddle',
			 tooltip: 'bottomMiddle'
		  }
	   }
	});
	
	$("li.hire").qtip({
	   content: $("#hire"),
	   show: 'click',
	   hide:  { 
			effect: { 
			type: 'fade',
			length: 500
			},
			when: { 
			event: 'unfocus' 
			}
	   },
	   style: 'buttonsClick', // The name of the newly created custom style above
	   position: {
		  corner: {
			 target: 'topMiddle',
			 tooltip: 'bottomMiddle'
		  }
	   }
	});
	
	$("li.contact").qtip({
	   content: $("#contact"),
	   show: 'click',
	   hide:  { 
			effect: { 
			type: 'fade',
			length: 500
			},
			when: { 
			event: 'unfocus' 
			}
	   },
	   style: 'right', // The name of the newly created custom style above
	   position: {
		  adjust: { 
		  	 //screen: true
			 x: -75, y: 0
		  },
		  corner: {
			 target: 'topRight',
			 tooltip: 'bottomRight'
		  }
	   }
	});
	
});