function CssStyleSheet()
{
    this.rules = [];
    this.ruleIndex = [];
    if (document.createStyleSheet)
        this.sheet = document.createStyleSheet();
    else
    {
        this.styleElement = document.createElement("style");
        document.getElementsByTagName("head")[0].appendChild(this.styleElement);
        this.sheet = this.styleElement.styleSheet ? this.styleElement.styleSheet : this.styleElement.sheet;
    }
}
CssStyleSheet.prototype.addRule = function(selectorText, ruleText)
{
    var result;
    if (!this.sheet) // Opera, and other browsers with no DOM stylesheet support
    {
        ruleText = ruleText.replace(/^\{?([^\}])/, "$1");
        if (!this.ruleIndex[selectorText])
        this.ruleIndex[selectorText] = this.rules.length;
        this.rules[this.ruleIndex[selectorText]] = ruleText;
        var cssText = "";
        for (var sel in this.ruleIndex)
            cssText = sel + " {" + this.rules[this.ruleIndex[sel]] + "}";
        this.styleElement.innerHTML = cssText;
    }
    else if (this.sheet.addRule) // IE.
    {
        ruleText = ruleText.replace(/^\{?([^\}])/, "$1");
        var r = this.sheet.rules.length;
        this.sheet.addRule(selectorText, ruleText);
        result = this.sheet.rules[r];
        this.ruleIndex[selectorText] = r;

        if (this.rules.length == 0)
        this.rules = this.sheet.rules;
    }
    else if (this.sheet.insertRule)
    {
        if (!/^\{[^\}]*\}$/.test(ruleText))
            ruleText = "{" + ruleText + "}";

        var r = this.sheet.cssRules.length;
        this.sheet.insertRule(selectorText + " " + ruleText, r);
        result = this.sheet.cssRules[r];
        this.ruleIndex[selectorText] = r;

        if (this.rules.length == 0)
            this.rules = this.sheet.cssRules;
    }
    else
    {
        alert("Cannot create rule");
    }
    return result;
}
