/*
* Skeleton V1.0.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 5/20/2011
*/


/* Table of Contents
==================================================
  #Base 960 Grid
  #Tablet (Portrait)
  #Mobile (Portrait)
  #Mobile (Landscape)
  #Clearing */


#page-wrapper {
  position: relative;
  width: 940px;
  margin:auto;
}

#page-wrapper.without-bg .contentblock .columns {
  background:none;
  border:none;
}

/* #Base 960 Grid
================================================== */

  .container {
    position: relative;
    width: 960px;
    margin: 0 -10px 10px;
    padding: 0;
    padding-top: 1px;
    top: 0;
    left: 0;
  }

  .container.header-container {
    padding-top: 0;
  }

  .column, .columns {
    float: left;
    display: inline;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 0px;
    margin-top: -1px; /* Firefox topmargin bug */
  }

  .outer .column, .outer .columns, .eight.columns > .contentblock.module-poll, .eight.columns > .contentblock.module-poll_blocks {
    background-color: white;
    border-right: 1px solid #d1d1d1;
    border-bottom: 1px solid #b2b2b2;
    margin-bottom: 10px;
  }

  .row { margin-bottom: 10px; }

  /* Nested Column Classes */
  .column.alpha, .columns.alpha             { margin-left: 0; }
  .column.omega, .columns.omega             { margin-right: 0; }

  .container .one-third.column            { width: 300px; }
  .container .two-thirds.column            { width: 620px; }

  /*****************************
    12 Column
  *****************************/

  /* Base Grid */
  .container-twelve .one.column             { width: 60px;  }
  .container-twelve .two.columns             { width: 140px; }
  .container-twelve .three.columns           { width: 220px; }
  .container-twelve .four.columns           { width: 300px; }
  .container-twelve .five.columns           { width: 380px; }
  .container-twelve .six.columns             { width: 460px; }
  .container-twelve .seven.columns           { width: 540px; }
  .container-twelve .eight.columns           { width: 620px; }
  .container-twelve .nine.columns           { width: 700px; }
  .container-twelve .ten.columns             { width: 780px; }
  .container-twelve .eleven.columns           { width: 860px; }
  .container-twelve .twelve.columns           { width: 940px; }

  /* Offsets */
  .container-twelve .offset-by-one           { margin-left: 80px;  }
  .container-twelve .offset-by-two           { margin-left: 160px; }
  .container-twelve .offset-by-three           { margin-left: 240px; }
  .container-twelve .offset-by-four           { margin-left: 320px; }
  .container-twelve .offset-by-five           { margin-left: 400px; }
  .container-twelve .offset-by-six           { margin-left: 480px; }
  .container-twelve .offset-by-seven           { margin-left: 560px; }
  .container-twelve .offset-by-eight           { margin-left: 640px; }
  .container-twelve .offset-by-nine           { margin-left: 720px; }
  .container-twelve .offset-by-ten           { margin-left: 800px; }
  .container-twelve .offset-by-eleven         { margin-left: 880px; }











/* #Tablet (Portrait)
================================================== */

  /* Note: Design for a width of 768px */
/*
  @media only screen and (min-width: 868px) and (max-width: 959px) {

  #page-wrapper {
    width: 748px;
  }
    .container {
      width: 748px;
      padding: 0 10px;
    }
    /*.container .column,
    .container .columns { margin-left: 10px; margin-right: 10px;  }*/
/*
    .column.alpha, .columns.alpha         { margin-left: 0; margin-right: 10px; }
    .column.omega, .columns.omega         { margin-right: 0; margin-left: 0px; }

    .container .one-third.column        { width: 236px; }
    .container .two-thirds.column        { width: 492px; }

    /*****************************
      12 Column
      ((768/12) - 20) * 1 = 44
    *****************************/
/*
    .container-twelve .one.column           { width: 44px;  }
    .container-twelve .two.columns           { width: 108px; }
    .container-twelve .three.columns         { width: 172px; }
    .container-twelve .four.columns         { width: 236px; }
    .container-twelve .five.columns         { width: 300px; }
    .container-twelve .six.columns           { width: 364px; }
    .container-twelve .seven.columns         { width: 428px; }
    .container-twelve .eight.columns         { width: 492px; }
    .container-twelve .nine.columns         { width: 556px; }
    .container-twelve .ten.columns           { width: 620px; }
    .container-twelve .eleven.columns         { width: 684px; }
    .container-twelve .twelve.columns         { width: 748px; }



    /* Offsets */
/*
    .container-twelve .offset-by-one         { margin-left: 64px;  }
    .container-twelve .offset-by-two         { margin-left: 128px; }
    .container-twelve .offset-by-three         { margin-left: 192px; }
    .container-twelve .offset-by-four         { margin-left: 256px; }
    .container-twelve .offset-by-five         { margin-left: 320px; }
    .container-twelve .offset-by-six         { margin-left: 384px; }
    .container-twelve .offset-by-seven         { margin-left: 448px; }
    .container-twelve .offset-by-eight         { margin-left: 512px; }
    .container-twelve .offset-by-nine         { margin-left: 576px; }
    .container-twelve .offset-by-ten         { margin-left: 640px; }
    .container-twelve .offset-by-eleven       { margin-left: 704px; }


  }
*/

/*  #Mobile (Portrait)
================================================== */

  /* Note: Design for a width of 320px */

  @media only screen and (max-width: 767px) {
  #page-wrapper {
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
  }
  .container {
    width: 100%;
    margin-right: 0px;
    margin-left: 0px;
    margin: 0px;
  }
    .columns, .column { margin: 0; }

    .container .one.column,
    .container .two.columns,
    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
    .container .one-third.column,
    .container .two-thirds.column  {
      width: 97%;
      margin: 1.5%;
      padding: 10px 0;
      border-bottom: 1px solid #d1d1d1;
    }

    /* Offsets */
    .container .offset-by-one,
    .container .offset-by-two,
    .container .offset-by-three,
    .container .offset-by-four,
    .container .offset-by-five,
    .container .offset-by-six,
    .container .offset-by-seven,
    .container .offset-by-eight,
    .container .offset-by-nine,
    .container .offset-by-ten,
    .container .offset-by-eleven,
    .container .offset-by-twelve,
    .container .offset-by-thirteen,
    .container .offset-by-fourteen,
    .container .offset-by-fifteen { margin-left: 0; }

  }


/* #Mobile (Landscape)
================================================== */

  /* Note: Design for a width of 480px */
/*
  @media only screen and (min-width: 768px) and (max-width: 867px) {

  #page-wrapper {
  width: 720px;
  }
    .container { width: 720px;
  margin-right: 0;
  margin-left: 0;
}
    .columns, .column { margin: 0; }

    .container .one.column,
    .container .two.columns,
    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
    .container .one-third.column,
    .container .two-thirds.column { width: 650px; }
  }
*/

/* #Clearing
================================================== */

  /* Self Clearing Goodness */
  .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

  /* Use clearfix class on parent to clear nested columns,
  or wrap each row of columns in a <div class="row"> */
  .clearfix:before,
  .clearfix:after,
  .row:before,
  .row:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0; }
  .row:after,
  .clearfix:after {
    clear: both; }
  .row,
  .clearfix {
    zoom: 1; }

  /* You can also use a <br class="clear" /> to clear columns */
  .clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
  }