/**
 * CSS Helpers
 *
 * Use this file to hold every CSS helper class, trick or something that will be
 * used in the project.
 */

/**
 * Use the .clearfix class to fix the issue of having two or more floating block
 * elements inside a container that is unable to grow it's height together with
 * the children.
 *
 * Taking the above example code, when both .content and .sidebar are floating,
 * the .page wouldn't be able to grow it's height dynamically. So, by adding the
 * .clearfix the problem is solved:
 *
 * <div class="page clearfix">
 *   <div class="content">
 *     <?php print $dummy_content; ?>
 *   </div><!-- end .content -->
 *   <div class="sidebar">
 *     <?php print $dummy_sidebar; ?>
 *   </div><!-- end .sidebar -->
 * </div><!-- end .page -->
 */
.clearfix:after { clear: both; content: "."; display: block; hidden; height: 0; overflow: hidden; visibility: }