$.fn.qtip.styles.etusivu = { // Last part is the name of the style
   width: 530,
   background: '#000',
   color: 'black',
   textAlign: 'center',
   border: {
      width: 7,
      radius: 8,
      color: '#000'
   },
	tip: 'leftBottom',

   name: 'dark' // Inherit the rest of the attributes from the preset dark style
}

$.fn.qtip.styles.etusivu2 = { // Last part is the name of the style
   width: 365,
   background: '#000',
   color: 'black',
   textAlign: 'center',
   border: {
      width: 7,
      radius: 5,
      color: '#000'
   },
	tip: 'leftBottom',

   name: 'dark' // Inherit the rest of the attributes from the preset dark style
}


// Create the tooltips only on document load
$(document).ready(function() 
{
   // By suppling no content attribute, the library uses each elements title attribute by default
   $('#etusivu1').qtip({
      content: '<img src="uploads/images/etusivu1_iso.jpg" alt="" />',
      style: 'etusivu',
      position: { 
 		corner: {
         		target: 'rightMiddle',
         		tooltip: 'bottomLeft'
      		}
	}
	
   });

   $('#etusivu2').qtip({
      content: '<img src="uploads/images/etusivu2_iso.jpg" alt="" />',
      style: 'etusivu2',
       position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}

   });

  $('#etusivu3').qtip({
      content: '<img src="uploads/images/etusivu3_iso.jpg" alt="" />',
      style: 'etusivu2',
      position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
   });

  $('#etusivu4').qtip({
      content: '<img src="uploads/images/etusivu4_iso.jpg" alt="" />',
 	style: 'etusivu',
        position: { 
 		corner: {
         		target: 'rightMiddle',
         		tooltip: 'bottomLeft'
      		}
	}
   });


  $('#etusivu5').qtip({
      content: '<img src="uploads/images/etusivu5_iso.jpg" alt="" />',
      style: 'etusivu',
       position: { 
 		corner: {
         		target: 'rightMiddle',
         		tooltip: 'bottomLeft'
      		}
	}
   });

  $('#etusivu6').qtip({
      content: '<img src="uploads/images/etusivu6_iso.jpg" alt="" />',
      style: 'etusivu2',
        position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
  });

  $('#etusivu7').qtip({
      content: '<img src="uploads/images/etusivu7_iso.jpg" alt="" />',
      style: 'etusivu',
       position: { 
 		corner: {
         		target: 'rightMiddle',
         		tooltip: 'bottomLeft'
      		}
	}
  });
  $('#etusivu8').qtip({
      content: '<img src="uploads/images/etusivu8_iso.jpg" alt="" />',
      style: 'etusivu2',
 position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
  });

  $('#etusivu9').qtip({
      content: '<img src="uploads/images/etusivu9_iso.jpg" alt="" />',
      style: 'etusivu2',
        position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
   });

 $('#etusivu10').qtip({
      content: '<img src="uploads/images/etusivu10_iso.jpg" alt="" />',
      style: 'etusivu',
        position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
   });

 $('#etusivu14').qtip({
      content: '<img src="uploads/images/etusivu14_iso.jpg" alt="" />',
      style: 'etusivu2',
        position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
   });

 $('#etusivu15').qtip({
      content: '<img src="uploads/images/etusivu15_iso.jpg" alt="" />',
      style: 'etusivu',
        position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
   });

 $('#etusivu16').qtip({
      content: '<img src="uploads/images/etusivu16_iso.jpg" alt="" />',
      style: 'etusivu',
        position: { 
 		corner: {
         		target: 'rightBottom',
         		tooltip: 'bottomLeft'
      		}
	}
   });

});