Access_New/parts/blog.php

<!--Blog Section-->
<section class="bg-gradient-quartz-white border-radius-6px lg-border-radius-0px pb-0">
  <div class="container">
    <div class="row justify-content-center mb-3">
      <div class="col-lg-7 text-center appear anime-child anime-complete" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
        <h3 class="text-dark-gray fw-700 ls-minus-1px" style="">Get Every Single Updates</h3>
      </div>
    </div>
    <div class="row mb-5 sm-mb-7">
      <div class="col-12">
        <ul class="blog-grid blog-wrapper grid grid-3col xl-grid-3col lg-grid-3col md-grid-2col sm-grid-2col xs-grid-1col gutter-extra-large appear anime-child anime-complete" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }" style="position: relative; height: 572.953px;">
          <li class="grid-sizer"></li>
          <!-- start blog item -->
          <li class="grid-item" style="position: absolute; left: 0%; top: 0px; transition: none;">
            <div class="card border-0 border-radius-5px box-shadow-quadruple-large box-shadow-quadruple-large-hover">
              <div class="blog-image"> <a href="demo-corporate-blog-single-clean.html" class="d-block"><img src="images/demo-corporate-blog-01.jpg" alt="" data-no-retina=""></a>
                <div class="blog-categories"></div>
              </div>
              <div class="card-body p-8"> <a href="demo-corporate-blog-single-clean.html" class="card-title mb-15px fw-700 fs-19 text-dark-gray d-inline-block w-90 md-w-100">Access Education Network Lights Up Pokhara Street Festival</a>
                
                <div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-14 text-uppercase">
                  <div class="me-auto"> <span class="blog-date d-inline-block fw-700 text-dark-gray">30 August 2021</span>
                    <div class="d-inline-block author-name fw-700 text-dark-gray">By <a href="demo-corporate-blog.html" class="text-dark-gray text-decoration-line-bottom">Den viliamson</a></div>
                  </div>
                  <div class="like-count"> <a href="#"><i class="fa-regular fa-heart text-red"></i><span class="text-dark-gray align-middle fw-700">25</span></a> </div>
                </div>
              </div>
            </div>
          </li>
          <!-- end blog item --> 
			
          <!-- start blog item -->
          <li class="grid-item" style="position: absolute; left: 33.3298%; top: 0px; transition: none;">
            <div class="card border-0 border-radius-5px box-shadow-quadruple-large box-shadow-quadruple-large-hover">
              <div class="blog-image"> <a href="demo-corporate-blog-single-clean.html" class="d-block"><img src="images/demo-corporate-blog-02.jpg" alt="" data-no-retina=""></a>
                <div class="blog-categories">  </div>
              </div>
              <div class="card-body p-12 lg-p-10"> <a href="demo-corporate-blog-single-clean.html" class="card-title mb-15px fw-700 fs-19 text-dark-gray d-inline-block w-90 md-w-100">Access at 19: A Logo for the Legacy, A Vision for Tomorrow</a>
                
                <div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-14 text-uppercase">
                  <div class="me-auto"> <span class="blog-date d-inline-block fw-700 text-dark-gray">28 August 2021</span>
                    <div class="d-inline-block author-name fw-700 text-dark-gray">By <a href="demo-corporate-blog.html" class="text-dark-gray text-decoration-line-bottom">Hugh macleod</a></div>
                  </div>
                  <div class="like-count"> <a href="#"><i class="fa-regular fa-heart text-red"></i><span class="text-dark-gray align-middle fw-700">58</span></a> </div>
                </div>
              </div>
            </div>
          </li>
          <!-- end blog item --> 
          <!-- start blog item -->
          <li class="grid-item" style="position: absolute; left: 66.6597%; top: 0px; transition: none;">
            <div class="card border-0 border-radius-5px box-shadow-quadruple-large box-shadow-quadruple-large-hover">
              <div class="blog-image"> <a href="demo-corporate-blog-single-clean.html" class="d-block"><img src="images/demo-corporate-blog-03.jpg" alt="" data-no-retina=""></a>
                <div class="blog-categories">  </div>
              </div>
              <div class="card-body p-12 lg-p-10"> <a href="demo-corporate-blog-single-clean.html" class="card-title mb-15px fw-700 fs-19 text-dark-gray d-inline-block w-90 md-w-100">Be the strong willed one the public relationship.</a>
                
                <div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-14 text-uppercase">
                  <div class="me-auto"> <span class="blog-date d-inline-block fw-700 text-dark-gray">26 August 2021</span>
                    <div class="d-inline-block author-name fw-700 text-dark-gray">By <a href="demo-corporate-blog.html" class="text-dark-gray text-decoration-line-bottom">Walton smith</a></div>
                  </div>
                  <div class="like-count"> <a href="#"><i class="fa-regular fa-heart text-red"></i><span class="text-dark-gray align-middle fw-700">75</span></a> </div>
                </div>
              </div>
            </div>
          </li>
          <!-- end blog item -->
        </ul>
      </div>
    </div>
  </div>
</section>
<!--Blog Section End-->