#container.fixed{width:890px;}
/*a class added to another like this means the element must have the id of container and the class*/


/* The Grid ---------------------- */
.row { width: 890px; max-width: 100%; min-width: 768px; margin: 0 auto;}
.row .row { width: auto; max-width: none; min-width: 0; margin: 0 -15px}/*rows inside rows have a negative margin that is equal to the padding of the columns*/

.columns {float: left; min-height: 1px; padding:0; position: relative; padding:0 15px; margin:0;}
.columns.centered { float: none; margin: 0 auto; }

[class*="columns"] + [class*="columns"]:last-child { float: right; }/*this is saying find all last columns in a row that are directly adjacent to another column - therefore a row with at least 2 columns*/

[class*="columns"] + [class*="columns"].end { float: left; }/*the end class is to overwrite the float right for last columns.. sometimes you may not want to float the last one right*/


/*grid column options*/
.one { width: 8.333%; }
.two { width: 16.666%; }
.three { width: 25%; }
.four { width: 33.33%; }
.five { width: 41.6666%; }
.six { width: 50%;}
.seven { width: 58.333%; }
.eight { width: 66.6%; }
.nine { width: 75%; }
.ten { width: 83.3333%; }
.eleven { width: 91.66666%; }
.twelve { width: 100%; }

/*centering columns*/
.centered { float: none; margin: 0 auto; }


/*use to offset rows by various factors*/
.offset-by-one { margin-left: 8.333%; }
.offset-by-two { margin-left: 16.666%; }
.offset-by-three { margin-left: 25%; }
.offset-by-four { margin-left: 33.3333%; }
.offset-by-five { margin-left: 41.6666%; }
.offset-by-six { margin-left: 50%; }
.offset-by-seven { margin-left: 58.3333%; }
.offset-by-eight { margin-left: 66.66666%; }
.offset-by-nine { margin-left: 75%; }
.offset-by-ten { margin-left: 83.33333%; }

/* Source Ordering */
.push-two { left: 16.666%; }
.pull-two { right: 16.666%; }

.push-three { left: 25%; }
.pull-three { right: 25%; }

.push-four { left: 33.3333%; }
.pull-four { right: 33.3333%; }

.push-five { left: 41.666%; }
.pull-five { right: 41.666%; }

.push-six { left: 50%; }
.pull-six { right: 50%; }

.push-seven { left: 58.33333%; }
.pull-seven { right: 58.3333%; }

.push-eight { left: 66.6666%; }
.pull-eight { right: 66.6666%; }

.push-nine { left: 75%; }
.pull-nine { right: 75%; }

.push-ten { left: 83.333%; }
.pull-ten { right: 83.333%; }


/*using in base to show all the grid blocks*/
.showGrid{background:#E7E7E7;border:1px solid #ddd;}
.row.display{background:#f4f4f4;margin:0 0 6px 0;}

/*blockgrids*/
ul.blockgrid { display: block; overflow: hidden; padding: 0; margin:0 -15px;list-style:none;}
.blockgrid > li { display: block; height: auto; float: left;padding:0 15px;margin:0 0 12px 0;}

/*clearing rows*/

.row { *zoom: 1; }
.row:before, .row:after { content: " "; display: table; }
.row:after { clear: both; }


.panel{background:#fff;padding:6px 15px; margin:0 0 12px 0;}