@extends ('layout')

@section ('content')

<section class="home-slider owl-carousel js-fullheight">
    <div class="slider-item js-fullheight" style="background-image: url(images/bg_1.jpg);">
        <div class="overlay"></div>
        <div class="container">
            <div class="row slider-text js-fullheight justify-content-center align-items-center"
                 data-scrollax-parent="true">

                <div class="col-md-12 col-sm-12 text-center ftco-animate">
                    <h1 class="mb-4 mt-5">Our Delicious Specialties</h1>
                    <p><a href="#" class="btn btn-primary p-3 px-xl-4 py-xl-3">Order Now</a> <a href="#"
                                                                                                class="btn btn-white btn-outline-white p-3 px-xl-4 py-xl-3">View Menu</a></p>
                </div>

            </div>
        </div>
    </div>

    <div class="slider-item js-fullheight" style="background-image: url(images/bg_2.jpg);">
        <div class="overlay"></div>
        <div class="container">
            <div class="row slider-text js-fullheight justify-content-center align-items-center"
                 data-scrollax-parent="true">

                <div class="col-md-12 col-sm-12 text-center ftco-animate">
                    <h1 class="mb-4 mt-5">The Best Place to Kick of Your Day</h1>
                    <p><a href="#" class="btn btn-primary p-3 px-xl-4 py-xl-3">Order Now</a> <a href="#"
                                                                                                class="btn btn-white btn-outline-white p-3 px-xl-4 py-xl-3">View Menu</a></p>
                </div>

            </div>
        </div>
    </div>

    <div class="slider-item js-fullheight" style="background-image: url(images/bg_3.jpg);">
        <div class="overlay"></div>
        <div class="container">
            <div class="row slider-text justify-content-center align-items-center" data-scrollax-parent="true">

                <div class="col-md-12 col-sm-12 text-center ftco-animate">
                    <h1 class="mb-4 mt-5">Creamy Hot and Ready to Serve</h1>
                    <p><a href="#" class="btn btn-primary p-3 px-xl-4 py-xl-3">Order Now</a> <a href="#"
                                                                                                class="btn btn-white btn-outline-white p-3 px-xl-4 py-xl-3">View Menu</a></p>
                </div>

            </div>
        </div>
    </div>
</section>


<section class="ftco-section ftco-wrap-about ftco-no-pb">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-sm-10 wrap-about ftco-animate text-center">
                <div class="heading-section mb-4 text-center">
                    <span class="subheading">About</span>
                    <h2 class="mb-4">Pocha Japanese Restaurant</h2>
                </div>
                <p>On her way she met a copy. The copy warned the Little Blind Text, that where it came from it
                    would have been rewritten a thousand times and everything that was left from its origin would be
                    the word "and" and the Little Blind Text should turn around and return to its own, safe country.
                    A small river named Duden flows by their place and supplies it with the necessary regelialia. It
                    is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p>

                <div class="video justify-content-center">
                    <a href="https://vimeo.com/45830194"
                       class="icon-video popup-vimeo d-flex justify-content-center align-items-center">
                        <span class="ion-ios-play"></span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="ftco-section bg-light">
    <div class="container">
        <div class="row justify-content-center mb-5 pb-2">
            <div class="col-md-7 text-center heading-section ftco-animate">
                <span class="subheading">Services</span>
                <h2 class="mb-4">Catering Services</h2>
            </div>
        </div>
        <div class="row">
            <div class="col-md-4 d-flex align-self-stretch ftco-animate text-center">
                <div class="media block-6 services d-block">
                    <div class="icon d-flex justify-content-center align-items-center">
                        <span class="flaticon-cake"></span>
                    </div>
                    <div class="media-body p-2 mt-3">
                        <h3 class="heading">Outside Catering</h3>
                        <p>Even the all-powerful Pointing has no control about the blind texts it is an almost
                            unorthographic.</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 d-flex align-self-stretch ftco-animate text-center">
                <div class="media block-6 services d-block">
                    <div class="icon d-flex justify-content-center align-items-center">
                        <span class="flaticon-meeting"></span>
                    </div>
                    <div class="media-body p-2 mt-3">
                        <h3 class="heading">Events</h3>
                        <p>Even the all-powerful Pointing has no control about the blind texts it is an almost
                            unorthographic.</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 d-flex align-self-stretch ftco-animate text-center">
                <div class="media block-6 services d-block">
                    <div class="icon d-flex justify-content-center align-items-center">
                        <span class="flaticon-tray"></span>
                    </div>
                    <div class="media-body p-2 mt-3">
                        <h3 class="heading">Birthday Party</h3>
                        <p>Even the all-powerful Pointing has no control about the blind texts it is an almost
                            unorthographic.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="ftco-section">
    <div class="container-fluid px-4">
        <div class="row justify-content-center mb-5 pb-2">
            <div class="col-md-7 text-center heading-section ftco-animate">
                <span class="subheading">Specialties</span>
                <h2 class="mb-4">Our Menu</h2>
            </div>
        </div>
        <div class="row">

            <div class="col-md-6 col-lg-4 menu-wrap">
                <div class="menus d-flex ftco-animate">
                    <div class="menu-img img" style="background-image: url(images/wine-2.jpg);"></div>
                    <div class="text">
                        <div class="d-flex">
                            <div class="one-half">
                                <h3>Grilled Crab with Onion</h3>
                            </div>
                            <div class="one-forth">
                                <span class="price">$29</span>
                            </div>
                        </div>
                        <p><span>Meat</span>, <span>Potatoes</span>, <span>Rice</span>, <span>Tomatoe</span></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="ftco-section">
		<div class="container">
			<div class="row justify-content-center mb-5 pb-2">
				<div class="col-md-7 text-center heading-section ftco-animate">
					<span class="subheading">Events</span>
					<h2 class="mb-4">Upcoming Events</h2>
				</div>
			</div>
			<div class="row">
				<div class="col-md-6 col-lg-3 ftco-animate">
					<div class="staff">
						<div class="img" style="background-image: url(images/chef-4.jpg);"></div>
						<div class="text pt-4">
							<h3>Japan party</h3>
							<span class="position mb-2">Restaurant Owner</span>
							<p>A small river named Duden flows by their place and supplies it with the necessary
								regelialia.</p>
						</div>
						<a href="#" class="btn btn-primary p-2 px-xl-3 py-xl-2">Attend</a>
					</div>
				</div>
				<div class="col-md-6 col-lg-3 ftco-animate">
					<div class="staff">
						<div class="img" style="background-image: url(images/chef-2.jpg);"></div>
						<div class="text pt-4">
							<h3>Japan Embassy</h3>
							<span class="position mb-2">Head Chef</span>
							<p>A small river named Duden flows by their place and supplies it with the necessary
								regelialia.</p>
								<a href="#" class="btn btn-primary p-2 px-xl-3 py-xl-2">Attend</a>
						</div>
					</div>
				</div>
				<div class="col-md-6 col-lg-3 ftco-animate">
					<div class="staff">
						<div class="img" style="background-image: url(images/chef-3.jpg);"></div>
						<div class="text pt-4">
							<h3>Happy New Year</h3>
							<span class="position mb-2">Chef</span>
							<p>A small river named Duden flows by their place and supplies it with the necessary
								regelialia.</p>
								<a href="#" class="btn btn-primary p-2 px-xl-3 py-xl-2">Attend</a>
						</div>
					</div>
				</div>
				<div class="col-md-6 col-lg-3 ftco-animate">
					<div class="staff">
						<div class="img" style="background-image: url(images/chef-1.jpg);"></div>
						<div class="text pt-4">
							<h3>Eat and Run</h3>
							<span class="position mb-2">Chef</span>
							<p>A small river named Duden flows by their place and supplies it with the necessary
								regelialia.</p>
								<a href="#" class="btn btn-primary p-2 px-xl-3 py-xl-2">Attend</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>

<!-- <section class="ftco-section testimony-section" style="background-image: url(images/bg_5.jpg);" data-stellar-background-ratio="0.5"> -->
<section class="ftco-section testimony-section img" style="background-image: url(images/bg_5.jpg);">
    <div class="overlay"></div>
    <div class="container">
        <div class="row justify-content-center mb-5">
            <div class="col-md-7 text-center heading-section ftco-animate">
                <span class="subheading">Testimony</span>
                <h2 class="mb-4">Happy Customer</h2>
            </div>
        </div>
        <div class="row ftco-animate justify-content-center">
            <div class="col-md-12">
                <div class="carousel-testimony owl-carousel ftco-owl">
                    @foreach($feedback as $feedback)
                    <div class="item">
                        <div class="testimony-wrap text-center pb-5">
                            <div class="user-img mb-4" style="background-image: url(images/person_3.jpg)">
									<span class="quote d-flex align-items-center justify-content-center">
										<i class="icon-quote-left"></i>
									</span>
                            </div>
                            <div class="text p-3">
                                <p class="mb-4">{{$feedback->message}}</p>
                                <p class="name">{{$feedback->Email}}</p>
                                <span class="position">Customer</span>
                            </div>
                        </div>
                    </div>
                        @endforeach
                </div>
            </div>
        </div>
    </div>
</section>

<section class="ftco-section ftco-no-pt ftco-no-pb">
    <div class="container-fluid px-0">
        <div class="row no-gutters">
            <div class="col-md">
                <a href="#" class="instagram img d-flex align-items-center justify-content-center"
                   style="background-image: url(images/insta-1.jpg);">
                    <span class="ion-logo-instagram"></span>
                </a>
            </div>
            <div class="col-md">
                <a href="#" class="instagram img d-flex align-items-center justify-content-center"
                   style="background-image: url(images/insta-2.jpg);">
                    <span class="ion-logo-instagram"></span>
                </a>
            </div>
            <div class="col-md">
                <a href="#" class="instagram img d-flex align-items-center justify-content-center"
                   style="background-image: url(images/insta-3.jpg);">
                    <span class="ion-logo-instagram"></span>
                </a>
            </div>
            <div class="col-md">
                <a href="#" class="instagram img d-flex align-items-center justify-content-center"
                   style="background-image: url(images/insta-4.jpg);">
                    <span class="ion-logo-instagram"></span>
                </a>
            </div>
            <div class="col-md">
                <a href="#" class="instagram img d-flex align-items-center justify-content-center"
                   style="background-image: url(images/insta-5.jpg);">
                    <span class="ion-logo-instagram"></span>
                </a>
            </div>
        </div>
    </div>
</section>

@endsection ('content')
