// =========== Layout

.l-full {
    width:100%;
    @include breakpoint($breakpoint-10) { @include grid(48, 1); }
}

.l-two-third {

    @include breakpoint($breakpoint-10) { @include grid(32, 1); }
}

.l-half {

    @include breakpoint($breakpoint-10) { @include grid(24, 1); }
}

.l-one-quarter {
    @include breakpoint($breakpoint-10) { @include grid(12, 1); }
}

.l-one-eigth {
    @include breakpoint($breakpoint-10) { @include grid(6, 1); }
}

.l-one-sixth {
    @include breakpoint($breakpoint-10) { @include grid(8, 1); }
}

.l-one-third {

    @include breakpoint($breakpoint-10) { @include grid(16, 1);  }
}

.l-grid {
    @include grid-container;

    li { @include grid(16, 1); }
}

.l-first { clear: left; }


.l-container {
    margin: auto;
    max-width: $max-width;
    padding: $spacing;
    @include grid-container;

    @include breakpoint($breakpoint-20) { padding: $spacing * 2; }
}

.l-menu-container {
    @include grid-container;
    padding: $spacing;
}

footer {
    background-image: linear-gradient(rgb(255, 255, 255) 0px, rgb(233, 233, 233) 30%);
}