window.addEvent('domready', function(){
	//First Example
	var els = $('sidebar').getElements('a');

	
	// We are setting the opacity of the element to 0.5 and adding two events
	els.each(function(el, i) {

	el.set('morph', {duration: 'short', transition: Fx.Transitions.Sine.easeOut}).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'text-indent':12
			
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				'text-indent': 0
			
			});
			
		}
	});
	});

		//store titles and text
	$$('a.tipz').each(function(element,index) {
		var content = element.get('title').split('::');
		element.store('tip:title', content[0]);
		element.store('tip:text', content[2]+content[1]);
	});
	
	//create the tooltips
	var tipz = new Tips('.tipz',{
		className: 'tipz',
		fixed: false,
		hideDelay: 20,
		offsets :{'x': 20, 'y': -16},
		showDelay: 50
	});
	tipz.addEvents({
	'show': function(tip) {
		tip.fade('in');
	},
	'hide': function(tip) {
		tip.fade('out');
	}
});



});
