{% extends "base.html.twig" %}
{% block title %}
    Nos Services - Micro76
{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" href="{{ asset('css/test.css') }}">
{% endblock %}




{% block body %}

    <div class="home">
        <h1 class="title">
{{ settings.find(2) }}
        </h1>
        <p>
            {{ settings.find(3) }}
        </p>
    </div>

    <div class="stepper-wrapper">
        <div class="stepper-item completed">
            <div class="step-counter">1</div>
            <div class="step-name">First</div>
        </div>
        <div class="stepper-item completed">
            <div class="step-counter">2</div>
            <div class="step-name">Second</div>
        </div>
        <div class="stepper-item active">
            <div class="step-counter">3</div>
            <div class="step-name">Third</div>
        </div>
        <div class="stepper-item">
            <div class="step-counter">4</div>
            <div class="step-name">Forth</div>
        </div>
    </div>

    <div class="equipement">
        {% for item in categories %}
            {% if item.isEquipement() %}
                <div class="item">
                    {% if item.image is not null %}
                        {{ item.image.display(100) }}
                    {% endif %}
                    <div>{{ item }}</div>
                </div>
            {% endif %}
        {% endfor %}
    </div>

{% endblock %}