<!--Block start-->
                  <div class="block-area">
                    <!--block title-->
                    <div class="block-title-6">
                      <h4 class="h5 border-primary">
                        <span class="bg-primary text-white">Sports</span>
                      </h4>
                    </div>
                    <!--block content-->
                    <div class="row">
                      <div class="col-lg-6">
                        <!-- big post -->
                        <div class="big-post">
                          <article class="card card-full hover-a">
                            <!--thumbnail & category-->
                            <div class="ratio_360-202 image-wrapper">
                              <a href="#">
                                <img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/360x202/img5.jpg" alt="Image description">
                              </a>
                              <a class="position-absolute m-2 t-0 p-1 badge badge-primary rounded-0" href="#">Moto GP</a>
                            </div>
                            <div class="card-body">
                              <!--title-->
                              <h2 class="card-title h1-sm h3-lg">
                                <a href="#">Motorcycles Feature Heavily In Three New Blockbuster Movies</a>
                              </h2>
                            </div>
                          </article>
                        </div>
                        <!-- sub card -->
                        <div class="sub-card">
                          <!--post list-->
                          <ul class="list-unstyled card-list border-bottom-last-0">
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">Bosch Wants To Put Rockets On Your Motorcycle</a>
                            </li>
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">How To Navigate The Spring Motorcycle Show Schedule</a>
                            </li>
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">Valentino Rossi’s 2019 AGV Pista GP R Helmet Unveiled In Qatar</a>
                            </li>
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">A Return To Indian's New Head Of Design Ola Stenegärd's Roots</a>
                            </li>
                          </ul>
                          <!--end post list-->
                        </div>
                        <!-- end sub card -->
                      </div>
                      <div class="col-lg-6">
                        <!-- big post -->
                        <div class="big-post">
                          <article class="card card-full hover-a">
                            <!--thumbnail & category-->
                            <div class="ratio_360-202 image-wrapper">
                              <a href="#">
                                <img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/360x202/img2.jpg" alt="Image description">
                              </a>
                              <a class="position-absolute m-2 t-0 p-1 badge badge-primary" href="#">Football</a>
                            </div>
                            <div class="card-body">
                              <!--title-->
                              <h2 class="card-title h1-sm h3-lg">
                                <a href="#">The Honda Gold Wing Is A Bike For The Ages, Not Just The Aged</a>
                              </h2>
                            </div>
                          </article>
                        </div>
                        <!-- sub card -->
                        <div class="sub-card">
                          <!--post list-->
                          <ul class="list-unstyled card-list border-bottom-last-0">
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">All Custom Motorcycle Roads Lead To The Petersen Museum</a>
                            </li>
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">Valerie Thompson Survives 343-mph Crash In Australia</a>
                            </li>
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">Exclusive Previews Of Two Outlier’s Guild Moto Show Custom Bikes</a>
                            </li>
                            <li>
                              <a class="h6 h5-sm h6-md" href="#">Cycle World Magazine Gets A Full Rebuild</a>
                            </li>
                          </ul>
                          <!--end post list-->
                        </div>
                        <!-- end sub card -->
                      </div>
                    </div>
                    <!--end block content-->
                  </div>
                  <!--End Block-->
                
              

This block component is same like block content 19, just add block color in block-area classes

                
                  <!-- Block start -->
                  <div class="block-area block-info">
                  ....
                  ....
                  </div>
                  <!--End Block-->