<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var Breite = article.value('breite-bild', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901 ';
		var headstyle = "";
	
	if ( Breite !== "" ){headstyle += cssselector + "{max-width: " + Breite + "px !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var HgColor1b = article.value('color-hg', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901:before ';
		var headstyle = "";
	
	if ( HgColor1b !== "" ){headstyle += cssselector + "{background-color: " + HgColor1b + " !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var HgColor1a = article.value('color-hg', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901:after ';
		var headstyle = "";
	
	if ( HgColor1a !== "" ){headstyle += cssselector + "{background-color: " + HgColor1a + " !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var HgColor2b = article.value('color-hg', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901 figcaption:before ';
		var headstyle = "";
	
	if ( HgColor2b !== "" ){headstyle += cssselector + "{background-color: " + HgColor2b + " !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var HgColor2a = article.value('color-hg', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901 figcaption:after ';
		var headstyle = "";
	
	if ( HgColor2a !== "" ){headstyle += cssselector + "{background-color: " + HgColor2a + " !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var ColorH3 = article.value('color-h3', '');
  var SizeH3 = article.value('size-h3', '');
  var GewichtH3 = article.value('gewicht-h3', '');
  var ColorBorderH3 = article.value('color-h3-borderbottom', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901 h3 ';
		var headstyle = "";
	
	if ( ColorH3 !== "" ){headstyle += cssselector + "{color: " + ColorH3 + " !important;}\n";}
	if ( SizeH3 !== "" ){headstyle += cssselector + "{font-size: " + SizeH3 + "em !important;}\n";}
	if ( GewichtH3 !== "" ){headstyle += cssselector + "{font-weight: " + GewichtH3 + " !important;}\n";}
	if ( ColorBorderH3 !== "" ){headstyle += cssselector + "{border-bottom-color: " + ColorBorderH3 + " !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var ColorP = article.value('color-p', '');
  var SizeP = article.value('size-p', '');
  var GewichtP = article.value('gewicht-p', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901 p ';
		var headstyle = "";
	
	if ( ColorP !== "" ){headstyle += cssselector + "{color: " + ColorP + " !important;}\n";}
	if ( SizeP !== "" ){headstyle += cssselector + "{font-size: " + SizeP + "em !important;}\n";}
	if ( GewichtP !== "" ){headstyle += cssselector + "{font-weight: " + GewichtP + " !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
	var cssClass = article.cssClass || "";	var inlineCss = article.inlineCss || "";
	
	if ( cssClass ) {cssClass = "hover1901 " + cssClass;}
	else {cssClass = "hover1901";}
	if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
	
  var ColorA = article.value('color-a', '');
  var SizeA = article.value('size-a', '');
  var GewichtA = article.value('gewicht-a', '');

		var cssselector = '.WZP-Artikel_' + article.id + '.hover1901 p a ';
		var headstyle = "";
	
	if ( ColorA !== "" ){headstyle += cssselector + "{color: " + ColorA + " !important;}\n";}
	if ( SizeA !== "" ){headstyle += cssselector + "{font-size: " + SizeA + "em !important;}\n";}
	if ( GewichtA !== "" ){headstyle += cssselector + "{font-weight: " + GewichtA + " !important;}\n";}
	system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var Breakpoint = article.value("breakpoint","");
var MobileFont = article.value("mobile-font","");
var headstyle = '@media (max-width: ' + Breakpoint + 'px) {';
   headstyle += '.WZP-Artikel_' + article.id + '.hover1901 {';
   headstyle += 'font-size: ' + MobileFont + '% !important;';
   headstyle += '}';
   headstyle += '}';
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>

<!--
***********************************************************************************
* Widget ZP / Widgets fuer Zeta Producer
* <$= article.widgetName $>
* Mario Gross / widget-zp.de
***********************************************************************************
-->

<$=system.partial("article-begin.html")$>

		<div style="text-align: center" class="<$= article.value("breite-widget") $>">
    <$
    for ( var i = 1; i <= 9; i++){
        var image = project.getImage(article.value("bild-" + i));
        if ( isNull(image) ){
            continue;
        }
    
        var altText = system.htmlEncode(system.removeHtmlTags(image.altText));
        var beschreibung = image.description;
        var title = system.htmlEncode(system.removeHtmlTags(image.description));
        var imgsrc = image.contentCopyPath;
        var fullsrc = image.workingCopyPath;
        var Head = article.value("h3-" + i, "");
        var Text = article.value("p-" + i, "");
        var linkname = "link-" + i;
        
        $>
<a <$= system.partial('zplink-expanded.html',  linkname) $>>
  <figure class="hover1901 WZP-Artikel_<$=article.id$>">
     <img src="<$= imgsrc $>" alt="<$= altText $>" title="<$= title $>">
       <figcaption>
          <h3><$= Head $></h3>
          <p><$= Text $></p>
       </figcaption>
  </figure>
</a>

        <$
    }
    $>
		</div>

<$=system.partial("article-end.html")$>