@extends($user_shop ?'web.user.layouts.layout' : 'web.layouts.layout')

@section('content')

    <section class="page-header page-header-xlg" style="background-image:url('/assets/images/vision-min.jpg');  ">
        <div class="overlay dark-1"><!-- dark overlay [1 to 9 opacity] --></div>
        <div class="container">
        </div>
    </section>
    <!-- /PAGE HEADER -->


    <!-- -->
    <section>
        <div class="container">

            <div class="row">

                <!-- LEFT -->
                <div class="col-md-8">


                    <div class="heading-title">
                        <h1>{{ __('website.aloe_vera') }}</h1>
                    </div>

                    <p>{{ __('webcontent.aloe_vera_word_copy') }} </p>


                    <div class="row margin-top-60">

                        <div class="col-sm-6">
                            <div class="heading-title heading-border-bottom heading-color">
                                <h3>{{ __('webcontent.origin_aloe_hl') }} </h3>
                                <p>{{ __('webcontent.origin_aloe_subl') }} </p>
                            </div>
                            <p>{{ __('webcontent.origin_aloe_copy') }} </p>
                        </div>

                        <div class="col-sm-6">
                            <div class="heading-title heading-border-bottom heading-color">
                                <h3>{{ __('webcontent.bio_quality_hl') }} </h3>
                                <p>{{ __('webcontent.bio_quality_subl') }} </p>
                            </div>
                            <p>{{ __('webcontent.bio_quality_copy') }} </p>
                        </div>
                    </div>
                    <div class="row">

                        <div class="col-sm-6">
                            <img class="img-fluid" src="/assets/images/aloe-vera-farm-haus.jpg" alt="service"/>
                            <p class="small"><em>{{ __('webcontent.shop_at_the_aloe_vera_farm') }}</em></p>
                        </div>

                         <div class="col-sm-6">
                            <img class="img-fluid" src="/assets/images/bio-siegel.jpg" alt="service"/>
                            <p class="small"><em></em></p>
                         </div>

                    </div>
                </div>
                <!-- /LEFT -->

                <!-- RIGHT -->
                <div class="col-md-4">

                    <div class="box-static box-border-top margin-bottom-60">
                        <div class="box-title">
                            <h4>{{ __('webcontent.pillars_best_aloe_vera_quality') }} </h4>
                        </div>
                        <ul class="list-unstyled list-icons padding-15 nopadding-bottom">
                            <li class="margin-bottom-20">
                                <i class="fa fa-check text-success size-18"></i>
                                <span class="block bold size-18">{{ __('webcontent.pillars_best_aloe_vera_quality_1_hl') }} </span>
                                <small>{{ __('webcontent.pillars_best_aloe_vera_quality_1_subl') }} </small>
                            </li>
                            <li class="margin-bottom-20">
                                <i class="fa fa-check text-success size-18"></i>
                                <span class="block bold size-18">{{ __('webcontent.pillars_best_aloe_vera_quality_2_hl') }} </span>
                                <small>{{ __('webcontent.pillars_best_aloe_vera_quality_2_subl') }} </small>
                            </li>
                            <li class="margin-bottom-20">
                                <i class="fa fa-check text-success size-18"></i>
                                <span class="block bold size-18">{{ __('webcontent.pillars_best_aloe_vera_quality_3_hl') }} </span>
                                <small>{{ __('webcontent.pillars_best_aloe_vera_quality_3_subl') }} </small>
                            </li>
                            <li class="margin-bottom-20">
                                <i class="fa fa-check text-success size-18"></i>
                                <span class="block bold size-18">{{ __('webcontent.pillars_best_aloe_vera_quality_4_hl') }} </span>
                                <small>{{ __('webcontent.pillars_best_aloe_vera_quality_4_subl') }} </small>
                            </li>
                            <li class="margin-bottom-20">
                                <i class="fa fa-check text-success size-18"></i>
                                <span class="block bold size-18">{{ __('webcontent.pillars_best_aloe_vera_quality_5_hl') }} </span>
                                <small>{{ __('webcontent.pillars_best_aloe_vera_quality_5_subl') }} </small>
                            </li>
                        </ul>
                        <hr/>
                    </div>
                </div>
                <!-- /RIGHT -->

                <div class="col-md-12 margin-top-60">

                    <div class="heading-title heading-border-bottom heading-color text-left">
                        <h3>{{ __('webcontent.aloe_high_quality_hl') }} </h3>
                        <p>{{ __('webcontent.aloe_high_quality_subl') }} </p>
                    </div>
                    <p>{{ __('webcontent.aloe_high_quality_copy') }} </p>

                    <div class="row">
                        <div class="col-sm-6">
                            <ul class="list-unstyled list-icons">
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li1') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li2') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li3') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li4') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li5') }} </li>
                            </ul>
                        </div>
                        <div class="col-sm-6">
                            <ul class="list-unstyled list-icons">
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li6') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li7') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li8') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li9') }} </li>
                                <li><i class="fa fa-check text-success"></i>{{ __('webcontent.aloe_high_quality_li10') }} </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- / -->


@endsection