// when the DOM is ready...
$(document).ready(function () {

    var $panels = $('#theProgramSlider .scrollContainer > .subSection');
    var $container = $('#theProgramSlider .scrollContainer');
	var currentPanelID = ""
    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;
	var i = 0;
	var arrow = "left";
	var panel = "";
	var firstPanelID = $panels[0].id;
	var lastPanelID = $panels[$panels.length-1].id;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', $panels[0].offsetWidth * $panels.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#theProgramSlider .sectionContent').css('overflow', 'hidden');

    // apply our left + right buttons
    $scroll
        .before('<span class="scrollButtons" id="left1" >left</span>')
        .after('<span class="scrollButtons" id="right1" >right</span>');

    // handle nav selection
    function selectNav() {
		if (currentPanelID == firstPanelID){
			panel = 'first';
		} else if ( currentPanelID == lastPanelID) {
			panel = 'last';		
		}else{
			panel = '';
		}
		
		//if the current slide is the last slide ($panels.length) then hide button
		if(panel == 'first') {
			$('#left1').addClass('leftHidden');	
			$('#left1').addClass('scrollButtonsHide');	
	
		} else if (panel == 'last') {
			$('#right1').addClass('rightHidden');
			$('#right1').addClass('scrollButtonsHide');	
		} else {
			$('#left1').removeClass('leftHidden');
			$('#left1').removeClass('scrollButtonsHide');	
			$('#right1').removeClass('rightHidden');
			$('#right1').removeClass('scrollButtonsHide');	
		}
		
		var el = $('#theProgramSlider .navigation').find('a[href$="' + currentPanelID + '"]').get(0);
		$(el)
			.parents('ul:first')
				.find('a')
					.removeClass('selected') 
				.end()
			.end()
		.addClass('selected');
    }
	
	$('#theProgramSlider .navigation').find('a').click(selectNav);
	
	$('#left1').addClass('leftHidden');

	$('#left1').click(function () {
		arrow = "left";
		selectNav();
	});
	
	$('#right1').click(function () {
		arrow = "right";
		selectNav();
	});
	 

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
       // var el = $('#theProgramSlider .navigation').find('a[href$="' + data.id + '"]').get(0);
		currentPanelID =  data.id;
		selectNav.call(currentPanelID);
    }


    if (window.location.hash) {
       trigger({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation a:first').click();
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow
		
		//if true, an initial scroll will be forced on start.
		force: true,
        // can be a selector which will be relative to the target
        items: $panels,

        navigation: '.navigation a',

        // selectors are NOT relative to document, i.e. make sure they're unique
        prev: 'span#left1',
        next: 'span#right1', 

        // allow the scroll effect to run both directions
        axis: 'x',

        onAfter: trigger, // our final callback

        offset: offset,

        // duration of the sliding effect
        duration: 500,
		stop: true,
        // easing - can be used with the easing plugin: 
        // http://gsgd.co.uk/sandbox/jquery/easing/
        easing: 'swing',
		lock: false,
		// return to the first panel or go back to the last panel
		cycle: false
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#theProgramSlider').serialScroll(scrollOptions);
});


// when the DOM is ready...
$(document).ready(function () {

    var $panels2 = $('#gbstLifeSlider .scrollContainer > .subSection');
    var $container2 = $('#gbstLifeSlider .scrollContainer');
	var currentPanelID = ""

    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal2 = true;
	var n = 0;
	var arrow2 = "left";
	var panel2 = "";
	var firstPanelID2 = $panels2[0].id;
	var lastPanelID2 = $panels2[$panels2.length-1].id;

    // float the panels left if we're going horizontal
    if (horizontal2) {
        $panels2.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container2.css('width', $panels2[0].offsetWidth * $panels2.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll2 = $('#gbstLifeSlider .sectionContent').css('overflow', 'hidden');

    // apply our left + right buttons
    $scroll2
        .before('<span class="scrollButtons" id="left2" >left</span>')
        .after('<span class="scrollButtons" id="right2" >right</span>');

    // handle nav selection
    function selectNav2() {
	
		if (currentPanelID2 == firstPanelID2){
			panel2 = 'first2';
		} else if ( currentPanelID2 == lastPanelID2) {
			panel2 = 'last2';		
		}else{
			panel2 = '';
		}
		//if the current slide is the last slide then hide button and vice versa. This function differs from the one abovve because there are only two items in the list.
		if(panel2 == 'first2') {
			$('#left2').addClass('leftHidden');	
			$('#left2').addClass('scrollButtonsHide');			
			$('#right2').removeClass('rightHidden');
			$('#right2').removeClass('scrollButtonsHide');	
	
		} else  {
			$('#right2').addClass('rightHidden');
			$('#right2').addClass('scrollButtonsHide');			
			$('#left2').removeClass('leftHidden');
			$('#left2').removeClass('scrollButtonsHide');	
		} 
		
		var el = $('#gbstLifeSlider .navigation').find('a[href$="' + currentPanelID2 + '"]').get(0);
		$(el)
			.parents('ul:first')
				.find('a')
					.removeClass('selected') 
				.end()
			.end()
		.addClass('selected');
		
		
    }
	
	$('#gbstLifeSlider .navigation').find('a').click(selectNav2);
	
	$('#left2').addClass('leftHidden');

	$('#left2').click(function () {
		arrow2 = "left";
		selectNav2();
	});
	
	$('#right2').click(function () {
		arrow2 = "right";
		selectNav2();
	});

   

    // go find the navigation link that has this target and select the nav
    function trigger2(data) {
		currentPanelID2 =  data.id;
		selectNav2.call(currentPanelID2);

    }

    if (window.location.hash) {
       trigger2({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation a:first').click();
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset2 = parseInt((horizontal2 ? 
        $container2.css('paddingTop') : 
        $container2.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions2 = {
        target: $scroll2, // the element that has the overflow
		
		//if true, an initial scroll will be forced on start.
		force: true,
        // can be a selector which will be relative to the target
        items: $panels2,

        navigation: '.navigation a',

        // selectors are NOT relative to document, i.e. make sure they're unique
        prev: 'span#left2',
        next: 'span#right2', 

        // allow the scroll effect to run both directions
        axis: 'x',

        onAfter: trigger2, // our final callback

        offset: offset2,

        // duration of the sliding effect
        duration: 500,
		stop: true,
        // easing - can be used with the easing plugin: 
        // http://gsgd.co.uk/sandbox/jquery/easing/
        easing: 'swing',
		lock: false,
		// return to the first panel or go back to the last panel
		cycle: false
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#gbstLifeSlider').serialScroll(scrollOptions2);
});
/*
// when the DOM is ready...
$(document).ready(function () {

    var $panels = $('#gbstLifeSlider .scrollContainer > .subSection');
    var $container = $('#gbstLifeSlider .scrollContainer');

    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', $panels[0].offsetWidth * $panels.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#gbstLifeSlider .sectionContent').css('overflow', 'hidden');

    // apply our left + right buttons
    $scroll
        .before('<span class="scrollButtons" id="left3" ></span>')
        .after('<span class="scrollButtons" id="right3" ></span>');
    // handle nav selection
   function selectNav() {
	$(this)
		.parents('ul:first')
			.find('a')
				.removeClass('selected')
			.end()
		.end()
		.addClass('selected');
	}
	
	

    $('#gbstLifeSlider .navigation').find('a').click(selectNav);

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
        var el = $('#gbstLifeSlider .navigation').find('a[href$="' + data.id + '"]').get(0);
        selectNav.call(el);
    }

    if (window.location.hash) {
        trigger({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation a:first').click();
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow

        // can be a selector which will be relative to the target
        items: $panels,

        navigation: '.navigation a',

        // selectors are NOT relative to document, i.e. make sure they're unique
        prev: 'span#left3',
        next: 'span#right3', 

        // allow the scroll effect to run both directions
        axis: 'x',

        onAfter: trigger, // our final callback

        offset: offset,

        // duration of the sliding effect
        duration: 500,

        // easing - can be used with the easing plugin: 
        // http://gsgd.co.uk/sandbox/jquery/easing/
        easing: 'swing',
		
		// return to the first panel or go back to the last panel
		cycle: false
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#gbstLifeSlider').serialScroll(scrollOptions);

    // now apply localScroll to hook any other arbitrary links to trigger 
    // the effect
 //$.localScroll(scrollOptions);

    // finally, if the URL has a hash, move the slider in to position, 
    // setting the duration to 1 because I don't want it to scroll in the
    // very first page load.  We don't always need this, but it ensures
    // the positioning is absolutely spot on when the pages loads.
	// scrollOptions.duration = 1;
  //  $.localScroll.hash(scrollOptions);

});*/

$(document).ready(function () {

    var $panels = $('#gbstJobsSlider .scrollContainer > .subSection');
    var $container = $('#gbstJobsSlider .scrollContainer');
	var currentPanelID = ""
    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;
	var i = 0;
	var arrow = "left";
	var panel = "";
	var firstPanelID = $panels[0].id;
	var lastPanelID = $panels[$panels.length-1].id;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', $panels[0].offsetWidth * $panels.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#gbstJobsSlider .sectionContent').css('overflow', 'hidden');

    // apply our left + right buttons
    $scroll
        .before('<span class="scrollButtons" id="left1" >left</span>')
        .after('<span class="scrollButtons" id="right1" >right</span>');

    // handle nav selection
    function selectNav() {
		if (currentPanelID == firstPanelID){
			panel = 'first';
		} else if ( currentPanelID == lastPanelID) {
			panel = 'last';		
		}else{
			panel = '';
		}
		
		//if the current slide is the last slide ($panels.length) then hide button
		if(panel == 'first') {
			$('#left1').addClass('leftHidden');	
			$('#left1').addClass('scrollButtonsHide');	
	
		} else if (panel == 'last') {
			$('#right1').addClass('rightHidden');
			$('#right1').addClass('scrollButtonsHide');	
		} else {
			$('#left1').removeClass('leftHidden');
			$('#left1').removeClass('scrollButtonsHide');	
			$('#right1').removeClass('rightHidden');
			$('#right1').removeClass('scrollButtonsHide');	
		}
		
		var el = $('#gbstJobsSlider .navigation').find('a[href$="' + currentPanelID + '"]').get(0);
		$(el)
			.parents('ul:first')
				.find('a')
					.removeClass('selected') 
				.end()
			.end()
		.addClass('selected');
    }
	
	$('#gbstJobsSlider .navigation').find('a').click(selectNav);
	
	$('#left1').addClass('leftHidden');

	$('#left1').click(function () {
		arrow = "left";
		selectNav();
	});
	
	$('#right1').click(function () {
		arrow = "right";
		selectNav();
	});
	 

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
       // var el = $('#gbstJobsSlider .navigation').find('a[href$="' + data.id + '"]').get(0);
		currentPanelID =  data.id;
		selectNav.call(currentPanelID);
    }


    if (window.location.hash) {
       trigger({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation a:first').click();
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow
		
		//if true, an initial scroll will be forced on start.
		force: true,
        // can be a selector which will be relative to the target
        items: $panels,

        navigation: '.navigation a',

        // selectors are NOT relative to document, i.e. make sure they're unique
        prev: 'span#left1',
        next: 'span#right1', 

        // allow the scroll effect to run both directions
        axis: 'x',

        onAfter: trigger, // our final callback

        offset: offset,

        // duration of the sliding effect
        duration: 500,
		stop: true,
        // easing - can be used with the easing plugin: 
        // http://gsgd.co.uk/sandbox/jquery/easing/
        easing: 'swing',
		lock: false,
		// return to the first panel or go back to the last panel
		cycle: false
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#gbstJobsSlider').serialScroll(scrollOptions);
});


$(document).ready(function () {

    var $panels = $('#workExpSlider .scrollContainer > .subSection');
    var $container = $('#workExpSlider .scrollContainer');
	var currentPanelID = ""
    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;
	var i = 0;
	var arrow = "left";
	var panel = "";
	var firstPanelID = $panels[0].id;
	var lastPanelID = $panels[$panels.length-1].id;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', $panels[0].offsetWidth * $panels.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#workExpSlider .sectionContent').css('overflow', 'hidden');

    // apply our left + right buttons
    $scroll
        .before('<span class="scrollButtons" id="left1" >left</span>')
        .after('<span class="scrollButtons" id="right1" >right</span>');

    // handle nav selection
    function selectNav() {
		if (currentPanelID == firstPanelID){
			panel = 'first';
		} else if ( currentPanelID == lastPanelID) {
			panel = 'last';		
		}else{
			panel = '';
		}
		
		//if the current slide is the last slide ($panels.length) then hide button
		if(panel == 'first') {
			$('#left1').addClass('leftHidden');	
			$('#left1').addClass('scrollButtonsHide');	
	
		} else if (panel == 'last') {
			$('#right1').addClass('rightHidden');
			$('#right1').addClass('scrollButtonsHide');	
		} else {
			$('#left1').removeClass('leftHidden');
			$('#left1').removeClass('scrollButtonsHide');	
			$('#right1').removeClass('rightHidden');
			$('#right1').removeClass('scrollButtonsHide');	
		}
		
		var el = $('#workExpSlider .navigation').find('a[href$="' + currentPanelID + '"]').get(0);
		$(el)
			.parents('ul:first')
				.find('a')
					.removeClass('selected') 
				.end()
			.end()
		.addClass('selected');
    }
	
	$('#workExpSlider .navigation').find('a').click(selectNav);
	
	$('#left1').addClass('leftHidden');

	$('#left1').click(function () {
		arrow = "left";
		selectNav();
	});
	
	$('#right1').click(function () {
		arrow = "right";
		selectNav();
	});
	 

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
       // var el = $('#workExpSlider .navigation').find('a[href$="' + data.id + '"]').get(0);
		currentPanelID =  data.id;
		selectNav.call(currentPanelID);
    }


    if (window.location.hash) {
       trigger({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation a:first').click();
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow
		
		//if true, an initial scroll will be forced on start.
		force: true,
        // can be a selector which will be relative to the target
        items: $panels,

        navigation: '.navigation a',

        // selectors are NOT relative to document, i.e. make sure they're unique
        prev: 'span#left1',
        next: 'span#right1', 

        // allow the scroll effect to run both directions
        axis: 'x',

        onAfter: trigger, // our final callback

        offset: offset,

        // duration of the sliding effect
        duration: 500,
		stop: true,
        // easing - can be used with the easing plugin: 
        // http://gsgd.co.uk/sandbox/jquery/easing/
        easing: 'swing',
		lock: false,
		// return to the first panel or go back to the last panel
		cycle: false
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#workExpSlider').serialScroll(scrollOptions);
});


$(document).ready(function () {

    var $panels = $('#cadetshipSlider .scrollContainer > .subSection');
    var $container = $('#cadetshipSlider .scrollContainer');
	var currentPanelID = ""
    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;
	var i = 0;
	var arrow = "left";
	var panel = "";
	var firstPanelID = $panels[0].id;
	var lastPanelID = $panels[$panels.length-1].id;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', $panels[0].offsetWidth * $panels.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#cadetshipSlider .sectionContent').css('overflow', 'hidden');

    // apply our left + right buttons
    $scroll
        .before('<span class="scrollButtons" id="left1" >left</span>')
        .after('<span class="scrollButtons" id="right1" >right</span>');

    // handle nav selection
    function selectNav() {
		if (currentPanelID == firstPanelID){
			panel = 'first';
		} else if ( currentPanelID == lastPanelID) {
			panel = 'last';		
		}else{
			panel = '';
		}
		
		//if the current slide is the last slide ($panels.length) then hide button
		if(panel == 'first') {
			$('#left1').addClass('leftHidden');	
			$('#left1').addClass('scrollButtonsHide');	
	
		} else if (panel == 'last') {
			$('#right1').addClass('rightHidden');
			$('#right1').addClass('scrollButtonsHide');	
		} else {
			$('#left1').removeClass('leftHidden');
			$('#left1').removeClass('scrollButtonsHide');	
			$('#right1').removeClass('rightHidden');
			$('#right1').removeClass('scrollButtonsHide');	
		}
		
		var el = $('#cadetshipSlider .navigation').find('a[href$="' + currentPanelID + '"]').get(0);
		$(el)
			.parents('ul:first')
				.find('a')
					.removeClass('selected') 
				.end()
			.end()
		.addClass('selected');
    }
	
	$('#cadetshipSlider .navigation').find('a').click(selectNav);
	
	$('#left1').addClass('leftHidden');

	$('#left1').click(function () {
		arrow = "left";
		selectNav();
	});
	
	$('#right1').click(function () {
		arrow = "right";
		selectNav();
	});
	 

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
       // var el = $('#cadetshipSlider .navigation').find('a[href$="' + data.id + '"]').get(0);
		currentPanelID =  data.id;
		selectNav.call(currentPanelID);
    }


    if (window.location.hash) {
       trigger({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation a:first').click();
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow
		
		//if true, an initial scroll will be forced on start.
		force: true,
        // can be a selector which will be relative to the target
        items: $panels,

        navigation: '.navigation a',

        // selectors are NOT relative to document, i.e. make sure they're unique
        prev: 'span#left1',
        next: 'span#right1', 

        // allow the scroll effect to run both directions
        axis: 'x',

        onAfter: trigger, // our final callback

        offset: offset,

        // duration of the sliding effect
        duration: 500,
		stop: true,
        // easing - can be used with the easing plugin: 
        // http://gsgd.co.uk/sandbox/jquery/easing/
        easing: 'swing',
		lock: false,
		// return to the first panel or go back to the last panel
		cycle: false
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#cadetshipSlider').serialScroll(scrollOptions);
});