@include add-grid(12);

.cols2 {
    @extend %clearfix;

    > div {
        @include box-sizing('border-box');
        @include float-span(12);
    }

    @include breakpoint($mobile-l) {
        > div {
            @include float-span(6);

            &:nth-child(2n+2) {
                @include float-span(6, 'last');
            }
        }
    }
}

.cols33 {
    @extend %clearfix;

    > div {
        @include box-sizing('border-box');
        @include float-span(12);

        @include breakpoint($mobile-l) {
            @include box-sizing('border-box');
            @include float-span(4);

            &:nth-child(3n+3) {
                @include float-span(4, 'last');
            }
        }
    }
}

.cols66-33 {
    @extend %clearfix;

    > div {
        @include box-sizing('border-box');
        @include float-span(12);

        > div {
            margin-bottom: 16px;
        }
    }

    @include breakpoint($mobile-l) {
        > div {
            @include box-sizing('border-box');
            @include grid-span(8, 1);

            &:nth-child(2n+2) {
                @include grid-span(4, 9);

            }
        }
    }

    @include breakpoint($mobile-xl) {
        > div {
            @include box-sizing('border-box');
            @include grid-span(9, 1);

            &:nth-child(2n+2) {
                @include grid-span(3, 10);
            }
        }
    }
}


.cols33-66 {
    @extend %clearfix;

    > div {
        @include box-sizing('border-box');
        @include float-span(12);

        > div {
            margin-bottom: 16px;
        }
    }

    @include breakpoint($mobile-l) {
        > div {
            @include box-sizing('border-box');
            @include grid-span(4, 1);

            &:nth-child(2n+2) {
                @include grid-span(8, 5);

            }
        }
    }

    @include breakpoint($mobile-xl) {
        > div {
            @include box-sizing('border-box');
            @include grid-span(3, 1);

            &:nth-child(2n+2) {
                @include grid-span(9, 4);
            }
        }
    }
}
