/*
* ColorLabs Responsive Layout Framework
* Copyright 2011, ColorLabs
* www.colorlabsproject.com
*/
/* #Base 978 Flexible Grid
================================================== */
/* Flexible image */
img {
  height: auto;
  max-width: 100%;
}

.container {
  padding: 0 15px;
  position: relative;
  *zoom: 1;
}
.container:after {
  content: "";
  display: table;
  clear: both;
}

.row {
  width: 100%;
  margin: 0 auto;
  position: relative;
  max-width: 978px;
  *zoom: 1;
}
.row:after {
  content: "";
  display: table;
  clear: both;
}

.col1, .col2, .col3, .col4,
.col5, .col6, .col7, .col8,
.col9, .col10, .col11, .col12 {
  float: left;
  display: inline;
  min-height: 1px;
  position: relative;
  margin-left: 3.091%;
}
.col1:first-child, .col2:first-child, .col3:first-child, .col4:first-child,
.col5:first-child, .col6:first-child, .col7:first-child, .col8:first-child,
.col9:first-child, .col10:first-child, .col11:first-child, .col12:first-child {
  margin-left: 0;
}

/* --- Column Width --- */
/* We can do iteration in sass just like we do in javascript or php */
.col1 {
  width: 5.5%;
}

.col2 {
  width: 14.091%;
}

.col3 {
  width: 22.682%;
}

.col4 {
  width: 31.273%;
}

.col5 {
  width: 39.864%;
}

.col6 {
  width: 48.455%;
}

.col7 {
  width: 57.045%;
}

.col8 {
  width: 65.636%;
}

.col9 {
  width: 74.227%;
}

.col10 {
  width: 82.818%;
}

.col11 {
  width: 91.409%;
}

.col12 {
  width: 100%;
}

/*  #Mobile Phone
================================================== */
@media only screen and (max-width: 767px) {
  .row {
    max-width: 767px;
  }
  .col1, .col2, .col3, .col4,
  .col5, .col6, .col7, .col8,
  .col9, .col10, .col11, .col12 {
    width: 100%;
    margin-left: 0;
  }
}