Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.14)
// Compass (v1.0.3)
// ----

$width-numerator: one, two, three, four, five, six, seven, eight, nine, ten, eleven, twelve, thriteen, fourteen, fifteen, sixteen;
$width-denominator: whole, half, third, quarter, fifth, sixth, seventh, eighth, ninth, tenth, eleventh, twelfth, thirtheenth, fourteenth, fifteenth, sixteenth;
$width-denominators: whole, halfs, thirds, quarters, fifths, sixths, sevenths, eighths, ninths, tenths, elevenths, twelfths, thirtheenths, fourteenths, fifteenths, sixteenths;

$screen-breakpoint-labels: xs, sm, md, lg, xl !default;
$screen-breakpoints: 360, 480, 768, 1024, 1400 !default;

$width-columns: 12;

@for $n from 1 through $width-columns {
  $nu: nth($width-numerator, $n);
  @for $d from $n through $width-columns {
    $de: nth($width-denominator, $d);
    @if $n > 1 {
      $de: nth($width-denominators, $d);
    }
    
    .#{$nu}-#{$de},
    .#{nth($screen-breakpoint-labels, 1)}-#{$nu}-#{$de} {
      width: ($n / $d) * 100 * 1%;
    }
    
    @media (max-width: #{nth($screen-breakpoints, 2) +px}) {
      .#{$nu}-#{$de} {
        width: 100%;
      }
    }
  }
}

/*! Screen specific widths */

@each $b in $screen-breakpoint-labels {
  $index: index($screen-breakpoint-labels, $b);
  
  $media-conditions: 'min-width: #{nth($screen-breakpoints, index($screen-breakpoint-labels, $b)) + 1 +px}';
  @if $index == 1 {
    $media-conditions: 'max-width: #{nth($screen-breakpoints, index($screen-breakpoint-labels, $b) + 1) +px}';
  }

  @media (#{$media-conditions}) {
    @for $n from 1 through $width-columns {
      $nu: nth($width-numerator, $n);
      @for $d from $n through $width-columns {
        $de: nth($width-denominator, $d);
        @if $n > 1 {
          $de: nth($width-denominators, $d);
        }
        
        .#{$b}-#{$nu}-#{$de} {
            width: ($n / $d) * 100 * 1%;
        }
      }
    }
    
    .#{$b}-hide {
      display: none !important;
    }
  }
}

SassMeister-output.css

.one-whole,
.xs-one-whole {
  width: 100%;
}

@media (max-width: 480px) {
  .one-whole {
    width: 100%;
  }
}
.one-half,
.xs-one-half {
  width: 50%;
}

@media (max-width: 480px) {
  .one-half {
    width: 100%;
  }
}
.one-third,
.xs-one-third {
  width: 33.33333%;
}

@media (max-width: 480px) {
  .one-third {
    width: 100%;
  }
}
.one-quarter,
.xs-one-quarter {
  width: 25%;
}

@media (max-width: 480px) {
  .one-quarter {
    width: 100%;
  }
}
.one-fifth,
.xs-one-fifth {
  width: 20%;
}

@media (max-width: 480px) {
  .one-fifth {
    width: 100%;
  }
}
.one-sixth,
.xs-one-sixth {
  width: 16.66667%;
}

@media (max-width: 480px) {
  .one-sixth {
    width: 100%;
  }
}
.one-seventh,
.xs-one-seventh {
  width: 14.28571%;
}

@media (max-width: 480px) {
  .one-seventh {
    width: 100%;
  }
}
.one-eighth,
.xs-one-eighth {
  width: 12.5%;
}

@media (max-width: 480px) {
  .one-eighth {
    width: 100%;
  }
}
.one-ninth,
.xs-one-ninth {
  width: 11.11111%;
}

@media (max-width: 480px) {
  .one-ninth {
    width: 100%;
  }
}
.one-tenth,
.xs-one-tenth {
  width: 10%;
}

@media (max-width: 480px) {
  .one-tenth {
    width: 100%;
  }
}
.one-eleventh,
.xs-one-eleventh {
  width: 9.09091%;
}

@media (max-width: 480px) {
  .one-eleventh {
    width: 100%;
  }
}
.one-twelfth,
.xs-one-twelfth {
  width: 8.33333%;
}

@media (max-width: 480px) {
  .one-twelfth {
    width: 100%;
  }
}
.two-halfs,
.xs-two-halfs {
  width: 100%;
}

@media (max-width: 480px) {
  .two-halfs {
    width: 100%;
  }
}
.two-thirds,
.xs-two-thirds {
  width: 66.66667%;
}

@media (max-width: 480px) {
  .two-thirds {
    width: 100%;
  }
}
.two-quarters,
.xs-two-quarters {
  width: 50%;
}

@media (max-width: 480px) {
  .two-quarters {
    width: 100%;
  }
}
.two-fifths,
.xs-two-fifths {
  width: 40%;
}

@media (max-width: 480px) {
  .two-fifths {
    width: 100%;
  }
}
.two-sixths,
.xs-two-sixths {
  width: 33.33333%;
}

@media (max-width: 480px) {
  .two-sixths {
    width: 100%;
  }
}
.two-sevenths,
.xs-two-sevenths {
  width: 28.57143%;
}

@media (max-width: 480px) {
  .two-sevenths {
    width: 100%;
  }
}
.two-eighths,
.xs-two-eighths {
  width: 25%;
}

@media (max-width: 480px) {
  .two-eighths {
    width: 100%;
  }
}
.two-ninths,
.xs-two-ninths {
  width: 22.22222%;
}

@media (max-width: 480px) {
  .two-ninths {
    width: 100%;
  }
}
.two-tenths,
.xs-two-tenths {
  width: 20%;
}

@media (max-width: 480px) {
  .two-tenths {
    width: 100%;
  }
}
.two-elevenths,
.xs-two-elevenths {
  width: 18.18182%;
}

@media (max-width: 480px) {
  .two-elevenths {
    width: 100%;
  }
}
.two-twelfths,
.xs-two-twelfths {
  width: 16.66667%;
}

@media (max-width: 480px) {
  .two-twelfths {
    width: 100%;
  }
}
.three-thirds,
.xs-three-thirds {
  width: 100%;
}

@media (max-width: 480px) {
  .three-thirds {
    width: 100%;
  }
}
.three-quarters,
.xs-three-quarters {
  width: 75%;
}

@media (max-width: 480px) {
  .three-quarters {
    width: 100%;
  }
}
.three-fifths,
.xs-three-fifths {
  width: 60%;
}

@media (max-width: 480px) {
  .three-fifths {
    width: 100%;
  }
}
.three-sixths,
.xs-three-sixths {
  width: 50%;
}

@media (max-width: 480px) {
  .three-sixths {
    width: 100%;
  }
}
.three-sevenths,
.xs-three-sevenths {
  width: 42.85714%;
}

@media (max-width: 480px) {
  .three-sevenths {
    width: 100%;
  }
}
.three-eighths,
.xs-three-eighths {
  width: 37.5%;
}

@media (max-width: 480px) {
  .three-eighths {
    width: 100%;
  }
}
.three-ninths,
.xs-three-ninths {
  width: 33.33333%;
}

@media (max-width: 480px) {
  .three-ninths {
    width: 100%;
  }
}
.three-tenths,
.xs-three-tenths {
  width: 30%;
}

@media (max-width: 480px) {
  .three-tenths {
    width: 100%;
  }
}
.three-elevenths,
.xs-three-elevenths {
  width: 27.27273%;
}

@media (max-width: 480px) {
  .three-elevenths {
    width: 100%;
  }
}
.three-twelfths,
.xs-three-twelfths {
  width: 25%;
}

@media (max-width: 480px) {
  .three-twelfths {
    width: 100%;
  }
}
.four-quarters,
.xs-four-quarters {
  width: 100%;
}

@media (max-width: 480px) {
  .four-quarters {
    width: 100%;
  }
}
.four-fifths,
.xs-four-fifths {
  width: 80%;
}

@media (max-width: 480px) {
  .four-fifths {
    width: 100%;
  }
}
.four-sixths,
.xs-four-sixths {
  width: 66.66667%;
}

@media (max-width: 480px) {
  .four-sixths {
    width: 100%;
  }
}
.four-sevenths,
.xs-four-sevenths {
  width: 57.14286%;
}

@media (max-width: 480px) {
  .four-sevenths {
    width: 100%;
  }
}
.four-eighths,
.xs-four-eighths {
  width: 50%;
}

@media (max-width: 480px) {
  .four-eighths {
    width: 100%;
  }
}
.four-ninths,
.xs-four-ninths {
  width: 44.44444%;
}

@media (max-width: 480px) {
  .four-ninths {
    width: 100%;
  }
}
.four-tenths,
.xs-four-tenths {
  width: 40%;
}

@media (max-width: 480px) {
  .four-tenths {
    width: 100%;
  }
}
.four-elevenths,
.xs-four-elevenths {
  width: 36.36364%;
}

@media (max-width: 480px) {
  .four-elevenths {
    width: 100%;
  }
}
.four-twelfths,
.xs-four-twelfths {
  width: 33.33333%;
}

@media (max-width: 480px) {
  .four-twelfths {
    width: 100%;
  }
}
.five-fifths,
.xs-five-fifths {
  width: 100%;
}

@media (max-width: 480px) {
  .five-fifths {
    width: 100%;
  }
}
.five-sixths,
.xs-five-sixths {
  width: 83.33333%;
}

@media (max-width: 480px) {
  .five-sixths {
    width: 100%;
  }
}
.five-sevenths,
.xs-five-sevenths {
  width: 71.42857%;
}

@media (max-width: 480px) {
  .five-sevenths {
    width: 100%;
  }
}
.five-eighths,
.xs-five-eighths {
  width: 62.5%;
}

@media (max-width: 480px) {
  .five-eighths {
    width: 100%;
  }
}
.five-ninths,
.xs-five-ninths {
  width: 55.55556%;
}

@media (max-width: 480px) {
  .five-ninths {
    width: 100%;
  }
}
.five-tenths,
.xs-five-tenths {
  width: 50%;
}

@media (max-width: 480px) {
  .five-tenths {
    width: 100%;
  }
}
.five-elevenths,
.xs-five-elevenths {
  width: 45.45455%;
}

@media (max-width: 480px) {
  .five-elevenths {
    width: 100%;
  }
}
.five-twelfths,
.xs-five-twelfths {
  width: 41.66667%;
}

@media (max-width: 480px) {
  .five-twelfths {
    width: 100%;
  }
}
.six-sixths,
.xs-six-sixths {
  width: 100%;
}

@media (max-width: 480px) {
  .six-sixths {
    width: 100%;
  }
}
.six-sevenths,
.xs-six-sevenths {
  width: 85.71429%;
}

@media (max-width: 480px) {
  .six-sevenths {
    width: 100%;
  }
}
.six-eighths,
.xs-six-eighths {
  width: 75%;
}

@media (max-width: 480px) {
  .six-eighths {
    width: 100%;
  }
}
.six-ninths,
.xs-six-ninths {
  width: 66.66667%;
}

@media (max-width: 480px) {
  .six-ninths {
    width: 100%;
  }
}
.six-tenths,
.xs-six-tenths {
  width: 60%;
}

@media (max-width: 480px) {
  .six-tenths {
    width: 100%;
  }
}
.six-elevenths,
.xs-six-elevenths {
  width: 54.54545%;
}

@media (max-width: 480px) {
  .six-elevenths {
    width: 100%;
  }
}
.six-twelfths,
.xs-six-twelfths {
  width: 50%;
}

@media (max-width: 480px) {
  .six-twelfths {
    width: 100%;
  }
}
.seven-sevenths,
.xs-seven-sevenths {
  width: 100%;
}

@media (max-width: 480px) {
  .seven-sevenths {
    width: 100%;
  }
}
.seven-eighths,
.xs-seven-eighths {
  width: 87.5%;
}

@media (max-width: 480px) {
  .seven-eighths {
    width: 100%;
  }
}
.seven-ninths,
.xs-seven-ninths {
  width: 77.77778%;
}

@media (max-width: 480px) {
  .seven-ninths {
    width: 100%;
  }
}
.seven-tenths,
.xs-seven-tenths {
  width: 70%;
}

@media (max-width: 480px) {
  .seven-tenths {
    width: 100%;
  }
}
.seven-elevenths,
.xs-seven-elevenths {
  width: 63.63636%;
}

@media (max-width: 480px) {
  .seven-elevenths {
    width: 100%;
  }
}
.seven-twelfths,
.xs-seven-twelfths {
  width: 58.33333%;
}

@media (max-width: 480px) {
  .seven-twelfths {
    width: 100%;
  }
}
.eight-eighths,
.xs-eight-eighths {
  width: 100%;
}

@media (max-width: 480px) {
  .eight-eighths {
    width: 100%;
  }
}
.eight-ninths,
.xs-eight-ninths {
  width: 88.88889%;
}

@media (max-width: 480px) {
  .eight-ninths {
    width: 100%;
  }
}
.eight-tenths,
.xs-eight-tenths {
  width: 80%;
}

@media (max-width: 480px) {
  .eight-tenths {
    width: 100%;
  }
}
.eight-elevenths,
.xs-eight-elevenths {
  width: 72.72727%;
}

@media (max-width: 480px) {
  .eight-elevenths {
    width: 100%;
  }
}
.eight-twelfths,
.xs-eight-twelfths {
  width: 66.66667%;
}

@media (max-width: 480px) {
  .eight-twelfths {
    width: 100%;
  }
}
.nine-ninths,
.xs-nine-ninths {
  width: 100%;
}

@media (max-width: 480px) {
  .nine-ninths {
    width: 100%;
  }
}
.nine-tenths,
.xs-nine-tenths {
  width: 90%;
}

@media (max-width: 480px) {
  .nine-tenths {
    width: 100%;
  }
}
.nine-elevenths,
.xs-nine-elevenths {
  width: 81.81818%;
}

@media (max-width: 480px) {
  .nine-elevenths {
    width: 100%;
  }
}
.nine-twelfths,
.xs-nine-twelfths {
  width: 75%;
}

@media (max-width: 480px) {
  .nine-twelfths {
    width: 100%;
  }
}
.ten-tenths,
.xs-ten-tenths {
  width: 100%;
}

@media (max-width: 480px) {
  .ten-tenths {
    width: 100%;
  }
}
.ten-elevenths,
.xs-ten-elevenths {
  width: 90.90909%;
}

@media (max-width: 480px) {
  .ten-elevenths {
    width: 100%;
  }
}
.ten-twelfths,
.xs-ten-twelfths {
  width: 83.33333%;
}

@media (max-width: 480px) {
  .ten-twelfths {
    width: 100%;
  }
}
.eleven-elevenths,
.xs-eleven-elevenths {
  width: 100%;
}

@media (max-width: 480px) {
  .eleven-elevenths {
    width: 100%;
  }
}
.eleven-twelfths,
.xs-eleven-twelfths {
  width: 91.66667%;
}

@media (max-width: 480px) {
  .eleven-twelfths {
    width: 100%;
  }
}
.twelve-twelfths,
.xs-twelve-twelfths {
  width: 100%;
}

@media (max-width: 480px) {
  .twelve-twelfths {
    width: 100%;
  }
}
/*! Screen specific widths */
@media (max-width: 480px) {
  .xs-one-whole {
    width: 100%;
  }

  .xs-one-half {
    width: 50%;
  }

  .xs-one-third {
    width: 33.33333%;
  }

  .xs-one-quarter {
    width: 25%;
  }

  .xs-one-fifth {
    width: 20%;
  }

  .xs-one-sixth {
    width: 16.66667%;
  }

  .xs-one-seventh {
    width: 14.28571%;
  }

  .xs-one-eighth {
    width: 12.5%;
  }

  .xs-one-ninth {
    width: 11.11111%;
  }

  .xs-one-tenth {
    width: 10%;
  }

  .xs-one-eleventh {
    width: 9.09091%;
  }

  .xs-one-twelfth {
    width: 8.33333%;
  }

  .xs-two-halfs {
    width: 100%;
  }

  .xs-two-thirds {
    width: 66.66667%;
  }

  .xs-two-quarters {
    width: 50%;
  }

  .xs-two-fifths {
    width: 40%;
  }

  .xs-two-sixths {
    width: 33.33333%;
  }

  .xs-two-sevenths {
    width: 28.57143%;
  }

  .xs-two-eighths {
    width: 25%;
  }

  .xs-two-ninths {
    width: 22.22222%;
  }

  .xs-two-tenths {
    width: 20%;
  }

  .xs-two-elevenths {
    width: 18.18182%;
  }

  .xs-two-twelfths {
    width: 16.66667%;
  }

  .xs-three-thirds {
    width: 100%;
  }

  .xs-three-quarters {
    width: 75%;
  }

  .xs-three-fifths {
    width: 60%;
  }

  .xs-three-sixths {
    width: 50%;
  }

  .xs-three-sevenths {
    width: 42.85714%;
  }

  .xs-three-eighths {
    width: 37.5%;
  }

  .xs-three-ninths {
    width: 33.33333%;
  }

  .xs-three-tenths {
    width: 30%;
  }

  .xs-three-elevenths {
    width: 27.27273%;
  }

  .xs-three-twelfths {
    width: 25%;
  }

  .xs-four-quarters {
    width: 100%;
  }

  .xs-four-fifths {
    width: 80%;
  }

  .xs-four-sixths {
    width: 66.66667%;
  }

  .xs-four-sevenths {
    width: 57.14286%;
  }

  .xs-four-eighths {
    width: 50%;
  }

  .xs-four-ninths {
    width: 44.44444%;
  }

  .xs-four-tenths {
    width: 40%;
  }

  .xs-four-elevenths {
    width: 36.36364%;
  }

  .xs-four-twelfths {
    width: 33.33333%;
  }

  .xs-five-fifths {
    width: 100%;
  }

  .xs-five-sixths {
    width: 83.33333%;
  }

  .xs-five-sevenths {
    width: 71.42857%;
  }

  .xs-five-eighths {
    width: 62.5%;
  }

  .xs-five-ninths {
    width: 55.55556%;
  }

  .xs-five-tenths {
    width: 50%;
  }

  .xs-five-elevenths {
    width: 45.45455%;
  }

  .xs-five-twelfths {
    width: 41.66667%;
  }

  .xs-six-sixths {
    width: 100%;
  }

  .xs-six-sevenths {
    width: 85.71429%;
  }

  .xs-six-eighths {
    width: 75%;
  }

  .xs-six-ninths {
    width: 66.66667%;
  }

  .xs-six-tenths {
    width: 60%;
  }

  .xs-six-elevenths {
    width: 54.54545%;
  }

  .xs-six-twelfths {
    width: 50%;
  }

  .xs-seven-sevenths {
    width: 100%;
  }

  .xs-seven-eighths {
    width: 87.5%;
  }

  .xs-seven-ninths {
    width: 77.77778%;
  }

  .xs-seven-tenths {
    width: 70%;
  }

  .xs-seven-elevenths {
    width: 63.63636%;
  }

  .xs-seven-twelfths {
    width: 58.33333%;
  }

  .xs-eight-eighths {
    width: 100%;
  }

  .xs-eight-ninths {
    width: 88.88889%;
  }

  .xs-eight-tenths {
    width: 80%;
  }

  .xs-eight-elevenths {
    width: 72.72727%;
  }

  .xs-eight-twelfths {
    width: 66.66667%;
  }

  .xs-nine-ninths {
    width: 100%;
  }

  .xs-nine-tenths {
    width: 90%;
  }

  .xs-nine-elevenths {
    width: 81.81818%;
  }

  .xs-nine-twelfths {
    width: 75%;
  }

  .xs-ten-tenths {
    width: 100%;
  }

  .xs-ten-elevenths {
    width: 90.90909%;
  }

  .xs-ten-twelfths {
    width: 83.33333%;
  }

  .xs-eleven-elevenths {
    width: 100%;
  }

  .xs-eleven-twelfths {
    width: 91.66667%;
  }

  .xs-twelve-twelfths {
    width: 100%;
  }

  .xs-hide {
    display: none !important;
  }
}
@media (min-width: 481px) {
  .sm-one-whole {
    width: 100%;
  }

  .sm-one-half {
    width: 50%;
  }

  .sm-one-third {
    width: 33.33333%;
  }

  .sm-one-quarter {
    width: 25%;
  }

  .sm-one-fifth {
    width: 20%;
  }

  .sm-one-sixth {
    width: 16.66667%;
  }

  .sm-one-seventh {
    width: 14.28571%;
  }

  .sm-one-eighth {
    width: 12.5%;
  }

  .sm-one-ninth {
    width: 11.11111%;
  }

  .sm-one-tenth {
    width: 10%;
  }

  .sm-one-eleventh {
    width: 9.09091%;
  }

  .sm-one-twelfth {
    width: 8.33333%;
  }

  .sm-two-halfs {
    width: 100%;
  }

  .sm-two-thirds {
    width: 66.66667%;
  }

  .sm-two-quarters {
    width: 50%;
  }

  .sm-two-fifths {
    width: 40%;
  }

  .sm-two-sixths {
    width: 33.33333%;
  }

  .sm-two-sevenths {
    width: 28.57143%;
  }

  .sm-two-eighths {
    width: 25%;
  }

  .sm-two-ninths {
    width: 22.22222%;
  }

  .sm-two-tenths {
    width: 20%;
  }

  .sm-two-elevenths {
    width: 18.18182%;
  }

  .sm-two-twelfths {
    width: 16.66667%;
  }

  .sm-three-thirds {
    width: 100%;
  }

  .sm-three-quarters {
    width: 75%;
  }

  .sm-three-fifths {
    width: 60%;
  }

  .sm-three-sixths {
    width: 50%;
  }

  .sm-three-sevenths {
    width: 42.85714%;
  }

  .sm-three-eighths {
    width: 37.5%;
  }

  .sm-three-ninths {
    width: 33.33333%;
  }

  .sm-three-tenths {
    width: 30%;
  }

  .sm-three-elevenths {
    width: 27.27273%;
  }

  .sm-three-twelfths {
    width: 25%;
  }

  .sm-four-quarters {
    width: 100%;
  }

  .sm-four-fifths {
    width: 80%;
  }

  .sm-four-sixths {
    width: 66.66667%;
  }

  .sm-four-sevenths {
    width: 57.14286%;
  }

  .sm-four-eighths {
    width: 50%;
  }

  .sm-four-ninths {
    width: 44.44444%;
  }

  .sm-four-tenths {
    width: 40%;
  }

  .sm-four-elevenths {
    width: 36.36364%;
  }

  .sm-four-twelfths {
    width: 33.33333%;
  }

  .sm-five-fifths {
    width: 100%;
  }

  .sm-five-sixths {
    width: 83.33333%;
  }

  .sm-five-sevenths {
    width: 71.42857%;
  }

  .sm-five-eighths {
    width: 62.5%;
  }

  .sm-five-ninths {
    width: 55.55556%;
  }

  .sm-five-tenths {
    width: 50%;
  }

  .sm-five-elevenths {
    width: 45.45455%;
  }

  .sm-five-twelfths {
    width: 41.66667%;
  }

  .sm-six-sixths {
    width: 100%;
  }

  .sm-six-sevenths {
    width: 85.71429%;
  }

  .sm-six-eighths {
    width: 75%;
  }

  .sm-six-ninths {
    width: 66.66667%;
  }

  .sm-six-tenths {
    width: 60%;
  }

  .sm-six-elevenths {
    width: 54.54545%;
  }

  .sm-six-twelfths {
    width: 50%;
  }

  .sm-seven-sevenths {
    width: 100%;
  }

  .sm-seven-eighths {
    width: 87.5%;
  }

  .sm-seven-ninths {
    width: 77.77778%;
  }

  .sm-seven-tenths {
    width: 70%;
  }

  .sm-seven-elevenths {
    width: 63.63636%;
  }

  .sm-seven-twelfths {
    width: 58.33333%;
  }

  .sm-eight-eighths {
    width: 100%;
  }

  .sm-eight-ninths {
    width: 88.88889%;
  }

  .sm-eight-tenths {
    width: 80%;
  }

  .sm-eight-elevenths {
    width: 72.72727%;
  }

  .sm-eight-twelfths {
    width: 66.66667%;
  }

  .sm-nine-ninths {
    width: 100%;
  }

  .sm-nine-tenths {
    width: 90%;
  }

  .sm-nine-elevenths {
    width: 81.81818%;
  }

  .sm-nine-twelfths {
    width: 75%;
  }

  .sm-ten-tenths {
    width: 100%;
  }

  .sm-ten-elevenths {
    width: 90.90909%;
  }

  .sm-ten-twelfths {
    width: 83.33333%;
  }

  .sm-eleven-elevenths {
    width: 100%;
  }

  .sm-eleven-twelfths {
    width: 91.66667%;
  }

  .sm-twelve-twelfths {
    width: 100%;
  }

  .sm-hide {
    display: none !important;
  }
}
@media (min-width: 769px) {
  .md-one-whole {
    width: 100%;
  }

  .md-one-half {
    width: 50%;
  }

  .md-one-third {
    width: 33.33333%;
  }

  .md-one-quarter {
    width: 25%;
  }

  .md-one-fifth {
    width: 20%;
  }

  .md-one-sixth {
    width: 16.66667%;
  }

  .md-one-seventh {
    width: 14.28571%;
  }

  .md-one-eighth {
    width: 12.5%;
  }

  .md-one-ninth {
    width: 11.11111%;
  }

  .md-one-tenth {
    width: 10%;
  }

  .md-one-eleventh {
    width: 9.09091%;
  }

  .md-one-twelfth {
    width: 8.33333%;
  }

  .md-two-halfs {
    width: 100%;
  }

  .md-two-thirds {
    width: 66.66667%;
  }

  .md-two-quarters {
    width: 50%;
  }

  .md-two-fifths {
    width: 40%;
  }

  .md-two-sixths {
    width: 33.33333%;
  }

  .md-two-sevenths {
    width: 28.57143%;
  }

  .md-two-eighths {
    width: 25%;
  }

  .md-two-ninths {
    width: 22.22222%;
  }

  .md-two-tenths {
    width: 20%;
  }

  .md-two-elevenths {
    width: 18.18182%;
  }

  .md-two-twelfths {
    width: 16.66667%;
  }

  .md-three-thirds {
    width: 100%;
  }

  .md-three-quarters {
    width: 75%;
  }

  .md-three-fifths {
    width: 60%;
  }

  .md-three-sixths {
    width: 50%;
  }

  .md-three-sevenths {
    width: 42.85714%;
  }

  .md-three-eighths {
    width: 37.5%;
  }

  .md-three-ninths {
    width: 33.33333%;
  }

  .md-three-tenths {
    width: 30%;
  }

  .md-three-elevenths {
    width: 27.27273%;
  }

  .md-three-twelfths {
    width: 25%;
  }

  .md-four-quarters {
    width: 100%;
  }

  .md-four-fifths {
    width: 80%;
  }

  .md-four-sixths {
    width: 66.66667%;
  }

  .md-four-sevenths {
    width: 57.14286%;
  }

  .md-four-eighths {
    width: 50%;
  }

  .md-four-ninths {
    width: 44.44444%;
  }

  .md-four-tenths {
    width: 40%;
  }

  .md-four-elevenths {
    width: 36.36364%;
  }

  .md-four-twelfths {
    width: 33.33333%;
  }

  .md-five-fifths {
    width: 100%;
  }

  .md-five-sixths {
    width: 83.33333%;
  }

  .md-five-sevenths {
    width: 71.42857%;
  }

  .md-five-eighths {
    width: 62.5%;
  }

  .md-five-ninths {
    width: 55.55556%;
  }

  .md-five-tenths {
    width: 50%;
  }

  .md-five-elevenths {
    width: 45.45455%;
  }

  .md-five-twelfths {
    width: 41.66667%;
  }

  .md-six-sixths {
    width: 100%;
  }

  .md-six-sevenths {
    width: 85.71429%;
  }

  .md-six-eighths {
    width: 75%;
  }

  .md-six-ninths {
    width: 66.66667%;
  }

  .md-six-tenths {
    width: 60%;
  }

  .md-six-elevenths {
    width: 54.54545%;
  }

  .md-six-twelfths {
    width: 50%;
  }

  .md-seven-sevenths {
    width: 100%;
  }

  .md-seven-eighths {
    width: 87.5%;
  }

  .md-seven-ninths {
    width: 77.77778%;
  }

  .md-seven-tenths {
    width: 70%;
  }

  .md-seven-elevenths {
    width: 63.63636%;
  }

  .md-seven-twelfths {
    width: 58.33333%;
  }

  .md-eight-eighths {
    width: 100%;
  }

  .md-eight-ninths {
    width: 88.88889%;
  }

  .md-eight-tenths {
    width: 80%;
  }

  .md-eight-elevenths {
    width: 72.72727%;
  }

  .md-eight-twelfths {
    width: 66.66667%;
  }

  .md-nine-ninths {
    width: 100%;
  }

  .md-nine-tenths {
    width: 90%;
  }

  .md-nine-elevenths {
    width: 81.81818%;
  }

  .md-nine-twelfths {
    width: 75%;
  }

  .md-ten-tenths {
    width: 100%;
  }

  .md-ten-elevenths {
    width: 90.90909%;
  }

  .md-ten-twelfths {
    width: 83.33333%;
  }

  .md-eleven-elevenths {
    width: 100%;
  }

  .md-eleven-twelfths {
    width: 91.66667%;
  }

  .md-twelve-twelfths {
    width: 100%;
  }

  .md-hide {
    display: none !important;
  }
}
@media (min-width: 1025px) {
  .lg-one-whole {
    width: 100%;
  }

  .lg-one-half {
    width: 50%;
  }

  .lg-one-third {
    width: 33.33333%;
  }

  .lg-one-quarter {
    width: 25%;
  }

  .lg-one-fifth {
    width: 20%;
  }

  .lg-one-sixth {
    width: 16.66667%;
  }

  .lg-one-seventh {
    width: 14.28571%;
  }

  .lg-one-eighth {
    width: 12.5%;
  }

  .lg-one-ninth {
    width: 11.11111%;
  }

  .lg-one-tenth {
    width: 10%;
  }

  .lg-one-eleventh {
    width: 9.09091%;
  }

  .lg-one-twelfth {
    width: 8.33333%;
  }

  .lg-two-halfs {
    width: 100%;
  }

  .lg-two-thirds {
    width: 66.66667%;
  }

  .lg-two-quarters {
    width: 50%;
  }

  .lg-two-fifths {
    width: 40%;
  }

  .lg-two-sixths {
    width: 33.33333%;
  }

  .lg-two-sevenths {
    width: 28.57143%;
  }

  .lg-two-eighths {
    width: 25%;
  }

  .lg-two-ninths {
    width: 22.22222%;
  }

  .lg-two-tenths {
    width: 20%;
  }

  .lg-two-elevenths {
    width: 18.18182%;
  }

  .lg-two-twelfths {
    width: 16.66667%;
  }

  .lg-three-thirds {
    width: 100%;
  }

  .lg-three-quarters {
    width: 75%;
  }

  .lg-three-fifths {
    width: 60%;
  }

  .lg-three-sixths {
    width: 50%;
  }

  .lg-three-sevenths {
    width: 42.85714%;
  }

  .lg-three-eighths {
    width: 37.5%;
  }

  .lg-three-ninths {
    width: 33.33333%;
  }

  .lg-three-tenths {
    width: 30%;
  }

  .lg-three-elevenths {
    width: 27.27273%;
  }

  .lg-three-twelfths {
    width: 25%;
  }

  .lg-four-quarters {
    width: 100%;
  }

  .lg-four-fifths {
    width: 80%;
  }

  .lg-four-sixths {
    width: 66.66667%;
  }

  .lg-four-sevenths {
    width: 57.14286%;
  }

  .lg-four-eighths {
    width: 50%;
  }

  .lg-four-ninths {
    width: 44.44444%;
  }

  .lg-four-tenths {
    width: 40%;
  }

  .lg-four-elevenths {
    width: 36.36364%;
  }

  .lg-four-twelfths {
    width: 33.33333%;
  }

  .lg-five-fifths {
    width: 100%;
  }

  .lg-five-sixths {
    width: 83.33333%;
  }

  .lg-five-sevenths {
    width: 71.42857%;
  }

  .lg-five-eighths {
    width: 62.5%;
  }

  .lg-five-ninths {
    width: 55.55556%;
  }

  .lg-five-tenths {
    width: 50%;
  }

  .lg-five-elevenths {
    width: 45.45455%;
  }

  .lg-five-twelfths {
    width: 41.66667%;
  }

  .lg-six-sixths {
    width: 100%;
  }

  .lg-six-sevenths {
    width: 85.71429%;
  }

  .lg-six-eighths {
    width: 75%;
  }

  .lg-six-ninths {
    width: 66.66667%;
  }

  .lg-six-tenths {
    width: 60%;
  }

  .lg-six-elevenths {
    width: 54.54545%;
  }

  .lg-six-twelfths {
    width: 50%;
  }

  .lg-seven-sevenths {
    width: 100%;
  }

  .lg-seven-eighths {
    width: 87.5%;
  }

  .lg-seven-ninths {
    width: 77.77778%;
  }

  .lg-seven-tenths {
    width: 70%;
  }

  .lg-seven-elevenths {
    width: 63.63636%;
  }

  .lg-seven-twelfths {
    width: 58.33333%;
  }

  .lg-eight-eighths {
    width: 100%;
  }

  .lg-eight-ninths {
    width: 88.88889%;
  }

  .lg-eight-tenths {
    width: 80%;
  }

  .lg-eight-elevenths {
    width: 72.72727%;
  }

  .lg-eight-twelfths {
    width: 66.66667%;
  }

  .lg-nine-ninths {
    width: 100%;
  }

  .lg-nine-tenths {
    width: 90%;
  }

  .lg-nine-elevenths {
    width: 81.81818%;
  }

  .lg-nine-twelfths {
    width: 75%;
  }

  .lg-ten-tenths {
    width: 100%;
  }

  .lg-ten-elevenths {
    width: 90.90909%;
  }

  .lg-ten-twelfths {
    width: 83.33333%;
  }

  .lg-eleven-elevenths {
    width: 100%;
  }

  .lg-eleven-twelfths {
    width: 91.66667%;
  }

  .lg-twelve-twelfths {
    width: 100%;
  }

  .lg-hide {
    display: none !important;
  }
}
@media (min-width: 1401px) {
  .xl-one-whole {
    width: 100%;
  }

  .xl-one-half {
    width: 50%;
  }

  .xl-one-third {
    width: 33.33333%;
  }

  .xl-one-quarter {
    width: 25%;
  }

  .xl-one-fifth {
    width: 20%;
  }

  .xl-one-sixth {
    width: 16.66667%;
  }

  .xl-one-seventh {
    width: 14.28571%;
  }

  .xl-one-eighth {
    width: 12.5%;
  }

  .xl-one-ninth {
    width: 11.11111%;
  }

  .xl-one-tenth {
    width: 10%;
  }

  .xl-one-eleventh {
    width: 9.09091%;
  }

  .xl-one-twelfth {
    width: 8.33333%;
  }

  .xl-two-halfs {
    width: 100%;
  }

  .xl-two-thirds {
    width: 66.66667%;
  }

  .xl-two-quarters {
    width: 50%;
  }

  .xl-two-fifths {
    width: 40%;
  }

  .xl-two-sixths {
    width: 33.33333%;
  }

  .xl-two-sevenths {
    width: 28.57143%;
  }

  .xl-two-eighths {
    width: 25%;
  }

  .xl-two-ninths {
    width: 22.22222%;
  }

  .xl-two-tenths {
    width: 20%;
  }

  .xl-two-elevenths {
    width: 18.18182%;
  }

  .xl-two-twelfths {
    width: 16.66667%;
  }

  .xl-three-thirds {
    width: 100%;
  }

  .xl-three-quarters {
    width: 75%;
  }

  .xl-three-fifths {
    width: 60%;
  }

  .xl-three-sixths {
    width: 50%;
  }

  .xl-three-sevenths {
    width: 42.85714%;
  }

  .xl-three-eighths {
    width: 37.5%;
  }

  .xl-three-ninths {
    width: 33.33333%;
  }

  .xl-three-tenths {
    width: 30%;
  }

  .xl-three-elevenths {
    width: 27.27273%;
  }

  .xl-three-twelfths {
    width: 25%;
  }

  .xl-four-quarters {
    width: 100%;
  }

  .xl-four-fifths {
    width: 80%;
  }

  .xl-four-sixths {
    width: 66.66667%;
  }

  .xl-four-sevenths {
    width: 57.14286%;
  }

  .xl-four-eighths {
    width: 50%;
  }

  .xl-four-ninths {
    width: 44.44444%;
  }

  .xl-four-tenths {
    width: 40%;
  }

  .xl-four-elevenths {
    width: 36.36364%;
  }

  .xl-four-twelfths {
    width: 33.33333%;
  }

  .xl-five-fifths {
    width: 100%;
  }

  .xl-five-sixths {
    width: 83.33333%;
  }

  .xl-five-sevenths {
    width: 71.42857%;
  }

  .xl-five-eighths {
    width: 62.5%;
  }

  .xl-five-ninths {
    width: 55.55556%;
  }

  .xl-five-tenths {
    width: 50%;
  }

  .xl-five-elevenths {
    width: 45.45455%;
  }

  .xl-five-twelfths {
    width: 41.66667%;
  }

  .xl-six-sixths {
    width: 100%;
  }

  .xl-six-sevenths {
    width: 85.71429%;
  }

  .xl-six-eighths {
    width: 75%;
  }

  .xl-six-ninths {
    width: 66.66667%;
  }

  .xl-six-tenths {
    width: 60%;
  }

  .xl-six-elevenths {
    width: 54.54545%;
  }

  .xl-six-twelfths {
    width: 50%;
  }

  .xl-seven-sevenths {
    width: 100%;
  }

  .xl-seven-eighths {
    width: 87.5%;
  }

  .xl-seven-ninths {
    width: 77.77778%;
  }

  .xl-seven-tenths {
    width: 70%;
  }

  .xl-seven-elevenths {
    width: 63.63636%;
  }

  .xl-seven-twelfths {
    width: 58.33333%;
  }

  .xl-eight-eighths {
    width: 100%;
  }

  .xl-eight-ninths {
    width: 88.88889%;
  }

  .xl-eight-tenths {
    width: 80%;
  }

  .xl-eight-elevenths {
    width: 72.72727%;
  }

  .xl-eight-twelfths {
    width: 66.66667%;
  }

  .xl-nine-ninths {
    width: 100%;
  }

  .xl-nine-tenths {
    width: 90%;
  }

  .xl-nine-elevenths {
    width: 81.81818%;
  }

  .xl-nine-twelfths {
    width: 75%;
  }

  .xl-ten-tenths {
    width: 100%;
  }

  .xl-ten-elevenths {
    width: 90.90909%;
  }

  .xl-ten-twelfths {
    width: 83.33333%;
  }

  .xl-eleven-elevenths {
    width: 100%;
  }

  .xl-eleven-twelfths {
    width: 91.66667%;
  }

  .xl-twelve-twelfths {
    width: 100%;
  }

  .xl-hide {
    display: none !important;
  }
}