@extends('web.layouts.main')
@section('content')
	@if($banner && $banner->banner!=NULL)
		<section class="bannerArea">
		    <img src="{{asset($service->banner)}}" class="img-fluid w-100 bannerImg" {!!$service->banner_meta_tag!!}>
		    <div class="container position-relative">
		        <div class="row">
		            <div class="col-lg-12">
		                <h2>Services</h2>
		                <nav aria-label="breadcrumb">
		                    <ol class="breadcrumb">
		                        <li class="breadcrumb-item"><a href="{{url('/')}}">Home</a></li>
		                        <li class="breadcrumb-item active" aria-current="page">{{$service->title}}</li>
		                    </ol>
		                </nav>
		            </div>
		        </div>
		    </div>
		</section>
	@endif
	<section class="services-details">
	    <div class="container">
	        <div class="row justify-content-between align-items-start">
				<div class="col-lg-8 servicesRight">
	            	@if($service->image!=NULL)
	                	<img src="{{asset($service->image)}}" class="img-fluid w-100 servicesImg" {!!$service->image_meta_tag!!}>
	                @endif
	                <div class="servicesDetailsWrap">
	                    <h4>
	                        {{$service->title}}
	                    </h4>
	                    <div class="textArea">
	                        {!!$service->description!!}
	                    </div>
	                </div>
	            </div>
	            <div class="col-lg-4  servicesNav sticky-lg-top">
	                <h4>Services</h4>
	                <ul class="servicesList">
	                    {{categoriesForInner($service->id)}}
	                </ul>
	            </div>
	        </div>
	    </div>
	</section>
@endsection