body {
  min-width: 980px;
}

.wrap {
  margin: 0 auto;
  width: 980px;
  position: relative;
}
  /* According to which of [notebook | default] layouts is used, the columns will either divide over 900, resp. 960 px */
  .layout-notebook {
    padding-left: 75px;
    padding-right: 0px;
    /* the left-over 900px is suitable for nice column division */
  }
  .layout-default,
  .layout-materials {
    padding-left: 20px;
    /* the left-over 960px is suitable for nice column division */
  }
    .row {
      margin-bottom: 20px;
    }
    .col {
      display: inline;
      float: left;
      width: 100%;
    }
    .col.alignright {
      float: right;
    }
    .col.half,         .col.w6 { width: 50%; }
    .col.third,        .col.w4 { width: 33.33333%; }
    .col.fourth,       .col.w3 { width: 25%; }
    .col.three-fourth, .col.w9 { width: 75%; }
    .col.sixth,        .col.w3 { width: 16.66666%; }
    
      .content {
        padding-right: 20px;
      }

/* http://sonspring.com/journal/clearing-floats */

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after,
.wrap:before,
.wrap:after,
.row:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.clearfix:after,
.layout-default,
.layout-materials,
.layout-notebook,
.wrap:after,
.row:after {
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix,
.layout-default,
.layout-materials,
.layout-notebook,
.wrap {
  zoom: 1;
}