//Declare the varibale name outside the function so it is global. 
var sp;
function InitPage()
{
	sp = new Spry.Widget.SlidingPanels("contentboxbody");
	Spry.$$("#link1").addEventListener("click", function(){sp.showPanel('item1');return false; }, false);
	Spry.$$("#link2").addEventListener("click", function(){sp.showPanel('item2');return false; }, false);
	Spry.$$("#link3").addEventListener("click", function(){sp.showPanel('item3');return false; }, false);
	Spry.$$("#link3-1").addEventListener("click", function(){sp.showPanel('item3');return false; }, false);
	Spry.$$("#link4").addEventListener("click", function(){sp.showPanel('item4');return false; }, false);
	Spry.$$("#link5").addEventListener("click", function(){sp.showPanel('item5');return false; }, false);
	Spry.$$("#link6").addEventListener("click", function(){sp.showPanel('item6');return false; }, false);
	Spry.$$("#link7").addEventListener("click", function(){sp.showPanel('item7');return false; }, false);
}
Spry.Utils.addLoadListener(InitPage);

function changeColor(val) {
	var link1 = document.getElementById('link1');
	var link2 = document.getElementById('link2');
	var link3 = document.getElementById('link3');
	var link4 = document.getElementById('link4');
	var link5 = document.getElementById('link5');
	var link6 = document.getElementById('link6');
	var about = document.getElementById('about');
	var skills = document.getElementById('skills');
	var experience = document.getElementById('experience');
	var education = document.getElementById('education');
	var certifications = document.getElementById('certifications');
	var references = document.getElementById('references');
	if(val==1) {
		link1.style.color = '#FDC67C';
		link2.style.color = '#EDEDED';
		link3.style.color = '#EDEDED';
		link4.style.color = '#EDEDED';
		link5.style.color = '#EDEDED';
		link6.style.color = '#EDEDED';
		about.style.background = 'url(images/user-over.png) no-repeat';
		skills.style.background = 'url(images/page_accept.png) no-repeat';
		experience.style.background = 'url(images/chart.png) no-repeat';
		education.style.background = 'url(images/edit.png) no-repeat';
		certifications.style.background = 'url(images/page.png) no-repeat';
		references.style.background = 'url(images/at.png) no-repeat';
	}
	if(val==2) {
		link1.style.color = '#EDEDED';
		link2.style.color = '#FDC67C';
		link3.style.color = '#EDEDED';
		link4.style.color = '#EDEDED';
		link5.style.color = '#EDEDED';
		link6.style.color = '#EDEDED';
		about.style.background = 'url(images/user.png) no-repeat';
		skills.style.background = 'url(images/page_accept-over.png) no-repeat';
		experience.style.background = 'url(images/chart.png) no-repeat';
		education.style.background = 'url(images/edit.png) no-repeat';
		certifications.style.background = 'url(images/page.png) no-repeat';
		references.style.background = 'url(images/at.png) no-repeat';
	}
	if(val==3) {
		link1.style.color = '#EDEDED';
		link2.style.color = '#EDEDED';
		link3.style.color = '#FDC67C';
		link4.style.color = '#EDEDED';
		link5.style.color = '#EDEDED';
		link6.style.color = '#EDEDED';
		about.style.background = 'url(images/user.png) no-repeat';
		skills.style.background = 'url(images/page_accept.png) no-repeat';
		experience.style.background = 'url(images/chart-over.png) no-repeat';
		education.style.background = 'url(images/edit.png) no-repeat';
		certifications.style.background = 'url(images/page.png) no-repeat';
		references.style.background = 'url(images/at.png) no-repeat';
	}
	if(val==4) {
		link1.style.color = '#EDEDED';
		link2.style.color = '#EDEDED';
		link3.style.color = '#EDEDED';
		link4.style.color = '#FDC67C';
		link5.style.color = '#EDEDED';
		link6.style.color = '#EDEDED';
		about.style.background = 'url(images/user.png) no-repeat';
		skills.style.background = 'url(images/page_accept.png) no-repeat';
		experience.style.background = 'url(images/chart.png) no-repeat';
		education.style.background = 'url(images/edit-over.png) no-repeat';
		certifications.style.background = 'url(images/page.png) no-repeat';
		references.style.background = 'url(images/at.png) no-repeat';
	}
	if(val==5) {
		link1.style.color = '#EDEDED';
		link2.style.color = '#EDEDED';
		link3.style.color = '#EDEDED';
		link4.style.color = '#EDEDED';
		link5.style.color = '#FDC67C';
		link6.style.color = '#EDEDED';
		about.style.background = 'url(images/user.png) no-repeat';
		skills.style.background = 'url(images/page_accept.png) no-repeat';
		experience.style.background = 'url(images/chart.png) no-repeat';
		education.style.background = 'url(images/edit.png) no-repeat';
		certifications.style.background = 'url(images/page-over.png) no-repeat';
		references.style.background = 'url(images/at.png) no-repeat';
	}
	if(val==6) {
		link1.style.color = '#EDEDED';
		link2.style.color = '#EDEDED';
		link3.style.color = '#EDEDED';
		link4.style.color = '#EDEDED';
		link5.style.color = '#EDEDED';
		link6.style.color = '#FDC67C';
		about.style.background = 'url(images/user.png) no-repeat';
		skills.style.background = 'url(images/page_accept.png) no-repeat';
		experience.style.background = 'url(images/chart.png) no-repeat';
		education.style.background = 'url(images/edit.png) no-repeat';
		certifications.style.background = 'url(images/page.png) no-repeat';
		references.style.background = 'url(images/at-over.png) no-repeat';
	}
}