
/**
 * Some additional styling for the Skeleton grid
 */


/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

.sm-zero { display: none; }

.sm-one.column,
.sm-one.columns,
.sm-two.columns,
.sm-three.columns,
.sm-four.columns,
.sm-five.columns,
.sm-six.columns,
.sm-seven.columns,
.sm-eight.columns,
.sm-nine.columns,
.sm-ten.columns,
.sm-eleven.columns,
.sm-twelve.columns {
  width: 100%;
  float: left;
  box-sizing: border-box;
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {

  .sm-one.column,
  .sm-one.columns                    { width: 4.66666666667%; }
  .sm-two.columns                    { width: 13.3333333333%; }
  .sm-three.columns                  { width: 22%;            }
  .sm-four.columns                   { width: 30.6666666667%; }
  .sm-five.columns                   { width: 39.3333333333%; }
  .sm-six.columns                    { width: 48%;            }
  .sm-seven.columns                  { width: 56.6666666667%; }
  .sm-eight.columns                  { width: 65.3333333333%; }
  .sm-nine.columns                   { width: 74.0%;          }
  .sm-ten.columns                    { width: 82.6666666667%; }
  .sm-eleven.columns                 { width: 91.3333333333%; }
  .sm-twelve.columns                 { width: 100%; margin-left: 0; }
}

/* Larger than tablet */
@media (min-width: 750px) {

  .sm-zero { display: block; }
  .md-zero { display: none; }

  .sm-twelve.columns                 { margin-left: 4%; }
  .sm-twelve.column:first-child,
  .sm-twelve.columns:first-child     { margin-left: 0; }

  .md-one.column,
  .md-one.columns                    { width: 4.66666666667%; }
  .md-two.columns                    { width: 13.3333333333%; }
  .md-three.columns                  { width: 22%;            }
  .md-four.columns                   { width: 30.6666666667%; }
  .md-five.columns                   { width: 39.3333333333%; }
  .md-six.columns                    { width: 48%;            }
  .md-seven.columns                  { width: 56.6666666667%; }
  .md-eight.columns                  { width: 65.3333333333%; }
  .md-nine.columns                   { width: 74.0%;          }
  .md-ten.columns                    { width: 82.6666666667%; }
  .md-eleven.columns                 { width: 91.3333333333%; }
  .md-twelve.columns                 { width: 100%; margin-left: 0; }
}

/* Larger than tablet */
@media (min-width: 1000px) {

  .md-zero { display: block; }
  .lg-zero { display: none; }

  .sm-twelve.columns                 { margin-left: 4%; }
  .md-twelve.columns                 { margin-left: 4%; }
  .sm-twelve.column:first-child,
  .sm-twelve.columns:first-child     { margin-left: 0; }
  .md-twelve.column:first-child,
  .md-twelve.columns:first-child     { margin-left: 0; }

  .lg-one.column,
  .lg-one.columns                    { width: 4.66666666667%; }
  .lg-two.columns                    { width: 13.3333333333%; }
  .lg-three.columns                  { width: 22%;            }
  .lg-four.columns                   { width: 30.6666666667%; }
  .lg-five.columns                   { width: 39.3333333333%; }
  .lg-six.columns                    { width: 48%;            }
  .lg-seven.columns                  { width: 56.6666666667%; }
  .lg-eight.columns                  { width: 65.3333333333%; }
  .lg-nine.columns                   { width: 74.0%;          }
  .lg-ten.columns                    { width: 82.6666666667%; }
  .lg-eleven.columns                 { width: 91.3333333333%; }
  .lg-twelve.columns                 { width: 100%; margin-left: 0; }
}
