@extends('layouts.beforelogin')
@section('content')
<section class="home-top">
    <div class="container">
				   @if (session('status'))
					<div class="alert alert-success">
						{{ session('status') }}
					</div>
                    @endif
                    @if(session()->has('message'))
                        <div class="alert alert-success">
                            {{ session()->get('message') }}
                        </div>
                    @endif
                    @if(Session::get('message_block'))
                        <div class="alert alert-danger">
                           {{ Session::get('message_block') }}
                        </div>
                    @endif
		<div class="banner-content-home">
			<div class="row justify-content-center">
				<div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
					<div class="banner-home-text">
						<h1>India’s #1 portal for finance & Commerce students & professionals</h1>
						<div class="get-st-sec">
							<div class="get-st-num">
								<input type="number" placeholder="Your Mobile Number"/>
							</div>
							<div class="get-st-btn">
								<input type="submit" value="Get Started"/>
							</div>
						</div>
					</div>

				</div>
			</div>
			<div class="bottom-banner">
				<div class="container">
				<div class="row justify-content-center">
					<div class="col-12 col-sm-12 col-md-12 col-lg-11 col-xl-11">
					<div class="bottom-ban-boxes">
						<div  class="row justify-content-center">
							<div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">
								<div class="bottom-box-1">
									<div class="box-text">
										<h6>Build Your Skills</h6>
										<p>Explore and Learn the right skills to pursue your career plans.</p>
									</div>
									<img src="{{asset('images/build-skill-man.png')}}"/>
								</div>
							</div>
							<div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">
								<div class="bottom-box-2">
									<div class="box-text">
										<h6>Find Finance Jobs</h6>
										<p>Discover and apply for jobs that suit your aspirations and skill profiles.</p>
									</div>
									<img src="{{asset('images/ban-lady.png')}}"/>
								</div>
							</div>
							<div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">
							<div class="bottom-box-3">
								<div class="box-text">
										<h6>Discover Your Path</h6>
										<p>Talk to our conuselllers to build a career path that suits you.</p>
								</div>
								<img src="{{asset('images/3rd-man-cmt.png')}}"/>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	</div>
 </section>
 <!-- <section class="bottom-strip">
	<div class="container">
		<div class="row justify-content-center">
			<div class="col-12 col-sm-12 col-md-9 col-lg-9 col-xl-9">
				<div class="bottom-strip-content">
					<div class="row">
						<div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">
							<a href="javascript:void();" data-toggle="modal" data-target=".nolink">
							<div class="strip-box">
								<img src="{{asset('images/home-strip1.png')}}"/>
								<div class="strip-box-text">
									<h6>For employers & recruiters</h6>
									<i class="fas fa-arrow-right"></i>
								</div>
							</div>
							</a>
						</div>
						<div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">
							<a href="javascript:void();" data-toggle="modal" data-target=".nolink">
							<div class="strip-box">
								<img src="{{asset('images/strip2.png')}}"/>
								<div class="strip-box-text">
									<h6>For academic institutions</h6>
									<i class="fas fa-arrow-right"></i>
								</div>
							</div>
							</a>
						</div>
						<div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">
							<a href="javascript:void();" data-toggle="modal" data-target=".nolink">
							<div class="strip-box">
								<img src="{{asset('images/strip3.png')}}"/>
								<div class="strip-box-text">
									<h6>For career counsellors</h6>
									<i class="fas fa-arrow-right"></i>
								</div>
							</div>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
 </section>
 <section class="preference-tab">
	<div class="container">
		<div class="row">
			<div class="col-12 col-sm-12 col-md-12 col-lg-11 col-xl-11">
				<div class="preference-tab-content">
					<h1>Find your preference</h1>
					<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been
					the industry's standard dummy text ever since the 1500s</p>
				</div>
				<div class="middle-home-tab">
					<div class="row">
						<div class="col-12 col-sm-12 col-md-3 col-lg-3 col-xl-3">
							<div class="left-home-tab">
								<ul class="nav nav-tabs" role="tablist">
									  <li>
										<a class="active" data-toggle="tab" href="#tabs-1" role="tab"> <i class="fas fa-graduation-cap"></i> Popular Courses <span> <i class="fas fa-arrow-right"></i></span></a>
									  </li>
									  <li>
										<a data-toggle="tab" href="#tabs-2" role="tab"> <i class="fas fa-briefcase"></i> Most Recent Jobs <span> <i class="fas fa-arrow-right"></span></i></a>
									  </li>
									  <li>
										<a data-toggle="tab" href="#tabs-3" role="tab"><i class="fas fa-users"></i> Popular Counselors <span> <i class="fas fa-arrow-right"></i> </span></a>
									  </li>
									</ul>
							</div>
						</div>
						<div class="col-12 col-sm-12 col-md-9 col-lg-9 col-xl-9">
							<div class="right-tab-output">
								<div class="tab-content">
									<div class="tab-pane active" id="tabs-1" role="tabpanel">
										<div class="right-tab-content">
										@foreach($Courses as $co)
										<div class="popular-tab-box">
												<img src="