@extends('frontend.layouts.master')
@section('title') What we do @endsection
@section('main-content')
@include('frontend.layouts.notification')

<!-- Start Page Title Area -->
<div class="page-title-area">
    <div class="d-table">
        <div class="d-table-cell">
            <div class="container">
                <div class="page-title-content">
                    <h2> What we do</h2>
                    <ul>
                        <li><a href="{{route('home')}}">Home</a></li>
                        <li> What we do</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End Page Title Area -->

<!-- Start Causes Area -->
<section class="causes-section pt-100 pb-100">
    <div class="container">
        <div class="section-title">
            <span>
                <i class="flaticon-ribbon"></i>
                Our What we do
            </span>
            <h2>The what we do that we care about</h2>
            <p></p>
        </div>

        <div class="row">
            @if(count($causes)>0)
				@foreach($causes as $cause)
                    <div class="col-lg-4 col-md-6">
                        <div class="single-causes">
                            @php
                                $photo=explode(',',$cause->photo);
                            @endphp
                            <img src="{{ Storage::url($cause->photo) }}" alt="">
                            <div class="icon">
                                <i class="flaticon-book-1"></i>
                            </div>

                            <div class="causes-content">
                                <h3>{{$cause->title}}</h3>
                                <p>{!! ($cause->description) !!}</p>
                                <a href="{{route('volunteer') }}" class="causes-btn-one">
                                    Volunteer
                                    <i class="flaticon-right"></i>
                                </a>
                            </div>
                        </div>
                    </div>
                @endforeach
            @endif
        </div>
    </div>
</section>
<!-- End Causes Area -->

@endsection