function DivOverlay(bounds, opt_weight, opt_color) {
      this.bounds_ = bounds;
      this.weight_ = opt_weight || 0;
      this.color_ = opt_color || "#888888";
    }
    DivOverlay.prototype = new GOverlay();

    // Creates the DIV representing this DivOverlay.
    DivOverlay.prototype.initialize = function(map) {
      // Create the DIV representing our DivOverlay
      var div = document.createElement("div");
      div.style.border = "2px solid black";
      div.style.position = "absolute";
      // Our DivOverlay is flat against the map, so we add our selves to the
      // MAP_PANE pane, which is at the same z-index as the map itself (i.e.,
      // below the marker shadows)
      map.getPane(G_MAP_MARKER_PANE).appendChild(div);

      this.map_ = map;
      this.div_ = div;
    }

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

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

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

      // Calculate the DIV coordinates of two opposite corners of our bounds to
      // get the size and position of our DivOverlay
      var c1 = this.map_.fromLatLngToDivPixel(this.bounds_.getSouthWest());
      var c2 = this.map_.fromLatLngToDivPixel(this.bounds_.getNorthEast());

      // Now position our DIV based on the DIV coordinates of our bounds
      this.div_.style.width = (Math.abs(c2.x - c1.x)) + "px";
      this.div_.style.height = (Math.abs(c1.y-c2.y)) + "px";
      this.div_.style.left = (Math.min(c2.x, c1.x) - this.weight_) + "px";
      this.div_.style.top = (Math.min(c2.y, c1.y) - this.weight_) + "px";
    }