//alert(document.getElementById('test').offsetHeight);
      //document.getElementById('test').style.height='12.8em';
      function getHeight(elem) {
        return document.getElementById(elem).offsetHeight;
      }

      function setHeight(elem, elem_height) {
        document.getElementById(elem).style.height = elem_height;
      }

      function getSetHeightEm(elem) {
        temp = document.getElementById(elem).offsetHeight;
        if (temp!=0) {
          document.getElementById(elem).style.height = "" + temp / 10 + "em";
          //return document.getElementById(elem).style.height;
        }
      }

      function convertToEm(no_of_pixels, css_body_font_size_percent) {
        if (no_of_pixels!=0) {
          //document.getElementById(elem).style.height = "" + temp / 10 + "em";
          return "" + (no_of_pixels / 10) * (62.5/css_body_font_size_percent) + "em";
        }
      }

function findCSS3() {
var mysheet=document.styleSheets[0]
for (i=0; i<mysheet.cssRules.length; i++){
/*if (mysheet.cssRules[i].selectorText=="p"){ //find the first "p" rule within stylesheet
pobj=mysheet.cssRules[i]
break
}*/
alert(mysheet.cssRules[i].style.backgroundImage);
alert(mysheet.cssRules[i].selectorText);
}

}

// convert s to camel case
function rzCC(s){
  for(var exp=/-([a-z])/; exp.test(s); s=s.replace(exp,RegExp.$1.toUpperCase()));
  return s;
}

function rzGetStyle(e,a){
  var v=null;
  if(document.defaultView && document.defaultView.getComputedStyle){
    var cs=document.defaultView.getComputedStyle(e,null);
    if(cs && cs.getPropertyValue) v=cs.getPropertyValue(a);
  }
  if(!v && e.currentStyle) v=e.currentStyle[rzCC(a)];
  return v;
}


function addBackgroundImageHTML(elem) {

  //Detect IE version 5.5 and later
  var arVersion = navigator.appVersion.split("MSIE");
  var version = parseFloat(arVersion[1]);

  var tempBG='';
  var tempUndefined;

  if (document.getElementById(elem).style.backgroundSize!=undefined) {
    //alert('CSS3 compat backgroundSize');
    //Do nothing (Assumes background-size:100% 100%; in CSS
  }
  else if (document.getElementById(elem).style.webkitBackgroundSize!=undefined) {
    //alert('CSS3 compat webkitBackgroundSize - KHTML/Safari');
    //Webkit proprietry webkitBackgroundSize - KHTML/Konqueror/Safari
    document.getElementById(elem).style.webkitBackgroundSize="100%";
  }
  else if (document.getElementById(elem).style.oBackgroundSize!=undefined) {
    //alert('CSS3 compat oBackgroundSize - Opera 9.50+');
    //Opera proprietry oBackgroundSize - Opera 9.5 - Opera X.Y?
    document.getElementById(elem).style.oBackgroundSize="100%";
  }
  else if ((encodeURI) && (document.body.filters)) {
    //alert('IE 5.5 - 7.x (and maybe 8.0) Proprietry Filters with sizeMode scale');

    //Internet Explorer proprietry filter:progid:AlphaImageLoader - Internet Explorer 5.5 - 7? (Assumes IE 8 will come with CSS2 backgroundSize support!)

    tempBG = rzGetStyle(document.getElementById(elem),'background-image');

    if (tempBG.substr(0,5)=='url("') {
      tempBG = tempBG.substr(5,tempBG.length-7)
    }
    if (tempBG.substr(0,4)=='url(') {
      tempBG = tempBG.substr(4,tempBG.length-5)
    }

    tempBG=tempBG.substring(tempBG.lastIndexOf("media/images/"),tempBG.length);

    document.getElementById(elem).style.background="none";

    document.getElementById(elem).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'" + tempBG + "', sizingMethod='scale')";

  }
  else {
    //what is going on? if I remove the  alert, Opera <9.5 does not finish - no  image appears. Is it the pause? Or the order of execution of the scripts in the page?
    //alert('NO CSS3 backgroundSize - Firefox 2.X (Maybe 3.X?) and Others');
    //All other Non CSS3 Compatible Browsers -Firefox 2.X and others (Firefox 3 CSS3  backgroundSize compat yet?)

    tempBG = rzGetStyle(document.getElementById(elem),'background-image');

    if (tempBG.substr(0,5)=='url("') {
      tempBG = tempBG.substr(5,tempBG.length-7)
    }
    if (tempBG.substr(0,4)=='url(') {
      tempBG = tempBG.substr(4,tempBG.length-5)
    }

    document.getElementById(elem).style.position='relative';
    document.getElementById(elem).innerHTML = '<div style="position:relative; z-index:1000000; ">' + document.getElementById(elem).innerHTML;

    document.getElementById(elem).innerHTML = document.getElementById(elem).innerHTML + '<\/div>';

    //Fixes escaped Parenthesis in URL of image (e.g.  (Live) has become \(Live\) in Firefox 2.X)
    tempBG = tempBG.replace(/\\[(]/g,"(");
    tempBG = tempBG.replace(/\\[)]/g,")");

    document.getElementById(elem).style.background="none";

    //Pre   appendChild /createElement code below
    //document.getElementById(elem).innerHTML = document.getElementById(elem).innerHTML + "<div style='display:block; width:100%; height:100%; z-index:0; position:absolute; top:0; left:0; '><img src=" + tempBG + " style='display:block; width:100%; height:100%; '\/><\/div>";


  //Operra Probs with setAttribute

    var theNewDiv = document.createElement('div');
    var theNewImg = document.createElement('img');

    //var theTextOfTheParagraph = document.createTextNode('Some content.');
    //theNewDiv.appendChild(theTextOfTheParagraph);




    //theNewImg.setAttribute('src',tempBG);
    theNewImg.src = tempBG;
    //theNewImg.setAttribute('style','display:block; width:100%; height:100%; ');
    theNewImg.style.display = 'none';
    theNewImg.style.width = '100%';
    theNewImg.style.height = '100%';

    //theNewImg.onload = function() { this.style.display='block'; }


    //theNewDiv.setAttribute('style','display:block; height:100%; z-index:0; position:absolute; top:0; left:0; ');
    theNewDiv.style.display = 'block';
    theNewDiv.style.width = '100%';
    theNewDiv.style.height = '100%';

    theNewDiv.style.zIndex = '0';
    theNewDiv.style.position = 'absolute';
    theNewDiv.style.top = '0';
    theNewDiv.style.left = '0';


    theNewDiv.appendChild(theNewImg);

    document.getElementById(elem).appendChild(theNewDiv);
    theNewImg.style.display = 'block';
    //The line above fixes the FLICKER in FF2.X - is it legal? to declare the style after appending to the DOM tree??
  }

}


function findClass() {
  getElementsByClassName(document, "*", "css3-background-scale");
}


//Written by Jonathan Snook, http://www.snook.ca/jonathan  |  Add-ons by Robert Nyman, http://www.robertnyman.com

function getElementsByClassName(oElm, strTagName, strClassName) {

	var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
	var arrReturnElements = new Array();
	strClassName = strClassName.replace(/\-/g, "\\-");
	var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
	var oElement;
	for(var i=0; i<arrElements.length; i++){
		oElement = arrElements[i];
		if(oRegExp.test(oElement.className)){
			arrReturnElements.push(oElement);
		}
	}
	return (arrReturnElements) 
}



function defineCSS3BackgroundSize(elem2) {
  //Detect IE version 5.5 and later
  var arVersion = navigator.appVersion.split("MSIE");
  var version = parseFloat(arVersion[1]);

  var tempBG='';
  var tempUndefined;

//var elem2='website';

  //alert('opera probs');

  if (document.getElementById(elem2).style.backgroundSize!=undefined) {
    alert('CSS3 compat backgroundSize');
    //Do nothing (Assumes background-size:100% 100%; in CSS
    function css3BackgroundSize100(elem) { }
  }
  else if (document.getElementById(elem2).style.webkitBackgroundSize!=undefined) {
    alert('CSS3 compat webkitBackgroundSize - KHTML/Safari');
    //Webkit proprietry webkitBackgroundSize - KHTML/Konqueror/Safari
    function css3BackgroundSize100(elem) {
      document.getElementById(elem).style.webkitBackgroundSize="100%";
    }
  }
  else if (document.getElementById(elem2).style.oBackgroundSize!=undefined) {
    alert('CSS3 compat oBackgroundSize - Opera 9.50+');
    //Opera proprietry oBackgroundSize - Opera 9.5 - Opera X.Y?

    function css3BackgroundSize100(elem) {
      document.getElementById(elem).style.oBackgroundSize="100%";
    }
  }
  else if ((encodeURI) && (document.body.filters)) {
    alert('IE 5.5 - 7.x (and maybe 8.0) Proprietry Filters with sizeMode scale');

    //Internet Explorer proprietry filter:progid:AlphaImageLoader - Internet Explorer 5.5 - 7? (Assumes IE 8 will come with CSS2 backgroundSize support!)



    function css3BackgroundSize100(elem) {
      tempBG = rzGetStyle(document.getElementById(elem),'background-image');

      if (tempBG.substr(0,5)=='url("') {
        tempBG = tempBG.substr(5,tempBG.length-7)
      }
      if (tempBG.substr(0,4)=='url(') {
        tempBG = tempBG.substr(4,tempBG.length-5)
      }

      tempBG=tempBG.substring(tempBG.lastIndexOf("media/images/"),tempBG.length);

      document.getElementById(elem).style.background="none";

      document.getElementById(elem).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'" + tempBG + "', sizingMethod='scale')";
    }

  }
  else {
    //what is going on? if I remove the  alert, Opera <9.5 does not finish - no  image appears. Is it the pause? Or the order of execution of the scripts in the page?

    //alert('NO CSS3 backgroundSize - Firefox 2.X (Maybe 3.X?) and Others');

    //All other Non CSS3 Compatible Browsers -Firefox 2.X and others (Firefox 3 CSS3  backgroundSize compat yet?)


    function css3BackgroundSize100(elem) {
      tempBG = rzGetStyle(document.getElementById(elem),'background-image');

      //alert(tempBG);

      if (tempBG.substr(0,5)=='url("') {
        tempBG = tempBG.substr(5,tempBG.length-7)
      }
      if (tempBG.substr(0,4)=='url(') {
        tempBG = tempBG.substr(4,tempBG.length-5)
      }

      document.getElementById(elem).style.position='relative';
      document.getElementById(elem).innerHTML = '<div style="position:relative; z-index:1000000; ">' + document.getElementById(elem).innerHTML;

      document.getElementById(elem).innerHTML = document.getElementById(elem).innerHTML + '<\/div>';

      //Fixes escaped Parenthesis in URL of image (e.g.  (Live) has become \(Live\) in Firefox 2.X)
      tempBG = tempBG.replace(/\\[(]/g,"(");
      tempBG = tempBG.replace(/\\[)]/g,")");

      document.getElementById(elem).innerHTML = document.getElementById(elem).innerHTML + "<div style='display:block; width:100%; height:100%; z-index:0; position:absolute; top:0; left:0; '><img src='" + tempBG + "' style='display:block; width:100%; height:100%; '\/><\/div>";
      document.getElementById(elem).style.background="none";
    }
    //css3BackgroundSize100('menu');

 //Opera problems on subsequent calls - needs alert() or some other timeout

    css3BackgroundSize100('header');
    //alert('header done');
    css3BackgroundSize100('strapLine');
    css3BackgroundSize100('page');
    //alert('page done');
    //css3BackgroundSize100('menu');
    setTimeout("css3BackgroundSize100('menu')",0);
    //alert('menu done');
    css3BackgroundSize100('menuBottom');
    css3BackgroundSize100('footer');

  }


}


/* 

var theNewParagraph = document.createElement('p');
var theTextOfTheParagraph = document.createTextNode('Some content.');
theNewParagraph.appendChild(theTextOfTheParagraph);
document.getElementById('someElementId').appendChild(theNewParagraph);

*/

/*



//three elements are required: p, b, br
var theNewParagraph = document.createElement('p');
var theBoldBit = document.createElement('b');
var theBR = document.createElement('br');

//set up theNewParagraph
theNewParagraph.setAttribute('title','The test paragraph');

//prepare the text nodes
var theText1 = document.createTextNode('This is a sample of some ');
var theText2 = document.createTextNode('HTML you might');
var theText3 = document.createTextNode('have');
var theText4 = document.createTextNode(' in your document');

//put together the bold bit
theBoldBit.appendChild(theText2);
theBoldBit.appendChild(theBR);
theBoldBit.appendChild(theText3);

//put together the whole paragraph
theNewParagraph.appendChild(theText1);
theNewParagraph.appendChild(theBoldBit);
theNewParagraph.appendChild(theText4);

//insert it into the document somewhere
document.getElementById('someElementId').appendChild(theNewParagraph);



*/