@extends("layouts.app")
@section("content")

    <div class="main-slider">
        <img class="img-fluid w-100" src="{{asset('images/innerBnnr.jpg')}}" alt="First slide">
        <div class="carousel-caption">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <h1 class="text-uppercase">Our Work</h1>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- END: Main Slider -->

    {{--    <section class="workSec pt-0">--}}
    {{--        <div class="container-fluid">--}}
    {{--            <div class="row no-gutters">--}}
    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/work1.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/work2.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/work3.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/work4.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/work5.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{('images/work6.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/work7.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3">--}}
    {{--                    <div class="workBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/work8.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="workCtnt">--}}
    {{--                            <h4>T- Shirts Printing</h4>--}}
    {{--                            <p>We can do that, too</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}
    {{--            </div>--}}
    {{--        </div>--}}
    {{--    </section>--}}
    {{--    --}}
    {{--    <section class="teamSec teamInner">--}}
    {{--        <div class="container">--}}
    {{--            <div class="row">--}}
    {{--                <div class="col-12">--}}
    {{--                    <h2>MEET THE ADMINISTRATIVE TEAM</h2>--}}
    {{--                </div>--}}
    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team1.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}
    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team2.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team3.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team4.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team5.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team6.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team7.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--                <div class="col-md-3 text-center">--}}
    {{--                    <div class="teamBox">--}}
    {{--                        <figure>--}}
    {{--                            <img src="{{asset('images/team8.jpg')}}" class="img-fluid" alt="">--}}
    {{--                        </figure>--}}
    {{--                        <div class="teamCtnt">--}}
    {{--                            <h4>Alexzendra</h4>--}}
    {{--                            <p>Customer service</p>--}}
    {{--                        </div>--}}
    {{--                    </div>--}}
    {{--                </div>--}}

    {{--            </div>--}}
    {{--        </div>--}}
    {{--    </section>--}}
    <div id="accordionExample">
        <section class="workSec pt-0">
            <div class="container-fluid">
                <div class="workSlider swiper">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a class="workBox" type="button" data-toggle="collapse" data-target="#cars"
                               aria-expanded="true" aria-controls="cars">
                                <figure>
                                    <img src="{{asset("images/cars/1.jpg")}}" class="img-fluid" alt="">
                                </figure>
                                <div class="workCtnt">
                                    <h4>Cars</h4>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="workBox" type="button" data-toggle="collapse" data-target="#clothing"
                               aria-expanded="true" aria-controls="clothing">
                                <figure>
                                    <img src="{{asset("images/clothing/1.jpg")}}" class="img-fluid" alt="">
                                </figure>
                                <div class="workCtnt">
                                    <h4>Clothing</h4>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="workBox" type="button" data-toggle="collapse" data-target="#misc"
                               aria-expanded="true" aria-controls="misc">
                                <figure>
                                    <img src="{{asset("images/misc/1.jpg")}}" class="img-fluid" alt="">
                                </figure>
                                <div class="workCtnt">
                                    <h4>Misc</h4>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="workBox" type="button" data-toggle="collapse" data-target="#stickers"
                               aria-expanded="true" aria-controls="stickers">
                                <figure>
                                    <img src="{{asset("images/stickers/1.jpg")}}" class="img-fluid" alt="">
                                </figure>
                                <div class="workCtnt">
                                    <h4>Stickers</h4>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="workBox" type="button" data-toggle="collapse" data-target="#storefronts"
                               aria-expanded="true" aria-controls="storefronts">
                                <figure>
                                    <img src="{{asset("images/storefronts/1.jpg")}}" class="img-fluid" alt="">
                                </figure>
                                <div class="workCtnt">
                                    <h4>Store Fronts</h4>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="workBox" type="button" data-toggle="collapse" data-target="#walls"
                               aria-expanded="true" aria-controls="walls">
                                <figure>
                                    <img src="{{asset("images/walls/1.jpg")}}" class="img-fluid" alt="">
                                </figure>
                                <div class="workCtnt">
                                    <h4>Walls</h4>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="workBox" type="button" data-toggle="collapse" data-target="#windows"
                               aria-expanded="true" aria-controls="windows">
                                <figure>
                                    <img src="{{asset("images/windows/1.jpg")}}" class="img-fluid" alt="">
                                </figure>
                                <div class="workCtnt">
                                    <h4>Windows</h4>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="swiper-pagination"></div>
                    <div class="swiper-button-prev"></div>
                    <div class="swiper-button-next"></div>
                </div>
            </div>
        </section>

        <section class="teamSec teamInner">
            <div class="container">
                <div class="row collapse show" id="cars" aria-labelledby="cars" data-parent="#accordionExample">
                    @for($i =1; $i<=46; $i++)
                        <div class="col-md-4 text-center">
                            <div class="teamBox">
                                <figure>
                                    <img src="{{asset("images/cars/$i.jpg")}}" class="img-fluid" alt="">
                                </figure>
                            </div>
                        </div>
                    @endfor
                </div>
                <div class="row collapse show" id="clothing" aria-labelledby="clothing" data-parent="#accordionExample">
                    @for($i =1; $i<=23; $i++)
                        <div class="col-md-4 text-center">
                            <div class="teamBox">
                                <figure>
                                    <img src="{{asset("images/clothing/$i.jpg")}}" class="img-fluid" alt="">
                                </figure>
                            </div>
                        </div>
                    @endfor
                </div>
                <div class="row collapse show" id="misc" aria-labelledby="misc" data-parent="#accordionExample">
                    @for($i =1; $i<=3; $i++)
                        <div class="col-md-4 text-center">
                            <div class="teamBox">
                                <figure>
                                    <img src="{{asset("images/misc/$i.jpg")}}" class="img-fluid" alt="">
                                </figure>
                            </div>
                        </div>
                    @endfor
                </div>
                <div class="row collapse show" id="stickers" aria-labelledby="stickers" data-parent="#accordionExample">
                    @for($i =1; $i<=9; $i++)
                        <div class="col-md-4 text-center">
                            <div class="teamBox">
                                <figure>
                                    <img src="{{asset("images/stickers/$i.jpg")}}" class="img-fluid" alt="">
                                </figure>
                            </div>
                        </div>
                    @endfor
                </div>
                <div class="row collapse show" id="storefronts" aria-labelledby="storefronts" data-parent="#accordionExample">
                    @for($i =1; $i<=34; $i++)
                        <div class="col-md-4 text-center">
                            <div class="teamBox">
                                <figure>
                                    <img src="{{asset("images/storefronts/$i.jpg")}}" class="img-fluid" alt="">
                                </figure>
                            </div>
                        </div>
                    @endfor
                </div>
                <div class="row collapse show" id="walls" aria-labelledby="walls" data-parent="#accordionExample">
                    @for($i =1; $i<=15; $i++)
                        <div class="col-md-4 text-center">
                            <div class="teamBox">
                                <figure>
                                    <img src="{{asset("images/walls/$i.jpg")}}" class="img-fluid" alt="">
                                </figure>
                            </div>
                        </div>
                    @endfor
                </div>
                <div class="row collapse show" id="windows" aria-labelledby="windows" data-parent="#accordionExample">
                    @for($i =1; $i<=6; $i++)
                        <div class="col-md-4 text-center">
                            <div class="teamBox">
                                <figure>
                                    <img src="{{asset("images/windows/$i.jpg")}}" class="img-fluid" alt="">
                                </figure>
                            </div>
                        </div>
                    @endfor
                </div>
            </div>
        </section>
    </div>

@endsection