{% extends "base_stie.html" %}
{% load i18n %}
{% load widget_tweaks %}

{% block content %}
  <div class="content">
    <div class="content-header">
      <h1>{% trans 'Холбоо барих' %}</h1>
    </div>
    <div class="content-body">
      <div class="row" style="margin: 20px 0 10px;">
        <div class="col-md-6 col-sm-6">
          <div class="add-box-2">
            <i class="fas fa-map-marker-alt"></i>
            <p>
              {% trans 'Монгол Улс, Улаанбаатар хот-210648, Ш/Х-187, Сүхбаатар Дүүрэг, 1-р хороо, Энхтайвны гудамж-13Б' %}
            </p>
          </div>
        </div>
        <div class="col-md-3 col-sm-3">
          <div class="add-box-2 br">
            <i class="fas fa-phone"></i>
            <p>
              {% trans 'Утас' %}: 70128801<br>
              {% trans 'Факс' %}: 70128801
            </p>
          </div>
        </div>
        <div class="col-md-3 col-sm-3">
          <div class="add-box-2">
            <i class="fa fa-globe"></i>
            <p>
              <a href="mailto:admin@hdc.gov.mn">admin@hdc.gov.mn</a>
              <a href="http://hdc.gov.mn">http://hdc.gov.mn</a>
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="content">
    <div class="content-body" style="padding: 5px;">
      <div id="map" style="width: 100%;height: 503px;"></div>
      <script async defer
              src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAat6gELDzdfdCXRem6J6e3ZKyxXJRmgf8&callback=mapInitContact"
              type="text/javascript"></script>
    </div>
  </div>

  <div class="content" style="margin-top: 25px;" id="send">
    <div class="content-header">
      <h1>{% trans 'Талархал, санал хүсэлт илгээх' %}</h1>
    </div>
    <div class="content-body">
      <div class="row">
        <div class="col-md-12 contact-form" style="margin-top: 15px;">
          <form method="post" autocomplete="off">
            {% csrf_token %}
            <ul>
              <li class="col-md-12">
                {% render_field form.fullname placeholder=form.fullname.label %}
              </li>
              <li class="col-md-6">
                {% render_field form.phone placeholder=form.phone.label %}
              </li>
              <li class="col-md-6">
                {% render_field form.email placeholder=form.email.label %}
              </li>
              <li class="col-md-12">
                {% render_field form.subject placeholder=form.subject.label %}
              </li>
              <li class="col-md-12">
                {% render_field form.content placeholder=form.content.label rows='4' %}
              </li>
              <li class="col-md-12">
                <input type="submit" value="{% trans 'Илгээх' %}">
              </li>
            </ul>
          </form>
        </div>
      </div>
    </div>
  </div>
{% endblock %}