<script type="text/javascript">
  Drupal.settings = {europa: {exposedBlockId: 'block-exposed-id'}};
</script>
<div class="row">
  <div class="col-md-3">

    <section id="block-exposed-id" class="filters collapse">
      <h3 class="block__title filters__title">Filter by</h3>
      <div class="views-exposed-form">
        <div class="views-exposed-widgets clearfix">

          <div id="edit-search-api-views-fulltext-wrapper" class="filters__filter views-exposed-widget">
            <label for="edit-search-api-views-fulltext">Keywords</label>
            <div class="views-widget">
              <div class="form-type-textfield form-item europa-textfield">
                <input class="form-control form-text" type="text" id="edit-search-api-views-fulltext"
                       name="search_api_views_fulltext" size="30" maxlength="128">
              </div>
            </div>
          </div>

          <div id="edit-field-job-tags-tid-wrapper" class="filters__filter views-exposed-widget">
            <label for="edit-field-job-tags-tid">Policies</label>
            <div class="views-widget">
              <div class="form-type-select form-item-field-job-tags-tid form-item form-select europa-select">
                <select multiple="multiple" name="field_job_tags_tid[]" class="form-control form-select" id="edit-field-job-tags-tid" size="9" style="display: none;">
                  <option value="22691">Agriculture</option>
                  <option value="22710">Banking - Financial affairs - Capital Markets Union</option>
                  <option value="26516" selected="selected">Brexit - United Kingdom</option>
                  <option value="22696">Budget - Administration</option>
                  <option value="22701">Competition - State Aid - Antitrust - Cartels - Mergers</option>
                  <option value="26519">Consumers</option>
                  <option value="26521">Customs - Taxation</option>
                </select>
                <div class="chosen-container chosen-container-multi form-control form-select" id="edit_field_job_tags_tid_chosen" style="width: 250px;">
                  <ul class="chosen-choices">
                    <li class="search-choice"><span>Brexit - United Kingdom</span><a class="search-choice-close" data-option-array-index="2"></a></li>
                    <li class="search-choice"><span>Agriculture</span><a class="search-choice-close" data-option-array-index="0"></a></li>
                    <li class="search-field" style="visibility: hidden;"><input class="chosen-search-input" type="text" autocomplete="off" value="- Any -" style="width: 25px;"></li>
                  </ul>
                  <div class="chosen-drop">
                    <ul class="chosen-results"></ul>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div id="edit-facet-filter-wrapper" class="filters__filter views-exposed-widget">
            <label for="edit-facet-filter">Topic</label>
            <div class="views-widget">
              <div class="form-type-select form-item form-select europa-select">
                <select class="form-control form-select" id="edit-facet-filter" name="facet__select__field_core_topics">
                  <option value="0">Any topic</option>
                  <option value="353">Agriculture and rural development</option>
                  <option value="354">Banking and financial services</option>
                </select>
              </div>
            </div>
          </div>

          <div id="edit-facet-filter-5-wrapper" class="filters__filter views-exposed-widget">
            <label for="edit-facet-filter-5">Location</label>
            <div class="views-widget">
              <div class="form-type-select form-item form-select europa-select">
                <select class="form-control form-select" id="edit-facet-filter-5"
                        name="facet__select__field_core_location:country">
                  <option value="0"> Any country</option>
                  <option value="FR">France</option>
                  <option value="DE">Germany</option>
                  <option value="PL">Poland</option>
                  <option value="PT">Portugal</option>
                </select>
              </div>
            </div>
          </div>

          <div id="edit-facet-filter-4-wrapper" class="filters__filter views-exposed-widget">
            <div class="views-widget">
              <div class="checkbox">
                <input type="checkbox" name="facet__checkboxes__field_event_is_online" checked="checked"
                       id="facet__checkboxes__field_event_is_online"><label
                  for="facet__checkboxes__field_event_is_online">Online only events</label>
              </div>
            </div>
          </div>

          <div id="edit-facet-filter-1-wrapper" class="filters__filter views-exposed-widget">
            <div class="views-widget">
              <div class="checkbox">
                <input type="checkbox" name="facet__checkboxes__field_event_is_live_streaming"
                       id="facet__checkboxes__field_event_is_live_streaming"><label
                  for="facet__checkboxes__field_event_is_live_streaming">Events with live streaming available</label>
              </div>
            </div>
          </div>

          <div id="edit-field-event-date-value-wrapper" class="filters__filter views-exposed-widget">
            <div class="views-widget">
              <div class="date-picker-no-js-hide">
                <div class="container-inline-date">
                  <div class="form-type-date-popup form-item form-group">
                    <div id="edit-field-event-date-value" class="date-padding clearfix">
                      <div class="form-type-textfield form-item europa-textfield">
                        <label class="control-label" for="edit-field-event-date-value-datepicker-popup-1">After</label>
                        <div class="date-picker">
                          <input data-targetfield="clean_field_event_date_value"
                                 class="date-picker-parent form-control form-text"
                                 type="text" id="edit-field-event-date-value-datepicker-popup-1"
                                 name="field_event_date_value[date]" value="" size="30" maxlength="30"><i
                            class="icon icon--calendar date-picker--icon"></i>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div id="edit-field-event-date-value-1-wrapper" class="filters__filter views-exposed-widget">
            <div class="views-widget">
              <div class="date-picker-no-js-hide">
                <div class="container-inline-date">
                  <div class="form-type-date-popup form-item form-group">
                    <div id="edit-field-event-date-value-1" class="date-padding clearfix">
                      <div class="form-type-textfield form-item europa-textfield">
                        <label class="control-label"
                               for="edit-field-event-date-value-1-datepicker-popup-1">Before</label>
                        <div class="date-picker">
                          <input data-targetfield="clean_field_event_date_value_1"
                                 class="date-picker-parent form-control form-text" type="text"
                                 id="edit-field-event-date-value-1-datepicker-popup-1"
                                 name="field_event_date_value_1[date]" value="" size="30" maxlength="30"><i
                            class="icon icon--calendar date-picker--icon"></i>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <button class="btn btn-primary filters__btn-submit" type="submit" name="" value="Apply">Apply</button>
          <button class="btn btn-default filters__btn-reset" type="submit" name="op" value="Clear filters">Clear
            filters
          </button>

        </div>
      </div>
    </section>
  </div>

  <div class="col-md-9">
    <div class="filters__result-count">
      <span class="filters__items-number">Events (1)</span>
    </div>
    <div><div class="filters__result-range">Showing results 1 to 20</div></div>
    <div class="filters__active-facets">
      <div class="facet-tag filters__facet-tag facet-tag--close">
        <span class="facet-tag__label filters__active-facet-label">Policies</span>
        <a href="#" title="Unset Policies">
          <span class="facet-tag__value filters__active-facet-value">Agriculture</span>
        </a>
        <a href="#" title="Unset Policies">
          <span class="facet-tag__value filters__active-facet-value">Brexit - United Kingdom</span>
        </a>
      </div>

      <div class="facet-tag filters__facet-tag facet-tag--close">
        <span class="facet-tag__label filters__active-facet-label">Online only</span>
        <a href="#" title="Unset Online only">
          <span class="facet-tag__value filters__active-facet-value">Yes</span>
        </a>
      </div>
    </div>
    <div class="view-content">
      <div class="listing__wrapper listing__wrapper--default">
        <ul class="listing listing--column-left listing--agenda">
          <li class="listing__item">
            <div about="#" typeof="sioc:Item foaf:Document" class="listing__item__wrapper">
              <div class="listing__column-second">
                <div class="date-block event past">
                  <span class="date-block__day">09</span>
                  <span class="date-block__month">Apr</span>
                  <span class="date-block__year">2019</span>
                </div>
              </div>
              <div class="listing__column-main">
                <h3 class="listing__title">
                  <a href="#" title="iCapital">iCapital 2019: EUROCITIES Webinar</a>
                </h3>
                <div class="listing__status-container">
                  <span class="icon icon--location icon--text-small icon--margin-right">Online only</span>
                </div>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>

  </div>
</div>