$(document).ready(function() {
						   
			picResize()	;
			
	});

function picResize(){			
			
				$('#slides li img').each(function() {
				var maxWidth = 960; // Max width for the image
				var maxHeight = 540;    // Max height for the image
				var ratio = 0;  // Used for aspect ratio
				var winWidth = document.body.clientWidth;    // Current image width
				var winHeight = document.body.clientHeight;  // Current image height	
				
				
				
				
				// Check if the current width is larger than the max				
				if(winWidth < maxWidth){				
					ratio = winWidth / winHeight;   // get ratio for scaling image					
					$(this).css("width", winWidth); // Set new width
					$('#slides li').css("width", winWidth );  // Set new width
					$('.video-js-box').css("width", 100+ '%' );  // Set new width			
					
					
					//$('#slides ul').css('left', -winWidth);
					
					var x = winWidth /2 ;		
					
					
					$(this).css("height", x + 30);  // Scale height based on ratio
					
					$('#slides').css("height", x + 30 ); 
					$('#carousel').css("height",  x + 30 );
					
					
					
				}
				
				else{
					
					$('#slides li').css("width", maxWidth );
					//$('.video-js-box').css("width", maxWidth );
					$(this).css("width", maxWidth); // Set new width
					$(this).css("height", maxHeight);  // Scale height based on ratio
					$('#slides').css("height", maxHeight ); 
					$('#carousel').css("height", maxHeight );
					
				}
				
				
				if(winWidth<600)
						{						
						
							$('#infobox p').css('font-size', '11px');
							$('#infobox h1').css('font-size', '1em');
							$('#infobox').css('width', winWidth-20);
							$('#infobox').css('left', '0');
							$('#infobox').css('bottom','0');
							$('#infobox').css('padding','4px 10px');
							$('#playbutton').css('top', '25%')
							
						}
					
					else{
								
							$('#infobox p').css('font-size', '12px');
							$('#infobox h1').css('font-size', '1.5em');
							$('#infobox h1').css('font-weight','normal');
							$('#infobox').css('width', '300');
							$('#playbutton').css('top', '40%');
							$('#infobox').css('bottom','9%');
							$('#infobox').css('left', '5%');
							$('#infobox').css('padding','12px 17px 17px 17px');
							
						}
						
						
				
			}); }