@extends('clientside.layouts.app')
@section('content')
<section class="section_common inner_banner">
  <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner">
      <div class="carousel-item active" style="background:url('../clientside/img/blog_slide1.jpg')">
      <img src="" alt="../clientside/img/blog_slide1.jpg" class="w-100 banner_inner_image">
        <div class="carousel-caption d-none d-flex justify-content-center align-items-center">
          <div class=" wow fadeInUp">
            <h5>Events to remember</h5> 
            <h2>Cherish your each moments</h2>
            <h6>Lorem Ipsum is simply dummy text</h6>
          </div>
        </div>
      </div>
      <div class="carousel-item" style="background:url('../clientside/img/blog_slide1.jpg')">
      <img alt="" src="../clientside/img/blog_slide1.jpg" alt="" class="w-100 banner_inner_image">
        <div class="carousel-caption d-none d-flex justify-content-center align-items-center">
          <div class=" wow fadeInUp">
            <h5>Blog</h5>
            <h2>something more from our blog</h2>
            <h6>Lorem Ipsum is simply dummy text</h6>
          </div>
        </div>
      </div>
      </div>
    @if($i !=1)
    <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
      <img src="{{ asset('clientside/img/arr_left.png') }}" alt="">
    </a> 
    <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
      <img src="{{ asset('clientside/img/arr_right.png') }}" alt="">
    </a>
    @endif
  </div>
  <a href="#" class="scroll_more next-section"> <img alt="" src="{{ asset('clientside/img/circle_white.png') }}" class="circle"> <img alt="" src="{{ asset('clientside/img/arrow_white.png') }}" class="arrow"> </a> 
</section>
<section class="section_common even_list_sec" style="background:url('../clientside/img/blog_sec2_bg.jpg') no-repeat">
  <div class="container-fluid">  
    <div class="row">
      <div class="col-12 text-center wow fadeInDown">
        <h3 class="section_title2 mb-5">We Are here to Explore more</h3>
      </div>
      
      <div class="col-md-4 wow fadeInUp">
        <div class="event_thumb blog_thumb"> 
          <div class="thumb_image"> <img src="{{ asset('clientside/img/blog1.jpg') }}" alt="" class="w-100"> </div>
          <div class="caption">
          	<div class="d-flex mb-3">
            	<span class="date_blog">20 october 2021</span>
                <span class="blog_user ml-auto">John doe</span>
            </div>            
            <h4>It is a long established fact that a reader will be distracted..</h4>
            <div class="d-flex justify-content-end"><a href="#" class="btn btn-primary">READ MORE</a> </div>
          </div>
        </div>
      </div>
      
      <div class="col-md-4 wow fadeInUp">
        <div class="event_thumb blog_thumb">
          <div class="thumb_image"> <img src="{{ asset('clientside/img/blog2.jpg') }}" alt="" class="w-100"> </div>
          <div class="caption">
          	<div class="d-flex mb-3">
            	<span class="date_blog">20 october 2021</span>
                <span class="blog_user ml-auto">John doe</span>
            </div>            
            <h4>Lorem Ipsum is simply dummy text of the printing and typesetting..</h4>
            <div class="d-flex justify-content-end"><a href="#" class="btn btn-primary">READ MORE</a> </div>
          </div>
        </div>
      </div>
      
      <div class="col-md-4 wow fadeInUp">
        <div class="event_thumb blog_thumb">
          <div class="thumb_image"> <img src="{{ asset('clientside/img/blog3.jpg') }}" alt="" class="w-100"> </div>
          <div class="caption">
          	<div class="d-flex mb-3">
            	<span class="date_blog">20 october 2021</span>
                <span class="blog_user ml-auto">John doe</span>
            </div>            
            <h4>Many desktop publishing packages and web page editors..</h4>
            <div class="d-flex justify-content-end"><a href="#" class="btn btn-primary">READ MORE</a> </div>
          </div>
        </div>
      </div>
      
      <div class="col-md-4 wow fadeInUp">
        <div class="event_thumb blog_thumb">
          <div class="thumb_image"> <img src="{{ asset('clientside/img/blog4.jpg') }}" alt="" class="w-100"> </div>
          <div class="caption">
          	<div class="d-flex mb-3">
            	<span class="date_blog">20 october 2021</span>
                <span class="blog_user ml-auto">John doe</span>
            </div>            
            <h4>There are many variations of passages of Lorem Ipsum available,..</h4>
            <div class="d-flex justify-content-end"><a href="#" class="btn btn-primary">READ MORE</a> </div>
          </div>
        </div>
      </div>
      
      <div class="col-md-4 wow fadeInUp">
        <div class="event_thumb blog_thumb">
          <div class="thumb_image"> <img src="{{ asset('clientside/img/blog5.jpg') }}" alt="" class="w-100"> </div>
          <div class="caption">
          	<div class="d-flex mb-3">
            	<span class="date_blog">20 october 2021</span>
                <span class="blog_user ml-auto">John doe</span>
            </div>            
            <h4>The standard chunk of Lorem Ipsum used since the 1500s is..</h4>
            <div class="d-flex justify-content-end"><a href="#" class="btn btn-primary">READ MORE</a> </div>
          </div>
        </div>
      </div>
      
      <div class="col-md-4 wow fadeInUp">
        <div class="event_thumb blog_thumb">
          <div class="thumb_image"> <img src="{{ asset('clientside/img/blog6.jpg') }}" alt="" class="w-100"> </div>
          <div class="caption">
          	<div class="d-flex mb-3">
            	<span class="date_blog">20 october 2021</span>
                <span class="blog_user ml-auto">John doe</span>
            </div>            
            <h4>All the Lorem Ipsum generators on the Internet tend to repeat..</h4>
            <div class="d-flex justify-content-end"><a href="#" class="btn btn-primary">READ MORE</a> </div>
          </div>
        </div>
      </div>
      
      
      
    </div>
  </div>
</section>
@endsection