/* 3 column layout

Thanks to:
http://matthewjamestaylor.com/blog/holy-grail-no-quirks-mode.htm

copy these styles to your <app_name>.css file, prepend something to make them take precedence, and set custom sizes 

*/

#colmid {
  left: 18em;           /* Left column width */
}
#colright {
  margin-left: -31em;   /* (Left column width + right column width) * -1 */
}
#col1pad {
	margin-left: 31em;   /* Left column left padding + Left column width + right column width */
	margin-right: 0em;   /* Left column right padding */
}
#col2 {
  width: 18em;         /* Left column content width */
  left: 13em;          /* Right column width */
}
#col3 {
  width: 13em;          /* Right column width */
  left: 0;              /* Right column right padding */
}

/* Stop copying here, don't edit styles below */

#colmask {
  position:relative;  /* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
  clear:both;
  float:left;
  width:100%;     /* width of whole page */
  overflow:hidden;    /* This chops off any overhanging divs */
}
#colmid {
  float:left;
  width:200%;
  position:relative;
  background:#fff;      /* Centre column background colour */
}
#colright {
  float:left;
  width:100%;
  position:relative;
  left:50%;
}
#col1wrap {
  float:right;
  width:50%;
  position:relative;
  right:100%;
}
#col1pad {
  overflow:hidden;
}
#col1 {
  width:100%;
  overflow:hidden;
}
#col2 {
  float:left;
  position:relative;
  margin-left:-50%;
  overflow:hidden;
}
#col3 {
  float:left;
  position:relative;
  overflow:hidden;
}