/*

  Usage
  -----
  In your main scss file, add the following three lines.
    $show-grid: true;
    $container-id: container;
    @import "grid";

  To hide the grid background and borders, change the first line to
    $show-grid: false;

  Then you get a series of classes named .col-1, .col-2, .col-3, etc. which you can use in your markup

*/
/* line 36, scss/grid.scss */
.col-1 {
  width: 60px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-2 {
  width: 140px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-3 {
  width: 220px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-4 {
  width: 300px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-5 {
  width: 380px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-6 {
  width: 460px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-7 {
  width: 540px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-8 {
  width: 620px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-9 {
  width: 700px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-10 {
  width: 780px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-11 {
  width: 860px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 36, scss/grid.scss */
.col-12 {
  width: 940px;
  margin-left: 20px;
  display: block;
  float: left;
}

/* line 39, scss/grid.scss */
.first {
  margin-left: 0px;
}

/* line 43, scss/grid.scss */
.col-container {
  width: 960px;
  padding-right: 20px;
  margin: 0 auto;
}