@extends('front.layouts.app')

@push('css')

    <link rel="stylesheet" href="{{asset('history/css/style.css')}}" />
    <style>
        .get-to-know{
            padding: 0;
        }
        .font-details-h6 {
            font-size: 30px;        /* Adjust size as needed */
            font-weight: 1000;       /* Extra bold */
            letter-spacing: 0.5px;  /* Slightly increase letter spacing */
            color: #FFFFFF;         /* Darker color for emphasis */
        }

    </style>
@endpush

@section('content')
    <section class="get-to-know">
        <!-- Page Header -->
        <section class="page-header">
            <div class="page-header-bg"
                 style="background-image: url({{ asset('front/assets/images/backgrounds/page-header-bg.jpg') }})">
            </div>
            <div class="container">
                <div class="page-header__inner">
                    <ul class="thm-breadcrumb list-unstyled">
                        <li><a href="{{ route('arabiaMobiles.home') }}">Home</a></li>
                        <li><span>/</span></li>
                        <li class="active">History & Timeline</li>
                    </ul>
                    <h2>Our History</h2>
                </div>
            </div>
        </section>
    </section>



    <!-- History section -->
    <section id="history" class="pt-100 has-parallax"  data-bg="{{asset('images/hist.png')}}" style="background-repeat: repeat;
    background-size: auto !important;">

        <!-- Parallax background -->
        <div class="parallax" data-bg="" data-target="#history" data-bottom-top="transform:translate3d(0px,-200px,0px);" data-top-bottom="transform:translate3d(0px,200px,0px);"></div>


        <!-- Container for title -->
        <div class="container">
            <!-- Column 12 for the title -->
            <div class="d-flex flex-column align-items-center t-center mb-10 mb-20-sm">
                <!-- Title -->
                <h1 class="gray8 fs-50 fs-40-sm lh-50 lh-45-sm medium font-secondary uppercase">
                    <span class="text-black-50">The Timeline of our success story</span>
                </h1>
{{--                <!-- Paragraph -->--}}
{{--                <p class="mxw-800 d-inline-flex mt-15">--}}
{{--                    On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and by the charms of pleasure of the moment, so blinded by desire--}}
{{--                </p>--}}
            </div>
            <!-- End column 12 for the title -->
        </div>
        <!-- End container for title -->



        <!-- Container for history -->
        <div class="container relative mt-70 pb-150">

            <!-- Strip for history - You can customize everything with classes -->
            <div class="visible-lg width-1 bg-gray3 absolute left-percent-50 top-0 move-left-half fullheight zi-0 pointer-events-none"></div>

            <!-- Today button -->
{{--            <div class="col-12 t-center relative zi-5">--}}
{{--                <div class="lh-normal py-15 px-30 bg-dark white fs-11 bold d-inline-flex radius">TODAY</div>--}}
{{--            </div>--}}
            <!-- Today button -->


            <!-- Row for posts and dates -->
            <div class="row relative zi-5" data-masonry='{"percentPosition": true }'>




                <!-- Post - ON LEFT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-0 mt-60-sm pr-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">1994</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            Company Foundation--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">
                            Arabia Mobiles, established in 1994, began as a distributor of consumer electronics. Over time, we have systematically expanded our operations to encompass the entire Lebanese territory.
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-right b-white b-colored-hover-item slow left-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-end justify-content-start">
                            <!-- Item -->
                            <a href="{{asset('history/images/history/1.jpg')}}" data-bg="{{asset('history/images/history/1.jpg')}}" data-fslightbox="20jan2022" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                            <!-- Item -->
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->

                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow left-percent-100 absolute ml--10"></div>
                </div>
                <!-- End post -->




                <!-- Post - ON RIGHT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-120 mt-60-sm pl-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2006</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            Lebanon's leading smartphone distributors--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">
                            By 2006, Arabia Mobiles had established itself as one of Lebanon's leading smartphone distributors, trading in major brands such as Nokia, Blackberry, Apple, Samsung, HTC, and Sony.

                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-left b-white b-colored-hover-item slow right-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
{{--                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-start justify-content-start">--}}
{{--                            <!-- Item -->--}}
{{--                            <a href="{{asset('history/images/history/9.jpg')}}" data-bg="{{asset('history/images/history/9.jpg')}}" data-fslightbox="18jan2022" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>--}}
{{--                            <!-- Item -->--}}
{{--                            <a href="{{asset('history/images/history/10.jpg')}}" data-bg="{{asset('history/images/history/10.jpg')}}" data-fslightbox="18jan2022" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>--}}
{{--                            <!-- Item -->--}}
{{--                            <a href="https://www.youtube.com/watch?v=FT3ODSg1GFE" data-fslightbox="18jan2022" data-type="youtube" class="icon-xl bg-dark2 white b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus">--}}
{{--                                <i class="bi-caret-right-fill fs-20"></i>--}}
{{--                            </a>--}}
{{--                            <!-- Item -->--}}
{{--                            <a href="{{asset('history/images/history/7.jpg')}}" data-bg="{{asset('history/images/history/7.jpg')}}" data-fslightbox="18jan2022" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>--}}
{{--                            <!-- Item -->--}}
{{--                            <a href="{{asset('history/images/history/6.jpg')}}" data-bg="{{asset('history/images/history/6.jpg')}}" data-fslightbox="18jan2022" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>--}}
{{--                        </div>--}}
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->
                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow right-percent-100 absolute mr--10"></div>
                </div>
                <!-- End post -->




                <!-- Post - ON LEFT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-0 mt-60-sm pr-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2014</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            THERE ARE MANY VARIATIONS OF PASSAGES--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">
                            In 2014, we inaugurated Khoury International FZE, marking our first office establishment outside Lebanon with the objective of expanding our operations in the Gulf region.
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-right b-white b-colored-hover-item slow left-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-end justify-content-start">
                            <!-- Item -->
                            <a href="{{asset('history/images/history/2.jpg')}}" data-bg="{{asset('history/images/history/2.jpg')}}" data-fslightbox="20jan2022" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                            <!-- Item -->
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->

                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow left-percent-100 absolute ml--10"></div>
                </div>
                <!-- End post -->



                <!-- Post - ON RIGHT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-70 mt-60-sm pl-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2016</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            CONTRARY TO POPULAR BELIEF--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">
                            By 2016, our esteemed reputation had earned international acclaim, leading to the exclusive distribution rights for used phones from ITOCHU Corporation.
                            Furthermore, we launched Arabia Care to reinforce the sales of second-hand used iPhones in
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-left b-white b-colored-hover-item slow right-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-start justify-content-start">
                            <!-- Item -->
                            <a href="{{asset('history/images/history/3.jpg')}}" data-bg="{{asset('history/images/history/3.jpg')}}" data-fslightbox="11jan2022" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->
                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow right-percent-100 absolute mr--10"></div>
                </div>
                <!-- End post -->



                <!-- Today button -->
{{--                <div class="col-12 mt-70 mt-60-sm t-center relative zi-5">--}}
{{--                    <div class="lh-normal py-15 px-30 bg-white dark2 fs-11 bold d-inline-flex radius">2021</div>--}}
{{--                </div>--}}
                <!-- Today button -->



                <!-- Post - ON LEFT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-0 mt-60-sm pr-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2017</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            LOREM IPSUM DOLOR SIT--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">
                            In 2017, we established Levant World for Mobile Trading, expanding our business into mobile accessories and forming a partnership with Anker
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-right b-white b-colored-hover-item slow left-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-end justify-content-start">
                            <!-- Item -->
                            <!-- Item -->
                            <a href="{{asset('history/images/history/4.jpg')}}" data-bg="{{asset('history/images/history/4.jpg')}}" data-fslightbox="24dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                            <!-- Item -->
                            <a href="{{asset('history/images/history/12.jpg')}}" data-bg="{{asset('history/images/history/12.jpg')}}" data-fslightbox="24dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->

                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow left-percent-100 absolute ml--10"></div>
                </div>
                <!-- End post -->



                <!-- Post - ON RIGHT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-70 mt-60-sm pl-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2018</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            THE STANDARD CHUNK OF LOREM IPSUM--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">
                            In 2018, following two years of successful partnership and trading in used phones, we expanded our distribution agreement with ITOCHU Corporation to include the UAE.
                            In addition, we broadened our business scope by establishing ELM Vita, a new company dedicated to distributing medical supplies in partnership with seven international brands
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-left b-white b-colored-hover-item slow right-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-start justify-content-start">
                            <!-- Item -->
                            <a href="{{asset('history/images/history/5.jpg')}}" data-bg="{{asset('history/images/history/5.jpg')}}" data-fslightbox="14dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->
                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow right-percent-100 absolute mr--10"></div>
                </div>
                <!-- End post -->

                <!-- Post - ON LEFT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-0 mt-60-sm pr-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2020</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            LOREM IPSUM DOLOR SIT--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">
                            Despite the challenges, in 2020, Khoury International FZE successfully secured the distribution rights for Nokia in the Levant region.
                            Furthermore, Arabia Mobiles became an official partner of Samsung
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-right b-white b-colored-hover-item slow left-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-end justify-content-start">
                            <!-- Item -->
                            <!-- Item -->
                            <a href="{{asset('history/images/history/6.jpg')}}" data-bg="{{asset('history/images/history/6.jpg')}}" data-fslightbox="24dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                            <!-- Item -->
                            <a href="{{asset('history/images/history/7.jpg')}}" data-bg="{{asset('history/images/history/7.jpg')}}" data-fslightbox="24dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->

                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow left-percent-100 absolute ml--10"></div>
                </div>
                <!-- End post -->

                <!-- Post - ON RIGHT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-70 mt-60-sm pl-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2021</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            THE STANDARD CHUNK OF LOREM IPSUM--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">Arabia Mobiles secured the distribution rights for Infinix in Lebanon.

                            Furthermore, we launched KI Tech LTD, which obtained exclusive distribution rights for Blackview in Cyprus.

                            Moreover, Khoury International FZE was appointed as the official distributor for Blackview in Iraq, Saudi Arabia, the United Arab Emirates, and Egypt
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-left b-white b-colored-hover-item slow right-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-start justify-content-start">
                            <!-- Item -->
                            <a href="{{asset('history/images/history/8.jpg')}}" data-bg="{{asset('history/images/history/8.jpg')}}" data-fslightbox="14dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                            <a href="{{asset('history/images/history/9.jpg')}}" data-bg="{{asset('history/images/history/9.jpg')}}" data-fslightbox="14dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                            <a href="{{asset('history/images/history/10.jpg')}}" data-bg="{{asset('history/images/history/10.jpg')}}" data-fslightbox="14dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->
                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow right-percent-100 absolute mr--10"></div>
                </div>
                <!-- End post -->

                <!-- Post - ON LEFT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-0 mt-60-sm pr-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2022</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            LOREM IPSUM DOLOR SIT--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">After a thorough evaluation by Carl Care of two service providers, Arabia Care was designated as the sole service provider for Infinix in Lebanon.
                            Arabia Care excelled in several key criteria:
                            Repair Time
                            Return
                            Repair Ratio,
                            Customer Satisfaction, and
                            the Number of Tickets Issued.
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-right b-white b-colored-hover-item slow left-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
{{--                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-end justify-content-start">--}}
{{--                            <!-- Item -->--}}
{{--                            <!-- Item -->--}}
{{--                            <a href="{{asset('history/images/history/6.jpg')}}" data-bg="{{asset('history/images/history/6.jpg')}}" data-fslightbox="24dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>--}}
{{--                            <!-- Item -->--}}
{{--                            <a href="{{asset('history/images/history/7.jpg')}}" data-bg="{{asset('history/images/history/7.jpg')}}" data-fslightbox="24dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>--}}
{{--                        </div>--}}
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->

                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow left-percent-100 absolute ml--10"></div>
                </div>
                <!-- End post -->

                <!-- Post - ON RIGHT -->
                <div class="col-lg-6 col-12 hover-container c-default height-auto relative mt-70 mt-60-sm pl-50 px-15-sm d-flex align-items-center">
                    <!-- Text Content -->
                    <div class="pt-40 pb-55 px-35 slow bg-white bg-colored-hover-item radius-md fullwidth relative">
                        <!-- Date -->
                        <h6 class=" gray7 white-hover-item uppercase slow font-details-h6">2023</h6>
                        <!-- Title -->
{{--                        <h4 class="uppercase fs-17 medium white-hover-item gray8 mt-10 slow">--}}
{{--                            THE STANDARD CHUNK OF LOREM IPSUM--}}
{{--                        </h4>--}}
                        <!-- Description -->
                        <p class="mt-10 gray6 white-hover-item slow">Arabia Mobiles secured the distribution rights for Infinix in Lebanon.

                            Furthermore, we launched KI Tech LTD, which obtained exclusive distribution rights for Blackview in Cyprus.

                            Moreover, Khoury International FZE was appointed as the official distributor for Blackview in Iraq, Saudi Arabia, the United Arab Emirates, and Egypt
                        </p>
                        <!-- Arrow -->
                        <div class="visible-lg b-15 arrow-left b-white b-colored-hover-item slow right-percent-100 top-percent-50 mt--15 absolute"></div>
                        <!-- Image and video content -->
                        <div class="absolute height-70px left-0 bottom-0 px-30 move-down-half fullwidth d-flex flex-wrap justify-content-lg-start justify-content-start">
                            <!-- Item -->
                            <a href="{{asset('history/images/history/11.jpg')}}" data-bg="{{asset('history/images/history/11.jpg')}}" data-fslightbox="14dec2021" data-type="image" class="icon-xl b-2 b-gray2 width-70 width-45-sm height-70 height-45-sm mx-5 mx-2-sm circle zoom-in-hover slow zoom-out-focus"></a>
                        </div>
                        <!-- End image and video content -->
                    </div>
                    <!-- End text content -->
                    <!-- Ball on strip -->
                    <div class="visible-lg width-20 height-20 circle bg-white bg-colored-hover-item slow right-percent-100 absolute mr--10"></div>
                </div>
                <!-- End post -->


            </div>
            <!-- End row for posts and dates -->

        </div>
        <!-- End history container -->
    </section>
    <!-- End history section -->

@endsection