function numSwitcher() {
  var myIndex = $("#header").children().index(this) + 1;
  $('#pic-index').html(myIndex);
}

// if JS is on, preload the images and add the pic navigation links to the DOM

$(document).ready(function() {
    var numImages =  $('#header').children().length;
	var rndNum = Math.floor(Math.random() * numImages);
    
      //$('#main-container').append('<div id="img-ctrl"><a id="hi_prev" href="#"><img src="images/shared/arrow-prev.jpg" width="15" height="15" alt="Previous Picture"/></a> Photo <span id="pic-index">0</span> of '+ numImages +' <a id="hi_next" href="#"><img src="images/shared/arrow-next.jpg" width="15" height="15" alt="Next Picture"/></a></div>');
	   
	   // then add the cycle info
       $('#header').cycle({ 
        fx:     'fade', 
        speed:  500, 
        timeout: 7500, 
        next:   '#hi_next',
        prev:   '#hi_prev',
	    pause: 1,
	    startingSlide: rndNum,
	    before: numSwitcher
       });
	
    if($.browser.safari == true){
      $('#header').css({
	  	'width' : '985px', 
		'height' : '260px',
		'position' : 'relative'
	  });
	 
	}
	
});