@extends('frontend.layouts.app')

@section('title') Blogs- {{ config('app.name') }} @endsection

@section('content')
<!-- ================================
    START BREADCRUMB AREA
================================= -->
    <section class="breadcrumb-area bread-bg">
      <div class="overlay"></div>
      <!-- end overlay -->
      <div class="container">
        <div class="breadcrumb-content text-center">
          <h2 class="sec__title text-white mb-3">Blog </h2>
          <ul class="bread-list">
            <li><a href="index.html">home</a></li>
            <li>Blog</li>
    
          </ul>
        </div>
        <!-- end breadcrumb-content -->
      </div>
      <!-- end container -->
      <div class="bread-svg">
        <svg viewBox="0 0 500 150" preserveAspectRatio="none">
          <path
            d="M-4.22,89.30 C280.19,26.14 324.21,125.81 511.00,41.94 L500.00,150.00 L0.00,150.00 Z"
          ></path>
        </svg>
      </div>
      <!-- end bread-svg -->
    </section>
    <!-- end breadcrumb-area -->
    <!-- ================================
    END BREADCRUMB AREA
================================= -->

<!-- ================================
       START BLOG AREA
================================= -->
    <section class="blog-area padding-top-60px padding-bottom-70px">
      <div class="container">
        <div class="row">
          <div class="col-lg-8 mb-5">
            <div class="row">
              <div class="col-lg-6 col-md-6">
                <div class="card hover-y">
                  <a href="#" class="card-image">
                    <img
                      src="images/img-loading.jpg"
                      data-src="images/img1.jpg"
                      alt="blog image"
                      class="card-img-top lazy"
                    />
                  </a>
                  <div class="card-body">
                    <h4 class="card-title">
                      <a href="#"
                        >50 Greatest Event Places in United Kingdom</a
                      >
                    </h4>
                    <ul class="card-meta d-flex flex-wrap align-items-center">
                      <li>25 Dec, 2018</li>
                    
                    </ul>
                    <p class="card-text mt-3">
                      Sed ut perspiciatis unde omnis iste natus error sit
                      voluptatem eaque ipsa quae ab illo inventore
                    </p>
                    <div
                      class="post-author d-flex align-items-center justify-content-between mt-3"
                    >
                      <div>
                        <img src="images/testi-img7.jpg" alt="" />
                        <span>By</span>
                        <a href="#">Technicul cloud LLP</a>
                      </div>
                      <a href="#" class="btn btn-danger text-white">Read more</a>
                    </div>
                  </div>
                  <!-- end card-body -->
                </div>
                <!-- end card -->
              </div>
              <!-- end col-lg-6 -->
              <div class="col-lg-6 col-md-6">
                <div class="card hover-y">
                  <a href="#" class="card-image">
                    <img
                      src="images/img-loading.jpg"
                      data-src="images/img2.jpg"
                      alt="blog image"
                      class="card-img-top lazy"
                    />
                  </a>
                  <div class="card-body">
                    <h4 class="card-title">
                      <a href="#"
                        >Top 10 Best Clothing Shops In Sydney</a
                      >
                    </h4>
                    <ul class="card-meta d-flex flex-wrap align-items-center">
                      <li>25 Dec, 2018</li>
                    
                    </ul>
                    <p class="card-text mt-3">
                      Sed ut perspiciatis unde omnis iste natus error sit
                      voluptatem eaque ipsa quae ab illo inventore
                    </p>
                    <div
                      class="post-author d-flex align-items-center justify-content-between mt-3"
                    >
                      <div>
                        <img src="images/testi-img7.jpg" alt="" />
                        <span>By</span>
                        <a href="#">Technicul cloud LLP</a>
                      </div>
                      <a href="#" class="btn btn-danger text-white">Read more</a>
                    </div>
                  </div>
                  <!-- end card-body -->
                </div>
                <!-- end card -->
              </div>
              <!-- end col-lg-6 -->
              <div class="col-lg-6 col-md-6">
                <div class="card hover-y">
                  <a href="#" class="card-image">
                    <img
                      src="images/img-loading.jpg"
                      data-src="images/img3.jpg"
                      alt="blog image"
                      class="card-img-top lazy"
                    />
                  </a>
                  <div class="card-body">
                    <h4 class="card-title">
                      <a href="#"
                        >Top 15 Greatest Hotels In United States</a
                      >
                    </h4>
                    <ul class="card-meta d-flex flex-wrap align-items-center">
                      <li>25 Dec, 2018</li>
                    
                    </ul>
                    <p class="card-text mt-3">
                      Sed ut perspiciatis unde omnis iste natus error sit
                      voluptatem eaque ipsa quae ab illo inventore
                    </p>
                    <div
                      class="post-author d-flex align-items-center justify-content-between mt-3"
                    >
                      <div>
                        <img src="images/testi-img7.jpg" alt="" />
                        <span>By</span>
                        <a href="#">Technicul cloud LLP</a>
                      </div>
                      <a href="#" class="btn btn-danger text-white">Read more</a>
                    </div>
                  </div>
                  <!-- end card-body -->
                </div>
                <!-- end card -->
              </div>
              <!-- end col-lg-6 -->
              <div class="col-lg-6 col-md-6">
                <div class="card hover-y">
                  <a href="#" class="card-image">
                    <img
                      src="images/img-loading.jpg"
                      data-src="images/img1.jpg"
                      alt="blog image"
                      class="card-img-top lazy"
                    />
                  </a>
                  <div class="card-body">
                    <h4 class="card-title">
                      <a href="#"
                        >50 Greatest Event Places in United Kingdom</a
                      >
                    </h4>
                    <ul class="card-meta d-flex flex-wrap align-items-center">
                      <li>25 Dec, 2018</li>
                    
                    </ul>
                    <p class="card-text mt-3">
                      Sed ut perspiciatis unde omnis iste natus error sit
                      voluptatem eaque ipsa quae ab illo inventore
                    </p>
                    <div
                      class="post-author d-flex align-items-center justify-content-between mt-3"
                    >
                      <div>
                        <img src="images/testi-img7.jpg" alt="" />
                        <span>By</span>
                        <a href="#">Technicul cloud LLP</a>
                      </div>
                      <a href="#" class="btn btn-danger text-white">Read more</a>
                    </div>
                  </div>
                  <!-- end card-body -->
                </div>
                <!-- end card -->
              </div>
              <!-- end col-lg-6 -->
              <div class="col-lg-6 col-md-6">
                <div class="card hover-y">
                  <a href="#" class="card-image">
                    <img
                      src="images/img-loading.jpg"
                      data-src="images/img2.jpg"
                      alt="blog image"
                      class="card-img-top lazy"
                    />
                  </a>
                  <div class="card-body">
                    <h4 class="card-title">
                      <a href="#"
                        >Top 10 Best Clothing Shops In Sydney</a
                      >
                    </h4>
                    <ul class="card-meta d-flex flex-wrap align-items-center">
                      <li>25 Dec, 2018</li>
                    
                    </ul>
                    <p class="card-text mt-3">
                      Sed ut perspiciatis unde omnis iste natus error sit
                      voluptatem eaque ipsa quae ab illo inventore
                    </p>
                    <div
                      class="post-author d-flex align-items-center justify-content-between mt-3"
                    >
                      <div>
                        <img src="images/testi-img7.jpg" alt="" />
                        <span>By</span>
                        <a href="#">Technicul cloud LLP</a>
                      </div>
                      <a href="#" class="btn btn-danger text-white">Read more</a>
                    </div>
                  </div>
                  <!-- end card-body -->
                </div>
                <!-- end card -->
              </div>
              <!-- end col-lg-6 -->
              <div class="col-lg-6 col-md-6">
                <div class="card hover-y">
                  <a href="#" class="card-image">
                    <img
                      src="images/img-loading.jpg"
                      data-src="images/img3.jpg"
                      alt="blog image"
                      class="card-img-top lazy"
                    />
                  </a>
                  <div class="card-body">
                    <h4 class="card-title">
                      <a href="#"
                        >Top 15 Greatest Hotels In United States</a
                      >
                    </h4>
                    <ul class="card-meta d-flex flex-wrap align-items-center">
                      <li>25 Dec, 2018</li>
                    
                    </ul>
                    <p class="card-text mt-3">
                      Sed ut perspiciatis unde omnis iste natus error sit
                      voluptatem eaque ipsa quae ab illo inventore
                    </p>
                    <div
                      class="post-author d-flex align-items-center justify-content-between mt-3"
                    >
                      <div>
                        <img src="images/testi-img7.jpg" alt="" />
                        <span>By</span>
                        <a href="#">Technicul cloud LLP</a>
                      </div>
                      <a href="#" class="btn btn-danger text-white">Read more</a>
                    </div>
                  </div>
                  <!-- end card-body -->
                </div>
                <!-- end card -->
              </div>
              <!-- end col-lg-6 -->
            </div>
            <!-- end row -->
            <nav aria-label="Page navigation example">
              <ul class="pagination justify-content-center pagination-list">
                <li class="page-item">
                  <a class="page-link" href="#" aria-label="Previous">
                    <span aria-hidden="true" class="fal fa-angle-left"></span>
                    <span class="sr-only">Previous</span>
                  </a>
                </li>
                <li class="page-item active">
                  <a class="page-link" href="#">1</a>
                </li>
                <li class="page-item"><a class="page-link" href="#">2</a></li>
                <li class="page-item"><a class="page-link" href="#">3</a></li>
                <li class="page-item">
                  <a class="page-link" href="#" aria-label="Next">
                    <span aria-hidden="true" class="fal fa-angle-right"></span>
                    <span class="sr-only">Next</span>
                  </a>
                </li>
              </ul>
            </nav>
          </div>
          <!-- end col-lg-8 -->
          <div class="col-lg-4">
            <div class="sidebar">
              <div class="card">
                <div class="card-body">
                  <h4 class="card-title mb-3">Search</h4>
                  <div class="form-group">
                    <span class="fal fa-search form-icon"></span>
                    <input
                      class="form-control form--control"
                      type="text"
                      placeholder="What are you looking for?"
                    />
                  </div>
                  <!-- end form-group -->
                  <button class="theme-btn border-0 w-100" type="submit">
                    Search
                  </button>
                </div>
                <!-- end card-body -->
              </div>
              <!-- end card -->
              <div class="card">
                <div class="card-body">
                  <h4 class="card-title mb-3">Post Tags</h4>
                  <ul class="tag-list">
                    <li><a href="#">Free Sub Domain</a></li>
                    <li><a href="#">Free Hosting Service</a></li>
                    <li><a href="#">Gbusiness</a></li>
                    <li><a href="#">Global Business</a></li>
                    <li><a href="#">Salon</a></li>
                    <li><a href="#">Cleaning</a></li>
                    <li><a href="#">Fashion</a></li>
                  </ul>
                </div>
                <!-- end card-body -->
              </div>
              <!-- end card -->
                  <div class="card">
                <div class="card-body">
                  <h4 class="card-title mb-3">Categories</h4>
                  <ul class="tag-list">
                    <li><a href="#">Listing</a></li>
                    <li><a href="#">Domain Hosting</a></li>
                    <li><a href="#">Business Promotion</a></li>
                    <li><a href="#">Domain</a></li>
                   
                  </ul>
                </div>
                <!-- end card-body -->
              </div>
              <!-- end card -->
              <div class="card">
                <div class="card-body">
                  <h4 class="card-title mb-3">Popular Posts</h4>
                  <ul class="media-list">
                    <li class="media media-card">
                      <a
                        href="#"
                        class="flex-shrink-0 me-3 d-block"
                      >
                        <img src="images/small-img.jpg" alt="Blog image" />
                      </a>
                      <div class="media-body align-self-center">
                        <h5 class="media-title mb-1">
                          <a href="#"
                            >The best sale marketer of the next year</a
                          >
                        </h5>
                        <p class="font-size-15">20 Jan, 2021</p>
                      </div>
                    </li>
                    <li class="media media-card my-4">
                      <a
                        href="#"
                        class="flex-shrink-0 me-3 d-block"
                      >
                        <img src="images/small-img.jpg" alt="Blog image" />
                      </a>
                      <div class="media-body align-self-center">
                        <h5 class="media-title mb-1">
                          <a href="#"
                            >The best sale marketer of the next year</a
                          >
                        </h5>
                        <p class="font-size-15">20 Jan, 2021</p>
                      </div>
                    </li>
                    <li class="media media-card">
                      <a
                        href="#"
                        class="flex-shrink-0 me-3 d-block"
                      >
                        <img src="images/small-img.jpg" alt="Blog image" />
                      </a>
                      <div class="media-body align-self-center">
                        <h5 class="media-title mb-1">
                          <a href="#"
                            >The best sale marketer of the next year</a
                          >
                        </h5>
                        <p class="font-size-15">20 Jan, 2021</p>
                      </div>
                    </li>
                  </ul>
                </div>
                <!-- end card-body -->
              </div>
              <!-- end card -->
              <div class="card">
                <div class="card-body">
                  <h4 class="card-title mb-3">Archive</h4>
                  <ul class="tag-list">
                    <li><a href="#">03 May 2022</a></li>
                    <li><a href="#">04 May 2022</a></li>
                    <li><a href="#">14 Aug 2024</a></li>
                    <li><a href="#">30 May 2025</a></li>
                    <li><a href="#">04 May 2024</a></li>
                    <li><a href="#">14 Aug 2025</a></li>
                  </ul>
                </div>
                <!-- end card-body -->
              </div>
              <!-- end card -->
            </div>
            <!-- end sidebar -->
          </div>
          <!-- end col-lg-4 -->
        </div>
        <!-- end row -->
      </div>
      <!-- end container -->
    </section>
    <!-- end blog-area -->
    <!-- ================================
       START BLOG AREA
================================= -->



     <!-- ================================
    START CTA AREA
================================= -->
    <section class="cta-area bg-dark padding-top-60px padding-bottom-60px">
      <div class="container">
        <div
          class="d-flex flex-wrap align-items-center justify-content-between"
        >
          <div class="section-heading py-3">
            <h2 class="mb-3 text-white font-size-28 font-weight-bold">
              Dirto is the best way to find & discover <br />
              great local businesses
            </h2>
            <p class="font-size-17 text-white">
              Morbi convallis bibendum urna ut viverra. Maecenas quis consequat
              libero
            </p>
          </div>
          <!-- end section-heading -->
          <a href="#" class="theme-btn">Create Account</a>
        </div>
        <!-- end d-flex -->
      </div>
      <!-- end container -->
    </section>
    <!-- end cta-area -->
    <!-- ================================
    END CTA AREA
================================= -->

@endsection