anchor.diff:              <span class="block__elem"></span>
             </div>
             ```
  -      .grid__cell-md_size_4.raw-text
  +      .grid__cell-md_size_4.raw-text(style="border-left: 1px solid #ddd;")
           :markdown
             #### CSS
              * Use class name selector only
  
positive.code:            * CSS size will not grow without any bounds with duplicating classes.
  
      .grid__row
        .grid__cell-xs_size_12.raw-text
          :markdown
            ## Block
            Block encapsulates a standalone entity that is meaningful on its own. While blocks can be nested and interact with each other, semantically they remain equal; there is no precedence or hierarchy. Holistic entities without DOM representation (such as controllers or models) can be blocks as well.
      .grid__row
        .grid__cell-md_size_4.raw-text
          :markdown
            #### Naming
  
            Block name may consist of Latin letters, digits, and dashes. To form a CSS class, add short prefix for namespacing: `.block`
        .grid__cell-md_size_4.raw-text
          :markdown
            #### HTML
            Any DOM node can be a block if it accepts a class name.
  
negative.code:               Original block/element name + single underscore + mod name: `.block_mod` or `.block__elem_mod`
             * __Key/value modifiers__<br>
                Original block/element name + single underscore + mod key name + single underscore + mod value: `.block_key_value` or `.block__elem_key_value`
        .grid__cell-md_size_4.raw-text(style="border-left: 1px solid #ddd;")
          :markdown
            #### HTML
            Modifier is an extra class name which you add to a block/element DOM node. Add modifier classes only to blocks/elements they modify, and keep the original class:
  