var design_id

$(document).ready(function() {
						   
					
				
					
	$('div#faqin').click(function() {
								
								
	
									   
									var br=this.getBoundingClientRect()
									
									//var br=document.getElementById('shop').getBoundingClientRect()
									
/*alert("Top:"+br.top+", Left:"+br.left+", Right:"+br.right+", Bottom:"+br.bottom)*/

                  var sr = document.getElementById('container').getBoundingClientRect()
              
			  /*var we = $(this).attr('href')*/
			  
			  //var we = this.getAttribute() 


		//Setup the modal window
		$('body').append('<div id="overlayFaq"></div><div id="modalFaq"><div id="modalInnerFaq"><iframe id="faq_in"  src="faq.html"></iframe><a href="#" id="close" title="Close">Close</a></div></div>');
	
		var viewportwidth;
 var viewportheight;
 
 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
 
 if (typeof window.innerWidth != 'undefined')
 {
      viewportwidth = window.innerWidth,
      viewportheight = window.innerHeight
 }
 
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)

 else if (typeof document.documentElement != 'undefined'
     && typeof document.documentElement.clientWidth !=
     'undefined' && document.documentElement.clientWidth != 0)
 {
       viewportwidth = document.documentElement.clientWidth,
       viewportheight = document.documentElement.clientHeight
 }
 
 // older versions of IE
 
 else
 {
       viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
       viewportheight = document.getElementsByTagName('body')[0].clientHeight
 }


//end
		if($.browser.msie && $.browser.version <= 6.0) {
			var windowHeight = $(document).height();
			$('#overlayFaq').height(windowHeight);
		}
		
		$('#overlayFaq').css('opacity', 0.5).fadeIn('fast');
		$('#modalFaq').fadeIn('fast');
		
		//Position it in the viewport
		/*var scrollPos = $(window).scrollTop() + 50;*/		
		var scrollPosTop = br.top
			var scrollPosLeft =  sr.left
			
			var windowHeight = $(document).height();
			
		$('#modalFaq').css('top',viewportheight/2-305 +'px');
		$('#modalFaq').css('left',scrollPosLeft+'px');
	    
	
	$(window).resize(function() {
								  
								  var sr = document.getElementById('container').getBoundingClientRect()
								  var scrollPosLeft =  sr.left
						
		$('#modalFaq').css('left',scrollPosLeft+'px');
			  
								  
								  
								  
								  
								  });
	
	
	
		
		//Handle the clicking of close button or clicking the background
		$('div#modalFaq a#close,div#overlayFaq').bind('click', function() {
																  
			$('div#modalFaq').fadeOut('fast',function() {
				$('div#overlayFaq').fadeOut('fast',function() {
					$(this).remove();							   
				});
				$(this).remove();							   
			});
			return false;
		});	
		
		//Get the image
		//var imgUrl = $(this).attr('href');
		
		
		
		//$(this).fg.css("background-color", "blue");
		
		//var who = $(this).children().children()
		   
		//var des = $(document).getElementById('order-area').attr('rel')
		
		//window.getElementById('design').value = design_id
	
	
		   
		/*$('div#modalFaqImageColumn').append('<a href="./images/tee02zoom.jpg" class="zoom" title="Your Title"> <img src="./images/tee02.png"> </a>');
		
		
		
			displaymessage()*/
			
			
			
		return false;
	});
	
	
	
});