/**
 * Gridpak Beta SCSS
 *
 * Generator - http://gridpak.com/
 * Created by @simplygoodwork
 */
/* Reusable column setup */
.col {
  border: 0px solid transparent;
  float: left;
  /*    -webkit-box-sizing:border-box;
      -moz-box-sizing:border-box;
      box-sizing:border-box;
      -moz-background-clip:padding-box !important;
      -webkit-background-clip:padding-box !important;
      background-clip:padding-box !important; */ }

    /* 1. 1 Column Grid 0px - 479px
    -----------------------------------------------------------------------------

    Span 1:    100%

    ----------------------------------------------------------------------------- */
@media screen and (min-width: 0px) and (max-width: 767px) {
  .col, .col-first, .col-last {
    margin-left: 0%;
    padding-top: 0%;
    padding-left: 4%;
    padding-right: 4%;
    float: none; }

  /* --- Gridpak variables ---*/
  .row .col:first-child {
    margin-left: 0;
    padding: 0; }

  .span-1 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-2 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-3 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-4 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-5 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-6 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-7 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-8 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-9 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-10 {
    width: 92%;
    border-left-width: 0;
    margin-left: 0%; }

        /*
        Add your semantic classnames in alongside their corresponding spans here. e.g.

        .span_3,
        .my_semantic_class_name {
            ...
        }

        */
  .span-1 {
    margin-left: 0;
    padding: 0;
    width: 100%; } }
    /* 2. 10 Column Grid 480px - Infinity
    -----------------------------------------------------------------------------

    Span 1:    10.0%
    Span 2:    20.0%
    Span 3:    30.0%
    Span 4:    40.0%
    Span 5:    50.0%
    Span 6:    60.0%
    Span 7:    70.0%
    Span 8:    80.0%
    Span 9:    90.0%
    Span 10:    100%

    ----------------------------------------------------------------------------- */
@media screen and (min-width: 768px) {
  /* --- Gridpak variables ---*/
  .col {
    margin-left: 0%;
    padding-top: 0%;
    padding-left: 1%;
    padding-right: 1%;
    float: left; }

  .col-first {
    margin-left: 0%;
    padding: 0 2% 0 0;
    float: left; }

  .col-last {
    margin-left: 0%;
    padding: 0 0 0 2%;
    float: left; }

  .row-first {
    height: 6.714em;
    margin-bottom: 0; }

  .row .col:first-child {
    margin-left: 0;
    padding: 0; }

  .span-1 {
    width: 8%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-2 {
    width: 18%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-3 {
    width: 28%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-4 {
    width: 38%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-5 {
    width: 48%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-6 {
    width: 58%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-7 {
    width: 68%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-8 {
    width: 78%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-9 {
    width: 88%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-10 {
    width: 98%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-full {
    width: 100%; }

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

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

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

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

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

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

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

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

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

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

  .row-1 {
    height: 6.714em;
    margin-bottom: 1em; }

  .row-2 {
    height: 13.428em;
    margin-bottom: 1em; }

  .row-3 {
    height: 20.142em;
    margin-bottom: 1em; }

  .row-4 {
    height: 26.856em;
    margin-bottom: 1em; }

  .row-5 {
    height: 33.57em;
    margin-bottom: 1em; }

  .row-6 {
    height: 40.284em;
    margin-bottom: 1em; }

  .row-7 {
    height: 46.998em;
    margin-bottom: 1em; }

  .row-8 {
    height: 53.712em;
    margin-bottom: 1em; }

  .row-9 {
    height: 60.426em;
    margin-bottom: 1em; }

  .row-10 {
    height: 67.14em;
    margin-bottom: 1em; }

  .span-1 .last-edge {
    width: 10%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-2 .last-edge {
    width: 20%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-3 .last-edge {
    width: 30%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-4 .last-edge {
    width: 40%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-5 .last-edge {
    width: 50%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-6 .last-edge {
    width: 60%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-7 .last-edge {
    width: 70%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-8 .last-edge {
    width: 80%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-9 .last-edge {
    width: 90%;
    border-left-width: 0;
    margin-left: 0%; }

  .span-10 .last-edge {
    width: 100%;
    border-left-width: 0;
    margin-left: 0%; } }

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