<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Modular Grid Example</title>
<link rel="stylesheet" href="example.css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<section class="container">
<h1>Modular Grid System</h1>
<h2>A flexible, responsive, percentage based grid system.</h2>
</section>
<section class="container debug">
<div class="m1"></div>
<div class="m1"></div>
<div class="m1"></div>
<div class="m1"></div>
<div class="m1"></div>
<div class="m1"></div>
<div class="m2 r4-2-0 l0-2-4">I move.</div>
<div class="m2-6-6"></div>
<div class="m2-4-2"></div>
<div class="m2-2-4"></div>
<div class="m1-3-6"></div>
<div class="m5-3-6"></div>
<div class="side-bar">
I disappear at the mobile size.
</div>
<div class="activity-feed"></div>
</section>
</body>
</html>