	function Balloon(center, opt_weight, opt_color) {
		this.center_ = center;
		this.weight_ = opt_weight || 2;
		this.color_ = opt_color || "#888888";
		this.data_ = "";
		this.importance = 10;
	}

	Balloon.prototype = new GOverlay();

	// Creates the DIV representing this balloonangle.
	Balloon.prototype.initialize = function(map) {
		// Create the DIV representing our balloonangle
		var div = document.createElement("div");
		div.id = "balloon_content";
		div.style.position = "absolute";
		div.style.display = "none";
		div.style.background = "#FFFFFF";
		div.style.color = "#5A606B";
		div.style.borderLeft = "1px solid #C5CDDE";
		div.style.borderRight = "1px solid #C5CDDE";
		div.style.padding = "10px";
		div.style.paddingTop = "5px";
		div.style.paddingBottom = "5px";

		map.getPane(G_MAP_MARKER_PANE).appendChild(div);

		div.style.zIndex = 11;
		this.map_ = map;
		this.div_ = div;
	}

	// Remove the main DIV from the map pane
	Balloon.prototype.remove = function() {
		this.div_.parentNode.removeChild(this.div_);
	}

	// Copy our data to a new Balloon
	Balloon.prototype.copy = function() {
		return new Balloon(this.center_, this.weight_, this.color_,
				this.backgroundColor_, this.opacity_);
	}

	Balloon.prototype.setCenter = function(center) {
		this.center_ = center;
		this.redraw(true);
	}

	Balloon.prototype.setData = function(subject, body, url) {
		this.subject_ = subject;
		this.data_ = body;
		this.url_ = url;
		this.redraw(true);
	}

	Balloon.prototype.visible = function(visible) {
		if (!this.div_)
			return;

		if (visible) {
			this.div_.style.display = "block";
		} else {
			this.div_.style.display = "none";
		}
	}

	// Redraw the balloonangle based on the current projection and zoom level
	Balloon.prototype.redraw = function(force) {
		// We only need to redraw if the coordinate system has changed
		if (!force) return;

		if (!this.div_)
			return;

		var html = "";

		if (this.url_ != undefined)
			html += "<div style='cursor: pointer;' onClick='getXUrl_direct(\"" + this.url_ + "\");'>";
		else
			html += "<div>";

		html += "<div style='position: absolute; width: 180px; height: 4px; background-image: url(\"images/balloon_top.png\"); top: -4px; left: 0px;'></div>";
		html += "<strong>" + this.subject_ + "</strong><br/>";
		html += this.data_;
		html += "<div style='position: absolute; width: 180px; height: 8px; background-image: url(\"images/balloon_bottom.png\"); bottom: -8px; left: 0px;'></div>";
		html += "</div>";

		this.div_.innerHTML = html;

		var c = this.map_.fromLatLngToDivPixel(this.center_);

		height = $("#balloon_content").height();
		width = $("#balloon_content").width();

		this.div_.style.width = "160px";
		//this.div_.style.height = "10px";
		this.div_.style.left = c.x - 95 + "px";
		this.div_.style.top = Math.min(c.y - height - 60) + "px";

		var pos_left = parseInt(this.div_.style.left);
		var pos_right = parseInt(this.div_.style.left) + parseInt(this.div_.style.width) + 20;
		var pos_top = parseInt(this.div_.style.top);
		var geo_left = this.map_.fromDivPixelToLatLng(new GPoint(pos_left, pos_top));
		var geo_right = this.map_.fromDivPixelToLatLng(new GPoint(pos_right, pos_top));

		/* This gives issues when zooming (remembers position) */
		/* var bounds = this.map_.getBounds();
		if (!bounds.contains(geo_left) || !bounds.contains(geo_right)) {
			this.map_.panTo(this.center_);
		}*/
	}

