$(function() {
						// get rid of the numbers in navigation li
						$("#navigation li").empty();
						//some effects
						firstDivs = $("#featureCarousel #container > div");
						$("#featureCarousel #container")
							.css({position:"relative",
										clear:"left",
										//width:"870px",
										width:firstDivs.length*812+"px",
										height:"509px",
										overflow:"hidden",
										backgroundColor:"transparent"})
						$('#featureCarousel a').each(function(){
							var image = $("img",this).attr('src');
							$(this).parent().css({background:"url('"+image+"') no-repeat top left"});
							$('img',this).remove();
						});
						lastDiv = firstDivs.length - 1; 
						for (i=0;i<firstDivs.length;i++)
							{
								firstDivs.eq(i).show()
									.css({position:"absolute",
												left:(i*800+(50))+"px",
												width:"800px",
												backgroundColor: "#FFF"})
									.append('<div class="overlay"></div>');
							}
						$(".overlay")
							.css({position:"absolute",
									 left:0,
									 top:"6px",
									 width:"800px",
									 height:"437px",
									 "z-index":1000,
									 cursor:"pointer"
							}).append('<div class="next"><img src="images/right01.png" /></div><div class="prev"><img src="images/left01.png" /></div>');
							$('.next').css({position:"absolute", top:"194px", left:0});
							$('.prev').css({position:"absolute", top:"194px", right:0});
							/*
							$("#featureCarousel #container").hover(function(){
								$('.next').show();
								$('.prev').show();
							},function(){
								$('.next').hide();
								$('.prev').hide();
							
							})
							*/
							$("#featureCarousel #container > div p")
								.css({position:"absolute",
											bottom:0,
											backgroundColor:"#000",
											color:"#fff",
											padding:"25px",
											width:"749px",
											opacity:"0.7"}).hide();
							$("#featureCarousel #container > div a img")
								.css({width:"100%",
											border:0});
						
							$("#featureCarousel #container > div").eq(0).css({opacity: "1.0", "z-index": lastDiv, top:"15px", height:"449px"}).addClass("active-img");
							$("#featureCarousel #container > div p").eq(0).show();
							$('.overlay').eq(0).hide();
							$("#featureCarousel #container > div").eq(0).siblings().css({opacity: "0.7", top:"21px", height:"437px", overflow:"hidden"}).removeClass("active-img");
							$("#navigation li").click(function(){
								// li click behavior
									var index = $("#navigation li").index(this);
								
									firstDivs.show()
										
											if (index == 0 && $("#featureCarousel #container > div").eq(0).css("left") == 0+"px")
												{
														return;
												}else{
									for (i=0;i<firstDivs.length;i++)
										{
													$(".overlay").css({"z-index": 1000}).show();
													$(".overlay").eq(index).css({"z-index": -1000});
													$(".overlay").eq(index).hide();
													$('.next, .prev').hide();
													$("#featureCarousel #container > div p").hide();
													$("#featureCarousel #container > div p").eq(index).show();
													
													$("#featureCarousel #container > div").eq(i)
														//.animate({ left: (((i+1-index)*800+(50)) - 800)+"px", queue: false }, 2000)
														.css({opacity: "0.7", height:"449px"});
													
												}
												
												
													$("#featureCarousel #container").animate({ left: (((1-index)*800) - 800)+"px", queue: false }, 1000);
													
													setTimeout(function(){$('.next, .prev').show()}, 1500)
										}
										
										$("#featureCarousel #container > div").eq(index).addClass("active-img")
										.css({"z-index": lastDiv,
													opacity: "1.0", top:"15px"})
										.siblings().removeClass("active-img").css({"z-index": 0, top:"21px", height:"437px", overflow:"hidden"});
										
										
							});
							$(".overlay").eq(0).css({"z-index": -1000});
							$(".overlay").click(function(){
								// li click behavior
									var index = $(".overlay").index(this);
								
									firstDivs.show()
										
											if (index == 0 && $("#featureCarousel #container > div").eq(0).css("left") == 0+"px")
												{
														return;
												}else{
									for (i=0;i<firstDivs.length;i++)
										{
													$(".overlay").css({"z-index": 1000}).show();
													$(".overlay").eq(index).css({"z-index": -1000});
													$(".overlay").eq(index).hide();
													$('.next, .prev').hide();
													$("#featureCarousel #container > div p").hide();
													$("#featureCarousel #container > div p").eq(index).show();
													$("#featureCarousel #container > div").eq(i)
													//	.animate({ left: (((i+1-index)*800+(50)) - 800)+"px", queue: true}, 1000)
														.css({opacity: "0.7", height:"449px"});
												}
												
												$("#featureCarousel #container").animate({ left: (((1-index)*800) - 800)+"px", queue: false }, 1000);
													
													setTimeout(function(){$('.next, .prev').show()}, 1500)
										}
										$("#navigation li").eq(index).addClass("active").siblings().removeClass("active");
										$("#featureCarousel #container > div").eq(index).addClass("active-img")
										.css({"z-index": lastDiv,
													opacity: "1.0", top:"15px"})
										.siblings().removeClass("active-img").css({"z-index": 0, top:"21px", height:"437px", overflow:"hidden"});
										
													setTimeout(function(){$('.next, .prev').show()}, 1500)
										
							});
							
						
							
							
						
					
							
							
					});