var introviewportwidth;
var introviewportheight;

function introviewport(){
			
			// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
 
 			if (typeof window.innerWidth != 'undefined'){
      			introviewportwidth = window.innerWidth,
      			introviewportheight = 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){
       			introviewportwidth = document.documentElement.clientWidth,
       			introviewportheight = document.documentElement.clientHeight
 			}
 
 			// older versions of IE
 
 			else
 			{
       			introviewportwidth = document.getElementsByTagName('body')[0].clientWidth,
       			introviewportheight = document.getElementsByTagName('body')[0].clientHeight
 			}
 			
			introverticalcenter('introcontainer');
			
			//document.getElementById("output").innerHTML = '<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>';	
		}

function introverticalcenter(IDdiv){

			if (document.styleSheets[0].cssRules){
					rules = document.styleSheets[0].cssRules;
			}
			else if (document.styleSheets[0].rules){
					rules = document.styleSheets[0].rules;
			}
			
			//document.getElementById("output").innerHTML = 'TEST';
			for (i = 0; i < rules.length; i++){
				if(rules[i].selectorText.toLowerCase() == "#introcontainer"){ 
					hekjeintrocontainer = i;
				}
			}

			var introcontainerheight = document.getElementById(IDdiv).clientHeight;
						
			if (document.styleSheets[0].deleteRule){ //if Firefox
				
				if (introviewportheight - introcontainerheight < 0){

					document.styleSheets[0].deleteRule(hekjeintrocontainer);
					document.styleSheets[0].insertRule("#introcontainer{ background: #FFFFFF; width: 900px;	height: 790px; margin: auto; }", hekjeintrocontainer);			
				}
				else{
				
					var newmargin = ((introviewportheight - introcontainerheight)/2)+"px";
										
					document.styleSheets[0].deleteRule(hekjeintrocontainer);
					document.styleSheets[0].insertRule("#introcontainer{ background: #FFFFFF; width: 900px;	height: 790px; margin: auto; margin-top: "+newmargin+"; margin-bottom: "+newmargin+"; }", hekjeintrocontainer);
				}
			}
			
			if (document.styleSheets[0].removeRule){ //if IE
			
				if (introviewportheight - introcontainerheight < 0){
				
					document.styleSheets[0].removeRule(hekjeintrocontainer);
					document.styleSheets[0].addRule("#introcontainer", "background: #FFFFFF; width: 900px;	height: 790px; margin: auto;", hekjeintrocontainer);
				
				}
				else{
				
					var newmargin = ((introviewportheight - introcontainerheight)/2)+"px";
				
					document.styleSheets[0].removeRule(hekjeintrocontainer);
					document.styleSheets[0].addRule("#introcontainer", "background: #FFFFFF; width: 900px;	height: 790px; margin: auto; margin-top: "+newmargin+"; margin-bottom: "+newmargin+";", hekjeintrocontainer);
				
				}
			
			}


		}