---
title: Post Thumbnail
body_class: page-email page-email-thumbnail
---

{{#extend "layout-default"}}

  {{#content "css" mode="prepend"}}
    <link rel="stylesheet" href="{{assets}}/examples/css/pages/email.css">
  {{/content}}


  {{#content "body"}}

    <!-- Page -->
    <div class="page">
      <div class="page-content">
        <!-- Panel -->
        <div class="panel">
          <div class="panel-body container-fluid">
            <div class="email-title">
              <img src="{{assets}}//images/logo-colored.png" alt="..." />
              <h4 class="blue-grey-400 font-weight-400">Remark</h4>
            </div>
            <!-- Card List -->
            <div class="card-list mt-20">
              <div class="card card-list-item">
                <div class="card-img-left">
                  <div class="cover-background" style="background-image: url('{{global}}/photos/placeholder.png')"></div>
                </div>
                <div class="card-block">
                  <p class="card-text">
                    <small>
                      <span class="card-author">June Lane</span> /
                      <span class="card-category">News</span> /
                      <span class="card-time">Jun 21, 2017</span>
                    </small>
                  </p>
                  <h4 class="card-title">Plurimum attico latine</h4>
                  <p class="card-text">Pervenias fatendum epicureis parentes tollit nostra levis homini
                    quietus affirmatis, temperantiamque suscepi electram effectrices
                    miser nomini expetendam istis. Aristippi idque. </p>
                </div>
                <div class="card-block clearfix">
                  <div class="card-actions float-left">
                    <a href="javascript:void(0)">
                  <i class="icon md-share"></i>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-heart"></i>
                  <span>21</span>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-chat"></i>
                  <span>35</span>
                </a>
                  </div>
                  <a class="btn btn-outline btn-default card-link float-right" href="javascript:void(0)">
                <i class="icon md-chevron-right"></i> Read More
              </a>
                </div>
              </div>
              <div class="card card-list-item">
                <div class="card-img-left">
                  <div class="cover-background" style="background-image: url('{{global}}/photos/placeholder.png')"></div>
                </div>
                <div class="card-block">
                  <p class="card-text">
                    <small>
                      <span class="card-author">June Lane</span> /
                      <span class="card-category">News</span> /
                      <span class="card-time">Jun 21, 2017</span>
                    </small>
                  </p>
                  <h4 class="card-title">Plurimum attico latine</h4>
                  <p class="card-text">Pervenias fatendum epicureis parentes tollit nostra levis homini
                    quietus affirmatis, temperantiamque suscepi electram effectrices
                    miser nomini expetendam istis. Aristippi idque. </p>
                </div>
                <div class="card-block clearfix">
                  <div class="card-actions float-left">
                    <a href="javascript:void(0)">
                  <i class="icon md-share"></i>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-heart"></i>
                  <span>21</span>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-chat"></i>
                  <span>35</span>
                </a>
                  </div>
                  <a class="btn btn-outline btn-default card-link float-right" href="javascript:void(0)">
                <i class="icon md-chevron-right"></i> Read More
              </a>
                </div>
              </div>
              <div class="card card-list-item">
                <div class="card-img-left">
                  <div class="cover-background" style="background-image: url('{{global}}/photos/placeholder.png')"></div>
                </div>
                <div class="card-block">
                  <p class="card-text">
                    <small>
                      <span class="card-author">June Lane</span> /
                      <span class="card-category">News</span> /
                      <span class="card-time">Jun 21, 2017</span>
                    </small>
                  </p>
                  <h4 class="card-title">Plurimum attico latine</h4>
                  <p class="card-text">Pervenias fatendum epicureis parentes tollit nostra levis homini
                    quietus affirmatis, temperantiamque suscepi electram effectrices
                    miser nomini expetendam istis. Aristippi idque. </p>
                </div>
                <div class="card-block clearfix">
                  <div class="card-actions float-left">
                    <a href="javascript:void(0)">
                  <i class="icon md-share"></i>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-heart"></i>
                  <span>21</span>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-chat"></i>
                  <span>35</span>
                </a>
                  </div>
                  <a class="btn btn-outline btn-default card-link float-right" href="javascript:void(0)">
                <i class="icon md-chevron-right"></i> Read More
              </a>
                </div>
              </div>
              <div class="card card-list-item">
                <div class="card-img-left">
                  <div class="cover-background" style="background-image: url('{{global}}/photos/placeholder.png')"></div>
                </div>
                <div class="card-block">
                  <p class="card-text">
                    <small>
                      <span class="card-author">June Lane</span> /
                      <span class="card-category">News</span> /
                      <span class="card-time">Jun 21, 2017</span>
                    </small>
                  </p>
                  <h4 class="card-title">Plurimum attico latine</h4>
                  <p class="card-text">Pervenias fatendum epicureis parentes tollit nostra levis homini
                    quietus affirmatis, temperantiamque suscepi electram effectrices
                    miser nomini expetendam istis. Aristippi idque. </p>
                </div>
                <div class="card-block clearfix">
                  <div class="card-actions float-left">
                    <a href="javascript:void(0)">
                  <i class="icon md-share"></i>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-heart"></i>
                  <span>21</span>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-chat"></i>
                  <span>35</span>
                </a>
                  </div>
                  <a class="btn btn-outline btn-default card-link float-right" href="javascript:void(0)">
                <i class="icon md-chevron-right"></i> Read More
              </a>
                </div>
              </div>
              <div class="card card-list-item">
                <div class="card-img-left">
                  <div class="cover-background" style="background-image: url('{{global}}/photos/placeholder.png')"></div>
                </div>
                <div class="card-block">
                  <p class="card-text">
                    <small>
                      <span class="card-author">June Lane</span> /
                      <span class="card-category">News</span> /
                      <span class="card-time">Jun 21, 2017</span>
                    </small>
                  </p>
                  <h4 class="card-title">Plurimum attico latine</h4>
                  <p class="card-text">Pervenias fatendum epicureis parentes tollit nostra levis homini
                    quietus affirmatis, temperantiamque suscepi electram effectrices
                    miser nomini expetendam istis. Aristippi idque. </p>
                </div>
                <div class="card-block clearfix">
                  <div class="card-actions float-left">
                    <a href="javascript:void(0)">
                  <i class="icon md-share"></i>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-heart"></i>
                  <span>21</span>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-chat"></i>
                  <span>35</span>
                </a>
                  </div>
                  <a class="btn btn-outline btn-default card-link float-right" href="javascript:void(0)">
                <i class="icon md-chevron-right"></i> Read More
              </a>
                </div>
              </div>
              <div class="card card-list-item">
                <div class="card-img-left">
                  <div class="cover-background" style="background-image: url('{{global}}/photos/placeholder.png')"></div>
                </div>
                <div class="card-block">
                  <p class="card-text">
                    <small>
                      <span class="card-author">June Lane</span> /
                      <span class="card-category">News</span> /
                      <span class="card-time">Jun 21, 2017</span>
                    </small>
                  </p>
                  <h4 class="card-title">Plurimum attico latine</h4>
                  <p class="card-text">Pervenias fatendum epicureis parentes tollit nostra levis homini
                    quietus affirmatis, temperantiamque suscepi electram effectrices
                    miser nomini expetendam istis. Aristippi idque. </p>
                </div>
                <div class="card-block clearfix">
                  <div class="card-actions float-left">
                    <a href="javascript:void(0)">
                  <i class="icon md-share"></i>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-heart"></i>
                  <span>21</span>
                </a>
                    <a href="javascript:void(0)">
                  <i class="icon md-chat"></i>
                  <span>35</span>
                </a>
                  </div>
                  <a class="btn btn-outline btn-default card-link float-right" href="javascript:void(0)">
                <i class="icon md-chevron-right"></i> Read More
              </a>
                </div>
              </div>
            </div>
            <!-- End Card List -->
            <div class="email-more">
              <p>You are currently signed up to Company’s newsletters as: youremail@gmail.com
                to <a class="email-unsubscribe" href="javascript:void(0)">unsubscribe</a></p>
              <div class="email-more-social">
                <a href="javascript:void(0)"><i class="icon bd-twitter" aria-hidden="true"></i></a>
                <a href="javascript:void(0)"><i class="icon bd-facebook" aria-hidden="true"></i></a>
                <a href="javascript:void(0)"><i class="icon bd-linkedin" aria-hidden="true"></i></a>
                <a href="javascript:void(0)"><i class="icon bd-pinterest" aria-hidden="true"></i></a>
              </div>
            </div>
          </div>
        </div>
        <!-- End Panel -->
      </div>
    </div>

  {{/content}}
{{/extend}}