bootstrap-fluid-grid-mixin.scss

.fluid-row {
  div, section, article, li { /* Needs testing on li's */
    &:first-child { /* using first child and margin-left for IE support */
      margin-left: 0;
    }
  }
}

.fluid-column(@columns: 1, @offset: 0, @reset: default) {
  .input-block-level();
  float: left;
  width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
  *width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%);
  margin-left: (@fluidGridGutterWidth * @offset) + (@fluidGridGutterWidth * (@offset - 1)) + (@fluidGridGutterWidth * 2);
  *margin-left: @fluidGridGutterWidth - (.5 / @fluidGridGutterWidth * 100 * 1%);
  .fluid-column-reset(@reset);
}

.fluid-column-reset(default) {
  @media (max-width: 1024px) {
    float: none;
    width: 100%;
    *width: 100%;
    margin-left: 0;
    *margin-left: 0;
  }
}
.fluid-column-reset(none) {

}

.fluid-column-reset(@_) {
  @media (max-width: @_) {
    float: none;
    width: 100%;
    *width: 100%;
    margin-left: 0;
    *margin-left: 0;
  }
}

.component-row {
	.fluid-row();
	.clearfix();
}

.one-component {
	.fluid-column(8);
}

.two-component {
	.fluid-column(4);
}

.three-component {
	.fluid-column(7);
}

.four-component {
	.fluid-column(4, 2);
}

#main-content {
	.fluid-row();
	.clearfix();
}

.main-content-sidebar {
	.fluid-column(3, 0, 700px);
}

.main-content {
	.fluid-column(9, 0, 700px);
}