//controls tab hovers
		
	$(document).ready(function(){
					
		//what divs do you want to show?
		var box_one = ["#boxZero","#boxOne","#boxTwo"];
		var box_two = ["#boxThree","#boxFour","#boxFive"];
		var box_three = ["#boxSix","#boxSeven"];
		
		//what are the tabs for those divs?
		var box_one_tabs = ["#one","#two","#three"];
		var box_two_tabs = ["#four","#five","#six"];
		var box_three_tabs = ["#seven","#eight"];
		
		var maxLen =14;
		var xLen = 20;//for really gigantic character strings that shouldn't be here anyway but hey, what the heck.
				
		//where are the images for the on and off states?
		var onTab = "url('http://216.157.37.125/wp-content/themes/LLI/images/home-tab-on.png') no-repeat";
		var offTab ="url('http://216.157.37.125/wp-content/themes/LLI/images/home-tab-off.png') no-repeat";
		var onTabLg = "url('http://216.157.37.125/wp-content/themes/LLI/images/home-tab-on-lg.png') no-repeat";
		var offTabLg = "url('http://216.157.37.125/wp-content/themes/LLI/images/home-tab-off-lg.png') no-repeat";
		var onTabxl = "url('http://216.157.37.125/wp-content/themes/LLI/images/home-tab-on-max.png') no-repeat";
		var offTabxl = "url('http://216.157.37.125/wp-content/themes/LLI/images/home-tab-off-max.png') no-repeat";
		
		
		//show the first tab in each box
		$(box_one[0]).show();
		$(box_two[0]).show();
		$(box_three[0]).show();
		
		for( i=0 ; i<= box_one_tabs.length; i++){ 
		
		  		if($(box_one_tabs[i]).text().length > maxLen){
					if($(box_one_tabs[i]).text().length > xLen){
						
				  		$(box_one_tabs[i]).css("background",offTabxl);
				  		$(box_one_tabs[i]).css("width",180);
						
					}//end xl if
					else{
			  		$(box_one_tabs[i]).css("background",offTabLg);
			  		$(box_one_tabs[i]).css("width",165);}
				}
				else
				$(box_one_tabs[i]).css("background",offTab);
		}
		for( i=0 ; i<= box_two_tabs.length; i++){ 
		
		  		if($(box_two_tabs[i]).text().length > maxLen){
		  		$(box_two_tabs[i]).css("background",offTabLg);
		  		$(box_two_tabs[i]).css("width",165);
				}
				else
				$(box_two_tabs[i]).css("background",offTab);
		}
		for( i=0 ; i<= box_three_tabs.length; i++){ 
		
		  		if($(box_three_tabs[i]).text().length > maxLen){
		  		$(box_three_tabs[i]).css("background",offTabLg);
		  		$(box_three_tabs[i]).css("width",165);
				}
				else
				$(box_three_tabs[i]).css("background",offTab);
		}
		
		
		//default first tab as hover
		$(box_one_tabs[0]).css("background",onTab);	
		$(box_two_tabs[0]).css("background",onTab);
		$(box_three_tabs[0]).css("background",onTab);
			   
			
			$('.tab').hover(function(){
				
				var length = $(this).text().length;
								
						//what box are we in?
						var box = $(this).parents('div.home-box').attr('id');

						//take that box and assign it to the correct array
						switch (box){
							case "box_one":
								var box = box_one;
								var tab = box_one_tabs;
								break;
								
							case "box_two":
								var box = box_two;
								var tab = box_two_tabs;
								break;
								
							case "box_three":
								var box = box_three;
								var tab = box_three_tabs;
								break;
								
							default:
								var box = box_one;	
								var tab = box_one_tabs;										
						}
						
						//what tab are we on?
						var tab_num = $(this).attr('name');
				
						
						// Set on tab div to show
					    for(var i = 0; i <= box.length; i++){
							
							$(this).parents('div.container').empty();
							
									if(i == tab_num){ 
									
										$(box[i]).fadeIn('slow');
										
									}//end if
									else
									$(box[i]).hide();
											
					  				if( $(tab[i]).text().length > maxLen ){
										
										if($(tab[i]).text().length > xLen){
											
									  		$(box_one_tabs[i]).css("background",offTabxl);
									  		$(box_one_tabs[i]).css("width",180);
											
										}//end xl if
										else{
						  				$(tab[i]).css("background",offTabLg);
										$(tab[i]).css("width",165);	
										}
					  				
					  				}	
									else
									$(tab[i]).css("background",offTab);
										
			
						}//end for
									
						//put the tab in the "on" state
						if( $(tab[tab_num]).text().length >= maxLen ){
							
										
							if($(tab[tab_num]).text().length > xLen){
											
									$(tab[tab_num]).css("background",onTabxl);
									$(tab[tab_num]).css("width",180);
											
							}//end xl if
							else{			
							$(tab[tab_num]).css("background",onTabLg);
							$(tab[tab_num]).css("width",165);}
						}
						else
						$(tab[tab_num]).css("background",onTab);
									
			},function(){/*done*/});
											   				
			
   			
	});

