.fluid-span-1 {
  width: 8.3333333333%;
}

.fluid-span-2 {
  width: 16.6666666667%;
}

.fluid-span-3 {
  width: 25%;
}

.fluid-span-4 {
  width: 33.3333333333%;
}

.fluid-span-5 {
  width: 41.6666666667%;
}

.fluid-span-6 {
  width: 50%;
}

.fluid-span-7 {
  width: 58.3333333333%;
}

.fluid-span-8 {
  width: 66.6666666667%;
}

.fluid-span-9 {
  width: 75%;
}

.fluid-span-10 {
  width: 83.3333333333%;
}

.fluid-span-11 {
  width: 91.6666666667%;
}

.fluid-span-12 {
  width: 100%;
}

.fluid-offset-1 {
  margin-left: 8.3333333333%;
}

.fluid-offset-2 {
  margin-left: 16.6666666667%;
}

.fluid-offset-3 {
  margin-left: 25%;
}

.fluid-offset-4 {
  margin-left: 33.3333333333%;
}

.fluid-offset-5 {
  margin-left: 41.6666666667%;
}

.fluid-offset-6 {
  margin-left: 50%;
}

.fluid-offset-7 {
  margin-left: 58.3333333333%;
}

.fluid-offset-8 {
  margin-left: 66.6666666667%;
}

.fluid-offset-9 {
  margin-left: 75%;
}

.fluid-offset-10 {
  margin-left: 83.3333333333%;
}

.fluid-offset-11 {
  margin-left: 91.6666666667%;
}

@media(max-width: 600px) {
  .fluid-span-1 {
    width: 16.6666666667%;
  }

  .fluid-span-2 {
    width: 33.3333333333%;
  }

  .fluid-span-3 {
    width: 50%;
  }

  .fluid-span-4 {
    width: 66.6666666667%;
  }

  .fluid-span-5 {
    width: 83.3333333333%;
  }

  .fluid-span-6 {
    width: 100%;
  }

  .fluid-offset-1 {
    margin-left: 16.6666666667%;
  }

  .fluid-offset-2 {
    margin-left: 33.3333333333%;
  }

  .fluid-offset-3 {
    margin-left: 50%;
  }

  .fluid-offset-4 {
    margin-left: 66.6666666667%;
  }

  .fluid-offset-5 {
    margin-left: 83.3333333333%;
  }

}
@media(max-width: 300px) {
  .fluid-span-1 {
    width: 33.3333333333%;
  }

  .fluid-span-2 {
    width: 66.6666666667%;
  }

  .fluid-span-3 {
    width: 100%;
  }

  .fluid-offset-1 {
    margin-left: 33.3333333333%;
  }

  .fluid-offset-2 {
    margin-left: 66.6666666667%;
  }

}