Semantic Class Names

<!-- The Markup -->
<div class="container">
    <a href="" class="leaderboard-story">
        <div></div>
        <div></div>
    </a>
    <a href="" class="leaderboard-story">
        <div></div>
        <div></div>
    </a>
    <a href="" class="leaderboard-story">
        <div></div>
        <div></div>
    </a>
</div>

<!-- SASS File -->
.container {
    @include clearfix();
}

.container > div {
    margin-bottom: 20px;
    width: auto;
    overflow: hidden;
}

.container div > div:first-child {
    margin-left: 0;
}

.leaderboard-story div {
    @include make-column(2); // Mixin difining grid cols
}