@extends('layouts.app')

@section('title','Our Team - Dusty helmets')

@section('content')

     <!-- Page Header Start -->
     <!-- p8/pic1 -->
        <div class="mb-0 page-header" style="background: linear-gradient(rgba(0, 0, 0, .2), rgba(0, 0, 0, .2)), url(public/assets/P8/pic1.jpg);background-position: center;
    background-repeat: no-repeat;
    background-size: cover;">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <h2>Our Team</h2>
                    </div>
                    <div class="col-12">
                        <a href="{{url('/')}}">Home</a>
                        <a href="{{url('/team')}}">Our Team</a>
                    </div>
                </div>
            </div>
        </div>
        <!-- Page Header End -->

          <div class="about">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-12">
                        <div class="about-content">
                            <div class="section-header">
                                <p>Dusty Helmets</p>
                                <h2 class="dusty-color">Our Team</h2>
                            </div>
                        <p>Dusty Helmets has a long and extensive experience of off-road motorcycles and
                        getting out in the bush in all parts of Kenya.</p>
                        <p>This wealth of knowledge gives us access to some of the most remote parts of
                        Kenya; unrivaled scenic rides, untouched wildlife regions and unbelievable heart-
                        warming interactions with the rich and diverse culture of this beautiful country.</p>
                        <p>We will tailor your off-road motorbike safari to your requests, your riding skills s and
                        safari specific preferences.</p>
                        </div>
                    </div>
                                      @foreach($page as $page)
                     @if($count%2!=0)
                        <div class="col-lg-7">
                            <div class="about-content">
                                {!! $page->content1 !!}
                            </div>
                        </div>
                        <div class="col-lg-5">
                            <div class="mt-5 shadow services services-1 color-2 d-block img" style="background-image: url({{asset('')}}public/storage/{{$page->image}});">
    
                                <!-- <img src="" alt="Image"> -->
                                <div class="icon d-flex align-items-center justify-content-center"><span class="fa fa-users"></span></div>
                                <!-- <button type="button" class="btn-play" data-toggle="modal" data-src="https://www.youtube.com/embed/DWRcNpR6Kdc" data-target="#videoModal">
                                    <span></span>
                                </button> -->
                            </div>
                        </div>
                     @else
                        <div class="col-lg-5">
                            <div class="mt-5 shadow services services-1 color-2 d-block img" style="background-image: url({{asset('')}}public/storage/{{$page->image}});">
    
                                <!-- <img src="" alt="Image"> -->
                                <div class="icon d-flex align-items-center justify-content-center"><span class="fa fa-users"></span></div>
                                <!-- <button type="button" class="btn-play" data-toggle="modal" data-src="https://www.youtube.com/embed/DWRcNpR6Kdc" data-target="#videoModal">
                                    <span></span>
                                </button> -->
                            </div>
                        </div>
                        <div class="col-lg-7">
                            <div class="about-content">
                                {!! $page->content1 !!}
                            </div>
                        </div>
                     @endif
                                      @endforeach

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

@endsection