// JavaScript Document

function animateClouds (  )
{
	
	document.getElementById('cloud1').style.position= 'fixed'; 
   document.getElementById('cloud1').style.left = '0px'
   document.getElementById('cloud1').style.top = '120px'
   
   	document.getElementById('cloud2').style.position= 'fixed'; 
   document.getElementById('cloud2').style.left = '1280px'
   document.getElementById('cloud2').style.top = '130px'
   
   	document.getElementById('cloud3').style.position= 'fixed'; 
   document.getElementById('cloud3').style.left = '2570px'
   document.getElementById('cloud3').style.top = '110px'
   
   	document.getElementById('cloud4').style.position= 'fixed'; 
   document.getElementById('cloud4').style.left = '840px'
   document.getElementById('cloud4').style.top = '190px'
   
   	document.getElementById('cloud5').style.position= 'fixed'; 
   document.getElementById('cloud5').style.left = '230px'
   document.getElementById('cloud5').style.top = '220px'
   
   	document.getElementById('cloud6').style.position= 'fixed'; 
   document.getElementById('cloud6').style.left = '-10px'
   document.getElementById('cloud6').style.top = '320px'
   
   	document.getElementById('cloud7').style.position= 'fixed'; 
   document.getElementById('cloud7').style.left = '982px'
      document.getElementById('cloud7').style.top = '440px'
	  
	  	document.getElementById('cloud8').style.position= 'fixed'; 
   document.getElementById('cloud8').style.left = '560px'
   document.getElementById('cloud8').style.top = '470px'
   
   	document.getElementById('cloud9').style.position= 'fixed'; 
   document.getElementById('cloud9').style.left = '870px'
   document.getElementById('cloud9').style.top = '550px'
   
   	document.getElementById('cloud10').style.position= 'fixed'; 
   document.getElementById('cloud10').style.left = '770px'
   document.getElementById('cloud10').style.top = '600px'
   
   	document.getElementById('cloud11').style.position= 'fixed'; 
   document.getElementById('cloud11').style.left = '540px'
   document.getElementById('cloud11').style.top = '620px'
   
   	document.getElementById('cloud12').style.position= 'fixed'; 
   document.getElementById('cloud12').style.left = '230px'
   document.getElementById('cloud12').style.top = '700px'
   
   	document.getElementById('cloud13').style.position= 'fixed'; 
   document.getElementById('cloud13').style.left = '-900px'
   document.getElementById('cloud13').style.top = '740px'
   
   	document.getElementById('cloud14').style.position= 'fixed'; 
   document.getElementById('cloud14').style.left = '1482px'
      document.getElementById('cloud14').style.top = '800px'
   
   setInterval ( "moveCloud('cloud1',1)", 70 );
   setInterval ( "moveCloud('cloud2',1)", 100 );
   setInterval ( "moveCloud('cloud3',1)", 200 );
   setInterval ( "moveCloud('cloud4',1)", 150 );
   setInterval ( "moveCloud('cloud5',1)", 400 );
   setInterval ( "moveCloud('cloud6',1)", 230 );
   setInterval ( "moveCloud('cloud7',1)", 150 );
   setInterval ( "moveCloud('cloud8',1)", 20 );
   setInterval ( "moveCloud('cloud9',1)", 150 );
   setInterval ( "moveCloud('cloud10',1)", 200 );
   setInterval ( "moveCloud('cloud11',1)", 280 );
   setInterval ( "moveCloud('cloud12',1)", 160 );
   setInterval ( "moveCloud('cloud13',1)", 120 );
   setInterval ( "moveCloud('cloud14',1)", 140 );
}

function moveCloud ( id,increment )
{
	var cloud = document.getElementById(id);
  if( (parseInt(cloud.style.left)>document.width) && (increment>0)){
	  cloud.style.left = '-200px';
  }else if( (parseInt(cloud.style.left)<-200) && (increment<0)){
	  cloud.style.left = document.width + 'px';
  }else{
	  cloud.style.left =  parseInt(cloud.style.left) + increment + 'px';
  }
}