{% extends 'base/base.html' %}
{% load static %}

{% block contents %}

    <div id="container">
    <div class="container">
      <!-- Breadcrumb Start-->
      <ul class="breadcrumb">
        <li><a href="index.html"><i class="fa fa-home"></i></a></li>
        <li><a href="contact-us.html">تماس با ما</a></li>
      </ul>
      <!-- Breadcrumb End-->
      <div class="row">
        <!--Middle Part Start-->
        <div id="content" class="col-sm-9">
          <h1 class="title">تماس با ما</h1>
          <h3 class="subtitle">محل ما</h3>
          <div class="row">
            <div class="col-sm-3"><img src="{{setting.logo.url}}" alt="قالب مارکت شاپ" title="قالب مارکت شاپ" class="img-thumbnail"></div>
            <div class="col-sm-3"><strong>قالب مارکت شاپ</strong><br>
              <address>{{ setting.adress }}</address>
            </div>
            <div class="col-sm-3"><strong>شماره تلفن</strong><br>
                {{ setting.phone }}<br>
              <br>
              <strong>فکس</strong><br>
               {{ setting.fax }}</div>
            <div class="col-sm-3"> <strong>ساعات کار</strong><br>
              خدمات مشتریان 24x7<br>
              <br>
              <strong>دیدگاه ها</strong><br>
              در اینجا توضیحات دلخواه خود را قرار دهید. فروشگاه چک قبول نمیکند! </div>
          </div>
          <form class="form-horizontal" method="post">
              {% csrf_token %}
            <fieldset>
              <h3 class="subtitle">با ما ارتباط برقرار کنید</h3>
              <div class="form-group required">
                <label class="col-md-2 col-sm-3 control-label" for="input-name">{{ contact_form.fullName.label }}</label>
                <div class="col-md-10 col-sm-9">
                    {{contact_form.fullName }}
                </div>
                  {% for error in contact_form.fullName.errors %}
                        <div class="text-danger">{{ error }}</div>
                  {% endfor %}
              </div>

             <div class="form-group required">
                <label class="col-md-2 col-sm-3 control-label" for="input-name">{{ contact_form.email.label }}</label>
                <div class="col-md-10 col-sm-9">
                    {{contact_form.email }}
                </div>
                  {% for error in contact_form.email.errors %}
                        <div class="text-danger">{{ error }}</div>
                  {% endfor %}
              </div>

            <div class="form-group required">
                <label class="col-md-2 col-sm-3 control-label" for="input-name">{{ contact_form.message.label }}</label>
                <div class="col-md-10 col-sm-9">
                    {{contact_form.message }}
                </div>
                  {% for error in contact_form.message.errors %}
                        <div class="text-danger">{{ error }}</div>
                  {% endfor %}
              </div>

            </fieldset>
            <div class="buttons">
              <div class="pull-right">
                <input class="btn btn-primary" type="submit" value="ارسال">
              </div>
            </div>
          </form>
        </div>
        <aside id="column-right" class="col-sm-3 hidden-xs">
          <div class="list-group">
            <h2 class="subtitle">محتوای سفارشی</h2>
              <p>{{ setting.about }}</p>
          </div>
          <div class="banner owl-carousel owl-theme" style="opacity: 1; display: block;">
            <div class="owl-wrapper-outer"><div class="owl-wrapper" style="width: 1052px; left: 0px; display: block; transition: all 0ms ease 0s; transform: translate3d(-263px, 0px, 0px); transform-origin: 394.5px center; perspective-origin: 394.5px center;"><div class="owl-item" style="width: 263px;"><div class="item"> <a href="#"><img src="{% static 'image/banner/small-banner1-265x350.jpg' %}" alt="small banner" class="img-responsive"></a> </div></div><div class="owl-item" style="width: 263px;"><div class="item"> <a href="#"><img src="image/banner/small-banner-265x350.jpg" alt="small banner1" class="img-responsive"></a> </div></div></div></div>

          </div>
        </aside>
        <!--Middle Part End -->
      </div>
    </div>
  </div>


{% endblock %}