<section class="steps-slider" id="stepsSlider-method">

    <div class="grid-row">
        @if(isset($title) && $title != '')
            <h2>{{ $title }}</h2>
        @endif

        <ul class="slider-nav">
            @foreach($slides as $key => $slide)
                <li class="slide-nav-item" data-order="{{$key}}">
                    <p>{{$slide->typeName}}</p>
                </li>
            @endforeach
        </ul>

        <div class="slides">
            @foreach($slides as $key => $slide)
                <article class="slide" data-order="{{$key}}">
                    <div class="kms-content">
                        {!! $slide->description !!}
                    </div>
                </article>
            @endforeach

            <div class="navigation-buttons">
                <span class="nav-item previous"
                      data-order="{{ (sizeof($slides) - 1) }}"><span>@include('site.svg.arrow')</span></span>
                <span class="nav-item next" data-order="1"><span>@include('site.svg.arrow')</span></span>
            </div>
        </div>

    </div>
</section>