$(document).ready(function(){
	$("#copyright").fadeTo(0, 0.9);
	$("#copyright").hover(function(){
	$("#copyright-box").stop(false,true).fadeTo("normal", 0.9);
	},function(){
	$("#copyright-box").stop(false,true).fadeTo("slow", 0.0);
	});
	$("#main").scrollable({
		vertical: true,
		keyboard: 'static',
		onSeek: function(event, i) {
			horizontal.eq(i).data("scrollable").focus();
		}
	}).navigator("#main_navi");
	var horizontal = $(".scrollable").scrollable({ circular: true }).navigator(".navi");
	horizontal.eq(0).data("scrollable").focus();
	jQuery('div.navi').each(function(intIndex) {
		var singleNavW = Number(jQuery(jQuery(this).children("a")).width());
		var marginL = Number(jQuery(jQuery(this).children("a")).css("margin-left").replace("px", ""));
		var marginR = Number(jQuery(jQuery(this).children("a")).css("margin-right").replace("px", ""));
		var totalNavW = String(jQuery(jQuery(this).children("a")).length * (singleNavW + marginL + marginR));
		jQuery(jQuery(this)).width(totalNavW + 'px');                  
	});
	
	// initialize tooltip
$("#main_navi li[title]").tooltip({

   // tweak the position
   offset: [13, -31],

   // use the "slide" effect
   effect: 'fade',
   
   delay: 30
});
	
	$("#logo a").hover(function() {
	$(this).stop(false,true).animate({ color: "#CC0099" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#FFF" }, "slow");
	});
	$("#main_navi li.home").hover(function() {
	$(this).stop(false,true).animate({ color: "#CCC" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#333" }, "slow");
	});
	$("#main_navi li.about").hover(function() {
	$(this).stop(false,true).animate({ color: "#CCC" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#FFCC00" }, "slow");
	});
	$("#main_navi li.graphic").hover(function() {
	$(this).stop(false,true).animate({ color: "#CCC" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#CC0099" }, "slow");
	});
	$("#main_navi li.web").hover(function() {
	$(this).stop(false,true).animate({ color: "#CCC" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#6699FF" }, "slow");
	});
	$("#main_navi li.contact").hover(function() {
	$(this).stop(false,true).animate({ color: "#CCC" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#333" }, "slow");
	});
	$("#main a").hover(function() {
	$(this).stop(false,true).animate({ color: "#F90" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#FFF" }, "slow");
	});
	$("#bottom a").hover(function() {
	$(this).stop(false,true).animate({ color: "#F90" }, "normal");
	},function() {
	$(this).stop(false,true).animate({ color: "#CC0099" }, "slow");
	});
	$(".item img").hover(function(){
	$(this).stop(false,true).fadeTo("slow", 0.5);
	},function(){
	$(this).stop(false,true).fadeTo("slow", 1.0);
	});
	$("#cssawards").hover(function(){
	$(this).stop(false,true).fadeTo("slow", 0.5);
	},function(){
	$(this).stop(false,true).fadeTo("slow", 1.0);
	});
	$("#awwards").hover(function(){
	$(this).stop(false,true).fadeTo("slow", 0.5);
	},function(){
	$(this).stop(false,true).fadeTo("slow", 1.0);
	});
	
	$.fn.supersized.options = {  
		startwidth: 1280,  
		startheight: 900,
		vertical_center: 1,
		slideshow: 1,
		navigation: 0,
		thumbnail_navigation: 0,
		transition: 1, //0-None, 1-Fade, 2-slide top, 3-slide right, 4-slide bottom, 5-slide left
		pause_hover: 0,
		slide_counter: 0,
		slide_captions: 0,
		slide_interval: 4000,
		slides : [
			{image : 'img/background/background.jpg', title : 'Creativy'},
			{image : 'img/background/background2.jpg', title : 'Web Design'},  
			{image : 'img/background/background3.jpg', title : 'Graphic Design'},
			{image : 'img/background/background4.jpg', title : 'Graphic Design'}
		]
	};
	$('#supersized').supersized(); 
});
$(window).load(function () {
	$("img").fadeTo("slow", 1.0);
	$("#copyright").stop(false,true).animate({top: 0}, 800);
});