jQuery(document).ready(function(){
  var windowWidth = window.screen.width < (window.outerWidth ? window.screen.width : window.outerWidth);
  var mobile = windowWidth < 500;
  if(mobile)
  {
		jQuery(window).scroll(function() {	      
	    scroll_effect();	      
		});
	}
});

function scroll_effect() {
  // Get the scroll position of the page
  scrollPos = jQuery(this).scrollTop();
  // Fade out the banner text
  jQuery('.carousel-caption').css({
    'margin-top' : -(scrollPos/3)+"px",
    'opacity' : 1-(scrollPos/300)
  });
  if (scrollPos > 400)
  {
    jQuery('.middle').css({
      'height': (scrollPos-250)/2+"px"
    });
  }
}