$(document).ready(function() {
						   
    // First create a div to host the map
    if ($('.vcard') ) {
		
		var createmap = $('<div id="googlemap"></div>').css({'width': '730px','height': '375px'});
		var themap = $('.media').append(createmap);

		// Now initialise the map
		var mapstraction = new Mapstraction('googlemap','google');
	
	
		// Geocode each hcard and add a marker
		$('.vcard').each(function() {
			var hcard = $(this);
		
			var latitude = hcard.find('.geo .latitude').text();
			var longitude = hcard.find('.geo .longitude').text();
			
			//  Centre on each marker in the map
			mapstraction.setCenterAndZoom(
			new LatLonPoint(latitude, longitude), 15 // Zoom level appropriate set to 6
			);
		
			var marker = new Marker(new LatLonPoint(latitude, longitude));
			marker.setIcon('/images/mapicon.gif');

			mapstraction.addMarker(marker);
			
			//  add Controls
			mapstraction.addControls({
			zoom: 'small',
			map_type: true
			});

		});
	};	
	
});