@php
    $alignmentClass = ($language == 'en') ? '' : 'text-left';
@endphp
<div class="cards-block">
    <div class="header relativeContainer font-title">
        {{__('Application Documents')}}
    </div>

    <div class="cards-line">

        <div class="card relativeContainer card-2">
            <img src="{{config('locations.systemImage.asset').'course-details-2.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-2-title')}}
                </span>
            </div>
        </div>

        <div class="card relativeContainer card-3">
            <img src="{{config('locations.systemImage.asset').'course-details-3.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-3-title')}}
                </span>
            </div>
        </div>

        <div class="card relativeContainer card-4">
            <img src="{{config('locations.systemImage.asset').'course-details-4.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-4-title')}}
                </span>

                <span class="text {{$alignmentClass}}">
                    {{__('card-4-text')}}
                </span>
            </div>
        </div>

        <div class="card relativeContainer card-5">
            <img src="{{config('locations.systemImage.asset').'course-details-5.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-5-title')}}
                </span>

                <span class="text">
                    {{__('card-5-text')}}
                </span>
            </div>
        </div>
            <div class="card relativeContainer card-6">
            <img src="{{config('locations.systemImage.asset').'course-details-6.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-6-title')}}
                </span>

                <span class="text {{$alignmentClass}}">
                    {{__('card-6-text')}}
                </span>
            </div>
        </div>
    </div>

    <div class="cards-line">
    

        <div class="card relativeContainer card-7">
            <img src="{{config('locations.systemImage.asset').'course-details-7.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-7-title')}}
                </span>

                <span class="text {{$alignmentClass}}">
                    {{__('card-7-text')}}
                </span>
            </div>
        </div>

        <div class="card relativeContainer card-8">
            <img src="{{config('locations.systemImage.asset').'course-details-8.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-8-title')}}
                </span>

                <span class="text {{$alignmentClass}}">
                    {{__('card-8-text')}}
                </span>
            </div>
        </div>

        <div class="card relativeContainer card-9">
            <img src="{{config('locations.systemImage.asset').'course-details-9.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-9-title')}}
                </span>

                <span class="text {{$alignmentClass}}">
                    {{__('card-9-text')}}
                </span>
            </div>
        </div>

        <div class="card relativeContainer card-10">
            <img src="{{config('locations.systemImage.asset').'course-details-10.png'}}">

            <div class="content">
                <span class="title font-title">
                    {{__('card-10-title')}}
                </span>

                <span class="text {{$alignmentClass}}">
                    {{__('card-10-text')}}
                </span>
            </div>
        </div>
    </div>

    <div class="note">
        <div class="note-title">
            <ol>
                <li>{{__('Note')}}:</li>
            </ol>
        </div>

        <div class="note-content">
            <ol>
                <li>{{__('note-line-1')}}</li>
                <li>{{__('note-line-2')}}</li>
                <li>{{__('note-line-3')}}</li>
            </ol>
        </div>
    </div>
</div>