@php
    $arOuterClasses = '';
    $arInnerClasses = '';
    if(!empty($sub->aspect_ratio)) {
        if($loop->iteration < 3) {
            $arOuterClasses = 'embed-responsive embed-responsive-3by4';
        } else {
            $arOuterClasses = 'embed-responsive ' . $sub->aspect_ratio;
        }
        $arInnerClasses = 'embed-responsive-item';
    }
@endphp

<div class="team-member">
    <div class="row align-items-center bg-white justify-content-between">
    <div class="col-md-6">
        <div class="overflow-hidden overlay-image {{$arOuterClasses ?? null}}">
            <img src="{{ $subitem->image }}" alt="{{ $subitem->title ?? $subitem->name }}" class="{{$arInnerClasses ?? null}}">
        </div>
    </div>
    <div class="col-md-6 px-md-5 pt-4 pt-md-0">

        @if(isset($subitem->name))
            <p class="name">
                {{ $subitem->name }}
            </p>
        @endif

        @if(isset($subitem->title))
            <p class="title">
                {{ $subitem->title }}
            </p>
        @endif

        @if(isset($subitem->sub_title))
            <p class="sub-title">
                {{ $subitem->sub_title }}
            </p>
        @endif

        <div class="divider"></div>

        <div class="text">
            {!! $subitem->text !!}
        </div>
    </div>
    </div>
</div>