<!-- for this panel you have the option to add a filter bar with buttons called "filter-trigger" -->
<!-- the first "filter-trigger" needs to have the class active -->
<!-- all "filter-trigger" elements need to be inserted into the desktop and into the mobile version, like in the example below -->
<div class="filter-bar fade-in-ele">
  <h3 class="filter-trigger active" data-filter="All">All</h3>
  <h3 class="filter-trigger" data-filter="Autumn">Autumn</h3>
  ...

  <div class="icon-filter mobile">
    <i class="fas fa-chevron-down"></i>
  </div>

  <div class="mobile-dropdown mobile" style="display:none;">
    <h3 class="filter-trigger active" data-filter="All">All</h3>
    <h3 class="filter-trigger" data-filter="Autumn">Autumn</h3>
    ...
  </div>
</div>

<!-- each "filter-trigger" has a "data-filter" attribute -->
<!-- this needs to match to the attributes below for the elements ("filtr-item") inside of the grid -->
<!-- this way the btn can detect for which items it should filter -->

<!-- example for the filter trigger button: -->
<h3 class="filter-trigger" data-filter="Autumn">Autumn</h3>

<!-- example for a filtr-item which will be shown if a user clicks the "filter-trigger" with the category "All" or "Autumn" or "Image" -->
<div class="filtr-item" data-category="All,Autumn,Image">
  ...
</div>

<!-- you can create 3 types of grid elements -->

<!-- a single image popup: -->
<!-- give the item the "data-popup-id": "2" and add as "data-src" the path to your image -->
<div class="filtr-item" data-popup-id="2" data-src="img/panels/grid-full/3.jpg">
  ...
</div>

<!-- an image-slider popup: -->
<!-- give the item the "data-popup-id": "1" and add as "data-src" the path to your images - seperated by "," -->
<div class="filtr-item" data-popup-id="1" data-src="img/panels/grid-full/1.jpg,img/panels/grid-full/2.jpg,img/panels/grid-full/3.jpg,img/panels/grid-full/4.jpg,img/panels/grid-full/5.jpg">
  ...
</div>

<!-- a youtube video popup: -->
<!-- give the item the "data-popup-id": "3" and add as "data-src" the youtube video ID -->
<div class="filtr-item" data-popup-id="3" data-src="hNQFjqDvPhA">
  ...
</div>