@charset "UTF-8";
/**
 * Ubuntu Core Front-End Framework
 *
 * Grid file part of the Ubuntu Core Front-End Framework
 * 
 * This grid is composed by 14 columns (units) separated by 13 gutters (1/3 unit).
 * The first and last column are for padding purposes only.
 * The content fits in the middle 12 columns.
 * Possible divisions: 1 (12 units + 11 gutters), 2 (6 units + 5 gutters), 
 * 3 ( 4 units + 3 gutters) and 4 (3 units + 2 gutters).
 *
 * When 1 unit = 60px, 1 gutter = 20px
 * 
 * @project		Ubuntu Core Front-End Framework
 * @author		Web Team at Canonical Ltd
 * @copyright	2012 Canonical Ltd
 *
 * @see			http://gridinator.com/
 * @see			http://blueprintcss.org/
 */

/**
 * Table of contents
 *
 * Main containers
 * Columns
 * Empty columns
 * Borders
 * Push and pull
 * Verticla gutter
 * Last
 * Clearing
 */
  
 /**
 * Main containers
 *
 * @section containers
 */

.wrapper {
	margin: 0 auto;
	text-align: left;
	max-width: 65.333em; /* 980px / 15px (baseline font); 980px + (60px x 2) = 1100px */
}

@media screen and (min-width: 481px) {
    .inner-wrapper {
        background: #fff;
        clear: both;
        display: inline; /* HACK_IE_LTE_6: To fix IE 6 double margin bug. */
        float: left;
        position: relative;
    }
}

@media screen and (max-width: 481px) {
    .inner-wrapper {
        background: #fff;
        clear: both;
        display: inline; /* HACK_IE_LTE_6: To fix IE 6 double margin bug. */
        float: left;
        padding: 0 0 0 0;
        position: relative;
    }
}

.inner-wrapper-full-width {
    background: #fff;
    clear: both;
    display: inline; /* HACK_IE_LTE_6: To fix IE 6 double margin bug. */
    float: left;
    padding: 0 0 0 0;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 481px) {
    .row { /** Clear entire row. */
        clear: both;
        float: left;
        margin: 0 20px;
        width: 100%;
    }
}

@media screen and (max-width: 481px) {
    .row { /** Clear entire row. */
        clear: both;
        float: left;
        margin: 0;
        width: 100%;
    }
}

/**
 * Columns
 *
 * @section columns
 */

@media screen and (min-width: 481px) {
    .span-3, .span-4, .span-6, .span-5, .span-7, .span-8, .span-9, .span-12 {
        clear: none;
        display: inline; /* HACK_IE_LTE_6: To fix IE 6 double margin bug. */
        float: left;
        margin: 0 1.333em 1.333em 0;
        padding: 0;
        position: relative;
    }
}


@media screen and (max-width: 481px) {
    .span-3, .span-4, .span-6, .span-5, .span-7, .span-8, .span-9, .span-12 {
        clear: none;
        display: inline; /* HACK_IE_LTE_6: To fix IE 6 double margin bug. */
        float: left;
        margin: 0 0.5em 0.5em 0;
        padding: 0;
        position: relative;
    }
}

.span-3 {
	width: 14.666em; /* 220px / 15px */
}
.span-4 {
	width: 20em; /* 300px / 15px */
}
.span-5 {
	width: 25.333em; /* 380px / 15px */
}
.span-6 {
	width: 30.666em; /* 460px / 15px */
}
.span-7 {
	width: 36em; /* 540px / 15px */
}
@media screen and (max-width: 481px) {
    .span-8 {
        max-width: 41.333em; /* 620px / 15px */
    }
}
@media screen and (min-width: 481px) {
    .span-8 {
        width: 41.333em; /* 620px / 15px */
    }
}
.span-9 {
	width: 46.666em; /* 700px / 15px */
}
.span-12 { /** Full width. */
	width: 62.666em; /* 940px / 15px */
	margin-right: 0;
}

/**
 * Empty columns
 *
 * Add these to a column to append or prepend 
 * empty columns
 *
 * @section empty-columns
 */

.append-1 { padding-right: 5.333em; } /* 80px / 15px */
.append-2 { padding-right: 10.666em; } /* 160px / 15px */
.append-3 { padding-right: 16em; } /* 240px / 15px */
.append-4 { padding-right: 21.333em; } /* 320px / 15px */
.append-5 { padding-right: 26.666em; } /* 400px / 15px */
.append-6 { padding-right: 32em; } /* 480px / 15px */
.append-7 { padding-right: 37.333em; } /* 560px / 15px */
.append-8 { padding-right: 42.666em; } /* 640px / 15px */
.append-9 { padding-right: 48em; } /* 720px / 15px */
.append-10 { padding-right: 53.333em; } /* 800px / 15px */
.append-11 { padding-right: 58.666em; } /* 880px / 15px */

.prepend-1 { padding-left: 5.333em; }
.prepend-2 { padding-left: 10.666em; }
.prepend-3 { padding-left: 16em; }
.prepend-4 { padding-left: 21.333em; }
.prepend-5 { padding-left: 26.666em; }
.prepend-6 { padding-left: 32em; }
.prepend-7 { padding-left: 37.333em; }
.prepend-8 { padding-left: 42.666em; }
.prepend-9 { padding-left: 48em; }
.prepend-10 { padding-left: 53.333em; }
.prepend-11 { padding-left: 58.666em; }

/**
 * Borders
 *
 * @section borders
 */

.border { /** Border on right hand side of a column. */
  padding-right: .6em;
  margin-right: .666em;
  border-right: 1px solid #ddd;
}

/**
 * Push and pull
 *
 * Use these classes to push elements into the next 
 * column and pull it into the previous column
 *
 * @section push-pull
 */

.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11 {
	float: left;
	position: relative;
}
.pull-1 {
	margin-left: -5.333em;
}
.pull-2 {
	margin-left: -10.666em;
}
.pull-3 {
	margin-left: -16em;
}
.pull-4 {
	margin-left: -21.333em;
}
.pull-5 {
	margin-left: -26.666em;
}
.pull-6 {
	margin-left: -32em;
}
.pull-7 {
	margin-left: -37.333em;
}
.pull-8 {
	margin-left: -42.666em;
}
.pull-9 {
	margin-left: -48em;
}
.pull-10 {
	margin-left: -53.333em;
}
.pull-11 {
	margin-left: -58.666em;
}

.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11 {
	float: left;
	position: relative;
}
.push-1 {
	margin: 0 -6.666em 0 6.666em;
}
.push-2 {
	margin: 0 -12em 0 12em;
}
.push-3 {
	margin: 0 -17.333em 0 17.333em;
}
.push-4 {
	margin: 0 -22.666em 0 22.666em;
}
.push-5 {
	margin: 0 - 28em 0 28em;
}
.push-6 {
	margin: 0 -33.333em 0 33.333em;
}
.push-7 {
	margin: 0 -38.666em 0 38.666em;
}
.push-8 {
	margin: 0 -44em 0 44em;
}
.push-9 {
	margin: 0 -49.333em 0 49.333em;
}
.push-10 {
	margin: 0 -54.666em 0 54.666em;
}
.push-11 {
	margin: 0 -60em 0 60em;
}

/**
 * Vertical gutter
 *
 * Add a gutter above or below and element
 *
 * @section last
 */
 
div.prepend-top, .prepend-top {
  margin-top:1.333em;
}
div.append-bottom, .append-bottom {
  margin-bottom:1.333em;
}

/**
 * Last
 *
 * Add to last column a row
 *
 * @section last
 */

.last {
	margin-right: 0;
}

/**
 * Clearing
 *
 * Hard and soft clearing classes
 *
 * @section clearing
 */

.clear {
	clear: both;
}
.clearfix:after, .container:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  overflow:hidden;
}
.clearfix {
	display: block;
}