text: // mini budget overview
  // to enable selection through pseudoStyle()
  var UID = {
  	_current: 0,
  	getNew: function(){
  		this._current++;
  		return this._current;
  	}
  };
  
  HTMLElement.prototype.pseudoStyle = function(element,prop,value){
  	var _this = this;
  	var _sheetId = "pseudoStyles";
  	var _head = document.head || document.getElementsByTagName('head')[0];
  	var _sheet = document.getElementById(_sheetId) || document.createElement('style');
  	_sheet.id = _sheetId;
  	var className = "pseudoStyle" + UID.getNew();
  	
  	_this.className +=  " "+className; 
  	
  	_sheet.innerHTML += "\n."+className+":"+element+"{"+prop+":"+ "'" + value + "'" +"}";
  	_head.appendChild(_sheet);
  	return this;
  };
  
  let budgetProgressBar =  document.querySelector('.budget-progress');
    
  budgetProgressBar.pseudoStyle("before","content", BALANCE);