<!--S:Main-->
	<div class="slider-holder {MENU_CLASS}">
		<div class="slider-gmaps">
			<div id="map-canvas-{GMAP_ID}" style="{HEIGHT}"></div>
		</div>

	</div>

<script>
	function GMap_initialize_{GMAP_ID}() {

		var myLatlng = new google.maps.LatLng({GMAP_LAT},{GMAP_LONG});

		var isDraggable = $(document).width() > 480 ? true : false; 
		var isPan = $(document).width() > 480 ? false : true; 
		var mapOptions = {
			scrollwheel: false,
			zoom: {GMAP_ZOOM},
			mapTypeId : google.maps.MapTypeId.{GMAP_TYPE},
			mapTypeControlOptions: {
				mapTypeIds: [google.maps.MapTypeId.{GMAP_TYPE}, 'gmap{GMAP_ID}'],
			},
			center: myLatlng,
			draggable: isDraggable,
			panControl: isPan
		};

		var map = new google.maps.Map(document.getElementById('map-canvas-{GMAP_ID}'), mapOptions);

  		{GRAYSCALE}

		{MARKERS}


	}GMap_initialize_{GMAP_ID}();
</script>
<!--E:Main-->

<!--S:Grayscale-->

			var stylez = [
				{
				  featureType: "all",
				  elementType: "all",
				  stylers: [
					{ saturation: -100 }
				  ]
				}
			];

			var mapType = new google.maps.StyledMapType(stylez, { name:"Grayscale" });    
			map.mapTypes.set('gmap{GMAP_ID}', mapType);
			map.setMapTypeId('gmap{GMAP_ID}');
<!--E:Grayscale-->


<!--S:MarkersGroup-->
	{DATA}
<!--E:MarkersGroup-->


<!--S:MarkersElement-->
	var myLatlng_{ITEM_ID} = new google.maps.LatLng({ITEM_LAT},{ITEM_LONG});

	{MARKER_VAR}

    // Add a Snazzy Info Window to the marker
    var info_{ITEM_ID} = new SnazzyInfoWindow({
		wrapperClass		: "gmap-window gmap-window-{ITEM_POSITION} {ITEM_CSS}",
		map					: map,
		position			: myLatlng_{ITEM_ID} ,
		{MARKER_WINDOW}
        placement			: '{ITEM_POSITION}',
        content				: '{CONTENT}',
        showCloseButton		: {_CLOSE},
        closeOnMapClick		: {_OUTSIDE},
        border				: false,
		padding				: "20px",
		{_MAXWIDTH}
		{_MAXHEIGHT}
        shadow				: false

    });

	{AUTO}	

<!--E:MarkersElement-->

<!--S:MarkersEmpty-->

<!--E:MarkersEmpty-->

<!--S:MaxWidth-->maxWidth			: {ITEM_MAX_WIDTH},<!--E:MaxWidth-->
<!--S:MaxHeight-->maxHeight			: {ITEM_MAX_HEIGHT},<!--E:MaxHeight-->


<!--S:MarkerVar-->
	var marker_{ITEM_ID} = new google.maps.Marker({
	  position: myLatlng_{ITEM_ID},
	  map: map,
	  title: '{ITEM_TITLE}',
	  icon: '{MARKER}'
	});
<!--E:MarkerVar-->

<!--S:MarkerInfo-->
        marker				: marker_{ITEM_ID},
<!--E:MarkerInfo-->



<!--S:Auto-->
	info_{ITEM_ID}.open();
<!--E:Auto-->


<!--S:Content-->
				<div class="marker ic">
					{_IMAGE}
					<div class="marker-content generic-text ic">
					{_TITLE}
					{_BODY}
					</div>
				</div>
<!--E:Content-->

<!--S:ContentImage--><div class="marker-image"><img src="upload/googlemaps/logo_{ITEM_ID}.jpg" class="image"/></div><!--E:ContentImage-->
<!--S:ContentTitle--><h4 class="marker-title ic">{ITEM_TITLE}</h4><!--E:ContentTitle-->
<!--S:ContentBody-->{ITEM_BODY}<!--E:ContentBody-->

<!--S:RawHtml-->
				<div class="marker marker-html">{ITEM_HTML}</div>
<!--E:RawHtml-->