$(document).ready(function() 
{

	var cc = 10;

   // Use the each() method to gain access to each elements attributes
   $('a[rel]').each(function()
   {
		
		var coords = $(this).attr('rel').split('-');
		$(this).css({
			'margin-left': coords[0] + 'px', 
			'margin-top': coords[1] + 'px',
			width: coords[2] + 'px',			
			height: coords[3] + 'px',
			'z-index': cc++
		});   		
   
      $(this).qtip(
      {
      
		content: '<img src="'+coords[4]+'" />',
		position: {
			corner: {
				target: 'topMiddle',
				tooltip: 'bottomMiddle'
			}
		},   
		style: {
			tip: true,
			width: 250,
			padding: 0,
				border: {
					width: 0
				},
			background: 'transparent',
			name: 'dark'
		}
      })
   });
   
   $('.modal').colorbox({
   		iframe: true,
   		width: '80%',
   		height: '70%'
   });
   
   $('.flipbook').colorbox({
  		iframe: true,
  		width: '85%',
  		height: '95%'
  }); 
});