gentux-style-guide/_modules/typography-demo.html

<http://gentuxdesign.com>

---
title: Typography In Use
---

<div class="container-fluid py-5">

<div class="row">
  <div class="col-sm-8 col-sm-offset-1">
    <h1 class="context--copy">
      <div class="h4 mb-1">Our Story</div>
      <div class="domd readable-line">It's Time To Reboot The Black Tie&nbsp;Experience</div>
    </h1>
  </div>
</div>

<div class="row">
  <div class="col-sm-10 col-sm-offset-1 col-lg-8 col-lg-offset-2 body-copy">
    <h2 class="context--copy">Section Title - Headline Level&nbsp;Two</h2>
    <p>
      When it comes to the traditional brick-and-mortar, laminated-catalog, outdated-inventory, advertise-low-and-get-upsold-in-the-store tuxedo rental experience, we are seriously questioning the status quo. And you should&nbsp;too.
    </p>
    <p>
      At Generation Tux, we believe your entire black tie experience should be worthy of the special day you need us for. We’re the first company to dedicate itself to overhauling and improving every aspect of making sure you look amazing for your memorable
      event.
    </p>
    <p>
      Inspired by our visionary founder, George Zimmer, we are a collective of experienced, open-minded, and forward-thinking fashion lovers, engineering geeks,and digital junkies who understand that when you look great, you feel awesome—and then joy happens.
    </p>

    <h3 class="context--copy"> Sub Section Headline H3</h3>
    <p>
      When it comes to the traditional brick-and-mortar, laminated-catalog, outdated-inventory, advertise-low-and-get-upsold-in-the-store tuxedo rental experience, we are seriously questioning the status quo. And you should&nbsp;too.
    </p>
    <h4 class="context--copy"> Sub Sub Section Headline H4</h4>
    <p>
      At Generation Tux, we believe your entire black tie experience should be worthy of the special day you need us for. We’re the first company to dedicate itself to overhauling and improving every aspect of making sure you look amazing for your memorable
      event.
    </p>
    <p>
      Inspired by our visionary founder, George Zimmer, we are a collective of experienced, open-minded, and forward-thinking fashion lovers, engineering geeks,and digital junkies who understand that when you look great, you feel awesome—and then joy happens.
    </p>
    <h5 class="context--copy"> Sub Sub Section Headline H5</h5>
    <p>
      At Generation Tux, we believe your entire black tie experience should be worthy of the special day you need us for. We’re the first company to dedicate itself to overhauling and improving every aspect of making sure you look amazing for your memorable
      event.
    </p>
    <h6 class="context--copy uppercase"> Sub Sub Section Headline H6</h6>
    <p>
      Inspired by our visionary founder, George Zimmer, we are a collective of experienced, open-minded, and forward-thinking fashion lovers, engineering geeks,and digital junkies who understand that when you look great, you feel awesome—and then joy happens.
    </p>
    <h3 class="context--copy"> This is a longer H3 Sub Section headline that will stretch a little further</h3>

    <p>
      When it comes to the traditional brick-and-mortar, laminated-catalog, outdated-inventory, advertise-low-and-get-upsold-in-the-store tuxedo rental experience, we are seriously questioning the status quo. And you should&nbsp;too.
    </p>
    <p>
      At Generation Tux, we believe your entire black tie experience should be worthy of the special day you need us for. We’re the first company to dedicate itself to overhauling and improving every aspect of making sure you look amazing for your memorable
      event.
    </p>
    <ul>
      <li>Ut wisi enim ad minim veniam, quis nostrud exerci tation</li>
      <li>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit</li>
    </ul>
    <p>
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex
      ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit
      augue duis dolore te feugait nulla&nbsp;facilisi.
    </p>
    <h2 class="context--copy uppercase">New Headline Level&nbsp;2</h2>
    <h3 class="context--copy"> Sub Section Headline H3</h3>
    <p>
      When it comes to the traditional brick-and-mortar, laminated-catalog, outdated-inventory, advertise-low-and-get-upsold-in-the-store tuxedo rental experience, we are seriously questioning the status quo. And you should&nbsp;too.
    </p>
    <p>
      <img class="context--copy copy-block img-responsive" src="http://placehold.it/900x300">
    </p>
    <p>
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex
      ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit
      augue duis dolore te feugait nulla&nbsp;facilisi.
    </p>
    <ul>
      <li>Ut wisi enim ad minim veniam, quis nostrud exerci tation</li>
      <li>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit</li>
    </ul>
    <p><img class="context--copy copy-block img-responsive" src="http://placehold.it/900x300"></p>
    <h3 class="context--copy"> Sub Section Headline H3</h3>
    <p>
      When it comes to the traditional brick-and-mortar, laminated-catalog, outdated-inventory, advertise-low-and-get-upsold-in-the-store tuxedo rental experience, we are seriously questioning the status quo. And you should&nbsp;too.
    </p>

    <div class="row">
      <div class="col-sm-4">
        <img class="context--copy img-responsive" src="http://placehold.it/300">
      </div>
      <div class="col-sm-8">
        <h4 class="context--copy">Section Title - Headline Level&nbsp;Two</h4>
        <p>
          When it comes to the traditional brick-and-mortar, laminated-catalog, outdated-inventory, advertise-low-and-get-upsold-in-the-store tuxedo rental experience, we are seriously questioning the status quo. And you should&nbsp;too.
        </p>
        <p>
          At Generation Tux, we believe your entire black tie experience should be worthy of the special day you need us for. We’re the first company to dedicate itself to overhauling and improving every aspect of making sure you look amazing for your memorable
          event.
        </p>
        <p>
          Inspired by our visionary founder, George Zimmer, we are a collective of experienced, open-minded, and forward-thinking fashion lovers, engineering geeks,and digital junkies who understand that when you look great, you feel awesome—and then joy happens.
        </p>
      </div>
    </div>
    <p>
      When it comes to the traditional brick-and-mortar, laminated-catalog, outdated-inventory, advertise-low-and-get-upsold-in-the-store tuxedo rental experience, we are seriously questioning the status quo. And you should&nbsp;too.
    </p>

    <h2 class="context--copy uppercase text-center">New Section</h2>
    <p class="text-center">
      Inspired by our visionary founder, George Zimmer, we are a collective of experienced, open-minded, and forward-thinking fashion lovers, engineering geeks,and digital junkies who understand that when you look great, you feel awesome—and then joy happens.
    </p>
    <div class="row">
      <div class="col-sm-4 text-center">
        <img class="mt-4 mb-3 text-center img-responsive" src="http://placehold.it/100">
        <h5 class="uppercase">Foobar</h5>
        <p> This is the item description</p>
      </div>
      <div class="col-sm-4 text-center">
        <img class="mt-4 mb-3 text-center img-responsive" src="http://placehold.it/100">
        <h5 class="uppercase">Foobar</h5>
        <p> This is the item description</p>
      </div>
      <div class="col-sm-4 text-center">
        <img class="mt-4 mb-3 text-center img-responsive" src="http://placehold.it/100">
        <h5 class="uppercase">Foobar</h5>
        <p> This is the item description</p>
      </div>
    </div>

    <h3 class="context--copy">Section </h3>
    <p>
      Inspired by our visionary founder, George Zimmer, we are a collective of experienced, open-minded, and forward-thinking fashion lovers, engineering geeks,and digital junkies who understand that when you look great, you feel awesome—and then joy happens.
    </p>

  </div>

</div>

</div><!-- /container -->