/*
  You can find an indepth explination of how this clearfix solution works
  from the artical by Nicolas Gallagher A New Micro Clearfix Hack at
           http://nicolasgallagher.com/micro-clearfix-hack/

  For modern browsers
   1. The space content is one way to avoid an Opera bug when the
      contenteditable attribute is included anywhere else in the document.
     Otherwise it causes space to appear at the top and bottom of elements
      that are clearfixed.
   2. The use of `table` rather than `block` is only necessary if using
     `:before` to contain the top-margins of child elements.

     Readings
     Everything You Know About Clear Fix is Wrong.
     http://www.tjkdesign.com/articles/clearfix_block-formatting-context_and_hasLayout.asp

     Clear Fix Reloaded
     http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified/


 */
.cf:before, .cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}