diff --git a/superx/xml/js/viz/viz_functions.js b/superx/xml/js/viz/viz_functions.js
index a81740d..eecbee7 100644
--- a/superx/xml/js/viz/viz_functions.js
+++ b/superx/xml/js/viz/viz_functions.js
@@ -3049,4 +3049,26 @@ var graph=sankey(data);
         .attr("x", function (d) { return d.x1 -40; }) //linke Seite
         .attr("text-anchor", "start")
         ;       
-}
\ No newline at end of file
+}
+
+function openModalImage(ergebniselementOrdnr)
+{
+	var myModalCard=document.getElementById("modalCard"+ergebniselementOrdnr);
+	myModalCard.classList.add('is-active');
+}
+function closeModalImage(ergebniselementOrdnr)
+{
+	var myModalCard=document.getElementById("modalCard"+ergebniselementOrdnr);
+	myModalCard.classList.remove('is-active');
+}
+function openModalCardDetail(ergebniselementOrdnr)
+{
+	var myModalCard=document.getElementById("modalCardDetail"+ergebniselementOrdnr);
+	myModalCard.classList.add('is-active');
+}
+function closeModalCardDetail(ergebniselementOrdnr)
+{
+	var myModalCard=document.getElementById("modalCardDetail"+ergebniselementOrdnr);
+	myModalCard.classList.remove('is-active');
+}
+
diff --git a/superx/xml/viz_html_chart.xsl b/superx/xml/viz_html_chart.xsl
index 1deb407..d1d307c 100644
--- a/superx/xml/viz_html_chart.xsl
+++ b/superx/xml/viz_html_chart.xsl
@@ -1295,15 +1295,23 @@ Stand: <xsl:value-of select="../stand" /></p>
 Platzhalter
 </div>
 </div>
+<p>
+<a onClick="{concat('javascript:openModalImage(',$ergebniselement_ordnr,');')}">
+<span class="button is-success is-small modal-button">Vergrößern ...</span></a>
+ 
+<a onClick="{concat('javascript:openModalCardDetail(',$ergebniselement_ordnr,');')}">
+<span class="button is-link is-small modal-button">Mehr Infos ...</span></a>
+
+</p>
 
     <!--        <div class="card-content modal-button" data-target="modal-card11">
               <div class="content">
                 <h4><xsl:value-of select="$caption" /></h4>
                 <p> </p>
-                -->
+                
 		<xsl:call-template name="legende_viz" >
 <xsl:with-param name="ordnr" select="$ergebniselement_ordnr" />
-</xsl:call-template>
+</xsl:call-template>-->
 
               </div>
 
diff --git a/superx/xml/viz_html_chart_viewer.xsl b/superx/xml/viz_html_chart_viewer.xsl
index 8d58ed9..6c60003 100644
--- a/superx/xml/viz_html_chart_viewer.xsl
+++ b/superx/xml/viz_html_chart_viewer.xsl
@@ -67,6 +67,7 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:HtmlUtils="de.superx.util
  </div>
  </div>
  <xsl:call-template name="footer" />
+ <xsl:call-template name="modalCards" />
 </body>
 <!-- end body -->
 </html>
@@ -99,12 +100,22 @@ myDiv="]]></xsl:text>
 <xsl:value-of select="concat('chartDiv',$ergebniselement_ordnr)" />
 <xsl:text><![CDATA[";
 createViewer(myChartModelStr,myDiv);
+myDiv="]]></xsl:text>
+<xsl:value-of select="concat('modalCardImage',$ergebniselement_ordnr)" />
+<xsl:text><![CDATA[";
+createViewer(myChartModelStr,myDiv);
+myDiv="]]></xsl:text>
+<xsl:value-of select="concat('modalCardDetailImage',$ergebniselement_ordnr)" />
+<xsl:text><![CDATA[";
+createViewer(myChartModelStr,myDiv);
+
 ]]></xsl:text>
 </xsl:if>
 </xsl:for-each>
 </xsl:for-each>
 <xsl:text><![CDATA[
 }
+
 function createViewer(myChartModelStr,chartDiv)
 {
 myChartModel=JSON.parse(myChartModelStr);
@@ -191,4 +202,102 @@ Formel: ANZ / 2 kaufm. gerundet
 </section><!-- der letzten Kartenreihe -->
 </section><!-- des Portals -->
 </xsl:template>
+<xsl:template name="modalCards" >
+<xsl:for-each select="/ergebnisse">
+<xsl:for-each select="ergebnis/ergebniselement">
+<xsl:variable name="chart_id"><xsl:value-of select="../felder/feld[@varname='Grafik']/value" /></xsl:variable>
+<xsl:variable name="ergebniselement_ordnr"><xsl:value-of select="@ordnr" /></xsl:variable>
+<xsl:if test="$chart_id != ''">
+<div  class="modal modal-fx-3dSlit" id="{concat('modalCard',$ergebniselement_ordnr)}">
+  <div class="modal-background"></div>
+      <div class="modal-content is-huge is-image">
+        <!-- content -->
+
+  <div class="modal-content">
+  <div class="box" style="text-align:right">
+   <a href="{concat('javascript:closeModalImage(',$ergebniselement_ordnr,');')}">
+     <span class="button is-black is-outlined"> X </span>
+     </a>
+  </div>
+    <div class="box">
+      <div id="{concat('modalCardImage',$ergebniselement_ordnr)}">
+      Picture placeholder
+      </div>
+      </div>
+    </div>
+  </div>
+ 
+</div>
+
+<div  class="modal modal-fx-3dSlit" id="{concat('modalCardDetail',$ergebniselement_ordnr)}">
+  <div class="modal-background"></div>
+     <div class="modal-content is-tiny">
+     <div class="box" style="text-align:right">
+     <a href="{concat('javascript:closeModalCardDetail(',$ergebniselement_ordnr,');')}">
+     <span class="button is-black is-outlined"> X </span>
+     </a>
+  </div>
+        <!-- content -->
+        <div class="card">
+          <div class="card-image">
+      <div id="{concat('modalCardDetailImage',$ergebniselement_ordnr)}">
+      Picture placeholder
+      </div>
+      </div>
+      
+       <div class="card-content">
+            <div class="media">
+              <div class="media-content">
+	      <h4><xsl:value-of select="viz_charts/viz_chart[@tid=$chart_id]/@caption"/></h4>
+            <p class="legende">
+<xsl:for-each select="../felder/feld">
+	<xsl:if test="(value !='' or sicht/@isFirstInGroup='false' or @isstandtoday='false')  and @varname != 'sort' and @varname != 'maxoffset' and value_caption != ''">
+
+		<span class="feldname">
+		<xsl:choose>
+		<xsl:when test="string-length(caption_short) &gt; 0 and caption_short != 'null'" >
+		<![CDATA[]]><xsl:value-of select="caption_short" /><![CDATA[]]>
+		</xsl:when>
+		<xsl:otherwise>
+		<xsl:value-of select="@varname" />
+		</xsl:otherwise>
+		</xsl:choose></span>:&#160;
+		<xsl:if test="string-length(value_caption) &lt; 50">
+					<span class="feldwert"><xsl:value-of select="value_caption" /><![CDATA[]]></span>
+		</xsl:if>
+			<xsl:if test="string-length(value_caption) &gt; 49">
+			<span class="feldwert"><![CDATA[]]><xsl:value-of select="substring(value_caption,0,50)" /><![CDATA[]]>...</span>
+		</xsl:if>
+		<xsl:if test="sicht!=''">
+			<span><![CDATA[ (]]><xsl:value-of select="sicht" />
+			<xsl:if test="@stand!=''"><xsl:text> - Stand:</xsl:text><xsl:value-of select="@stand"/></xsl:if>
+			<xsl:text><![CDATA[)]]>	</xsl:text></span>
+			
+		</xsl:if>
+	;
+	</xsl:if>
+
+</xsl:for-each>
+User: <xsl:value-of select="/ergebnisse/user"/>&#160;
+Stand: <xsl:value-of select="../stand" /></p>
+<xsl:if test="../hinweis != ''">
+<xsl:call-template name="newline_to_br">
+	<xsl:with-param name="string" select="../hinweis" />
+</xsl:call-template>
+</xsl:if>
+              </div>
+	      <p align="right"><a href="{concat('javascript:closeModalCardDetail(',$ergebniselement_ordnr,');')}">
+     <span class="button is-black is-outlined"> X </span>
+     </a></p>
+            </div>
+            
+          </div>
+    </div>
+  </div>
+ 
+</div>
+</xsl:if>
+</xsl:for-each>
+</xsl:for-each>
+</xsl:template>
 </xsl:stylesheet>