var scrollSpeed = 1; 		// Speed in milliseconds
			var step = 1; 				// How many pixels to move per step
			var current = 0;			// The current pixel row
			var imageWidth = 2712;		// Background image width
			var headerWidth = 907;		// How wide the header is.
			
			//The pixel row where to start a new loop
			var restartPosition = -(imageWidth - headerWidth);
			
			function scrollBg(){
				//Go to next pixel row.
				current -= step;
				
				//If at the end of the image, then go to the top.
				if (current == restartPosition){
					current = 0;
				}
				
				//Set the CSS of the header.
			//	$('.maindiv').css("background-position",current+"px 0");
			}
			
			//Calls the scrolling function repeatedly
			
	

$(document).ready(function(){
	//$(document).pngFix(); 
   //base url for the website
    var scrollSpeed = 1; 
    // var init = setInterval("scrollBg()", scrollSpeed);
	//var base_url='http://localhost/JITOA/public/';
	 //var base_url="http://www.sadda.jo/JITOA-Beta/public/";
    var base_url='http://www.jitoa.org/public/';
     //moveBgAround();
	 // Cross fade function
	 ////////////////////////////////////////////////////////////////////////////
	  // find the div.fade elements and hook the hover event
		  /*
		  var div1=$('div#f1');
		  var div2=$('div#f2');
		  var div3=$('div#f3');
		   div1.hover(function() {
			// on hovering over, find the element we want to fade *up*
			var fade1 = $('div.div1');
			var fade2=	$('div.div2');
			// if the element is currently being animated (to a fadeOut)...
			if (fade1.is(':animated') || (fade2.is(':animated'))) {
			  // ...take it's current opacity back up to 1
			  fade1.stop().fadeTo(500, 1);
			  fade2.stop().fadeTo(500, 1);
			} else {
			  // fade in quickly
			  fade1.fadeIn(700);
			  fade2.fadeIn(500);
			}
		  }, function () {
			// on hovering out, fade the element out
			var fade1 = $('div.div1');
			var fade2=	$('div.div2');
			if (fade1.is(':animated') || (fade2.is(':animated'))) {
			  fade1.stop().fadeTo(500, 0);
			  fade2.stop().fadeTo(500, 0);
			} else {
			  // fade away slowly
			  fade1.fadeOut(700);
			  fade2.fadeOut(500);
			}
		  });
		  //////////////////////////////////////////////////////////////////////////
		  // find the div.fade elements and hook the hover event
		  div2.hover(function() {
			// on hovering over, find the element we want to fade *up*
			var fade1 = $('div.div0');
			var fade2=	$('div.div2');
			// if the element is currently being animated (to a fadeOut)...
			if (fade1.is(':animated') || (fade2.is(':animated'))) {
			  // ...take it's current opacity back up to 1
			  fade1.stop().fadeTo(500, 1);
			  fade2.stop().fadeTo(500, 1);
			} else {
			  // fade in quickly
			  fade1.fadeIn(700);
			  fade2.fadeIn(500);
			}
		  }, function () {
			// on hovering out, fade the element out
			var fade1 = $('div.div0');
			var fade2=	$('div.div2');
			if (fade1.is(':animated') && (fade2.is(':animated'))) {
			  fade1.stop().fadeTo(500, 0);
			  fade2.stop().fadeTo(500, 0);
			} else {
			  // fade away slowly
			  fade1.fadeOut(700);
			  fade2.fadeOut(500);
			}
		  });
		  //////////////////////////////////////////////////////////////////////////
		  // find the div.fade elements and hook the hover event
		   div3.hover(function() {
			// on hovering over, find the element we want to fade *up*
			var fade1 = $('div.div0');
			var fade2=	$('div.div1');
			// if the element is currently being animated (to a fadeOut)...
			if (fade1.is(':animated') && (fade2.is(':animated'))) {
			  // ...take it's current opacity back up to 1
			  fade1.stop().fadeTo(500, 1);
			  fade2.stop().fadeTo(500, 1);
			} else {
			  // fade in quickly
			  fade1.fadeIn(500);
			  fade2.fadeIn(500);
			}
		  }, function () {
			// on hovering out, fade the element out
			var fade1 = $('div.div0');
			var fade2=	$('div.div1');
			if (fade1.is(':animated') || (fade2.is(':animated'))) {
			  fade1.stop().fadeTo(500, 0);
			  fade2.stop().fadeTo(500, 0);
			} else {
			  // fade away slowly
			  fade1.fadeOut(500);
			  fade2.fadeOut(500);
			}
		  });
     // end Cross fade function
	 */
	 ////////////////////////////////////////////////////////////////////////////
	//
	$('.close-not').click(function(){$(this).parent().hide();})
	//
	 $("div.new").animate({width:'toggle'},2000); 
	 $("div#logintit1").toggle(function(){$("#loginbody1").show();$("#logintit1-img").attr('src',base_url+'images/right-tiles-arrow-down.gif')},function(){$("#loginbody1").hide();$("#logintit1-img").attr('src',base_url+'images/right-tiles-arrow.gif')});
	 $("div#logintit2").toggle(function(){$("#loginbody2").show();$("#logintit2-img").attr('src',base_url+'images/right-tiles-arrow-down.gif')},function(){$("#loginbody2").hide();$("#logintit2-img").attr('src',base_url+'images/right-tiles-arrow.gif')});
	 $("div#logintit3").toggle(function(){$("#loginbody3").show();$("#logintit3-img").attr('src',base_url+'images/right-tiles-arrow-down.gif')},function(){$("#loginbody3").hide();$("#logintit3-img").attr('src',base_url+'images/right-tiles-arrow.gif')});
	 $("div#logintit4").toggle(function(){$("#loginbody4").show();$("#logintit4-img").attr('src',base_url+'images/right-tiles-arrow-down.gif')},function(){$("#loginbody4").hide();$("#logintit4-img").attr('src',base_url+'images/right-tiles-arrow.gif')});
	 $("div#logintit5").toggle(function(){$("#loginbody5").show();$("#logintit5-img").attr('src',base_url+'images/right-tiles-arrow-down.gif')},function(){$("#loginbody5").hide();$("#logintit5-img").attr('src',base_url+'images/right-tiles-arrow.gif')});
	 
	 $('#about').hover(function(){$("#about #about-img").css("display","none");$("#about #about-img-hover").show();},function(){$("#about #about-img").show();$("#about #about-img-hover").hide();})
	 $('#join').hover(function(){$("#join #join-img").css("display","none");$("#join #join-img-hover").show();},function(){$("#join #join-img").show();$("#join #join-img-hover").hide();})
	 $('#getinvolved').hover(function(){$("#getinvolved #getinvolved-img").css("display","none");$("#getinvolved #getinvolved-img-hover").show();},function(){$("#getinvolved #getinvolved-img").show();$("#getinvolved #getinvolved-img-hover").hide();})
	 $('#certified').hover(function(){$("#certified #certified-img").css("display","none");$("#certified #certified-img-hover").show();},function(){$("#certified #certified-img").show();$("#certified #certified-img-hover").hide();})
	 $('#career').hover(function(){$("#career #career-img").css("display","none");$("#career #career-img-hover").show();},function(){$("#career #career-img").show();$("#career #career-img-hover").hide();})
	 $('#media').hover(function(){$("#media #media-img").css("display","none");$("#media #media-img-hover").show();},function(){$("#media #media-img").show();$("#media #media-img-hover").hide();})
	 $('#business').hover(function(){$("#business #business-img").css("display","none");$("#business #business-img-hover").show();},function(){$("#business #business-img").show();$("#business #business-img-hover").hide();})
	 $('#profile').hover(function(){$("#profile #profile-img").css("display","none");$("#profile #profile-img-hover").show();},function(){$("#profile #profile-img").show();$("#profile #profile-img-hover").hide();})

	  
	    //$('a.linkshover1').mouseover(function() {$('a.linkshover2').css("opacity","0.5");$('a.linkshover3').css("opacity","0.5");})
		//$('a.linkshover1').mouseout(function() {$('a.linkshover2').css("opacity","1");$('a.linkshover3').css("opacity","1");})
		//$('a.linkshover2').mouseover(function() {$('a.linkshover1').css("opacity","0.5");$('a.linkshover3').css("opacity","0.5");})
		//$('a.linkshover2').mouseout(function() {$('a.linkshover1').css("opacity","1");$('a.linkshover3').css("opacity","1");})
		//$('a.linkshover3').mouseover(function() {$('a.linkshover1').css("opacity","0.5");$('a.linkshover2').css("opacity","0.5");})
		//$('a.linkshover3').mouseout(function() {$('a.linkshover1').css("opacity","1");$('a.linkshover2').css("opacity","1");})
		$('.header').hover(function(){},function(){
		$('div.header3').css("background-color","#f19013");
		$('div.header3inside').css("background-color","#f19013");
		$('div#about-menu').show();
		});
	
	  $('#about').mouseover(function() 
		 {
				$('div.header3').css("background-color","#f19013");
				$('div.header3inside').css("background-color","#f19013");
				
				$('div#join-menu').css("display","none");
				$('div#involved-menu').css("display","none");
				$('div#certified-menu').css("display","none");
				$('div#career-menu').css("display","none");
				$('div#media-menu').css("display","none");
				$('div#bus-menu').css("display","none");
				$('div#profile-menu').css("display","none");
				//////////////////////////////////////////
				$('div#about-menu').show();
         })
	  $('#join').mouseover(function() 
		 {
			    $('div.header3').css("background-color","#c7161e");
				$('div.header3inside').css("background-color","#c7161e");
				$('div#about-menu').css("display","none");
				$('div#involved-menu').css("display","none");
				$('div#certified-menu').css("display","none");
				$('div#career-menu').css("display","none");
				$('div#media-menu').css("display","none");
			    $('div#bus-menu').css("display","none");
				$('div#profile-menu').css("display","none");
				//////////////////////////////////////////
				$('div#join-menu').show();
         })
	   $('#getinvolved').mouseover(function() 
		 {
			    $('div.header3').css("background-color","#cd9d30");
				$('div.header3inside').css("background-color","#cd9d30");
				$('div#about-menu').css("display","none");
				$('div#join-menu').css("display","none");
				$('div#certified-menu').css("display","none");
				$('div#career-menu').css("display","none");
				$('div#media-menu').css("display","none");
			    $('div#bus-menu').css("display","none");
				$('div#profile-menu').css("display","none");
				//////////////////////////////////////////
				$('div#involved-menu').show();
         })
	    
	  $('#certified').mouseover(function() 
		 {
			    $('div.header3').css("background-color","#0cb2e8");
				$('div.header3inside').css("background-color","#0cb2e8");
				$('div#about-menu').css("display","none");
				$('div#join-menu').css("display","none");
				$('div#involved-menu').css("display","none");
				$('div#career-menu').css("display","none");
				$('div#media-menu').css("display","none");
			    $('div#bus-menu').css("display","none");
				$('div#profile-menu').css("display","none");
				//////////////////////////////////////////
				$('div#certified-menu').show();
         })
	  
	  $('#career').mouseover(function() 
		 {
			    $('div.header3').css("background-color","#aab437");
				$('div.header3inside').css("background-color","#aab437");
				$('div#about-menu').css("display","none");
				$('div#join-menu').css("display","none");
				$('div#involved-menu').css("display","none");
				$('div#certified-menu').css("display","none");
				$('div#media-menu').css("display","none");
			    $('div#bus-menu').css("display","none");
				$('div#profile-menu').css("display","none");
				//////////////////////////////////////////
				$('div#career-menu').show();
         })
	     
		$('#media').mouseover(function() 
		 {
			    $('div.header3').css("background-color","#508c45");
				$('div.header3inside').css("background-color","#508c45");
				$('div#about-menu').css("display","none");
				$('div#join-menu').css("display","none");
				$('div#involved-menu').css("display","none");
				$('div#certified-menu').css("display","none");
			    $('div#career-menu').css("display","none");
				$('div#bus-menu').css("display","none");
				$('div#profile-menu').css("display","none");
				//////////////////////////////////////////
				$('div#media-menu').show();
         })
	  
	  
	   $('#business').mouseover(function() 
		 {
			    $('div.header3').css("background-color","#b19058");
				$('div.header3inside').css("background-color","#b19058");
				$('div#about-menu').css("display","none");
				$('div#join-menu').css("display","none");
				$('div#involved-menu').css("display","none");
				$('div#certified-menu').css("display","none");
				$('div#media-menu').css("display","none");
			    $('div#career-menu').css("display","none");
				$('div#profile-menu').css("display","none");
				//////////////////////////////////////////
				$('div#bus-menu').show();
         })
	   $('#profile').mouseover(function() 
		 {
			    $('div.header3').css("background-color","#652c44");
				$('div.header3inside').css("background-color","#652c44");
				$('div#about-menu').css("display","none");
				$('div#join-menu').css("display","none");
				$('div#involved-menu').css("display","none");
				$('div#certified-menu').css("display","none");
				$('div#media-menu').css("display","none");
			    $('div#career-menu').css("display","none");
				$('div#bus-menu').css("display","none");
				//////////////////////////////////////////
				$('div#profile-menu').show();
				
         })
				 

	 

});

function moveBgAround() {
	//give a random value from 0 to 400 for the X axis and the Y axis
	var x = Math.floor(Math.random()*401);
	var y = Math.floor(Math.random()*401);
	//var y = 0;

	//random generated time it takes to move
	var time = Math.floor(Math.random()*1001) + 2000;

	//make the background image move!
	$('.maindiv').animate({
		backgroundPosition: '(' + (x * -1) + 'px ' + (y * -1) + 'px)'
	}, time, "swing", function() {
		moveBgAround();
	});
}