/*
* Skeleton Responsive 12 Grid System
* Copyright 2013, Jin Zhou
* jin@corporateinteractive.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/


/* Table of Contents
==================================================
  #Base Setup
  #Screen (Standard)
  #Screen (Widescreen)
  #Tablet (Portrait)
  #Mobile (Portrait)
  #Mobile (Landscape)
  #Fix    (Clearfix, borderfix etc) */


/* #Base Setup
================================================== */
    .container                       { margin: 0 auto; }
    .row                             { width: 100%; }
    [class*="span"]                  { display: block; float: left; width: 100%; min-height: 1px; }
    [class*="span"]:first-child      { margin-left: 0; }

    .show                            { display: block; }
    .hide                            { display: none;  }

/* #Screen (Widescreen)
================================================== */

    .container                       { width: 1200px; }
    [class*="span"]                  { margin-left: 2.564102564102564%; margin-right: 0; }

    .span12                          { width: 100%;                }
    .span11                          { width: 91.45299145299145%;  }
    .span10                          { width: 82.90598290598291%;  }
    .span9                           { width: 74.35897435897436%;  }
    .span8                           { width: 65.81196581196582%;  }
    .span7                           { width: 57.26495726495726%;  }
    .span6                           { width: 48.717948717948715%; }
    .span5                           { width: 40.17094017094017%;  }
    .span4                           { width: 31.623931623931625%; }
    .span3                           { width: 23.076923076923077%; }
    .span2                           { width: 14.52991452991453%;  }
    .span1                           { width:  5.982905982905983%; }

    .offset12                        { margin-left: 105.12820512820512%; }
    .offset12:first-child            { margin-left: 102.56410256410257%; }
    .offset11                        { margin-left: 96.58119658119658%;  }
    .offset11:first-child            { margin-left: 94.01709401709402%;  }
    .offset10                        { margin-left: 88.03418803418803%;  }
    .offset10:first-child            { margin-left: 85.47008547008548%;  }
    .offset9                         { margin-left: 79.48717948717949%;  }
    .offset9:first-child             { margin-left: 76.92307692307693%;  }
    .offset8                         { margin-left: 70.94017094017094%;  }
    .offset8:first-child             { margin-left: 68.37606837606839%;  }
    .offset7                         { margin-left: 62.393162393162385%; }
    .offset7:first-child             { margin-left: 59.82905982905982%;  }
    .offset6                         { margin-left: 53.84615384615384%;  }
    .offset6:first-child             { margin-left: 51.28205128205128%;  }
    .offset5                         { margin-left: 45.299145299145295%; }
    .offset5:first-child             { margin-left: 42.73504273504273%;  }
    .offset4                         { margin-left: 36.75213675213675%;  }
    .offset4:first-child             { margin-left: 34.18803418803419%;  }
    .offset3                         { margin-left: 28.205128205128204%; }
    .offset3:first-child             { margin-left: 25.641025641025642%; }
    .offset2                         { margin-left: 19.65811965811966%;  }
    .offset2:first-child             { margin-left: 17.094017094017094%; }
    .offset1                         { margin-left: 11.11111111111111%;  }
    .offset1:first-child             { margin-left:  8.547008547008547%; }

/* #Fix
================================================== */

  /* Use ".clearfix" on parent container or wrap columns in a <div class="row"> to automatically clear nested columns */
  .row:before,
  .row:after,
  .clearfix:before,
  .clearfix:after {
    content: '\0020';
    display: block;
    visibility: hidden;
    width: 0;
    height: 0;
  }
  .row:after,
  .clearfix:after {
    clear: both;
  }

  /* You can also use ".clear" e.g. a <br class="clear" /> to clear columns */
  .clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
  }

  [class*="span"] {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-background-clip: padding-box;
       -moz-background-clip: padding-box;
            background-clip: padding-box;
  }

  @-ms-viewport {
    width: device-width; /* For IE 10 */
  }