function popMap( placement, markers ){

		var holder		= document.createElement( 'DIV' );			// create a holder new div element for the option menu
		var body		= document.getElementById( 'Kensington' );	// grab the body element to append the div to it
		var contents	= document.createElement( 'DIV' );			// create a content new div element for the option menu
		var innerLayer	= document.createElement( 'DIV' );			// create a content new div element for the option menu
		var canvas		= document.getElementById( 'canvas' );		// grab the first div layer
		var self		= this;
		var container	= document.createElement( 'DIV' );
			container.id = 'map';

		var addEvent = function( element, eventType, eventFunction ) {
			if ( element.attachEvent ) {	// IE
				element.attachEvent( 'on' + eventType, eventFunction );
			} else if ( element.addEventListener ) {	// Mozilla
				element.addEventListener( eventType, eventFunction, false );
			}
		}

		var removeEvent = function( element, eventType, eventFunction ) {
			if ( element.detachEvent ) {	// IE
				element.detachEvent( 'on' + eventType, eventFunction );
			} else if ( element.removeEventListener ) {	// Mozilla
				element.removeEventListener( eventType, eventFunction, false );
			}
		}

		var setup = function() {
	
			holder.style.position		= 'absolute';
			holder.style.display		= 'block';
			holder.style.visibility		= 'hidden';
			if ( holder.addEventListener ) {
				holder.innerHTML		= '<img src="images/box-shadow-2.png" width="100%" height="100%" />';
			} else {
				holder.innerHTML		= '<div style="width: 100%; height: 100%; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'/images/box-shadow-2.png\', sizingMethod =\'scale\')">';
			}

			body.appendChild( holder );

			contents.style.position		= 'absolute';
			contents.style.left			= '2px';
			contents.style.top			= '2px';
			contents.style.border		= '1px solid black';
			contents.style.background	= 'white';
			contents.style.overflow		= 'hidden';

			innerLayer.style.padding	= '0';

			holder.appendChild( contents );
			contents.appendChild( innerLayer );

			createContent();

			self.updatePosition();
			holder.style.visibility = 'visible';
			
			addEvent( body, 'mousedown', self.onBodyClick );
			addEvent( window, 'resize', self.updateLayout );
			addEvent( window, 'scroll', self.scrollLayout );

			holder.onmousedown = function(e) {

				if ( !e ) {	e = window.event; }
				
				if ( e ) {
					if (e.stopPropagation) {
						e.stopPropagation();
					} else {
						e.returnValue	= false;
						e.cancelBubble	= true;
					}
				}
			}

			obscure();

		}

		var obscure = function( kill ) {

			if ( obscure.layer ){

				if( kill && obscure.layer.parentNode ){

					obscure.layer.parentNode.removeChild( obscure.layer );
					obscure.layer = false;

				}

			} else if ( holder.parentNode ) {

				obscure.layer					= document.createElement( 'DIV' );
				obscure.layer.style.position	= 'absolute';
				obscure.layer.style.left		= '0px';
				obscure.layer.style.right		= '0px';
				obscure.layer.style.top			= '0px';
				obscure.layer.style.bottom		= '0px';

				holder.parentNode.insertBefore( obscure.layer, holder );

			}

		}

		var startLoad = function() {

			contents.style.background = 'url(images/rotate-anim-small.gif) center center no-repeat white';
			innerLayer.style.visibility = 'hidden';

		}

		var endLoad = function() {

			contents.style.background = 'white';
			innerLayer.style.visibility = 'visible';

		}

		var createContent = function() {

			startLoad();

			self.updateDimensions();
				
			innerLayer.appendChild( container );

			var close = document.createElement( 'div' );
				close.style.cssText		= 'background: url(images/map/icon-close.png) 50% 50% no-repeat; * background: transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/map/icon-close.png\', sizingMethod =\'image\');';
				close.style.position	= 'absolute';
				close.style.top			= '10px';
				close.style.right		= '10px';
				close.style.width		= '50px';
				close.style.height		= '50px';
				close.style.cursor		= 'pointer';
				close.alt				= 'Close Map';
				close.title				= 'Close Map';

			addEvent( close, 'click', function() { canvas.style.display='none';	self.kill();
			} );

			innerLayer.appendChild( close );

			if ( GBrowserIsCompatible() ) {

				var map = new GMap2( document.getElementById( 'map' ) );	
					map.addControl( new GOverviewMapControl() );
					map.addControl( new GScaleControl() );
					map.enableDoubleClickZoom();
					map.enableContinuousZoom();
					map.setCenter( new GLatLng( 0, 0 ), 0 );

				var zoomIn = document.createElement( 'div' );
					zoomIn.style.cssText	= 'background: url(images/map/icon-zoom-in.png) 50% 50% no-repeat; * background: transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/map/icon-zoom-in.png\', sizingMethod =\'image\');';
					zoomIn.style.position	= 'absolute';
					zoomIn.style.top		= '10px';
					zoomIn.style.left		= '10px';
					zoomIn.style.width		= '40px';
					zoomIn.style.height		= '40px';
					zoomIn.style.cursor		= 'pointer';
					zoomIn.alt				= 'Zoom In';
					zoomIn.title			= 'Zoom In';

				GEvent.addDomListener( zoomIn, 'click', function() {
					map.zoomIn();
				});

				var zoomOut = document.createElement( 'div' );
					zoomOut.style.cssText	= 'background: url(images/map/icon-zoom-out.png) 50% 50% no-repeat; * background: transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/map/icon-zoom-out.png\', sizingMethod =\'image\');';
					zoomOut.style.position	= 'absolute';
					zoomOut.style.top		= '55px';
					zoomOut.style.left		= '10px';
					zoomOut.style.width		= '40px';
					zoomOut.style.height	= '40px';
					zoomOut.style.cursor	= 'pointer';
					zoomOut.alt				= 'Zoom Out';
					zoomOut.title			= 'Zoom Out';

				GEvent.addDomListener( zoomOut, 'click', function() {
					map.zoomOut();
				});

				var typeSatellite = document.createElement( 'div' );
					typeSatellite.style.cssText		= 'background: url(images/map/icon-world.png) 50% 50% no-repeat; * background: transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/map/icon-world.png\', sizingMethod =\'image\');';
					typeSatellite.style.position	= 'absolute';
					typeSatellite.style.top			= '100px';
					typeSatellite.style.left		= '10px';
					typeSatellite.style.width		= '40px';
					typeSatellite.style.height		= '40px';
					typeSatellite.style.cursor		= 'pointer';
					typeSatellite.alt				= 'Satellite Map';
					typeSatellite.title				= 'Satellite Map';

				GEvent.addDomListener( typeSatellite, 'click', function() {
					map.setMapType( G_SATELLITE_MAP );
				});

				var typeStreet = document.createElement( 'div' );
					typeStreet.style.cssText	= 'background: url(images/map/icon-map.png) 50% 50% no-repeat; * background: transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/map/icon-map.png\', sizingMethod =\'image\');';
					typeStreet.style.position	= 'absolute';
					typeStreet.style.top		= '140px';
					typeStreet.style.left		= '10px';
					typeStreet.style.width		= '40px';
					typeStreet.style.height		= '40px';
					typeStreet.style.cursor		= 'pointer';
					typeStreet.alt				= 'Road Map';
					typeStreet.title			= 'Road Map';

				GEvent.addDomListener( typeStreet, 'click', function() {
					map.setMapType( G_NORMAL_MAP );
				});

				var typeHybrid = document.createElement( 'div' );
					typeHybrid.style.cssText	= 'background: url(images/map/icon-hybrid.png) 50% 50% no-repeat; * background: transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/map/icon-hybrid.png\', sizingMethod =\'image\');';
					typeHybrid.style.position	= 'absolute';
					typeHybrid.style.top		= '180px';
					typeHybrid.style.left		= '5px';
					typeHybrid.style.width		= '50px';
					typeHybrid.style.height		= '50px';
					typeHybrid.style.cursor		= 'pointer';
					typeHybrid.alt				= 'Hybrid Map';
					typeHybrid.title			= 'Hybrid Map';

				GEvent.addDomListener( typeHybrid, 'click', function() {
					map.setMapType( G_HYBRID_MAP );
				});

				var controlBg = document.createElement( 'div' );
					controlBg.style.cssText		= 'background: url(images/map/control-bg.png) 100% 100% no-repeat; * background: transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/map/control-bg.png\', sizingMethod =\'image\');';
					controlBg.style.position	= 'absolute';
					controlBg.style.top			= '-15px';
					controlBg.style.left		= '0';
					controlBg.style.width		= '60px';
					controlBg.style.height		= '250px';

				map.getContainer().appendChild( controlBg );
				map.getContainer().appendChild( zoomIn );
				map.getContainer().appendChild( zoomOut );
				map.getContainer().appendChild( typeSatellite );
				map.getContainer().appendChild( typeStreet );
				map.getContainer().appendChild( typeHybrid );

				var markerBounds = new GLatLngBounds();

				for ( i in markers ) {
					var markerPoint =  new GLatLng( markers[i][0], markers[i][1] )
					markerBounds.extend( markerPoint );
					map.addOverlay( createMarker( i, markerPoint, markers[i][2] ) );
				}

				map.setCenter( markerBounds.getCenter(), map.getBoundsZoomLevel( markerBounds) );

				if (map.getZoom() > 15) {
					map.setZoom( 15 );
				}

			}			

			function createMarker( id, point, markerTitle ) {

				var icon = new GIcon();
					icon.image				= "http://labs.google.com/ridefinder/images/mm_20_red.png";
					icon.shadow				= "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
					icon.iconSize			= new GSize( 12, 20 );
					icon.shadowSize			= new GSize( 22, 20 );
					icon.iconAnchor			= new GPoint( 6, 20 );
					icon.infoWindowAnchor	= new GPoint( 5, 1 );

				var marker = new GMarker( point, icon );
				
				var innerContent = '<div style="text-align: center; padding: 0 0 5px 0;">' + markerTitle + '</div>'
								 + '<div id="detail-map-' + id + '" style="width: 100%; height: 100px; border: 1px solid #CCCCCC;"></div>';
			  
				GEvent.addListener(marker, "click", function() {

					marker.openInfoWindowHtml( innerContent );
					
					var mapDiv = document.getElementById( 'detail-map-' + id );
				
					var detailMap = new GMap2( mapDiv );
						detailMap.setCenter( point , 17 );

					G_NORMAL_MAP.getErrorMessage = function() {
					
						var zoom = detailMap.getZoom();
						if ( zoom > 8 ) {
							detailMap.setZoom( zoom - 1 );
							return true;
						}

						return 'No data available at this zoom level.';
					} 

					var copyrightDiv = mapDiv.firstChild.nextSibling;
						copyrightDiv.style.display = 'none'; 

					var copyrightImg = mapDiv.firstChild.nextSibling.nextSibling;
						copyrightImg.style.display = 'none'; 

				});

				return marker;

			}

			self.updateLayout();

			endLoad();			

		}

		this.onBodyClick = function() {

			self.kill(); /// suicidal div :D !
					
		}

		this.updateLayout = function(){

			self.updateDimensions();
			self.updatePosition();
			self.scrollLayout();

		}

		this.scrollLayout = function(){

			canvas.style.top = '105px';

			if( obscure.layer ){
				obscure.layer.style.height = document.documentElement.scrollHeight + 'px';
			}

			self.updatePosition();

		}

		this.updateDimensions = function(){

			var w, h;

			switch( placement.width ) {
				case 'canvas 80':
					w = canvas.offsetWidth / 100 * 80;
				break;
				default:
					w = placement.width;
				break;
			}

			switch(placement.width) {

				case 'canvas 80':
					h = canvas.offsetHeight / 100 * 80;
					
				break;

				default:
					h = placement.height;
				break;
			}

			holder.style.width		= ( w + 12 ) + 'px';
			holder.style.height		= ( h + 12 ) + 'px';
			contents.style.width	= ( w ) + 'px';
			contents.style.height	= ( h ) + 'px';
			container.style.width	= contents.style.width;
			container.style.height	= contents.style.height;

		}

		this.updatePosition = function() {

			if ( placement ) {

				var x;
				var y;

				var hx = getLeft(holder);
				var hy = getTop(holder);
				var hw = holder.offsetWidth;
				var hh = holder.offsetHeight;

				var px = getLeft(canvas);
				var py = getTop(canvas);
				var pw = canvas.offsetWidth;
				var ph = canvas.offsetHeight;

				switch( placement.type ){
				case 'center':

					var tx = getLeft(placement.element);
					var ty = getTop(placement.element);
					var tw = placement.element.offsetWidth;
					var th = placement.element.offsetHeight;

					x = tx + tw * 0.5 - hw * 0.5;
					y = ty + th * 0.5 - hh * 0.5;
					
				break;
				}

				if ((x + hw) > (px + pw)){

					x = (px + pw - hw ) - 10;
					if (x < px ) x = px + 10;

				}else if( x < px ){

					x = px + 10;

				}

				if ((y + hh) > (py + ph)){

					y = (py + ph - hh ) - 10;
					if (y < py ) y = py + 10;

				}else if( y < py ){

					y = py + 10;

				}

				holder.style.left = x + 'px';
				holder.style.top = y + 'px';

			}

		}

		this.kill = function() {

			obscure( true );

			removeEvent( body, 'mousedown', self.onBodyClick );
			removeEvent( window, 'resize', self.updateLayout );
			removeEvent( window, 'scroll', self.scrollLayout );

			if ( holder && holder.parentNode ){
				holder.parentNode.removeChild( holder );
			}

		}

		setup();

	}