$(window).load(function(){
	if ($(window).width() < $('#pastilles').width()){
		$('#ant, #seg').show();	
	} else {
		$('#ant, #seg').hide();
	}
	
	xy_center ('#pastilles', window);
	
	$('#logo').css({
		'top': (Math.round($(window).height() - $('#logo').height()) / 2)+ $('#pastilles').height() / 2 + $('#logo').height() / 2 + 'px',
		'left': (Math.round($(window).width() - $('#logo').width()) / 2) + 'px'
	});
	
	$('#ant').css({
		'top': (Math.round($(window).height() - $('#ant').height()) / 2) + 'px',
		'left': '0px'
	}).mousedown(function(){	
		$(this).css({'margin-left':'-2px'});
	}).mouseup(function(){	
		$(this).css({'margin-left':'0px'});
		$('#pastilles').stop().animate({left: '50px'}, 500);
	}).mouseleave(function(){	
		$(this).css({'margin-left':'0px'});
	});
	
	$('#seg').css({
		'top': (Math.round($(window).height() - $('#seg').height()) / 2) + 'px',
		'right': '0px'
	}).mousedown(function(){	
		$(this).css({'margin-right':'-2px'});
	}).mouseup(function(){	
		$(this).css({'margin-right':'0px'});
		$('#pastilles').stop().animate({'left': $(window).width()-$('#pastilles').width()-50+'px'}, 500);
	}).mouseleave(function(){	
		$(this).css({'margin-right':'0px'});
	});
		
	$(window).resize(function() {
		if ($(window).width() < $('#pastilles').width()){
			$('#ant, #seg').show();	
		} else {
			$('#ant, #seg').hide();
		}
		
		xy_center ('#pastilles', window);
		
		$('#logo').css({
			'top': (Math.round($(window).height() - $('#logo').height()) / 2)+ $('#pastilles').height() / 2 + $('#logo').height() / 2 + 'px',
			'left': (Math.round($(window).width() - $('#logo').width()) / 2) + 'px'
		});
		
		$('#ant').css({
			'top': (Math.round($(window).height() - $('#ant').height()) / 2) + 'px',
			'left': '0px'
		});
		
		$('#seg').css({
			'top': (Math.round($(window).height() - $('#seg').height()) / 2) + 'px',
			'right': '0px'
		});
	});
});

/*****************************************************************************
 *                                FUNCIONS                                   *
 *****************************************************************************/

function xy_center (item, ref) {
	$(item).css({
			'top': (Math.round($(ref).height() - $(item).height()) / 2) + 'px',
			'left': (Math.round($(ref).width() - $(item).width()) / 2) + 'px'
	});
}