/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Contents
==================================================
    #Macbook pro 1440x900
    #Some laptop 1366x768
    #Macbook air 1280x800
    #Most netbook 1024x600
    #Most Ipad 1024x768
    #IPhone 4 960x640
    #Google nexus one 800x480
    #Meizu M8 one 720x480
    #IPhone 3G/3GS 480x320
    #Mobile 320
    #Clearing 
*/



/* #Base 960 Grid
================================================== */

    .container {
	position: relative;
	width: 1200px;
	margin: 0 auto;
}
.container .column, .container .columns {
	float: left;
	display: inline;
	margin-left: 0px;
	margin-right: 0px;
}
/*.row                                        { margin-bottom: 10px; }*/
/* Nested Column Classes */
    .column.alpha, .columns.alpha {
	margin-left: 0;
}
.column.omega, .columns.omega {
	margin-right: 0;
}
/* Base Grid */
    .container .one.column, .container .one.columns {
	width: 6.25%;
}
.container .two.columns {
	width: 12.5%;
}
.container .three.columns {
	width: 18.75%;
}
.container .four.columns {
	width: 25%;
}
.container .five.columns {
	width: 31.25%;
}
.container .six.columns {
	width: 37.5%;
}
.container .seven.columns {
	width: 43.75%;
}
.container .eight.columns {
	width: 50%;
}
.container .nine.columns {
	width: 56.25%;
}
.container .ten.columns {
	width: 62.5%;
}
.container .eleven.columns {
	width: 68.75%;
}
.container .twelve.columns {
	width: 75%;
}
.container .thirteen.columns {
	width: 81.25%;
}
.container .fourteen.columns {
	width: 87.5%;
}
.container .fifteen.columns {
	width: 93.75%;
}
.container .sixteen.columns {
	width: 100%;
}
.container .one-third.column {
	width: 25%;
}
.container .two-thirds.column {
	width: 66.6%;
}
/* Offsets */
    .container .offset-by-one {
	padding-left: 6.25%;
}
.container .offset-by-two {
	padding-left: 12.5%;
}
.container .offset-by-three {
	padding-left:  18.75%;
}
.container .offset-by-four {
	padding-left: 25%;
}
.container .offset-by-five {
	padding-left: 31.25%;
}
.container .offset-by-six {
	padding-left: 37.5%;
}
.container .offset-by-seven {
	padding-left: 43.75%;
}
.container .offset-by-eight {
	padding-left: 50%;
}
.container .offset-by-nine {
	padding-left: 56.25%;
}
.container .offset-by-ten {
	padding-left: 62.5%;
}
.container .offset-by-eleven {
	padding-left: 68.75%;
}
.container .offset-by-twelve {
	padding-left: 75%;
}
.container .offset-by-thirteen {
	padding-left: 81.25%;
}
.container .offset-by-fourteen {
	padding-left: 87.5%;
}
.container .offset-by-fifteen {
	padding-left: 93.75%;
}
    
    
    
/*Macbook pro 1440x900*/
/*================================================== */
 @media only screen and (min-width: 1366px) and (max-width: 1440px) {
/* .container {
width: 96%
}*/
}
/*Some laptop 1366x768*/
/*================================================== */
 @media only screen and (min-width: 1280px) and (max-width: 1366px) {
/*.container {
width: 96%
}*/
}
/*Macbook air 1280x800*/
/*================================================== */
 @media only screen and (min-width: 1024px) and (max-width: 1280px) {
.container {
width: 94%
}
}
/*Most netbook 1024x600*/
/*================================================== */
 @media only screen and (min-width: 960px) and (max-width: 1024px) {
.container {
width: 94%
}
}
/*Most Ipad 1024x768*/
/*================================================== */
 @media only screen and (min-width: 960px) and (max-width: 1024px) {
.container {
width: 94%
}
}
/*IPhone 4 960x640*/
/*================================================== */
 @media only screen and (min-width: 800px) and (max-width: 960px) {
.container {
width: 94%
}
}
/*Google nexus one 4 800x480*/
/*================================================== */
 @media only screen and (min-width: 720px) and (max-width: 800px) {
.container {
width: 96%
}
}

/*Meizu M8 one 4 720x480*/
/*================================================== */
 @media only screen and (min-width: 480px) and (max-width: 767px) {
.container {
width: 94%;
}
.container .columns, .container .column {
}
 .container .one.column, .container .one.columns, .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 .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column {
width: 100%;
}
}
/*IPhone 3G 480x320*/
/*================================================== */
 @media only screen and (min-width: 320px) and (max-width: 480px) {
.container {
width: 94%;
}
 .container .columns, .container .column {
}
 .container .one.column, .container .one.columns, .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 .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column {
width: 100%;
}
}

/*Mobile*/
/*================================================== */
 @media only screen and (max-width: 320px) {
.container {
width: 94%;
}
 .container .columns, .container .column {
}
 .container .one.column, .container .one.columns, .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 .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column {
width: 100%;
}
}
/* #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;
}
