@extends('user.layouts.app')
@section('metapart')
<meta property="og:url" content="{{ \Illuminate\Support\Facades\URL::full() }}">
<meta property="og:title" content="{{$sitesetting->meta_tag}}">
<meta property="og:description" content="{{$sitesetting->meta_tag}}">
<meta property="og:type" content="Website">
<meta property="og:image" content="{{$sitesetting->image_url}}">
<meta property="og:image:secure_url" content="{{$sitesetting->image_url}}">
<meta property="og:image:type" content="image/jpg">
<meta property="og:image:width" content="200">
<meta property="og:image:height" content="200">
@endsection
@section('pagetitle')
<title>{{ $sitesetting->comp_name }}</title>
@endsection
@section('body')
<section class="rev_slider_wrapper">
	<div id="slider1" class="rev_slider" data-version="5.0">
		<ul>
		@foreach($slider as $singleimage)
			<li data-transition="slidingoverlayleft"> <img src="{{ $singleimage->image_url }}" alt="" width="1920" height="800" data-bgposition="center center" data-bgfit="cover" data-bgrepeat="no-repeat" data-bgparallax="1">
				<div class="tp-caption  tp-resizeme" data-x="left" data-hoffset="0" data-y="top" data-voffset="205" data-transform_idle="o:1;" data-transform_in="x:[-175%];y:0px;z:0;rX:0;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0.01;s:3000;e:Power3.easeOut;" data-transform_out="s:1000;e:Power3.easeInOut;s:1000;e:Power3.easeInOut;" data-mask_in="x:[100%];y:0;s:inherit;e:inherit;" data-splitin="none" data-splitout="none" data-start="700">
					<div class="slide-content-box">
						<h1 style="color:{{ $singleimage->title_clr }}">{{ $singleimage->title }}</h1>
						<h3 style="color:{{ $singleimage->sub_title_clr }}">{{ $singleimage->sub_title }}</h3>
					</div>
				</div>
			</li>
			@endforeach
		</ul>
	</div>
</section>
<section class="welcome-area">
	<div class="container clearfix">
		<div class="sec-title">
			<h2>{{  $about->title }}</h2> <span class="decor"></span> </div>
		<div class="row">
			<div class="col-md-6 col-sm-12 col-xs-12">
				<div class="text-holder">
					<h3>{{  $about->sub_title }}</h3>
					<p>{!! html_entity_decode($about->description) !!}</p>
					<div class="bottom">
						<div class="button"> <a class="thm-btn bg-cl-1" href="{{ url('about') }}">More About Us</a> </div>
					</div>
				</div>
			</div>
			<div class="col-md-6 col-sm-12 col-xs-12">
				<div class="gallery clearfix">
					<div class="row">
						<div class="col-md-6 col-sm-6 col-xs-12">
							<div class="video-gallery">
								<iframe width="100%" height="200px" src="https://www.youtube.com/embed/{{ $about->youtube_videolink }}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
							</div>
						</div>
						<div class="col-md-6 col-sm-6 col-xs-12">
							<div class="gallery-bg-img"> <img src="{{ $about->image_url }}" alt=""> </div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!--<section class="service-area" style="background-image:url({{ url('public/assets/user') }}/images/bg.jpg);">
	<div class="container">
		<div class="sec-title">
			<h2>Services We do</h2> <span class="decor"></span> </div>
		<div class="row">
			<div class="col-md-4 col-sm-4 col-xs-12">
				<div class="single-service-item">
					<div class="img-holder"> <img src="{{ url('public/assets/user') }}/images/services-1.jpg" alt="Awesome Image">
						<div class="overlay">
							<div class="box">
								<div class="content"> <a href="#"><i class="fa fa-link" aria-hidden="true"></i></a> </div>
							</div>
						</div>
					</div>
					<div class="text-holder"> <a href="#"><h3>Residential <span>Design</span></h3></a>
						<p>We design Wardrobes, Kitchen Cabinets based...</p>
					</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-4 col-xs-12">
				<div class="single-service-item">
					<div class="img-holder"> <img src="{{ url('public/assets/user') }}/images/services-2.jpg" alt="Awesome Image">
						<div class="overlay">
							<div class="box">
								<div class="content"> <a href="#"><i class="fa fa-link" aria-hidden="true"></i></a> </div>
							</div>
						</div>
					</div>
					<div class="text-holder"> <a href="#"><h3>Commercial <span>Design</span></h3></a>
						<p>Best projects and products in the commercial...</p>
					</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-4 col-xs-12">
				<div class="single-service-item">
					<div class="img-holder"> <img src="{{ url('public/assets/user') }}/images/services-3.jpg" alt="Awesome Image">
						<div class="overlay">
							<div class="box">
								<div class="content"> <a href="#"><i class="fa fa-link" aria-hidden="true"></i></a> </div>
							</div>
						</div>
					</div>
					<div class="text-holder"> <a href="#"><h3>Corporate <span>Design</span></h3></a>
						<p>Changing business climate, workplace design...</p>
					</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-4 col-xs-12">
				<div class="single-service-item">
					<div class="img-holder"> <img src="{{ url('public/assets/user') }}/images/services-4.jpg" alt="Awesome Image">
						<div class="overlay">
							<div class="box">
								<div class="content"> <a href="#"><i class="fa fa-link" aria-hidden="true"></i></a> </div>
							</div>
						</div>
					</div>
					<div class="text-holder"> <a href="#"><h3>Hospitality <span>Design</span></h3></a>
						<p>Designing hospital area with equipments needs...</p>
					</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-4 col-xs-12">
				<div class="single-service-item">
					<div class="img-holder"> <img src="{{ url('public/assets/user') }}/images/services-5.jpg" alt="Awesome Image">
						<div class="overlay">
							<div class="box">
								<div class="content"> <a href="#"><i class="fa fa-link" aria-hidden="true"></i></a> </div>
							</div>
						</div>
					</div>
					<div class="text-holder"> <a href="#"><h3>Restaurant <span>Design</span></h3></a>
						<p>Will differentiate from the ordinary restaurants...</p>
					</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-4 col-xs-12">
				<div class="single-service-item">
					<div class="img-holder"> <img src="{{ url('public/assets/user') }}/images/services-6.jpg" alt="Awesome Image">
						<div class="overlay">
							<div class="box">
								<div class="content"> <a href="#"><i class="fa fa-link" aria-hidden="true"></i></a> </div>
							</div>
						</div>
					</div>
					<div class="text-holder"> <a href="#"><h3>Industrial <span>Design</span></h3></a>
						<p>Will differentiate you from the ordinary restaurants</p>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>-->
<section class="latest-project-area">
	<div class="container-fluid">
		<div class="container">
			<div class="sec-title pull-left">
				<h2>Latest <span>Product</span></h2> <span class="decor"></span> </div>
			<ul class="project-filter post-filter pull-right">
				<li class="active" data-filter=".filter-item"><span>View All </span></li>
				@foreach($category as $cat)
				<li data-filter=".{{ $cat->slug }}"><span>{{ $cat->name }}</span></li>
				@endforeach
			</ul>
		</div>
		<div class="row project-content masonary-layout filter-layout"> 
		@foreach($home_page_product as $singlepro)
			<div class="col-md-2 col-sm-4 col-xs-12 filter-item {{ $singlepro->category->slug }}">
				<div class="single-project-item single_home">
					<div class="img-holder"> <img src="{{ $singlepro->image_url }}" alt="{{ $singlepro->name }}">
						<div class="overlay">
							<div class="box">
								<div class="content"> <a href="{{ url('/product'.'/'.$singlepro->slug) }}"><h3>{{ $singlepro->name }}</h3></a>
									<p>{{ $singlepro->category->name }}</p>
									<div class="icon-holder"> <a href="{{ $singlepro->image_url }}" data-rel="prettyPhoto" title="{{ $singlepro->name }}"><i class="fa fa-camera"></i></a> </div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			@endforeach
		</div>
	</div>
</section>

@endsection
@section('js')
@endsection