$(document).ready(function(){

  fadeImages = new Array(
    "/img/bg.home3.jpg",
    "/img/bg.home4.jpg",
    "/img/bg.home1.jpg",
    "/img/bg.home2.jpg"
  );

  fadeImagesColors = new Array(
    "#70605d",
    "#e8dedb",
    "#b4a9a8",
    "#bbacab"
  );

  var imageName = new Array();

  for(j=0;j<fadeImages.length;j++){
    imageName[j] = new Image();
    imageName[j].src = fadeImages[j];
  }

  i=0;

  function fade(){
    $('#bg-fade').css({opacity: 1}).animate({opacity: 0}, 2000, 'swing', function(){
      clearTimeout(timeout);
      newImage = $(this).parent().css("backgroundImage");
      newColor = $(this).parent().css("backgroundColor");
      $(this).css("backgroundColor", newColor);
      $(this).css("backgroundImage", newImage);

      $(this).css({opacity: 1});

      if(fadeImages[i] == undefined){
        i = 0;
      }

      $(this).parent().css("backgroundImage", "url('"+fadeImages[i]+"')");
      $(this).parent().css("backgroundColor", fadeImagesColors[i]);
      i++;

      timeout = setTimeout(fade, 7000);
    });
  }

  timeout = setTimeout(fade, 5000);

});
