window.onload = function (){
  var img1_src = "/img/portfolio/specmash.jpg",
   		img2_src = "/img/portfolio/bravo_logo.jpg",
      img3_src = "/img/portfolio/elis.jpg",
   	  img4_src = "/img/portfolio/polm.jpg",
      img5_src = "/img/portfolio/shopingcard.jpg",
   	  img6_src = "/img/portfolio/bear.jpg",
      angle = 0;
  document.getElementById("page_portfolio").innerHTML = "";
  var R = Raphael("page_portfolio", 980, 380);
  
  var img1 = R.image(img1_src, 570, 60, 291, 189); var img1_back = R.image(img1_src, 570, 60, 291, 189).hide().animate({rotation: -6}, 0).toBack().show(); img1.animate({rotation: -6}, 0);
  var img2 = R.image(img2_src, 40, 160, 181, 146);var img2_back = R.image(img2_src, 40, 160, 181, 146).hide().animate({rotation: -7}, 0).toBack().show();img2.animate({rotation: -7}, 0);
  var img3 = R.image(img3_src, 248, 115, 277, 189);var img3_back = R.image(img3_src, 248, 115, 277, 189).hide().animate({rotation: 20}, 0).toBack().show();img3.animate({rotation: 20}, 0);
  var img4 = R.image(img4_src, 90, 50, 353, 184);var img4_back = R.image(img4_src, 90, 50, 353, 184).hide().animate({rotation: 4}, 0).toBack().show();img4.animate({rotation: 4}, 0);
  var img5 = R.image(img5_src, 474, 107, 178, 170);var img5_back = R.image(img5_src, 474, 107, 178, 170).hide().animate({rotation: 4}, 0).toBack().show();img5.animate({rotation: 4}, 0);
  var img6 = R.image(img6_src, 720, 120, 204, 214);var img6_back = R.image(img6_src, 720, 120, 204, 214).hide().animate({rotation: 4}, 0).toBack().show();img6.animate({rotation: 4}, 0);
  
   $(img1.node).mouseover(function(evt) {img1_back.attr({opacity:0}).toFront().animate({opacity:1},300); setTimeout(function(){img1_back.animate({rotation: 0}, 200); img1.animate({rotation: 0}, 200);},301);});
   $(img2.node).mouseover(function(evt) {img2_back.attr({opacity:0}).toFront().animate({opacity:1},300); setTimeout(function(){img2_back.animate({rotation: 0}, 200); img2.animate({rotation: 0}, 200);},301);});
   $(img3.node).mouseover(function(evt) {img3_back.attr({opacity:0}).toFront().animate({opacity:1},300); setTimeout(function(){img3_back.animate({rotation: 0}, 200); img3.animate({rotation: 0}, 200);},301);});
   $(img4.node).mouseover(function(evt) {img4_back.attr({opacity:0}).toFront().animate({opacity:1},300); setTimeout(function(){img4_back.animate({rotation: 0}, 200); img4.animate({rotation: 0}, 200);},301);});
   $(img5.node).mouseover(function(evt) {img5_back.attr({opacity:0}).toFront().animate({opacity:1},300); setTimeout(function(){img5_back.animate({rotation: 0}, 200); img5.animate({rotation: 0}, 200);},301);});
   $(img6.node).mouseover(function(evt) {img6_back.attr({opacity:0}).toFront().animate({opacity:1},300); setTimeout(function(){img6_back.animate({rotation: 0}, 200); img6.animate({rotation: 0}, 200);},301);});

  $(img1_back.node).mouseout(function(evt) {img1.animate({rotation: -6}, 200); img1_back.animate({rotation: -6}, 200); setTimeout(function(){img1.insertAfter(img1_back);},300);});
  $(img2_back.node).mouseout(function(evt) {img2.animate({rotation: -7}, 200); img2_back.animate({rotation: -7}, 200); setTimeout(function(){img2.insertAfter(img2_back);},300);});
  $(img3_back.node).mouseout(function(evt) {img3.animate({rotation: 20}, 200); img3_back.animate({rotation: 20}, 200); setTimeout(function(){img3.insertAfter(img3_back);},300);});
  $(img4_back.node).mouseout(function(evt) {img4.animate({rotation: 4}, 200); img4_back.animate({rotation: 4}, 200); setTimeout(function(){img4.insertAfter(img4_back);},300);});
  $(img5_back.node).mouseout(function(evt) {img5.animate({rotation: 4}, 200); img5_back.animate({rotation: 4}, 200); setTimeout(function(){img5.insertAfter(img5_back);},300);});
  $(img6_back.node).mouseout(function(evt) {img6.animate({rotation: 4}, 200); img6_back.animate({rotation: 4}, 200); setTimeout(function(){img6.insertAfter(img6_back);},300);});
  setTimeout(function () {R.safari();}); //защита от бага в safari
}