#sg-layouts.showcase.shadow-1
  header.showcase-header
    h2 Basic Layouts
    p.
      You will use the following layouts throughout your documenation
      to specify sections and sub-sections of content.

  .showcase-content
    .l-main-section
      h2 Main Section Title
      p Main section content...

      pre.prettyprint.linenums.lang-html
        code.
          .l-main-section
            h2 Section Title
            p section content...

      .l-sub-section
        h3 Sub Section Title
        p.
          sub section content... This content is related to the main section
          content and <strong>falls within</strong> the main section.

        pre.prettyprint.linenums.lang-html
          code.
            .l-sub-section
              h3 Sub Section Title
              p sub section content...