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

/*

Grid 1200px
Nicolas Poliquin
polikin.ca

*/


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */
.nxcelda {  padding-left: 10px;padding-right: 10px; }

.columns, 
.column { 	
	-webkit-transition: all 0.2s ease;
	  -moz-transition: all 0.2s ease;
	  -moz-transition: all 0.2s ease;
	  -ms-transition: all 0.2s ease;
	  -o-transition: all 0.2s ease;
	  transition: all 0.2s ease;
}



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

		.container { width: 400px; }
		.container .columns,
		.container .column { margin: 0; }

    .container .sixteen.columns                 { width: 360px; }
    .container .twelve.columns                  { width: 360px; }
    .container .eight.columns                   { width: 360px; }
    .container .six.columns                     { width: 300px; }
    .container .four.columns                    { width: 300px; }
    .container .four-i.columns                  { width: 300px; }
		
    .container .one-third.column                { width: 300px; }
    .container .one-third-i.column              { width: 300px; }
    .container .two-thirds.column               { width: 360px; }

		.container .cols1.columns,
		.container .cols2.columns,
		.container .cols3.columns,
		.container .cols4.columns,
    .container .cols5.columns,
    .container .cols6.columns,
    .container .cols7.columns,
    .container .cols8.columns ,
    .container .cols9.columns,
    .container .cols10.columns,
    .container .cols11.columns,
    .container .cols12.columns                  { width: 360px; }
	
	}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 540px) {
		.container { width: 540px; }
		.container .columns,
		.container .column { margin: 0; }
				
    .container .sixteen.columns                 { width: 500px; }
    .container .twelve.columns                  { width: 500px; }
    .container .eight.columns                   { width: 400px; }
    .container .six.columns                     { width: 300px; }
    .container .four.columns                    { width: 200px; }
    .container .four-i.columns                  { width: 200px; }
		
    .container .one-third.column                { width: 300px; }
    .container .one-third-i.column              { width: 400px; }
    .container .two-thirds.column               { width: 500px; }
		
		.container .cols1.columns,
		.container .cols2.columns,
		.container .cols3.columns,
		.container .cols4.columns,
    .container .cols5.columns,
    .container .cols6.columns,
    .container .cols7.columns,
    .container .cols8.columns ,
    .container .cols9.columns,
    .container .cols10.columns,
    .container .cols11.columns,
    .container .cols12.columns                  { width: 500px; }

	}

/* Larger than tablet */
@media (min-width: 760px) {
	
    .container                    { position: relative; width: 800px; margin: 0 auto; padding: 0; }
    .container .column,
    .container .columns           { float: left; display: inline; margin-left: 00px; margin-right: 00px; }
    .row                                        { margin-bottom: 20px; }
	
    .container .sixteen.columns                 { width: 800px; }
    .container .twelve.columns                  { width: 600px; }
    .container .eight.columns                   { width: 400px; }
    .container .six.columns                     { width: 300px; }
    .container .four.columns                    { width: 200px; }
    .container .four-i.columns                  { width: 180px; }
		
    .container .one-third.column                { width: 267px; }
    .container .one-third-i.column              { width: 247px; }
    .container .two-thirds.column               { width: 533px; }
		
		.container .cols1.columns										{ width: 100%; }
		.container .cols2.columns										{ width: 50%; }
		.container .cols3.columns										{ width: 33.3333%; }
		.container .cols4.columns										{ width: 25%; }
    .container .cols5.columns                   { width: 20%; }
    .container .cols6.columns                   { width: 16.6666%; }
    .container .cols7.columns                   { width: 14.2857%; }
    .container .cols8.columns                   { width: 12.5%; }
    .container .cols9.columns                   { width: 11.1111%; }
    .container .cols10.columns                  { width: 10%; }
    .container .cols11.columns                  { width: 9.0909%; }
    .container .cols12.columns                  { width: 8.3333%; }
	
	}

/* Larger than desktop */
@media (min-width: 960px) {
	
    .container                    { position: relative; width: 960px; margin: 0 auto; padding: 0; }
    .container .column,
    .container .columns           { float: left; display: inline; margin-left: 00px; margin-right: 00px; }
    .row                                        { margin-bottom: 20px; }
		
    .container .sixteen.columns                 { width: 960px; }
    .container .twelve.columns                  { width: 720px; }
    .container .eight.columns                   { width: 480px; }
    .container .six.columns                     { width: 360px; }
    .container .four.columns                    { width: 240px; }
    .container .four-i.columns                  { width: 220px; }
		
    .container .one-third.column                { width: 320px; }
    .container .one-third-i.column              { width: 300px; }
    .container .two-thirds.column               { width: 640px; }

		.container .cols1.columns										{ width: 100%; }
		.container .cols2.columns										{ width: 50%; }
		.container .cols3.columns										{ width: 33.3333%; }
		.container .cols4.columns										{ width: 25%; }
    .container .cols5.columns                   { width: 20%; }
    .container .cols6.columns                   { width: 16.6666%; }
    .container .cols7.columns                   { width: 14.2857%; }
    .container .cols8.columns                   { width: 12.5%; }
    .container .cols9.columns                   { width: 11.1111%; }
    .container .cols10.columns                  { width: 10%; }
    .container .cols11.columns                  { width: 9.0909%; }
    .container .cols12.columns                  { width: 8.3333%; }
	
	}

/* Larger than Desktop HD */
@media (min-width: 1200px) {
	
    .container                    { position: relative; width: 1200px; margin: 0 auto; padding: 0; }
    .container .column,
    .container .columns           { float: left; display: inline; margin-left: 00px; margin-right: 00px; }
    .row                                        { margin-bottom: 20px; }

    .container .sixteen.columns                 { width: 1200px; }
    .container .twelve.columns                  { width: 900px; }
    .container .eight.columns                   { width: 600px; }
    .container .six.columns                     { width: 450px; }
    .container .four.columns                    { width: 300px; }
    .container .four-i.columns                  { width: 280px; }
		
    .container .one-third.column                { width: 400px; }
    .container .one-third-i.column              { width: 380px; }
    .container .two-thirds.column               { width: 800px; }

		.container .cols1.columns										{ width: 100%; }
		.container .cols2.columns										{ width: 50%; }
		.container .cols3.columns										{ width: 33.3333%; }
		.container .cols4.columns										{ width: 25%; }
    .container .cols5.columns                   { width: 20%; }
    .container .cols6.columns                   { width: 16.6666%; }
    .container .cols7.columns                   { width: 14.2857%; }
    .container .cols8.columns                   { width: 12.5%; }
    .container .cols9.columns                   { width: 11.1111%; }
    .container .cols10.columns                  { width: 10%; }
    .container .cols11.columns                  { width: 9.0909%; }
    .container .cols12.columns                  { width: 8.3333%; }
	
	}



/* #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;
    }
