{% load crispy_forms_tags %}

<div class="table-area">
  <div class="table-title">
    <div class="row">
      <div class="col-md-4">
        <div>
          <h4>Costing</h4>
        </div>
      </div>
      {% comment %} <div class="col-md-8">
        <div class="add-btn">
            <a href="{% url 'style-create' %}"> 
              <button id="mother-rganization" class="cus-btn"  type="button" name="button">
                <i class="fa fa-plus-circle" aria-hidden="true"></i>
                Style
              </button>
            </a>
        </div>
      </div> {% endcomment %}
    </div>
  </div>
  <div class="table-header bg-white">
    <form method="post" id="personForm" data-cities-url="" novalidate>
      {% csrf_token %}
      
      <div class="row">
        <div class="col-md-12">
          <div class="row">
            <div class="col-md-3 fw-bold">
              {{form.mother_organization|as_crispy_field }}
            </div> 
            <div class="col-md-3 fw-bold">
              {{form.sister_organization|as_crispy_field }}
            </div> 
            <div class="col-md-3 fw-bold">
              {{form.branch|as_crispy_field }}
            </div> 
          <div class="row">
            
            {% comment %} <div class="col-md-3 fw-bold">
              {{form.sister_organization|as_crispy_field }}
            </div> 
            <div class="col-md-3 fw-bold">
              {{form.branch|as_crispy_field }}
            </div>  {% endcomment %}
          </div>
            <div class="col-md-3" style="margin-top: 31px;">
              <button type="submit" class="cus-btn">Show</button>
            </div>
          </div>
        </div>
      </div>
    </form>
  </div>
</div>