{include file="includes/header.html"} 
{include file="includes/header-holder.html"}

<main class="main" id="main">
  {include file="includes/menu.html"}

  <div id="fullpagePrimary">
    <section class="section page contact contact-form">
      <div class="wrapper">
        <div class="content">
    
          <div class="content-wrapper">
            {include file="includes/breadcrumbs.html"}

            <div class="content-container">
              <div class="col col-left">
                <div class="bg" {if $element.mainImageFilename}style="background-image: url({image f=$element.mainImageFilename return='path'})"{/if}></div>          

                <div class="col-content">
                  {capture assign=breadcrumbsCount}{$breadcrumbs|count}{/capture}
                  <h1 class="h1 title">
                  {if $element.banner_menu_ver==0}
                    {$element.name}
                  {else}
                    {$breadcrumbs[$breadcrumbsCount - 2].name}
                  {/if}
                  </h1>
                  <div class="page-menu">
                    {foreach $pageSubNodes as $psn}
                        <a href='{seoLink id_element=$psn.id withParents=1 parentLink="{seoParentLink module=$psn.module id_element=$psn.id}"}' class="{if $psn.selected}underline{/if}">{if $psn.link_title}{$psn.link_title}{else}{$psn.name}{/if}</a>
                    {/foreach}
                  </div>                  
                </div>

                <div class="contact-info">
                  {$element.content}
                </div>
              </div>
              <div class="col col-right">
                <form id="contactForm" class="form" onsubmit="xajax_exe('PageModule-xajaxContact', xajax.getFormValues('contactForm')); return false;">
                  <div class="heading">{$element.name}</div>

                  <div class="col-wrapper">
                    <div class="col">
                      <div class="form-group">
                        <label class="label required">
                          {'contact_label_name'|translate}
                          <input name="c_name" type="text" class="form-control">
                        </label>
                      </div>
                      <div class="form-group">
                        <label class="label required">
                          {'contact_label_surname'|translate}
                          <input name="c_surname" type="text" class="form-control">
                        </label>
                      </div>
                      <div class="form-group">
                        <label class="label required">
                          {'contact_label_firm'|translate}
                          <input name="c_firm" type="text" class="form-control">
                        </label>
                      </div>
                    </div>
                    <div class="col">
                      <div class="form-group">
                        <label class="label required">
                          {'contact_label_email'|translate}
                          <input name="c_email" type="text" class="form-control">
                        </label>
                      </div>
                      <div class="form-group">
                        <label class="label required">
                          {'contact_label_phone'|translate}
                          <input name="c_phone" type="text" class="form-control">
                        </label>
                      </div>
                      <div class="form-group">
                        <label class="label required">
                          {'contact_label_region'|translate}
                          <select class="select-selectric" name="c_id_subject">
                          	<option value="">Wybierz</option>
                            {foreach $subjectList as $sl}
                                <option value="{CMSString::encode($sl.id)}">{$sl.name}</option>
                            {/foreach}
                          </select>
                        </label>
                      </div>
                    </div>
                  </div>
                  <!-- /.col-wrapper -->

                  <div class="form-group">
                    <label class="label label-textarea label-100p required">
                      {'contact_label_question'|translate}
                      <textarea name="c_question" class="form-control textarea"></textarea>                        
                    </label>
                  </div>

                  <div class="checkbox">
                    <input id="privacy-policy" name="c_bylaw" type="checkbox">
                    <label for="privacy-policy">
                      {'contact_bylaw_text'|translate}
                      <a href="{seoLink id_element=1751 withParents=1}" class="privacy-policy-link">{'general_policy'|translate}</a>
                    </label>
                  </div>
                  

                  <div class="form-btn-wrapper">
                    <button type="submit" class="btn btn--text-arrow">
                      {'general_send_message'|translate}
                      <div class="btn btn--arrow"></div>
                    </button>
                  </div>
                </form>
              </div>
            </div>
          </div>
    
        </div>
      </div>
    </section>
  </div>
  <!-- /#fullpage -->
</main>

{include file="includes/footer-holder.html"} 
{include file="includes/footer.html"}

<script src="{$templates_dir}{$templates_dir}/js/jquery.cssmap.min.js"></script>