.settings {
  _default-settings: '("grids": (-1px: 12), "gutters": (-1px: 0.25), "gutter styles": (-1px: "opposite"), "output": "isolation", "direction": "ltr", "mobile first": true, "include border box": false, "include clearfix": false, "background grid color": chocolate, "asymmetric output": "isolation", "calc include min-width": true, "debug": false)';
  _user-settings: '("grids": (-1px: 3, 500px: 5, 700px: 1 3 5 7), "gutters": (-1px: 0.25, 500px: 10px, 700px: 1em), "gutter styles": (-1px: "split", 700px: "opposite"))';
}

.float-span {
  _grid: 3;
  _gutter: 0.25;
  _gutter-style: "split";
  _float-span-start: "@include float-span(1, 1)";
  width: 26.66667%;
  clear: right;
  float: left;
  margin-left: 3.33333%;
  margin-right: 3.33333%;
  _float-span-end: "@include float-span(1, 3)";
  width: 26.66667%;
  clear: right;
  float: right;
  margin-left: 0;
  margin-right: 3.33333%;
  _float-span-multiple: "@include float-span(2, 2)";
  width: 60%;
  clear: right;
  float: right;
  margin-left: 0;
  margin-right: 3.33333%;
}
@media (min-width: 499px) {
  .float-span {
    _grid: 3;
    _gutter: 0.25;
    _gutter-style: "split";
    _float-span-start: "@include float-span(1, 1)";
    width: 26.66667%;
    clear: right;
    float: left;
    margin-left: 3.33333%;
    margin-right: 3.33333%;
    _float-span-end: "@include float-span(1, 3)";
    width: 26.66667%;
    clear: right;
    float: right;
    margin-left: 0;
    margin-right: 3.33333%;
    _float-span-multiple: "@include float-span(2, 2)";
    width: 60%;
    clear: right;
    float: right;
    margin-left: 0;
    margin-right: 3.33333%;
  }
}
@media (min-width: 500px) {
  .float-span {
    _grid: 5;
    _gutter: 10px;
    _gutter-style: "split";
    _float-span-start: "@include float-span(1, 1)";
    width: 20%;
    clear: right;
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    _float-span-end: "@include float-span(1, 5)";
    width: 20%;
    clear: right;
    float: right;
    padding-left: 5px;
    padding-right: 5px;
    _float-span-multiple: "@include float-span(2, 2)";
    width: 40%;
    clear: right;
    float: left;
    padding-left: 5px;
    padding-right: 5px;
  }
}
@media (min-width: 699px) {
  .float-span {
    _grid: 5;
    _gutter: 10px;
    _gutter-style: "split";
    _float-span-start: "@include float-span(1, 1)";
    width: 20%;
    clear: right;
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    _float-span-end: "@include float-span(1, 5)";
    width: 20%;
    clear: right;
    float: right;
    padding-left: 5px;
    padding-right: 5px;
    _float-span-multiple: "@include float-span(2, 2)";
    width: 40%;
    clear: right;
    float: left;
    padding-left: 5px;
    padding-right: 5px;
  }
}
@media (min-width: 700px) {
  .float-span {
    _grid: 1 3 5 7;
    _gutter: 1em;
    _gutter-style: "opposite";
    _float-span-start: "@include float-span(1, 1)";
    width: 6.25%;
    clear: right;
    float: left;
    padding-right: 1em;
    _float-span-end: "@include float-span(1, 4)";
    width: 43.75%;
    clear: right;
    float: right;
    padding-right: 0;
    _float-span-multiple: "@include float-span(2, 2)";
    width: 50%;
    clear: right;
    float: left;
    padding-right: 1em;
  }
}