
/*
* ColorLabs Responsive Layout Framework for Modernizm
* Copyright 2011, ColorLabs
* www.colorlabsproject.com
* Based on Skeleton and 978.gs
*/

/* #Base 978 Grid
================================================== */
.container {
    position: relative;
    padding: 0;
}

.row {
    margin: 0 auto;
    max-width: 590px;
    min-width: 420px;
    width: 100%
}

	/* Columns */
.column, .columns {
    float: left;
    display: inline;
    min-height: 1px;
    position: relative
}

.column {
    margin-left: 3.08%
}

.column.one-third,
	.column:first-child,
	.column.alpha,
	.col12 {
    margin-left: 0
}

.column.alpha {
    clear: left
}

	/* Grid */
.col1 {
    width: 5.5%
}

.col2 {
    width: 14.1%
}

.col3 {
    width: 22.69%
}

.col4 {
    width: 31.08%
}

.col5 {
    width: 39.87%
}

.col6 {
    width: 48.46%
}

.col7 {
    width: 57%
}

.col8 {
    width: 65.6%
}

.col9 {
    width: 74%
}

.col10 {
    width: 82.8%
}

.col11 {
    width: 91.4%
}

.col12 {
    width: 100%
}

.one-third {
    width: 33.3%
}

	/* Centered */
.col1.centered {
    margin-left: 47.25%
}

.col2.centered {
    margin-left: 42.95%
}

.col3.centered {
    margin-left: 38.65%
}

.col4.centered {
    margin-left: 34.46%
}

.col5.centered {
    margin-left: 30.06%
}

.col6.centered {
    margin-left: 25.77%
}

.col7.centered {
    margin-left: 21.5%
}

.col8.centered {
    margin-left: 17.2%
}

.col9.centered {
    margin-left: 13%
}

.col10.centered {
    margin-left: 8.6%
}

.col11.centered {
    margin-left: 4.29%
}

	/* Flexible images */
.column > img {
    max-width: 100%;
    max-height: 100%;
    display: block
}

/*  #Mobile (Portrait)
================================================== */
	
@media only screen and (max-width: 767px) {
    .container {
        padding: 0 30px
    }

    .row > .column {
        border: none;
        margin-left: 0
    }

    .row {
        margin: 0 auto;
        max-width: 767px;
        min-width: 0;
        width: 100%
    }

    .row  > .col1, .row > .col2, .row > .col3, .row > .col4, .row > .col5, .row > .col6,
		.row > .col7, .row > .col8, .row > .col9, .row > .col9, .row > .col10, .row > .col11, .row > .col12 {
        width: 100%;
    }
}

/*  #Mobile (Landscape)
================================================== */
	
@media only screen and (min-width: 480px) and (max-width: 767px) {
}

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

.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,
		.widget:before,
		.widget:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.row:after,
		.clearfix:after,
		.widget:after {
    clear: both;
}

.row,
		.clearfix,
		.widget {
    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;
}

/* #Class Helper
================================================== */
	
	/* Floating */
.fl, .fr {
    display: inline
}

.fl {
    float: left
}

.fr {
    float: right
}

	/* Aligning */
.align-center {
    text-align: center
}

/* #Reset (Inspired by E. Meyers)
================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
} 