@extends('layouts.common.common')

@section('content')

<div class="content-wrap">
		<!-- INTRO SECTION
		==================================== -->
		<div class="intro-section how-its-sec">
			<div class="intro-box bg-img" style="background-image: url({{asset('common/img/banner1.jpg')}});">
				<div class="black-overlay">
					<div class="intro-content">
						<h1 class="intro-tit">{{tr('repair')}}&amp;{{tr('refresh_your_home')}}</h1>
						<p class="intro-txt">{{tr('how_it_works_content')}}</p>
					</div>
				</div>
			</div>
		</div>
		<!-- END OF INTRO SECCTION -->

		<!-- how-work-slider
		====================================-->
		<div class="how-work-slider row m-0 p-30">
			<div class="how-work-slider-left-col col-lg-6 col-md-6 col-sm-12 col-xs-12">
				<div class="how-work-slider-left">
					<div class="how-work-img bg-img" style="background-image: url({{asset('common/img/how-its1.jpg')}});"></div>
				</div>
			</div>

			<div class="how-work-slider-right-col col-lg-6 col-md-6 col-sm-12 col-xs-12">
				<div class="how-work-slider-right how-slide">
					<div class="how-its-box text-center">
						<div class="how-icon">
							<i class="ion-paper-airplane"></i>
						</div>
						<h3 class="how-main-tit">{{tr('pick_task')}}</h3>
						<p class="how-txt">{{tr('how_it_works_content')}}</p>
					</div>
					<div class="how-its-box text-center">
						<div class="how-icon">
							<i class="ion-paper-airplane"></i>
						</div>
						<h3 class="how-main-tit">{{tr('pick_task')}}</h3>
						<p class="how-txt">{{tr('how_it_works_content')}}</p>
					</div>
					<div class="how-its-box text-center">
						<div class="how-icon">
							<i class="ion-paper-airplane"></i>
						</div>
						<h3 class="how-main-tit">{{tr('pick_task')}}</h3>
						<p class="how-txt">{{tr('how_it_works_content')}}</p>
					</div>
				</div>
			</div>
		</div>
		<!-- End of how-work-slider -->

		<div class="download gray-bg p-30 text-center">
			<div class="container">
				<h3>
					<span class="download-txt">{{tr('started_your_first_task')}}</span>
					<span>
						<a href="#" class="download">
							<div class="get-app bg-img" style="background-image: url({{asset('common/img/playstore.png')}});"></div>
						</a>
						<a href="#" class="download">
							<div class="get-app bg-img" style="background-image: url({{asset('common/img/app-store.png')}});"></div>
						</a>
					</span>
				</h3>
			</div>
		</div>

		<!-- BECOME TASKER SECTION
		====================================== -->
		<div class="become-tasker row m-0 bg-img" style="background-image: url({{asset('common/img/img1.jpg')}});">
			<div class="container">
				<div class="become-tasker-col col-lg-7 col-md-7 col-sm-6 col-xs-12">
					
				</div>
				<div class="become-tasker-col col-lg-5 col-md-5 col-sm-6 col-xs-12">
			 		<div class="become-tasker-box white-bg text-center">
						<h3 class="main-sub-tit">{{tr('trust_safety')}}</h3>
						<p class="main-txt landing-txt1">{{tr('how_it_works_content')}}</p>
					</div>
				</div>
			</div>
		</div>
		<!-- END OF BECOME TASKER SECTION -->

		<!-- PAYMENTS SECTION
		====================================== -->
		<div class="payment-section row m-0 white-bg  p-30">
			<div class="container">
				<h3 class="main-tit">{{tr('payment_pricing')}}</h3>
				
				<!-- How its work box -->
				<div class="how-its-work-col col-lg-4 col-md-4 col-sm-6 col-xs-12">
					<div class="how-its-work-box text-center">
						<div class="how-its-work-icon bg-img" style="background-image: url({{asset('common/img/how-its-work.png')}});">
						</div>
						<div class="how-its-work-content">
							<h3 class="how-its-work-tit">{{tr('secure_payments')}}</h3>
							<p class="how-its-work-txt">{{tr('how_it_works_content')}}</p>
						</div>
					</div>
				</div>
				<!-- End of how its work box -->
				<!-- How its work box -->
				<div class="how-its-work-col col-lg-4 col-md-4 col-sm-6 col-xs-12">
					<div class="how-its-work-box text-center">
						<div class="how-its-work-icon bg-img" style="background-image: url({{asset('common/img/how-its-work.png')}});">
						</div>
						<div class="how-its-work-content">
							<h3 class="how-its-work-tit">{{tr('transparent_pricing')}}</h3>
							<p class="how-its-work-txt">{{tr('how_it_works_content')}}</p>
						</div>
					</div>
				</div>
				<!-- End of how its work box -->
				<!-- How its work box -->
				<div class="how-its-work-col col-lg-4 col-md-4 col-sm-6 col-xs-12">
					<div class="how-its-work-box text-center">
						<div class="how-its-work-icon bg-img" style="background-image: url({{asset('common/img/how-its-work.png')}});">
						</div>
						<div class="how-its-work-content">
							<h3 class="how-its-work-tit">{{tr('cancellation_policy')}}</h3>
							<p class="how-its-work-txt">{{tr('how_it_works_content')}}</p>
						</div>
					</div>
				</div>
				<!-- End of how its work box -->
			</div>
		</div>
		<!-- END OF PAYMENTS SECTION -->
		

		<!-- HOW ITS WORK SECTION
		====================================== -->
		<div class="how-its-work row m-0 gray-bg  p-30">
			<div class="container">
				<!-- How its work box -->
				<div class="how-its-work-col col-lg-4 col-md-4 col-sm-6 col-xs-12">
					<div class="how-its-work-box text-center">
						<div class="magazine-img bg-img" style="background-image: url({{asset('common/img/how-its-work1.png')}});">
						</div>
						<div class="how-its-work-content">
							<h3 class="how-its-work-tit">{{tr('pick_task')}}</h3>
							<p class="how-its-work-txt">{{tr('how_it_works_content')}}</p>
						</div>
					</div>
				</div>
				<!-- End of how its work box -->
				<!-- How its work box -->
				<div class="how-its-work-col col-lg-4 col-md-4 col-sm-6 col-xs-12">
					<div class="how-its-work-box text-center">
						<div class="magazine-img bg-img" style="background-image: url({{asset('common/img/how-its-work3.png')}});">
						</div>
						<div class="how-its-work-content">
							<h3 class="how-its-work-tit">{{tr('pick_task')}}</h3>
							<p class="how-its-work-txt">{{tr('how_it_works_content')}}</p>
						</div>
					</div>
				</div>
				<!-- End of how its work box -->
				<!-- How its work box -->
				<div class="how-its-work-col col-lg-4 col-md-4 col-sm-6 col-xs-12">
					<div class="how-its-work-box text-center">
						<div class="magazine-img bg-img" style="background-image: url({{asset('common/img/how-its-work3.png')}});">
						</div>
						<div class="how-its-work-content">
							<h3 class="how-its-work-tit">{{tr('pick_task')}}</h3>
							<p class="how-its-work-txt">{{tr('how_it_works_content')}}</p>
						</div>
					</div>
				</div>
				<!-- End of how its work box -->
			</div>
		</div>
		<!-- END OF HOW ITS WORK SECTION -->

</div>

@endsection