<div class="voucher {{modificator}} {{mod}}">
  {{#if voucher-title}}
    <h2 class="{{modificator}}-title">{{title}}</h2>
  {{/if}}
  {{#if voucher-info}}
    <div class="{{modificator}}-info">
      <div class="row">
        <div class="{{modificator}}-placeholder">
          <div class="{{modificator}}-placeholder-wrap">
            {{#if discount}}
              <span class="{{modificator}}-placeholder-discount">
            10% off
          </span>
            {{/if}}
            <img src="{{imgPlaceholder}}" alt="">
          </div>
        </div>
        <div class="{{modificator}}-description">
          {{#if sub-header}}
            {{#each subheader-data}}
              <h{{subheaderIndex}} class="{{modificator}}-subheader">{{subheader}}</h{{subheaderIndex}}>
            {{/each}}
          {{/if}}
          <p>{{description}}</p>
          <p>{{description2}}</p>
          {{#if description-button}}
            <div class="{{modificator}}-code-actions {{button-mod}}">
              <a href="#" class="btn btn-primary">
                {{buttonValue}}
              </a>
            </div>
          {{/if}}
        </div>
      </div>
    </div>
  {{/if}}
  {{#if hasBanner}}
    <div class="{{modificator}}-banner-wrap">
      <div class="{{modificator}}-banner-info">{{{bannerInfo}}}</div>
      <div class="{{modificator}}-banner-expiry-date">{{bannerExpiryDate}}</div>
    </div>
  {{/if}}
  {{#if voucher-code}}
    <div class="{{modificator}}-wrap {{modificator}}-wrap{{button-mod}}">
      <div class="row">
        {{#if hasBarcode}}
          <div class="{{modificator}}-barcode">
            <div class="{{modificator}}-barcode-container">
              <div class="{{modificator}}-barcode-title">
                <h5>{{barcodeTitle}}</h5>
              </div>
              <div class="{{modificator}}-barcode-info">
                {{#unless targetedVoucher}}
                  <span class="name">{{barcodeName}}</span>
                  <span class="date">{{barcodeDate}}</span>
                {{/unless}}
                <span class="hint">{{barcodeHint}}</span>
              </div>
              <div class="{{modificator}}-barcode-img">
                <svg id="barcode" jsbarcode-value="00010931000118010" jsbarcode-width="3" jsbarcode-height="119" jsbarcode-displayvalue="false" jsbarcode-margin="0" width="435px" height="119px" x="0px" y="0px" viewBox="0 0 435 119" xmlns="http://www.w3.org/2000/svg" version="1.1" style="transform: translate(0px, 0px);"><rect x="0" y="0" width="435" height="119" style="fill:#ffffff;"></rect><g transform="translate(0, 0)" style="fill:#000000;"><rect x="0" y="0" width="6" height="119"></rect><rect x="9" y="0" width="3" height="119"></rect><rect x="18" y="0" width="9" height="119"></rect><rect x="33" y="0" width="6" height="119"></rect><rect x="42" y="0" width="6" height="119"></rect><rect x="54" y="0" width="6" height="119"></rect><rect x="66" y="0" width="6" height="119"></rect><rect x="78" y="0" width="6" height="119"></rect><rect x="87" y="0" width="6" height="119"></rect><rect x="99" y="0" width="6" height="119"></rect><rect x="111" y="0" width="3" height="119"></rect><rect x="120" y="0" width="3" height="119"></rect><rect x="132" y="0" width="6" height="119"></rect><rect x="141" y="0" width="6" height="119"></rect><rect x="156" y="0" width="6" height="119"></rect><rect x="165" y="0" width="6" height="119"></rect><rect x="174" y="0" width="6" height="119"></rect><rect x="186" y="0" width="6" height="119"></rect><rect x="198" y="0" width="6" height="119"></rect><rect x="210" y="0" width="6" height="119"></rect><rect x="219" y="0" width="6" height="119"></rect><rect x="231" y="0" width="6" height="119"></rect><rect x="243" y="0" width="9" height="119"></rect><rect x="258" y="0" width="3" height="119"></rect><rect x="264" y="0" width="6" height="119"></rect><rect x="276" y="0" width="6" height="119"></rect><rect x="285" y="0" width="6" height="119"></rect><rect x="297" y="0" width="9" height="119"></rect><rect x="309" y="0" width="3" height="119"></rect><rect x="315" y="0" width="12" height="119"></rect><rect x="330" y="0" width="3" height="119"></rect><rect x="339" y="0" width="9" height="119"></rect><rect x="351" y="0" width="6" height="119"></rect><rect x="363" y="0" width="9" height="119"></rect><rect x="378" y="0" width="3" height="119"></rect><rect x="384" y="0" width="6" height="119"></rect><rect x="396" y="0" width="6" height="119"></rect><rect x="411" y="0" width="9" height="119"></rect><rect x="423" y="0" width="3" height="119"></rect><rect x="429" y="0" width="6" height="119"></rect></g></svg>
              </div>
              <div class="{{modificator}}-barcode-number">{{barcodeNumber}}</div>
              <div class="{{modificator}}-barcode-warning">{{barcodeWarning}}</div>
              {{#if barcode-expand}}
                <div class="barcode__footer_expand">
                  <a href="#" class="icon" data-toggle="modal" data-target="#modal-barcode">
                    <i class="far fa-expand-arrows"></i>
                    <a href="#" data-toggle="modal" data-target="#modal-barcode">Use barcode</a>
                  </a>
                </div>
              {{else if barcode-targeted-expand}}
                <div class="barcode__footer_expand">
                  <a href="#" class="icon" data-toggle="modal" data-target="#modal-barcode-targeted">
                    <i class="far fa-expand-arrows"></i>
                    <a href="#" data-toggle="modal" data-target="#modal-barcode-targeted">Use barcode</a>
                  </a>
                </div>
              {{/if}}
            </div>
          </div>
        {{/if}}
        {{#if hasCode}}
          <div class="{{modificator}}-code">
            <div class="{{modificator}}-code-container">
              <div class="{{modificator}}-code-title">
                <h3>{{codeTitle}}</h3>
              </div>
              {{#unless copy-absent}}
                <div class="{{modificator}}-code-field">
                  <input type="text" value="{{inputValue}}" disabled>
                  <a href="#" class="copy-barcode">
                    <span class="icon">
                      <i class="fas fa-copy"></i>
                    </span>
                    <span>Copy</span>
                  </a>
                </div>
                <div class="copy-barcode_notification">

                </div>
              {{/unless}}
              {{#if button-present}}
                <div class="{{modificator}}-code-actions">
                  <a href="#" class="btn btn-primary">
                    {{buttonValue}}
                  </a>
                </div>
              {{/if}}
              {{#if warning-present}}
                <div class="{{modificator}}-code-warning">{{codeWarning}}</div>
              {{/if}}
            </div>
          </div>
        {{/if}}
        {{#if hasTargetedCode}}
          <div class="{{modificator}}-code">
            <div class="{{modificator}}-code-container">
              <div class="{{modificator}}-code-title">
                <h5>{{codeTitle}}</h5>
              </div>
                <div class="{{modificator}}-code-info">
                  <span class="hint">{{codeHint}}</span>
                </div>
                <div class="{{modificator}}-code-field">
                  <span>{{codeHeading}}</span>
                  <div class="{{modificator}}-code-wrap">
                    <input class="{{modificator}}-code-value" type="text" value="{{codeValue}}" disabled>
                  </div>
                </div>
                <a href="#" class="copy-barcode">
                    <span class="icon">
                      <i class="far fa-copy"></i>
                    </span>
                    <span>Copy code</span>
                </a>
                <div class="copy-barcode_notification"></div>
                {{#if notification}}
                  <div class="copy-barcode_notification"></div>
                {{/if}}
              {{#if button-present}}
                <div class="{{modificator}}-code-actions">
                  <a href="#" class="btn btn-primary">
                    {{buttonValue}}
                  </a>
                </div>
              {{/if}}
              {{#if warning-present}}
                <div class="{{modificator}}-code-warning">{{codeWarning}}</div>
              {{/if}}
            </div>
          </div>
        {{/if}}
      </div>
    </div>
    {{#if termsAndConditions}}
      <div class="terms">
        <div class="terms__btn-accordion">
        <span class="icon">
          <i class="fas fa-angle-down"></i>
        </span>
          Terms & Conditions
        </div>
        <div class="terms__content">
          Terms, conditions and exclusions apply. Credit subject to status. Over 18’s only. Offer ends 21st February 2018. Ask your design consultant for more information and
          terms and conditions. 24 month term. Equal monthly payments commence after delivery. Wickes Building Supplies Limited is registered in England and Wales with
          registration number 1840419 and is authorised and regulated by the Financial Conduct Authority to carry on credit-broking. Registered office; Lodge Way House,
          Harlestone Road, Northampton, NN5 7UG. Credit is exclusively provided by Hitachi Capital (UK) PLC, with whom Wickes have a commercial relationship. Hitachi Capital
          (UK) PLC is registered in England and Wales with registration number 1630491 and is authorised and regulated by the Financial Conduct Authority. Registered office;
          Hitachi Capital House, Thorpe Road, Staines-upon-Thames, Surrey, TW18 3HP. Excludes non showroom Kitchen and Bathroom products.
        </div>
      </div>
    {{/if}}
  {{/if}}
</div>