@extends('client.topCargo.layouts.layout')

@section('title', 'Franchise')

@section('content')
    <!--Page Header-->
    <div class="page-header title-area">
        <div class="header-title">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 col-sm-12 col-xs-12">
                        <h1 class="page-title">Franchise</h1>
                    </div>
                </div>
            </div>
        </div>
        <div class="breadcrumb-area">
            <div class="container">
                <div class="row">
                    <div class="col-md-8 col-sm-12 col-xs-12 site-breadcrumb">
                        <nav class="breadcrumb">
                            <a class="home" href="{{ route('home') }}"><span>Home</span></a>
                            <i class="fa fa-angle-right" aria-hidden="true"></i>
                            <span>Franchise</span>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="fh-section-title clearfix  text-center version-dark paddbtm20">
        <h2>Our Franchise<span class="main-color"> Company</span></h2>
    </div>
    <!-- Services sec -->
    <!-- Services sec   end-->
    <div class="homeserv1 secpadd2">
        <div class="container">
            <div class="fh-service  style-flat">
                <div class="service-list row">
                    @forelse ($franchises as $franchise)
                        <div class="item-service  col-xs-12 col-sm-6 col-md-3">
                            <div class="service-content">
                                <div class="entry-thumbnail">
                                    <a class="link" href="{{ route('showFranchise', $franchise->alias) }}"></a>
                                    <a href="{{ route('showFranchise', $franchise->alias) }}"><span class="icon"><i
                                                class="fa fa-long-arrow-right" aria-hidden="true"></i></span></a>
                                    <img style="width: 100%; height:180px; object-fit:cover; object-position:center;"
                                        src="{{ asset($franchise->thumb) }}" alt="{{ $franchise->title }}">
                                </div>
                                <div class="summary">
                                    <h2 class="entry-title"><a
                                            href="{{ route('showFranchise', $franchise->alias) }}">{{ $franchise->title }}</a>
                                    </h2>
                                    <p>{{ $franchise->sub_text }}</p>

                                </div>
                            </div>
                        </div>
                    @empty
                    @endforelse

                </div>
            </div>
        </div>
    </div>
@endsection