@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
 */

.eight-col, .eleven-col, .five-col, .four-col, .nine-col, .one-col, .seven-col, .six-col, .ten-col, .three-col, .twelve-col, .two-col {
box-sizing : border-box;
clear : none;
display : inline-block;
float : left;
margin-right : 2.128%;
margin-bottom : 20px;
padding : 0;
position : relative;
}
.one-col {
width : 6.38297%;
}
.two-col {
width : 14.89361%;
}
.three-col {
width : 23.40425%;
}
.four-col {
width : 31.91489%;
}
.five-col {
width : 40.42553%;
}
.six-col {
width : 48.93617%;
}
.seven-col {
width : 57.4468%;
}
.eight-col {
width : 65.95744%;
}
.nine-col {
width : 74.46808%;
}
.ten-col {
width : 82.97872%;
}
.eleven-col {
width : 91.48936%;
}
.twelve-col {
width : 100%;
margin-right : 0;
}
.twelve-col .one-col {
width : 6.3053%;
margin-right : 2.21238%;
}
.twelve-col .two-col {
width : 14.823%;
margin-right : 2.21238%;
}
.twelve-col .three-col {
width : 23.3407%;
margin-right : 2.21238%;
}
.twelve-col .four-col {
width : 31.8584%;
margin-right : 2.21238%;
}
.twelve-col .five-col {
width : 40.3761%;
margin-right : 2.21238%;
}
.twelve-col .six-col {
width : 48.8938%;
margin-right : 2.21238%;
}
.twelve-col .seven-col {
width : 57.4115%;
margin-right : 2.21238%;
}
.twelve-col .eight-col {
width : 65.9292%;
margin-right : 2.21238%;
}
.twelve-col .nine-col {
width : 74.4469%;
margin-right : 2.21238%;
}
.twelve-col .ten-col {
width : 82.9646%;
margin-right : 2.21238%;
}
.twelve-col .eleven-col {
width : 91.4823%;
margin-right : 2.21238%;
}
.twelve-col .twelve-col {
width : 100%;
margin-right : 0;
}
.eleven-col .one-col {
width : 6.89238%;
margin-right : 2.41837%;
}
.eleven-col .two-col {
width : 16.20314%;
margin-right : 2.41837%;
}
.eleven-col .three-col {
width : 25.5139%;
margin-right : 2.41837%;
}
.eleven-col .four-col {
width : 34.82466%;
margin-right : 2.41837%;
}
.eleven-col .five-col {
width : 44.13542%;
margin-right : 2.41837%;
}
.eleven-col .six-col {
width : 53.44619%;
margin-right : 2.41837%;
}
.eleven-col .seven-col {
width : 62.75695%;
margin-right : 2.41837%;
}
.eleven-col .eight-col {
width : 72.06771%;
margin-right : 2.41837%;
}
.eleven-col .nine-col {
width : 81.37847%;
margin-right : 2.41837%;
}
.eleven-col .ten-col {
width : 90.68923%;
margin-right : 2.41837%;
}
.eleven-col .eleven-col {
width : 100%;
margin-right : 0;
}
.ten-col .one-col {
width : 7.6%;
margin-right : 2.66666%;
}
.ten-col .two-col {
width : 17.86666%;
margin-right : 2.66666%;
}
.ten-col .three-col {
width : 28.13333%;
margin-right : 2.66666%;
}
.ten-col .four-col {
width : 38.4%;
margin-right : 2.66666%;
}
.ten-col .five-col {
width : 48.66666%;
margin-right : 2.66666%;
}
.ten-col .six-col {
width : 58.93333%;
margin-right : 2.66666%;
}
.ten-col .seven-col {
width : 69.19999%;
margin-right : 2.66666%;
}
.ten-col .eight-col {
width : 79.46666%;
margin-right : 2.66666%;
}
.ten-col .nine-col {
width : 89.73333%;
margin-right : 2.66666%;
}
.ten-col .ten-col {
width : 100%;
margin-right : 0;
}
.nine-col .one-col {
width : 8.46953%;
margin-right : 2.97176%;
}
.nine-col .two-col {
width : 19.91084%;
margin-right : 2.97176%;
}
.nine-col .three-col {
width : 31.35215%;
margin-right : 2.97176%;
}
.nine-col .four-col {
width : 42.79346%;
margin-right : 2.97176%;
}
.nine-col .five-col {
width : 54.23476%;
margin-right : 2.97176%;
}
.nine-col .six-col {
width : 65.67607%;
margin-right : 2.97176%;
}
.nine-col .seven-col {
width : 77.11738%;
margin-right : 2.97176%;
}
.nine-col .eight-col {
width : 88.55869%;
margin-right : 2.97176%;
}
.nine-col .nine-col {
width : 100%;
margin-right : 0;
}
.eight-col .one-col {
width : 9.56375%;
margin-right : 3.3557%;
}
.eight-col .two-col {
width : 22.48322%;
margin-right : 3.3557%;
}
.eight-col .three-col {
width : 35.40268%;
margin-right : 3.3557%;
}
.eight-col .four-col {
width : 48.32214%;
margin-right : 3.3557%;
}
.eight-col .five-col {
width : 61.24161%;
margin-right : 3.3557%;
}
.eight-col .six-col {
width : 74.16107%;
margin-right : 3.3557%;
}
.eight-col .seven-col {
width : 87.08053%;
margin-right : 3.3557%;
}
.eight-col .eight-col {
width : 100%;
margin-right : 0;
}
.seven-col .one-col {
width : 10.98265%;
margin-right : 3.85356%;
}
.seven-col .two-col {
width : 25.81888%;
margin-right : 3.85356%;
}
.seven-col .three-col {
width : 40.6551%;
margin-right : 3.85356%;
}
.seven-col .four-col {
width : 55.49132%;
margin-right : 3.85356%;
}
.seven-col .five-col {
width : 70.32755%;
margin-right : 3.85356%;
}
.seven-col .six-col {
width : 85.16377%;
margin-right : 3.85356%;
}
.seven-col .seven-col {
width : 100%;
margin-right : 0;
}
.six-col .one-col {
width : 12.89592%;
margin-right : 4.52488%;
}
.six-col .two-col {
width : 30.31674%;
margin-right : 4.52488%;
}
.six-col .three-col {
width : 47.73755%;
margin-right : 4.52488%;
}
.six-col .four-col {
width : 65.15837%;
margin-right : 4.52488%;
}
.six-col .five-col {
width : 82.57918%;
margin-right : 4.52488%;
}
.six-col .six-col {
width : 100%;
margin-right : 0;
}
.five-col .one-col {
width : 15.61643%;
margin-right : 5.47945%;
}
.five-col .two-col {
width : 36.71232%;
margin-right : 5.47945%;
}
.five-col .three-col {
width : 57.80821%;
margin-right : 5.47945%;
}
.five-col .four-col {
width : 78.9041%;
margin-right : 5.47945%;
}
.five-col .five-col {
width : 100%;
margin-right : 0;
}
.four-col .one-col {
width : 19.79166%;
margin-right : 6.94444%;
}
.four-col .two-col {
width : 46.52777%;
margin-right : 6.94444%;
}
.four-col .three-col {
width : 73.26388%;
margin-right : 6.94444%;
}
.four-col .four-col {
width : 100%;
margin-right : 0;
}
.three-col .one-col {
width : 27.01421%;
margin-right : 9.47867%;
}
.three-col .two-col {
width : 63.5071%;
margin-right : 9.47867%;
}
.three-col .three-col {
width : 100%;
margin-right : 0;
}
.two-col .one-col {
width : 42.53731%;
margin-right : 14.92537%;
}
.two-col .two-col {
width : 100%;
margin-right : 0;
}
.one-col .one-col {
width : 100%;
margin-right : 0;
}
.twelve-col .last-col {
margin-right : 0;
}
.eleven-col .last-col {
margin-right : 0;
}
.ten-col .last-col {
margin-right : 0;
}
.nine-col .last-col {
margin-right : 0;
}
.eight-col .last-col {
margin-right : 0;
}
.seven-col .last-col {
margin-right : 0;
}
.six-col .last-col {
margin-right : 0;
}
.five-col .last-col {
margin-right : 0;
}
.four-col .last-col {
margin-right : 0;
}
.three-col .last-col {
margin-right : 0;
}
.two-col .last-col {
margin-right : 0;
}
.one-col .last-col {
margin-right : 0;
}

@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;
}
