@extends('layout.main')

@section('main-section')
        <!-- subheader -->
        <section id="subheader">
            <div class="container-fluid m-5-hor">
                <div class="row">
                    <div class="col-md-12">
                        <h1 class="big-heading">Tour Package</h1>
                        <p>Varius blandit sit amet</p>
                    </div>
                </div>
            </div>
        </section>
        <!-- subheader end -->

    <!--  gallery home --> 
    <section aria-label="gallery">
        <div class="container-fluid m-5-hor">
            <div class="row">
                <div class="col-lg-12">
                    <h3 class="big-heading">Popular Tour Packages</h3>
                    <span class="sub-heading-content">Exclusive Tour Packages in Uttarakhand</span>
                    <span class="devider-left"></span>
                </div>
            </div>
        </div>

        <div class="container onStep" data-animation="fadeInUp" data-time="0">
            <div class="row">
                @foreach($tourData as $tourRow)
                <div class="col-md-4">
                    <div class="gal-home">
                        <a href="{{ url('/tour/'.$tourRow->id) }}">
                            <div class="hovereffect">
                                <img alt="imageportofolio" class="img-responsive" src="{{ asset('public/storage/'.$tourRow->image) }}">
                            </div>
                            <div class="gal-home-content">
                                <div class="row">
                                    <div class="col-md-9"> 
                                        <h4>{{ $tourRow->name }}</h4>
                                        <p>Duration {{ $tourRow->time_period }}</p>
                                        <div class="star-content">
                                            <i class="fa fa-star" aria-hidden="true"></i> 
                                            <i class="fa fa-star" aria-hidden="true"></i> 
                                            <i class="fa fa-star" aria-hidden="true"></i> 
                                            <i class="fa fa-star" aria-hidden="true"></i> 
                                            <i class="fa fa-star-o" aria-hidden="true"></i>
                                        </div>
                                        <div class="review-cont big-heading">{{ $tourRow->rating }}</div>
                                    </div>
                                    <div class="col-md-3"> 
                                        <div class="heading-price">From</div>
                                        <div class="price big-heading">₹ {{ $tourRow->price }}</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>
                @if($loop->iteration%3==0)
            </div>
            <div class="row">
                @endif
                @endforeach
            </div>
        </div>
    </section> 
    <!--  gallery home end --> 

@endsection