/* 
  Extra Strength Responsive Grids
  Author & copyright (c) 2013: John Polacek and Tim Svensen
  Follow on Twitter: @johnpolacek
  Follow on Twitter: @tsvensen

  Dual MIT & GPL license

  Project Page: http://dfcb.github.com/extra-strength-responsive-grids
  Project Repo: https://github.com/dfcb/extra-strength-responsive-grids
  
  Note: box-sizing: border-box; is required for this solution. 
  For more info, see the project page

  See examples-grid.scss for usage.
*/
.grid-all, .grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-quarter, .grid-7, .grid-8, .grid-third, .grid-9, .grid-10, .grid-11, .grid-12, .grid-half, .grid-13, .grid-14, .grid-15, .grid-16, .grid-two-thirds, .grid-17, .grid-18, .grid-three-quarters, .grid-19, .grid-20, .grid-21, .grid-22, .grid-23, .grid-24, .grid-whole {
  margin: 0;
  clear: none;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  *behavior: url(boxsizing.htc);
}

.offset-0 {
  margin-left: 0;
}

.grid-1 {
  width: 4.16667%;
}

.offset-1 {
  margin-left: 4.16667%;
}

.grid-2 {
  width: 8.33333%;
}

.offset-2 {
  margin-left: 8.33333%;
}

.grid-3 {
  width: 12.5%;
}

.offset-3 {
  margin-left: 12.5%;
}

.grid-4 {
  width: 16.66667%;
}

.offset-4 {
  margin-left: 16.66667%;
}

.grid-5 {
  width: 20.83333%;
}

.offset-5 {
  margin-left: 20.83333%;
}

.grid-6, .grid-quarter {
  width: 25%;
}

.offset-6 {
  margin-left: 25%;
}

.grid-7 {
  width: 29.16667%;
}

.offset-7 {
  margin-left: 29.16667%;
}

.grid-8, .grid-third {
  width: 33.33333%;
}

.offset-8 {
  margin-left: 33.33333%;
}

.grid-9 {
  width: 37.5%;
}

.offset-9 {
  margin-left: 37.5%;
}

.grid-10 {
  width: 41.66667%;
}

.offset-10 {
  margin-left: 41.66667%;
}

.grid-11 {
  width: 45.83333%;
}

.offset-11 {
  margin-left: 45.83333%;
}

.grid-12, .grid-half {
  width: 50%;
}

.offset-12 {
  margin-left: 50%;
}

.grid-13 {
  width: 54.16667%;
}

.offset-13 {
  margin-left: 54.16667%;
}

.grid-14 {
  width: 58.33333%;
}

.offset-14 {
  margin-left: 58.33333%;
}

.grid-15 {
  width: 62.5%;
}

.offset-15 {
  margin-left: 62.5%;
}

.grid-16, .grid-two-thirds {
  width: 66.66667%;
}

.offset-16 {
  margin-left: 66.66667%;
}

.grid-17 {
  width: 70.83333%;
}

.offset-17 {
  margin-left: 70.83333%;
}

.grid-18, .grid-three-quarters {
  width: 75%;
}

.offset-18 {
  margin-left: 75%;
}

.grid-19 {
  width: 79.16667%;
}

.offset-19 {
  margin-left: 79.16667%;
}

.grid-20 {
  width: 83.33333%;
}

.offset-20 {
  margin-left: 83.33333%;
}

.grid-21 {
  width: 87.5%;
}

.offset-21 {
  margin-left: 87.5%;
}

.grid-22 {
  width: 91.66667%;
}

.offset-22 {
  margin-left: 91.66667%;
}

.grid-23 {
  width: 95.83333%;
}

.offset-23 {
  margin-left: 95.83333%;
}

.grid-24, .grid-whole {
  width: 100%;
}

.offset-24 {
  margin-left: 100%;
}

/* padding helper classes */
.padded {
  padding: 15px;
}

.padded-left {
  padding-left: 15px;
}

.padded-right {
  padding-right: 15px;
}

.padded-top {
  padding-top: 15px;
}

.padded-bottom {
  padding-bottom: 15px;
}

.padded-sides {
  padding: 0 15px;
}

.padded-vertical {
  padding: 15px 0;
}

.padded-inner {
  padding: 15px;
}

.padded-inner-sides {
  padding: 0 15px;
}

.padded-reverse {
  margin: 0 -15px;
  width: auto;
  box-sizing: content-box;
  float: none;
}

.padded-reverse-all {
  margin: -15px;
  width: auto;
  box-sizing: content-box;
  float: none;
}

/* miscellaneous helper classes */
.flow-opposite {
  float: right;
}

.center {
  text-align: center;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

/* For compatibility with Bootstrap (fixed), Foundation, etc. */
.row {
  margin: 0 -15px;
  width: auto;
  box-sizing: content-box;
  float: none;
}

@media (max-width: 480px) {
  .s-grid-all, .s-grid-1, .s-grid-2, .s-grid-3, .s-grid-4, .s-grid-5, .s-grid-6, .s-grid-quarter, .s-grid-7, .s-grid-8, .s-grid-third, .s-grid-9, .s-grid-10, .s-grid-11, .s-grid-12, .s-grid-half, .s-grid-13, .s-grid-14, .s-grid-15, .s-grid-16, .s-grid-two-thirds, .s-grid-17, .s-grid-18, .s-grid-three-quarters, .s-grid-19, .s-grid-20, .s-grid-21, .s-grid-22, .s-grid-23, .s-grid-24, .s-grid-whole {
    margin: 0;
    clear: none;
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    *behavior: url(boxsizing.htc);
  }

  .s-offset-0 {
    margin-left: 0;
  }

  .s-grid-1 {
    width: 4.16667%;
  }

  .s-offset-1 {
    margin-left: 4.16667%;
  }

  .s-grid-2 {
    width: 8.33333%;
  }

  .s-offset-2 {
    margin-left: 8.33333%;
  }

  .s-grid-3 {
    width: 12.5%;
  }

  .s-offset-3 {
    margin-left: 12.5%;
  }

  .s-grid-4 {
    width: 16.66667%;
  }

  .s-offset-4 {
    margin-left: 16.66667%;
  }

  .s-grid-5 {
    width: 20.83333%;
  }

  .s-offset-5 {
    margin-left: 20.83333%;
  }

  .s-grid-6, .s-grid-quarter {
    width: 25%;
  }

  .s-offset-6 {
    margin-left: 25%;
  }

  .s-grid-7 {
    width: 29.16667%;
  }

  .s-offset-7 {
    margin-left: 29.16667%;
  }

  .s-grid-8, .s-grid-third {
    width: 33.33333%;
  }

  .s-offset-8 {
    margin-left: 33.33333%;
  }

  .s-grid-9 {
    width: 37.5%;
  }

  .s-offset-9 {
    margin-left: 37.5%;
  }

  .s-grid-10 {
    width: 41.66667%;
  }

  .s-offset-10 {
    margin-left: 41.66667%;
  }

  .s-grid-11 {
    width: 45.83333%;
  }

  .s-offset-11 {
    margin-left: 45.83333%;
  }

  .s-grid-12, .s-grid-half {
    width: 50%;
  }

  .s-offset-12 {
    margin-left: 50%;
  }

  .s-grid-13 {
    width: 54.16667%;
  }

  .s-offset-13 {
    margin-left: 54.16667%;
  }

  .s-grid-14 {
    width: 58.33333%;
  }

  .s-offset-14 {
    margin-left: 58.33333%;
  }

  .s-grid-15 {
    width: 62.5%;
  }

  .s-offset-15 {
    margin-left: 62.5%;
  }

  .s-grid-16, .s-grid-two-thirds {
    width: 66.66667%;
  }

  .s-offset-16 {
    margin-left: 66.66667%;
  }

  .s-grid-17 {
    width: 70.83333%;
  }

  .s-offset-17 {
    margin-left: 70.83333%;
  }

  .s-grid-18, .s-grid-three-quarters {
    width: 75%;
  }

  .s-offset-18 {
    margin-left: 75%;
  }

  .s-grid-19 {
    width: 79.16667%;
  }

  .s-offset-19 {
    margin-left: 79.16667%;
  }

  .s-grid-20 {
    width: 83.33333%;
  }

  .s-offset-20 {
    margin-left: 83.33333%;
  }

  .s-grid-21 {
    width: 87.5%;
  }

  .s-offset-21 {
    margin-left: 87.5%;
  }

  .s-grid-22 {
    width: 91.66667%;
  }

  .s-offset-22 {
    margin-left: 91.66667%;
  }

  .s-grid-23 {
    width: 95.83333%;
  }

  .s-offset-23 {
    margin-left: 95.83333%;
  }

  .s-grid-24, .s-grid-whole {
    width: 100%;
  }

  .s-offset-24 {
    margin-left: 100%;
  }

  /* padding helper classes */
  .s-padded {
    padding: 15px;
  }

  .s-padded-left {
    padding-left: 15px;
  }

  .s-padded-right {
    padding-right: 15px;
  }

  .s-padded-top {
    padding-top: 15px;
  }

  .s-padded-bottom {
    padding-bottom: 15px;
  }

  .s-padded-sides {
    padding: 0 15px;
  }

  .s-padded-vertical {
    padding: 15px 0;
  }

  .s-padded-inner {
    padding: 15px;
  }

  .s-padded-inner-sides {
    padding: 0 15px;
  }

  .s-padded-reverse {
    margin: 0 -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  .s-padded-reverse-all {
    margin: -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  /* miscellaneous helper classes */
  .s-flow-opposite {
    float: right;
  }

  .s-center {
    text-align: center;
  }

  .s-left {
    text-align: left;
  }

  .s-right {
    text-align: right;
  }

  .s-hidden {
    display: none;
  }
}
@media (min-width: 481px) and (max-width: 640px) {
  .m-grid-all, .m-grid-1, .m-grid-2, .m-grid-3, .m-grid-4, .m-grid-5, .m-grid-6, .m-grid-quarter, .m-grid-7, .m-grid-8, .m-grid-third, .m-grid-9, .m-grid-10, .m-grid-11, .m-grid-12, .m-grid-half, .m-grid-13, .m-grid-14, .m-grid-15, .m-grid-16, .m-grid-two-thirds, .m-grid-17, .m-grid-18, .m-grid-three-quarters, .m-grid-19, .m-grid-20, .m-grid-21, .m-grid-22, .m-grid-23, .m-grid-24, .m-grid-whole {
    margin: 0;
    clear: none;
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    *behavior: url(boxsizing.htc);
  }

  .m-offset-0 {
    margin-left: 0;
  }

  .m-grid-1 {
    width: 4.16667%;
  }

  .m-offset-1 {
    margin-left: 4.16667%;
  }

  .m-grid-2 {
    width: 8.33333%;
  }

  .m-offset-2 {
    margin-left: 8.33333%;
  }

  .m-grid-3 {
    width: 12.5%;
  }

  .m-offset-3 {
    margin-left: 12.5%;
  }

  .m-grid-4 {
    width: 16.66667%;
  }

  .m-offset-4 {
    margin-left: 16.66667%;
  }

  .m-grid-5 {
    width: 20.83333%;
  }

  .m-offset-5 {
    margin-left: 20.83333%;
  }

  .m-grid-6, .m-grid-quarter {
    width: 25%;
  }

  .m-offset-6 {
    margin-left: 25%;
  }

  .m-grid-7 {
    width: 29.16667%;
  }

  .m-offset-7 {
    margin-left: 29.16667%;
  }

  .m-grid-8, .m-grid-third {
    width: 33.33333%;
  }

  .m-offset-8 {
    margin-left: 33.33333%;
  }

  .m-grid-9 {
    width: 37.5%;
  }

  .m-offset-9 {
    margin-left: 37.5%;
  }

  .m-grid-10 {
    width: 41.66667%;
  }

  .m-offset-10 {
    margin-left: 41.66667%;
  }

  .m-grid-11 {
    width: 45.83333%;
  }

  .m-offset-11 {
    margin-left: 45.83333%;
  }

  .m-grid-12, .m-grid-half {
    width: 50%;
  }

  .m-offset-12 {
    margin-left: 50%;
  }

  .m-grid-13 {
    width: 54.16667%;
  }

  .m-offset-13 {
    margin-left: 54.16667%;
  }

  .m-grid-14 {
    width: 58.33333%;
  }

  .m-offset-14 {
    margin-left: 58.33333%;
  }

  .m-grid-15 {
    width: 62.5%;
  }

  .m-offset-15 {
    margin-left: 62.5%;
  }

  .m-grid-16, .m-grid-two-thirds {
    width: 66.66667%;
  }

  .m-offset-16 {
    margin-left: 66.66667%;
  }

  .m-grid-17 {
    width: 70.83333%;
  }

  .m-offset-17 {
    margin-left: 70.83333%;
  }

  .m-grid-18, .m-grid-three-quarters {
    width: 75%;
  }

  .m-offset-18 {
    margin-left: 75%;
  }

  .m-grid-19 {
    width: 79.16667%;
  }

  .m-offset-19 {
    margin-left: 79.16667%;
  }

  .m-grid-20 {
    width: 83.33333%;
  }

  .m-offset-20 {
    margin-left: 83.33333%;
  }

  .m-grid-21 {
    width: 87.5%;
  }

  .m-offset-21 {
    margin-left: 87.5%;
  }

  .m-grid-22 {
    width: 91.66667%;
  }

  .m-offset-22 {
    margin-left: 91.66667%;
  }

  .m-grid-23 {
    width: 95.83333%;
  }

  .m-offset-23 {
    margin-left: 95.83333%;
  }

  .m-grid-24, .m-grid-whole {
    width: 100%;
  }

  .m-offset-24 {
    margin-left: 100%;
  }

  /* padding helper classes */
  .m-padded {
    padding: 15px;
  }

  .m-padded-left {
    padding-left: 15px;
  }

  .m-padded-right {
    padding-right: 15px;
  }

  .m-padded-top {
    padding-top: 15px;
  }

  .m-padded-bottom {
    padding-bottom: 15px;
  }

  .m-padded-sides {
    padding: 0 15px;
  }

  .m-padded-vertical {
    padding: 15px 0;
  }

  .m-padded-inner {
    padding: 15px;
  }

  .m-padded-inner-sides {
    padding: 0 15px;
  }

  .m-padded-reverse {
    margin: 0 -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  .m-padded-reverse-all {
    margin: -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  /* miscellaneous helper classes */
  .m-flow-opposite {
    float: right;
  }

  .m-center {
    text-align: center;
  }

  .m-left {
    text-align: left;
  }

  .m-right {
    text-align: right;
  }

  .m-hidden {
    display: none;
  }
}
@media (min-width: 641px) and (max-width: 800px) {
  .ml-grid-all, .ml-grid-1, .ml-grid-2, .ml-grid-3, .ml-grid-4, .ml-grid-5, .ml-grid-6, .ml-grid-quarter, .ml-grid-7, .ml-grid-8, .ml-grid-third, .ml-grid-9, .ml-grid-10, .ml-grid-11, .ml-grid-12, .ml-grid-half, .ml-grid-13, .ml-grid-14, .ml-grid-15, .ml-grid-16, .ml-grid-two-thirds, .ml-grid-17, .ml-grid-18, .ml-grid-three-quarters, .ml-grid-19, .ml-grid-20, .ml-grid-21, .ml-grid-22, .ml-grid-23, .ml-grid-24, .ml-grid-whole {
    margin: 0;
    clear: none;
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    *behavior: url(boxsizing.htc);
  }

  .ml-offset-0 {
    margin-left: 0;
  }

  .ml-grid-1 {
    width: 4.16667%;
  }

  .ml-offset-1 {
    margin-left: 4.16667%;
  }

  .ml-grid-2 {
    width: 8.33333%;
  }

  .ml-offset-2 {
    margin-left: 8.33333%;
  }

  .ml-grid-3 {
    width: 12.5%;
  }

  .ml-offset-3 {
    margin-left: 12.5%;
  }

  .ml-grid-4 {
    width: 16.66667%;
  }

  .ml-offset-4 {
    margin-left: 16.66667%;
  }

  .ml-grid-5 {
    width: 20.83333%;
  }

  .ml-offset-5 {
    margin-left: 20.83333%;
  }

  .ml-grid-6, .ml-grid-quarter {
    width: 25%;
  }

  .ml-offset-6 {
    margin-left: 25%;
  }

  .ml-grid-7 {
    width: 29.16667%;
  }

  .ml-offset-7 {
    margin-left: 29.16667%;
  }

  .ml-grid-8, .ml-grid-third {
    width: 33.33333%;
  }

  .ml-offset-8 {
    margin-left: 33.33333%;
  }

  .ml-grid-9 {
    width: 37.5%;
  }

  .ml-offset-9 {
    margin-left: 37.5%;
  }

  .ml-grid-10 {
    width: 41.66667%;
  }

  .ml-offset-10 {
    margin-left: 41.66667%;
  }

  .ml-grid-11 {
    width: 45.83333%;
  }

  .ml-offset-11 {
    margin-left: 45.83333%;
  }

  .ml-grid-12, .ml-grid-half {
    width: 50%;
  }

  .ml-offset-12 {
    margin-left: 50%;
  }

  .ml-grid-13 {
    width: 54.16667%;
  }

  .ml-offset-13 {
    margin-left: 54.16667%;
  }

  .ml-grid-14 {
    width: 58.33333%;
  }

  .ml-offset-14 {
    margin-left: 58.33333%;
  }

  .ml-grid-15 {
    width: 62.5%;
  }

  .ml-offset-15 {
    margin-left: 62.5%;
  }

  .ml-grid-16, .ml-grid-two-thirds {
    width: 66.66667%;
  }

  .ml-offset-16 {
    margin-left: 66.66667%;
  }

  .ml-grid-17 {
    width: 70.83333%;
  }

  .ml-offset-17 {
    margin-left: 70.83333%;
  }

  .ml-grid-18, .ml-grid-three-quarters {
    width: 75%;
  }

  .ml-offset-18 {
    margin-left: 75%;
  }

  .ml-grid-19 {
    width: 79.16667%;
  }

  .ml-offset-19 {
    margin-left: 79.16667%;
  }

  .ml-grid-20 {
    width: 83.33333%;
  }

  .ml-offset-20 {
    margin-left: 83.33333%;
  }

  .ml-grid-21 {
    width: 87.5%;
  }

  .ml-offset-21 {
    margin-left: 87.5%;
  }

  .ml-grid-22 {
    width: 91.66667%;
  }

  .ml-offset-22 {
    margin-left: 91.66667%;
  }

  .ml-grid-23 {
    width: 95.83333%;
  }

  .ml-offset-23 {
    margin-left: 95.83333%;
  }

  .ml-grid-24, .ml-grid-whole {
    width: 100%;
  }

  .ml-offset-24 {
    margin-left: 100%;
  }

  /* padding helper classes */
  .ml-padded {
    padding: 15px;
  }

  .ml-padded-left {
    padding-left: 15px;
  }

  .ml-padded-right {
    padding-right: 15px;
  }

  .ml-padded-top {
    padding-top: 15px;
  }

  .ml-padded-bottom {
    padding-bottom: 15px;
  }

  .ml-padded-sides {
    padding: 0 15px;
  }

  .ml-padded-vertical {
    padding: 15px 0;
  }

  .ml-padded-inner {
    padding: 15px;
  }

  .ml-padded-inner-sides {
    padding: 0 15px;
  }

  .ml-padded-reverse {
    margin: 0 -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  .ml-padded-reverse-all {
    margin: -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  /* miscellaneous helper classes */
  .ml-flow-opposite {
    float: right;
  }

  .ml-center {
    text-align: center;
  }

  .ml-left {
    text-align: left;
  }

  .ml-right {
    text-align: right;
  }

  .ml-hidden {
    display: none;
  }
}
@media (min-width: 801px) and (max-width: 1130px) {
  .l-grid-all, .l-grid-1, .l-grid-2, .l-grid-3, .l-grid-4, .l-grid-5, .l-grid-6, .l-grid-quarter, .l-grid-7, .l-grid-8, .l-grid-third, .l-grid-9, .l-grid-10, .l-grid-11, .l-grid-12, .l-grid-half, .l-grid-13, .l-grid-14, .l-grid-15, .l-grid-16, .l-grid-two-thirds, .l-grid-17, .l-grid-18, .l-grid-three-quarters, .l-grid-19, .l-grid-20, .l-grid-21, .l-grid-22, .l-grid-23, .l-grid-24, .l-grid-whole {
    margin: 0;
    clear: none;
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    *behavior: url(boxsizing.htc);
  }

  .l-offset-0 {
    margin-left: 0;
  }

  .l-grid-1 {
    width: 4.16667%;
  }

  .l-offset-1 {
    margin-left: 4.16667%;
  }

  .l-grid-2 {
    width: 8.33333%;
  }

  .l-offset-2 {
    margin-left: 8.33333%;
  }

  .l-grid-3 {
    width: 12.5%;
  }

  .l-offset-3 {
    margin-left: 12.5%;
  }

  .l-grid-4 {
    width: 16.66667%;
  }

  .l-offset-4 {
    margin-left: 16.66667%;
  }

  .l-grid-5 {
    width: 20.83333%;
  }

  .l-offset-5 {
    margin-left: 20.83333%;
  }

  .l-grid-6, .l-grid-quarter {
    width: 25%;
  }

  .l-offset-6 {
    margin-left: 25%;
  }

  .l-grid-7 {
    width: 29.16667%;
  }

  .l-offset-7 {
    margin-left: 29.16667%;
  }

  .l-grid-8, .l-grid-third {
    width: 33.33333%;
  }

  .l-offset-8 {
    margin-left: 33.33333%;
  }

  .l-grid-9 {
    width: 37.5%;
  }

  .l-offset-9 {
    margin-left: 37.5%;
  }

  .l-grid-10 {
    width: 41.66667%;
  }

  .l-offset-10 {
    margin-left: 41.66667%;
  }

  .l-grid-11 {
    width: 45.83333%;
  }

  .l-offset-11 {
    margin-left: 45.83333%;
  }

  .l-grid-12, .l-grid-half {
    width: 50%;
  }

  .l-offset-12 {
    margin-left: 50%;
  }

  .l-grid-13 {
    width: 54.16667%;
  }

  .l-offset-13 {
    margin-left: 54.16667%;
  }

  .l-grid-14 {
    width: 58.33333%;
  }

  .l-offset-14 {
    margin-left: 58.33333%;
  }

  .l-grid-15 {
    width: 62.5%;
  }

  .l-offset-15 {
    margin-left: 62.5%;
  }

  .l-grid-16, .l-grid-two-thirds {
    width: 66.66667%;
  }

  .l-offset-16 {
    margin-left: 66.66667%;
  }

  .l-grid-17 {
    width: 70.83333%;
  }

  .l-offset-17 {
    margin-left: 70.83333%;
  }

  .l-grid-18, .l-grid-three-quarters {
    width: 75%;
  }

  .l-offset-18 {
    margin-left: 75%;
  }

  .l-grid-19 {
    width: 79.16667%;
  }

  .l-offset-19 {
    margin-left: 79.16667%;
  }

  .l-grid-20 {
    width: 83.33333%;
  }

  .l-offset-20 {
    margin-left: 83.33333%;
  }

  .l-grid-21 {
    width: 87.5%;
  }

  .l-offset-21 {
    margin-left: 87.5%;
  }

  .l-grid-22 {
    width: 91.66667%;
  }

  .l-offset-22 {
    margin-left: 91.66667%;
  }

  .l-grid-23 {
    width: 95.83333%;
  }

  .l-offset-23 {
    margin-left: 95.83333%;
  }

  .l-grid-24, .l-grid-whole {
    width: 100%;
  }

  .l-offset-24 {
    margin-left: 100%;
  }

  /* padding helper classes */
  .l-padded {
    padding: 15px;
  }

  .l-padded-left {
    padding-left: 15px;
  }

  .l-padded-right {
    padding-right: 15px;
  }

  .l-padded-top {
    padding-top: 15px;
  }

  .l-padded-bottom {
    padding-bottom: 15px;
  }

  .l-padded-sides {
    padding: 0 15px;
  }

  .l-padded-vertical {
    padding: 15px 0;
  }

  .l-padded-inner {
    padding: 15px;
  }

  .l-padded-inner-sides {
    padding: 0 15px;
  }

  .l-padded-reverse {
    margin: 0 -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  .l-padded-reverse-all {
    margin: -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  /* miscellaneous helper classes */
  .l-flow-opposite {
    float: right;
  }

  .l-center {
    text-align: center;
  }

  .l-left {
    text-align: left;
  }

  .l-right {
    text-align: right;
  }

  .l-hidden {
    display: none;
  }
}
@media (min-width: 1131px) {
  .f-grid-all, .f-grid-1, .f-grid-2, .f-grid-3, .f-grid-4, .f-grid-5, .f-grid-6, .f-grid-quarter, .f-grid-7, .f-grid-8, .f-grid-third, .f-grid-9, .f-grid-10, .f-grid-11, .f-grid-12, .f-grid-half, .f-grid-13, .f-grid-14, .f-grid-15, .f-grid-16, .f-grid-two-thirds, .f-grid-17, .f-grid-18, .f-grid-three-quarters, .f-grid-19, .f-grid-20, .f-grid-21, .f-grid-22, .f-grid-23, .f-grid-24, .f-grid-whole {
    margin: 0;
    clear: none;
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    *behavior: url(boxsizing.htc);
  }

  .f-offset-0 {
    margin-left: 0;
  }

  .f-grid-1 {
    width: 4.16667%;
  }

  .f-offset-1 {
    margin-left: 4.16667%;
  }

  .f-grid-2 {
    width: 8.33333%;
  }

  .f-offset-2 {
    margin-left: 8.33333%;
  }

  .f-grid-3 {
    width: 12.5%;
  }

  .f-offset-3 {
    margin-left: 12.5%;
  }

  .f-grid-4 {
    width: 16.66667%;
  }

  .f-offset-4 {
    margin-left: 16.66667%;
  }

  .f-grid-5 {
    width: 20.83333%;
  }

  .f-offset-5 {
    margin-left: 20.83333%;
  }

  .f-grid-6, .f-grid-quarter {
    width: 25%;
  }

  .f-offset-6 {
    margin-left: 25%;
  }

  .f-grid-7 {
    width: 29.16667%;
  }

  .f-offset-7 {
    margin-left: 29.16667%;
  }

  .f-grid-8, .f-grid-third {
    width: 33.33333%;
  }

  .f-offset-8 {
    margin-left: 33.33333%;
  }

  .f-grid-9 {
    width: 37.5%;
  }

  .f-offset-9 {
    margin-left: 37.5%;
  }

  .f-grid-10 {
    width: 41.66667%;
  }

  .f-offset-10 {
    margin-left: 41.66667%;
  }

  .f-grid-11 {
    width: 45.83333%;
  }

  .f-offset-11 {
    margin-left: 45.83333%;
  }

  .f-grid-12, .f-grid-half {
    width: 50%;
  }

  .f-offset-12 {
    margin-left: 50%;
  }

  .f-grid-13 {
    width: 54.16667%;
  }

  .f-offset-13 {
    margin-left: 54.16667%;
  }

  .f-grid-14 {
    width: 58.33333%;
  }

  .f-offset-14 {
    margin-left: 58.33333%;
  }

  .f-grid-15 {
    width: 62.5%;
  }

  .f-offset-15 {
    margin-left: 62.5%;
  }

  .f-grid-16, .f-grid-two-thirds {
    width: 66.66667%;
  }

  .f-offset-16 {
    margin-left: 66.66667%;
  }

  .f-grid-17 {
    width: 70.83333%;
  }

  .f-offset-17 {
    margin-left: 70.83333%;
  }

  .f-grid-18, .f-grid-three-quarters {
    width: 75%;
  }

  .f-offset-18 {
    margin-left: 75%;
  }

  .f-grid-19 {
    width: 79.16667%;
  }

  .f-offset-19 {
    margin-left: 79.16667%;
  }

  .f-grid-20 {
    width: 83.33333%;
  }

  .f-offset-20 {
    margin-left: 83.33333%;
  }

  .f-grid-21 {
    width: 87.5%;
  }

  .f-offset-21 {
    margin-left: 87.5%;
  }

  .f-grid-22 {
    width: 91.66667%;
  }

  .f-offset-22 {
    margin-left: 91.66667%;
  }

  .f-grid-23 {
    width: 95.83333%;
  }

  .f-offset-23 {
    margin-left: 95.83333%;
  }

  .f-grid-24, .f-grid-whole {
    width: 100%;
  }

  .f-offset-24 {
    margin-left: 100%;
  }

  /* padding helper classes */
  .f-padded {
    padding: 15px;
  }

  .f-padded-left {
    padding-left: 15px;
  }

  .f-padded-right {
    padding-right: 15px;
  }

  .f-padded-top {
    padding-top: 15px;
  }

  .f-padded-bottom {
    padding-bottom: 15px;
  }

  .f-padded-sides {
    padding: 0 15px;
  }

  .f-padded-vertical {
    padding: 15px 0;
  }

  .f-padded-inner {
    padding: 15px;
  }

  .f-padded-inner-sides {
    padding: 0 15px;
  }

  .f-padded-reverse {
    margin: 0 -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  .f-padded-reverse-all {
    margin: -15px;
    width: auto;
    box-sizing: content-box;
    float: none;
  }

  /* miscellaneous helper classes */
  .f-flow-opposite {
    float: right;
  }

  .f-center {
    text-align: center;
  }

  .f-left {
    text-align: left;
  }

  .f-right {
    text-align: right;
  }

  .f-hidden {
    display: none;
  }
}

/*# sourceMappingURL=grid.css.map */